/* ETA white-label theme override — Egyptian Tax Authority (teal + gold). Loaded AFTER the app CSS so these win. Best-effort reskin of Mantine primary. */ :root{ --eta-teal:#0C4A4E; --eta-teal-2:#0F5A5F; --eta-gold:#B08A2E; --eta-gold-2:#C79A33; /* Mantine resolved primary vars (used by most filled components) */ --mantine-primary-color-filled:var(--eta-teal); --mantine-primary-color-filled-hover:var(--eta-teal-2); --mantine-primary-color-light:rgba(12,74,78,.10); --mantine-primary-color-light-hover:rgba(12,74,78,.16); --mantine-primary-color-light-color:var(--eta-teal); --mantine-primary-color-contrast:#ffffff; --mantine-color-anchor:var(--eta-teal-2); /* override the default primary palette scale (Mantine default primary = 'blue') */ --mantine-color-blue-0:#e8f2f2; --mantine-color-blue-1:#cfe2e2; --mantine-color-blue-2:#a3c9ca; --mantine-color-blue-3:#74afb1; --mantine-color-blue-4:#4f999b; --mantine-color-blue-5:#2d8386; --mantine-color-blue-6:#0C4A4E; --mantine-color-blue-7:#0a4145; --mantine-color-blue-8:#083539; --mantine-color-blue-9:#05292c; --mantine-color-blue-filled:var(--eta-teal); --mantine-color-blue-filled-hover:var(--eta-teal-2); --mantine-color-blue-light:rgba(12,74,78,.10); --mantine-color-blue-light-hover:rgba(12,74,78,.16); --mantine-color-blue-light-color:var(--eta-teal); --mantine-color-blue-outline:var(--eta-teal); } /* gold accents on key emphasis elements */ a:hover{color:var(--eta-gold-2)!important;} ::selection{background:rgba(176,138,46,.28);} /* ===== ETA official logo placement (JPEG badge) ===== */ /* header wordmark: hide "teradata", show ETA logo + name */ .brand{ display:flex!important; align-items:center; gap:8px; } .brand::before{ content:""; display:inline-block; width:30px; height:30px; flex:0 0 auto; background:#fff url("/eta-logo.jpg") center/contain no-repeat; border-radius:6px; box-shadow:0 0 0 1px rgba(0,0,0,.06); } .brand > b{ font-size:0!important; line-height:1; white-space:nowrap; } .brand > b::after{ content:"مصلحة الضرائب المصرية"; font-size:16px; font-weight:800; color:#0C4A4E; } :root[data-theme="dark"] .brand > b::after, .brand[data-dark] > b::after{ color:#EAF1F0; } /* sidebar square: ETA logo badge on white */ .logo{ background:#fff!important; position:relative!important; overflow:hidden; } .logo > svg{ visibility:hidden!important; } .logo::after{ content:""; position:absolute; inset:3px; background:url("/eta-logo.jpg") center/contain no-repeat; } /* ===== compact hero band + RTL Arabic copy ===== */ .heroband{ padding:16px 40px 18px !important; } .hero-copy{ direction:rtl; text-align:center; } .hero-copy .eyebrow{ margin-bottom:2px !important; } .hero-copy h1{ font-size:23px !important; line-height:1.35 !important; margin:2px 0 6px !important; } .hero-copy .sub{ font-size:13px !important; line-height:1.6 !important; margin-top:2px !important; } .hero-copy .heropills, .hero-copy [class*="heropil"]{ justify-content:center; } /* ===== profile trigger pill + details popup (React-proof, appended to ) ===== */ #eta-profile-pill{ position:fixed; top:60px; inset-inline-end:16px; z-index:70; direction:rtl; display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-family:'Cairo','Tajawal',system-ui,sans-serif; font-size:13px; font-weight:700; color:#EAF1F0; background:linear-gradient(90deg,#0C4A4E,#0F5A5F); border:1px solid #C79A33; border-radius:22px; padding:7px 14px; box-shadow:0 4px 14px rgba(0,0,0,.20); } #eta-profile-pill:hover{ filter:brightness(1.08); } #eta-profile-pill .eta-pill-ic{ font-size:15px; } #eta-profile-pill .eta-pill-nm{ max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } #eta-profile-pill .eta-pill-cta{ color:#E7D3A0; font-weight:800; font-size:12px; } #eta-profile-modal{ position:fixed; inset:0; z-index:9000; display:none; direction:rtl; background:rgba(6,32,34,.55); backdrop-filter:blur(2px); } #eta-profile-modal.open{ display:flex; align-items:center; justify-content:center; } .eta-pm-box{ width:min(92vw,460px); max-height:86vh; overflow:auto; background:#fff; color:#0C2E30; border-radius:16px; border-top:5px solid #C79A33; box-shadow:0 24px 60px rgba(0,0,0,.35); font-family:'Cairo','Tajawal',system-ui,sans-serif; animation:etaPop .16s ease-out; } @keyframes etaPop{ from{ transform:translateY(8px) scale(.98); opacity:0; } to{ transform:none; opacity:1; } } .eta-pm-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 18px 10px; } .eta-pm-title{ font-weight:800; font-size:14px; color:#0C4A4E; } .eta-pm-x{ background:transparent; border:0; font-size:17px; color:#0C4A4E; cursor:pointer; opacity:.7; padding:2px 6px; } .eta-pm-x:hover{ opacity:1; } .eta-pm-name{ padding:0 18px 8px; font-weight:800; font-size:19px; color:#0C4A4E; } .eta-pm-body{ padding:4px 18px 8px; } .eta-pm-row{ display:flex; justify-content:space-between; gap:14px; padding:8px 0; border-bottom:1px dashed #dfeceb; font-size:13.5px; } .eta-pm-row:last-child{ border-bottom:0; } .eta-pm-k{ color:#5b7c7b; font-weight:600; } .eta-pm-v{ color:#0C2E30; font-weight:700; text-align:end; } .eta-pm-foot{ padding:10px 18px 16px; font-size:12px; color:#7a8f8e; } :root[data-theme="dark"] .eta-pm-box{ background:#0f2a2c; color:#EAF1F0; } :root[data-theme="dark"] .eta-pm-title, :root[data-theme="dark"] .eta-pm-name{ color:#EAF1F0; } :root[data-theme="dark"] .eta-pm-x{ color:#EAF1F0; } :root[data-theme="dark"] .eta-pm-row{ border-bottom-color:rgba(255,255,255,.10); } :root[data-theme="dark"] .eta-pm-k{ color:#9fb9b8; } :root[data-theme="dark"] .eta-pm-v{ color:#fff; } /* ===== "log in as guest" button on the login page (injected into .login-card) ===== */ #eta-guest-wrap{ margin:14px 0 2px; direction:rtl; text-align:center; font-family:'Cairo','Tajawal',system-ui,sans-serif; } .eta-guest-or{ display:flex; align-items:center; gap:10px; margin:0 0 10px; color:#7a8f8e; font-size:12px; font-weight:600; } .eta-guest-or::before,.eta-guest-or::after{ content:""; height:1px; flex:1; background:rgba(12,74,78,.14); } #eta-guest-btn{ width:100%; cursor:pointer; font-family:inherit; font-size:14px; font-weight:800; color:#0C2E30; background:linear-gradient(90deg,#E7D3A0,#C79A33); border:1px solid #C79A33; border-radius:12px; padding:11px 14px; box-shadow:0 6px 16px rgba(176,138,46,.28); transition:filter .15s; } #eta-guest-btn:hover{ filter:brightness(1.06); } #eta-guest-btn:disabled{ opacity:.6; cursor:default; } .eta-guest-hint{ margin-top:7px; font-size:11.5px; color:#7a8f8e; line-height:1.55; } :root[data-theme="dark"] .eta-guest-or{ color:rgba(234,241,240,.55); } :root[data-theme="dark"] .eta-guest-or::before,:root[data-theme="dark"] .eta-guest-or::after{ background:rgba(234,241,240,.16); } :root[data-theme="dark"] .eta-guest-hint{ color:rgba(234,241,240,.60); } /* ===== one-time welcome toast (first login) ===== */ .eta-toast{ position:fixed; top:64px; left:50%; transform:translateX(-50%) translateY(-14px); z-index:9500; direction:rtl; display:flex; align-items:center; gap:11px; max-width:min(92vw,470px); background:linear-gradient(90deg,#0C4A4E,#0F5A5F); color:#fff; border:1px solid #C79A33; border-radius:14px; padding:11px 16px; box-shadow:0 14px 36px rgba(0,0,0,.30); cursor:pointer; font-family:'Cairo','Tajawal',system-ui,sans-serif; opacity:0; transition:opacity .32s ease, transform .32s ease; } .eta-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); } .eta-toast-ic{ font-size:21px; flex:0 0 auto; } .eta-toast-msg{ display:flex; flex-direction:column; gap:2px; min-width:0; } .eta-toast-msg b{ font-size:14px; } .eta-toast-msg span{ font-size:12px; color:#E7D3A0; line-height:1.45; } /* Hide the base SPA "Demo mode keeps the surface clean…" callout on the chat home */ .callout{ display:none !important; } /* Hide the Demo/Power interface-mode toggle in the header */ .modeswitch{ display:none !important; } /* Hide the "Enter to send · … · /api/chat/stream" hint under the composer */ .composer-wrap .hint{ display:none !important; } /* Hide the floating "🧠 Activity" toggle and its side panel. It exposes the agent's internal reasoning/tool trace, which is developer-facing — not something a citizen or a minister should see next to a tax file. Both are hidden: without the toggle the panel is unreachable, but it can start open, so it is hidden explicitly too. */ .activity-toggle{ display:none !important; } aside.activity{ display:none !important; }