:root{
  --eshraq-green:#0b6b5e;
  --eshraq-green-deep:#07574e;
  --eshraq-green-bright:#0f806f;
  --eshraq-gold:#d8af49;
  --eshraq-gold-soft:#f5e5ad;
  --eshraq-ink:#173a34;
  --eshraq-muted:#697873;
  --eshraq-bg:#f7f3ea;
  --eshraq-paper:#fffdf8;
  --eshraq-line:#e7dfd0;
  --eshraq-soft:#edf7f3;
  --eshraq-danger:#a9342d;
  --eshraq-shadow:0 18px 50px rgba(23,58,52,.10);
  --eshraq-shadow-soft:0 10px 28px rgba(23,58,52,.065);
  font-family:system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--eshraq-bg);scroll-behavior:smooth}
body{min-height:100vh;margin:0;color:var(--eshraq-ink);background:radial-gradient(circle at 8% 10%,rgba(216,175,73,.10),transparent 24rem),radial-gradient(circle at 92% 12%,rgba(11,107,94,.08),transparent 30rem),var(--eshraq-bg)}
button,input,select,textarea{font:inherit}
button{color:inherit}
.hidden{display:none!important}
body.eshraq-booting #authView,body.eshraq-booting #appView{visibility:hidden!important}

/* Authenticated application ownership boundary. Nothing below styles #authView. */
#appView.app-shell{min-height:100vh;position:relative;padding-right:252px;background:transparent}
#appView .topbar{position:sticky;top:0;z-index:40;min-height:76px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 28px;background:rgba(255,253,248,.94);border-bottom:1px solid rgba(216,175,73,.25);backdrop-filter:blur(16px);box-shadow:0 7px 26px rgba(23,58,52,.045)}
#appView .brand{display:flex;align-items:center;gap:11px;min-width:0}
#appView .brand img{width:48px;height:48px;object-fit:contain;border-radius:14px;padding:4px;background:#fff;border:1px solid rgba(216,175,73,.24);box-shadow:0 6px 18px rgba(23,58,52,.055)}
#appView .brand div{display:grid;gap:2px;min-width:0}
#appView .brand b{font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--eshraq-ink)}
#appView .brand small{font-size:.78rem;color:var(--eshraq-muted)}
#appView .icon-btn{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(216,175,73,.34);border-radius:14px;background:#fff;cursor:pointer;box-shadow:0 7px 20px rgba(23,58,52,.055)}
#appView .dot{position:absolute;top:8px;left:8px;width:8px;height:8px;border-radius:50%;background:#d33b32;border:2px solid #fff}

#appView .content{width:min(1220px,calc(100% - 42px));margin:0 auto;padding:28px 0 76px}
#appView .page{display:grid;gap:18px;animation:eshraq-page-in .18s ease-out}
@keyframes eshraq-page-in{from{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:none}}

#appView .card,#appView .list-item,#appView .service-card,#appView .journey-card{background:rgba(255,255,255,.94);border:1px solid var(--eshraq-line);border-radius:22px;box-shadow:var(--eshraq-shadow-soft)}
#appView .card{padding:20px}
#appView .list-item,#appView .service-card,#appView .journey-card{padding:18px}
#appView .section-head{display:flex;justify-content:space-between;gap:14px;align-items:center}
#appView .section-head h2,#appView .section-head h3{margin:0}
#appView .section-head p{margin:.35rem 0 0}
#appView .muted,#appView .tiny,#appView small{color:var(--eshraq-muted)}
#appView .tiny{font-size:.82rem}

#appView .btn,#appView .security-action,#appView .link-btn,#appView .slot-btn,#appView .page-back-btn{border:0;border-radius:12px;padding:10px 15px;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,opacity .14s ease}
#appView .btn:active,#appView .security-action:active,#appView .link-btn:active,#appView .slot-btn:active{transform:translateY(1px) scale(.99)}
#appView .btn.primary,#appView .security-action{background:linear-gradient(135deg,var(--eshraq-green-bright),var(--eshraq-green));color:#fff;box-shadow:0 8px 20px rgba(11,107,94,.16)}
#appView .btn.soft,#appView .link-btn,#appView .slot-btn,#appView .page-back-btn{background:var(--eshraq-soft);color:var(--eshraq-green)}
#appView .btn.danger{background:var(--eshraq-danger);color:#fff}
#appView .btn:disabled,#appView .security-action:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
#appView .wide{width:100%}
#appView .badge{display:inline-flex;align-items:center;gap:5px;background:var(--eshraq-soft);color:var(--eshraq-green);border:1px solid rgba(11,107,94,.10);border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:700}
#appView .badge.gold{background:#fff7df;color:#765a10;border-color:#eed48b}

#appView .hero{position:relative;overflow:hidden;min-height:220px;padding:30px 32px;background:linear-gradient(135deg,#fffdf8 0%,#f4fbf8 58%,#e9f5f1 100%);border-color:rgba(11,107,94,.14)}
#appView .hero::before{content:"";position:absolute;top:0;right:0;width:8px;height:100%;background:linear-gradient(180deg,var(--eshraq-green),var(--eshraq-gold))}
#appView .hero::after{content:"";position:absolute;inset:auto -95px -125px auto;width:330px;height:330px;border-radius:50%;border:42px solid rgba(11,107,94,.05);pointer-events:none}
#appView .hero .eyebrow,#appView .journey-kicker{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;font-weight:850;color:#80631c}
#appView .hero h2{margin:10px 0 6px;font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.2}
#appView .hero>p{margin:0 0 20px;max-width:760px;color:var(--eshraq-muted);line-height:1.8}
#appView .progress-wrap{position:relative;z-index:1;margin-top:16px;max-width:760px}
#appView .progress-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;font-size:.9rem}
#appView .progress{height:10px;background:#e4ece9;border-radius:99px;overflow:hidden}
#appView .progress i{display:block;height:100%;background:linear-gradient(90deg,var(--eshraq-green),var(--eshraq-green-bright));border-radius:inherit}
#appView .progress-wrap .link-btn{margin-top:10px}

#appView .journey-v140{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#appView .journey-card{display:grid;gap:8px}
#appView .journey-card h3{margin:0}
#appView .journey-card p{margin:0 0 4px;color:var(--eshraq-muted);line-height:1.75}

#appView .quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
#appView .quick{min-height:132px;display:grid;place-items:center;align-content:center;gap:7px;background:#fff;border:1px solid var(--eshraq-line);border-radius:20px;padding:18px;text-align:center;cursor:pointer;box-shadow:0 8px 24px rgba(23,58,52,.05);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
#appView .quick:hover{transform:translateY(-2px);border-color:rgba(11,107,94,.28);box-shadow:0 14px 30px rgba(23,58,52,.08)}
#appView .quick span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--eshraq-soft);color:var(--eshraq-green);font-size:1.2rem}
#appView .quick b{font-size:.98rem}
#appView .quick small{display:block;font-size:.78rem}

#appView .service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#appView .service-card{display:grid;align-content:start;gap:10px;min-height:200px}
#appView .service-card h3{margin:2px 0 0;font-size:1.03rem}
#appView .service-card p{margin:0;color:var(--eshraq-muted);line-height:1.75}
#appView .service-card .btn{margin-top:auto}
#appView .list{display:grid;gap:11px}
#appView .list-item p{margin:.55rem 0}
#appView .meta{display:flex;flex-wrap:wrap;gap:7px}
#appView .empty{padding:18px;text-align:center;color:var(--eshraq-muted);background:rgba(255,255,255,.76);border:1px dashed #ddd2c1;border-radius:16px}

#appView .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#appView .form-grid label{display:grid;gap:7px;font-size:.9rem;font-weight:700}
#appView .form-grid input,#appView .form-grid select,#appView textarea,#appView select{width:100%;border:1px solid #d4dfdb;border-radius:12px;padding:11px 12px;background:#fff;color:var(--eshraq-ink);outline:none;transition:border-color .14s ease,box-shadow .14s ease}
#appView .form-grid input:focus,#appView .form-grid select:focus,#appView textarea:focus,#appView select:focus{border-color:rgba(11,107,94,.65);box-shadow:0 0 0 3px rgba(11,107,94,.10)}
#appView .form-grid .wide{grid-column:1/-1}

#appView .menu{display:grid;gap:8px}
#appView .menu button{display:flex;justify-content:space-between;align-items:center;border:1px solid transparent;background:#fff;padding:14px 15px;border-radius:14px;cursor:pointer}
#appView .menu button:hover{background:var(--eshraq-soft);border-color:rgba(11,107,94,.12)}
#appView .account-card{display:grid;gap:16px}
#appView .account-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
#appView .account-version{font-size:.78rem;color:var(--eshraq-muted)}
#appView .security-list{display:grid;gap:10px}
#appView .security-item{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:13px 0;border-top:1px solid #eee7da}
#appView .security-item>div{display:flex;align-items:center;gap:10px}
#appView .security-icon{font-size:1.2rem}
#appView .app-pref-card{margin-top:14px}
#appView .app-pref-grid{display:grid;gap:10px}
#appView .app-pref-row{display:flex;justify-content:space-between;gap:14px;align-items:center;border-top:1px solid #eee7da;padding-top:12px}

#appView .assistant-chat,#appView .assistant-hero{display:grid;gap:14px}
#appView .assistant-messages{min-height:180px;max-height:420px;overflow:auto;background:#f8faf9;border:1px solid #e1ebe7;border-radius:16px;padding:14px}
#appView .assistant-form{display:grid;grid-template-columns:1fr auto;gap:9px}
#appView .assistant-form input{border:1px solid #d6dfdc;border-radius:12px;padding:11px}
#appView .assistant-actions,#appView .assistant-shortcuts{display:flex;flex-wrap:wrap;gap:8px}
#appView .quality-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
#appView .quality-grid form{display:grid;gap:12px}
#appView .quality-grid label{display:grid;gap:6px;font-weight:700}
#appView .page-back-row{margin-bottom:-6px}
#appView .page-back-btn{padding:8px 12px}
#appView .booking-slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#appView .assessment-form fieldset{border:1px solid var(--eshraq-line);border-radius:16px;margin:12px 0;padding:14px}
#appView .assessment-step-head{display:flex;gap:8px;align-items:center;margin-bottom:8px}
#appView .assessment-step-no{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--eshraq-green);color:#fff}
#appView .function-grid,#appView .assessment-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#appView .data-load-error{display:grid;gap:8px;text-align:start;background:#fff9e8;border:1px solid #ead596;color:#6f5517}
#appView .data-load-error.critical{padding:14px;border-radius:14px}
#appView .data-load-error .btn{justify-self:start}
#appView .shell-sync-note{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px 14px;background:#fff9e8;border:1px solid #ead596;border-radius:14px;color:#6f5517;font-size:.88rem}

/* Desktop navigation rail: right side in RTL. */
#appView .bottom-nav{position:fixed;top:0;right:0;bottom:0;width:252px;z-index:50;display:flex;flex-direction:column;gap:8px;padding:116px 14px 18px;background:linear-gradient(180deg,#075f53 0%,#07584f 55%,#064d46 100%);border-left:1px solid rgba(255,255,255,.12);box-shadow:-14px 0 40px rgba(11,52,46,.08);transform:none}
#appView .bottom-nav::before{content:"إشراق\A تطبيق المستفيد";white-space:pre;position:absolute;top:24px;right:18px;left:18px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.14);color:#fff;font-weight:850;line-height:1.6}
#appView .bottom-nav button{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;border:1px solid transparent;border-radius:14px;background:transparent;color:rgba(255,255,255,.83);padding:10px 12px;text-align:right;cursor:pointer}
#appView .bottom-nav button span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.05);font-size:1rem}
#appView .bottom-nav button small{color:inherit;font-size:.84rem;font-weight:750}
#appView .bottom-nav button:hover{background:rgba(255,255,255,.07)}
#appView .bottom-nav button.on{background:rgba(255,255,255,.12);border-color:rgba(216,175,73,.40);color:#fff}
#appView .bottom-nav button.on span{background:rgba(216,175,73,.16);border-color:rgba(216,175,73,.44);color:#ffe9a8}

/* Non-auth application overlays are explicit. No generic dialog geometry. */
#requestDialog{border:0;border-radius:22px;width:min(580px,calc(100% - 24px));max-height:min(760px,calc(100dvh - 30px));padding:0;box-shadow:0 24px 80px rgba(0,0,0,.25);background:#fff}
#requestDialog::backdrop{background:rgba(6,29,25,.56);backdrop-filter:blur(3px)}
#requestDialog .dialog-card{padding:22px;display:grid;gap:12px;background:#fff;max-height:inherit;overflow:auto}
#requestDialog input,#requestDialog select,#requestDialog textarea{width:100%;border:1px solid #d4dfdb;border-radius:12px;padding:11px 12px;background:#fff;color:var(--eshraq-ink)}
#requestDialog .btn{border:0;border-radius:12px;padding:10px 15px;cursor:pointer}
#requestDialog .btn.primary{background:linear-gradient(135deg,var(--eshraq-green-bright),var(--eshraq-green));color:#fff}
#requestDialog .x{border:0;border-radius:10px;background:var(--eshraq-soft);color:var(--eshraq-green);width:36px;height:36px;cursor:pointer}

.toast{position:fixed;left:22px;bottom:24px;z-index:9999;max-width:min(520px,calc(100% - 44px));background:#173a34;color:#fff;padding:12px 16px;border-radius:14px;box-shadow:0 16px 42px rgba(0,0,0,.18)}
.toast.error{background:var(--eshraq-danger)}
.profile-required-gate{position:fixed;right:274px;bottom:24px;z-index:9000;width:min(420px,calc(100% - 44px));background:#fff9e8;border:1px solid #e3c86e;border-radius:18px;padding:14px;box-shadow:var(--eshraq-shadow)}

@media(max-width:900px){
  #appView.app-shell{padding-right:0}
  #appView .bottom-nav{top:auto;right:0;left:0;bottom:0;width:auto;height:72px;display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:0;background:rgba(255,255,255,.97);border:0;border-top:1px solid var(--eshraq-line);box-shadow:0 -8px 30px rgba(23,58,52,.08);backdrop-filter:blur(16px)}
  #appView .bottom-nav::before{display:none}
  #appView .bottom-nav button{min-height:72px;display:grid;place-items:center;align-content:center;gap:3px;border:0;border-radius:0;color:#60706b;padding:6px 3px;text-align:center}
  #appView .bottom-nav button span{width:auto;height:auto;border:0;background:none}
  #appView .bottom-nav button.on{background:#edf7f3;color:var(--eshraq-green);border:0}
  #appView .bottom-nav button.on span{background:none;border:0;color:var(--eshraq-green)}
  #appView .topbar{padding-inline:18px}
  #appView .content{padding-bottom:104px}
  .toast{bottom:88px}
  .profile-required-gate{right:14px;bottom:88px}
}

@media(max-width:760px){
  #appView .topbar{min-height:68px;padding:9px 12px}
  #appView .brand img{width:42px;height:42px}
  #appView .brand b{font-size:.9rem}
  #appView .content{width:calc(100% - 22px);padding-top:14px}
  #appView .card,#appView .list-item,#appView .service-card,#appView .journey-card{border-radius:18px}
  #appView .card{padding:16px}
  #appView .hero{min-height:auto;padding:20px}
  #appView .hero h2{font-size:1.55rem}
  #appView .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #appView .quick{min-height:118px;padding:14px}
  #appView .service-grid,#appView .journey-v140,#appView .quality-grid,#appView .form-grid,#appView .function-grid,#appView .assessment-check-grid{grid-template-columns:1fr}
  #appView .section-head,#appView .account-head,#appView .security-item,#appView .app-pref-row{align-items:stretch;flex-direction:column}
  #appView .assistant-form{grid-template-columns:1fr}
  #appView .bottom-nav{height:68px}
  #appView .bottom-nav button{min-height:68px}
  #appView .bottom-nav button small{font-size:.72rem}
  .toast{left:11px;right:11px;max-width:none}
  .profile-required-gate{left:11px;right:11px;width:auto}
}

@media(prefers-reduced-motion:reduce){#appView *,#appView *::before,#appView *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}