/* EFHAMHA design system: lavender canvas, indigo accent, white cards. RTL first. */
:root{
  --bg:#eef0fb; --card:#fff; --ink:#1d1a4e; --muted:#6b7090; --line:#e6e8f5;
  --brand:#5b4cdb; --brand-d:#4a3cc4; --brand-soft:#ecebfd;
  --ok:#1f9d55; --ok-bg:#e5f6ec; --wait:#c77700; --wait-bg:#fff1dc; --bad:#d6364d; --bad-bg:#fde8eb;
  --radius:16px; --shadow:0 1px 2px rgba(40,36,110,.05),0 6px 20px rgba(40,36,110,.06);
  --bs-body-font-family:'IBM Plex Sans Arabic',system-ui,'Segoe UI',Tahoma,sans-serif;
  --bs-body-color:var(--ink); --bs-body-bg:var(--bg);
}
*{-webkit-tap-highlight-color:transparent}
body{font-family:var(--bs-body-font-family);background:var(--bg);color:var(--ink);line-height:1.7;min-height:100vh}
a{color:var(--brand);text-decoration:none} a:hover{color:var(--brand-d)}
:focus-visible{outline:3px solid rgba(91,76,219,.45);outline-offset:2px;border-radius:8px}
h1,h2,h3,h4{color:var(--ink);font-weight:700;line-height:1.35}
.muted{color:var(--muted)} .small-note{font-size:.82rem;color:var(--muted)}

/* ---------- buttons & inputs ---------- */
.btn-brand{background:var(--brand);border:0;color:#fff;font-weight:600;border-radius:12px;padding:.7rem 1.4rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:background .15s}
.btn-brand:hover,.btn-brand:focus{background:var(--brand-d);color:#fff}
.btn-brand:disabled{opacity:.6}
.btn-soft{background:#fff;border:1px solid var(--brand);color:var(--brand);font-weight:600;border-radius:12px;padding:.6rem 1.2rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}
.btn-soft:hover{background:var(--brand-soft);color:var(--brand-d)}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--ink);border-radius:12px;padding:.55rem 1rem;font-weight:500}
.btn-danger-soft{background:var(--bad-bg);color:var(--bad);border:0;border-radius:12px;padding:.6rem 1.2rem;font-weight:600}
.form-control,.form-select{border:1px solid var(--line);border-radius:12px;padding:.7rem .95rem;background:#fff;color:var(--ink)}
.form-control:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(91,76,219,.15)}
.form-label{font-weight:600;font-size:.92rem}

/* ---------- logo ---------- */
.logo{display:flex;align-items:center;gap:.65rem;color:var(--ink)}
.logo:hover{color:var(--ink)}
.logo svg{width:40px;height:40px;flex:none}
.logo .t{display:flex;flex-direction:column;line-height:1.15}
.logo .t b{font-size:1.55rem;color:var(--brand);font-weight:700}
.logo .t small{font-size:.66rem;color:var(--muted);font-weight:500}

/* ---------- app shell ---------- */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.topbar .in{max-width:1240px;margin:auto;padding:.7rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.user-chip{display:flex;align-items:center;gap:.6rem;font-weight:500;color:var(--ink);background:none;border:0;padding:0}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:700;flex:none}
.shell{max-width:1240px;margin:auto;padding:1.5rem 1.25rem 3rem;display:grid;grid-template-columns:210px 1fr;gap:1.5rem;align-items:start}
.side{position:sticky;top:5rem;display:flex;flex-direction:column;gap:.35rem}
.side a{display:flex;align-items:center;gap:.7rem;padding:.7rem 1rem;border-radius:12px;color:var(--muted);font-weight:500}
.side a i{font-size:1.1rem}
.side a:hover{background:rgba(91,76,219,.07);color:var(--brand)}
.side a.active{background:var(--brand-soft);color:var(--brand);font-weight:700}
.panel{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:2rem}
.card-x{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.footer-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:1.25rem;margin-top:2rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.zat{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:var(--ink);letter-spacing:.5px;direction:ltr}
.zat i{font-style:normal;background:var(--ink);color:#fff;border-radius:6px;padding:0 .4rem;font-size:.95rem}

.bottom-nav{display:none}
@media (max-width:991.98px){
  .shell{grid-template-columns:1fr;padding:1rem .9rem 6.5rem}
  .side{display:none}
  .panel{padding:1.25rem;border-radius:18px}
  .topbar .in{padding:.6rem .9rem}
  .bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;bottom:0;inset-inline:0;background:#fff;border-top:1px solid var(--line);padding:.4rem .5rem calc(.4rem + env(safe-area-inset-bottom));z-index:40}
  .bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:.1rem;color:var(--muted);font-size:.74rem;font-weight:500;padding:.25rem}
  .bottom-nav a i{font-size:1.25rem}
  .bottom-nav a.active{color:var(--brand);font-weight:700}
  .user-name{display:none}
}

/* ---------- hero (dashboard / landing) ---------- */
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center}
.hero h1{font-size:clamp(1.8rem,3.4vw,2.5rem);margin-bottom:.6rem}
.hero p.lead{color:var(--muted);font-size:1.05rem;max-width:34rem}
.hero .art{width:100%;max-width:340px;justify-self:center}
.cta-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:1.5rem;text-align:center;margin-top:1.25rem;max-width:30rem}
.cta-card .ico{width:44px;height:44px;margin:0 auto .5rem;border-radius:14px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:1.4rem}
.cta-card h3{font-size:1.1rem;margin:0}
.cta-card p{color:var(--muted);font-size:.9rem;margin:.15rem 0 1rem}
.cta-card .btn-brand{width:100%}
.cta-card .priv{margin-top:.8rem;font-size:.8rem;color:var(--brand)}
@media (max-width:767.98px){.hero{grid-template-columns:1fr}.hero .art{display:none}}

.sec-title{font-size:1.25rem;margin:2rem 0 1rem}
.acts{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.act{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.4rem 1rem;text-align:center;color:var(--ink);box-shadow:var(--shadow);transition:transform .15s,border-color .15s;display:block}
.act:hover{transform:translateY(-3px);border-color:var(--brand);color:var(--ink)}
.act .i{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;margin:0 auto .7rem;font-size:1.35rem}
.act b{display:block;font-size:1.02rem}
.act span{font-size:.82rem;color:var(--muted)}
.i-violet{background:#e9e8fc;color:#5b4cdb}.i-teal{background:#d9f5ee;color:#13a389}.i-orange{background:#fdebd2;color:#e48a12}.i-pink{background:#fde1ee;color:#e0488f}
@media (max-width:767.98px){.acts{grid-template-columns:repeat(2,1fr)}}

/* ---------- document table / list ---------- */
.row-head{display:flex;align-items:center;justify-content:space-between;margin:2rem 0 .8rem}
.row-head h2{font-size:1.25rem;margin:0}
.doc-table{width:100%;border-collapse:separate;border-spacing:0}
.doc-table th{font-size:.8rem;color:var(--muted);font-weight:600;padding:.6rem 1rem;border-bottom:1px solid var(--line);text-align:start}
.doc-table td{padding:.9rem 1rem;border-bottom:1px solid var(--line);vertical-align:middle}
.doc-table tr:last-child td{border-bottom:0}
.doc-table .nm{display:flex;align-items:center;gap:.7rem;color:var(--ink);font-weight:600;min-width:0}
.doc-table .nm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:26rem}
.ficon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:none;font-size:.62rem;font-weight:800;color:#fff}
.ficon.pdf{background:#e5484d}.ficon.img{background:#1fb5a8;font-size:1.05rem}
.badge-s{display:inline-block;border-radius:999px;padding:.15rem .8rem;font-size:.8rem;font-weight:600;white-space:nowrap}
.badge-s.ok{background:var(--ok-bg);color:var(--ok)}.badge-s.wait{background:var(--wait-bg);color:var(--wait)}
.badge-s.bad{background:var(--bad-bg);color:var(--bad)}.badge-s.new{background:var(--brand-soft);color:var(--brand)}
.empty{text-align:center;padding:2.5rem 1rem;color:var(--muted)}
.empty i{font-size:2.2rem;color:var(--brand);display:block;margin-bottom:.4rem}

.page-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}
.page-head h1{font-size:1.5rem;margin:0}
.page-head p{margin:0;color:var(--muted);font-size:.92rem}
.toolbar{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}
.search{position:relative;flex:1;min-width:200px}
.search i{position:absolute;inset-inline-end:.9rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.search input{padding-inline-end:2.5rem}
.pills{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1rem}
.pill{border-radius:999px;padding:.3rem 1rem;font-size:.9rem;background:#fff;border:1px solid var(--line);color:var(--muted);font-weight:500}
.pill.active{background:var(--brand-soft);border-color:var(--brand-soft);color:var(--brand);font-weight:700}
.doc-list{display:flex;flex-direction:column}
.doc-item{display:grid;grid-template-columns:auto 1fr auto auto auto;gap:1rem;align-items:center;padding:.95rem .25rem;border-bottom:1px solid var(--line)}
.doc-item:last-child{border-bottom:0}
.doc-item .nm{color:var(--ink);font-weight:600;min-width:0}
.doc-item .nm div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-item .nm small{display:block;color:var(--muted);font-weight:400;font-size:.78rem}
.doc-item .dt{font-size:.82rem;color:var(--muted);direction:ltr;text-align:end}
.kebab{background:none;border:0;color:var(--muted);font-size:1.2rem;border-radius:8px;padding:.1rem .45rem}
.kebab:hover{background:var(--brand-soft);color:var(--brand)}
@media (max-width:767.98px){
  .doc-item{grid-template-columns:auto 1fr auto;grid-template-areas:"i n k" "i s d"}
  .doc-item .ficon{grid-area:i}.doc-item .nm{grid-area:n}.doc-item .kebab-wrap{grid-area:k}.doc-item .badge-s{grid-area:s;justify-self:start}.doc-item .dt{grid-area:d}
  .doc-table .hide-m{display:none}
}

/* ---------- upload ---------- */
.drop{border:2px dashed #b9b3f2;border-radius:18px;background:#fafaff;padding:2.2rem 1rem;text-align:center;transition:background .15s,border-color .15s}
.drop.over{background:var(--brand-soft);border-color:var(--brand)}
.drop .big{font-size:2.6rem;color:var(--brand)}
.drop h3{font-size:1.05rem;color:var(--brand);margin:.3rem 0}
.file-chip{display:flex;align-items:center;gap:.8rem;border:1px solid var(--line);border-radius:14px;padding:.8rem 1rem;background:#fff;margin-top:1rem}
.file-chip .nm{flex:1;min-width:0}.file-chip .nm b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:start}
.file-chip .nm small{color:var(--muted)}
.consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem;color:var(--muted);margin:1.1rem 0}
.consent input{margin-top:.3rem;accent-color:var(--brand);width:1.1rem;height:1.1rem;flex:none}

.proc{border:1px solid var(--line);border-radius:18px;padding:1.6rem;text-align:center;background:#fff;margin-top:1.25rem}
.proc .ico{font-size:2.2rem;color:var(--brand)}
.bar{height:8px;border-radius:99px;background:#e8e9f7;overflow:hidden;margin:1rem 0 .3rem}
.bar i{display:block;height:100%;width:0;background:var(--brand);border-radius:99px;transition:width .5s ease}
.pct{text-align:end;font-size:.8rem;color:var(--muted);direction:ltr}
.steps{list-style:none;padding:0;margin:1rem 0 0;text-align:start;display:inline-block;min-width:220px}
.steps li{display:flex;align-items:center;gap:.6rem;padding:.3rem 0;color:var(--muted)}
.steps li i{font-size:1.2rem}
.steps li.cur{color:var(--ink);font-weight:600}.steps li.cur i{color:var(--brand);animation:pulse 1.2s infinite}
.steps li.done{color:var(--ink)}.steps li.done i{color:var(--ok)}
@keyframes pulse{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.steps li.cur i{animation:none}.bar i{transition:none}.act{transition:none}}

/* ---------- document view ---------- */
.doc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:start}
.tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:1.2rem;gap:.25rem}
.tabs button{flex:1;background:none;border:0;border-bottom:3px solid transparent;padding:.7rem .5rem;font-weight:600;color:var(--muted);font-size:.95rem}
.tabs button.active{color:var(--brand);border-bottom-color:var(--brand)}
.pane{display:none}.pane.active{display:block}
.sum-title{display:flex;align-items:center;gap:.5rem;font-size:1.05rem;font-weight:700;margin:0 0 .5rem}
.sum-title i{color:var(--brand)}
.sum-block{margin-bottom:1.6rem}
.sum-block h4{font-size:1.05rem;margin:0 0 .7rem}
.kp{list-style:none;padding:0;margin:0}
.kp li{display:flex;align-items:flex-start;gap:.6rem;padding:.35rem 0}
.kp li i{margin-top:.3rem;font-size:1rem;flex:none}
.kp li.ok i{color:var(--ok)}.kp li.warn i{color:var(--wait)}
.kp b{font-weight:600}
.terms{list-style:none;padding:0;margin:0}
.terms li{padding:.3rem 0;display:flex;gap:.55rem;align-items:flex-start}
.terms li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand);margin-top:.7rem;flex:none}
.type-pill{display:inline-block;background:var(--brand-soft);color:var(--brand);border-radius:999px;padding:.1rem .8rem;font-size:.8rem;font-weight:600}
.notice{border-radius:12px;padding:.7rem .95rem;font-size:.86rem;background:var(--wait-bg);color:#7a4a00;margin-bottom:1rem}
.disclaimer{font-size:.78rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:.8rem;margin-top:1rem}
.viewer{background:#fff}
.viewer-bar{display:flex;align-items:center;gap:.6rem;padding:.8rem 1rem;border-bottom:1px solid var(--line);font-weight:600}
.viewer-bar .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:start}
.viewer-bar button,.pager button{background:none;border:0;color:var(--muted);font-size:1.05rem;border-radius:8px;padding:.2rem .5rem}
.viewer-bar button:hover,.pager button:hover{background:var(--brand-soft);color:var(--brand)}
.viewer-canvas{background:#f4f5fb;padding:1rem;display:grid;place-items:center;min-height:320px;overflow:auto;max-height:70vh}
.viewer-canvas canvas,.viewer-canvas img{max-width:100%;height:auto;box-shadow:0 2px 10px rgba(30,30,80,.15);background:#fff}
.pager{display:flex;align-items:center;justify-content:center;gap:.6rem;padding:.7rem;border-top:1px solid var(--line);font-size:.9rem;direction:ltr}
@media (max-width:991.98px){
  .doc-grid{grid-template-columns:1fr}
  .pane-doc{display:none}.pane-doc.active{display:block}
  .tabs.has-doc button[data-tab=doc]{display:block}
}
@media (min-width:992px){
  .tabs button[data-tab=doc]{display:none}
  .doc-grid .pane-doc{display:none!important}
  .doc-grid{grid-template-areas:"main doc"}
  .main-col{grid-area:main}.doc-col{grid-area:doc;position:sticky;top:5rem}
}

/* ---------- chat ---------- */
.chat{display:flex;flex-direction:column;gap:.9rem;margin-bottom:1rem}
.msg{display:flex;gap:.6rem;align-items:flex-end;max-width:100%}
.msg.user{justify-content:flex-start}
.bubble{border-radius:16px;padding:.7rem 1rem;max-width:88%;font-size:.95rem;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.user .bubble{background:var(--brand);color:#fff;border-end-start-radius:4px}
.msg.bot .bubble{background:#f1f2fb;color:var(--ink);border-end-end-radius:4px}
.msg.bot .bubble.nf{background:#fff7e8;color:#7a4a00}
.bot-av{width:32px;height:32px;flex:none;color:var(--brand)}
.cite{display:block;font-size:.76rem;color:var(--muted);margin-top:.35rem;white-space:normal}
.cite q{display:block;margin-top:.2rem;font-style:normal;color:#5a5f80;border-inline-start:3px solid #cfd0f0;padding-inline-start:.5rem;quotes:none}
.time{font-size:.7rem;color:var(--muted);align-self:flex-end}
.sugg-title{font-weight:700;font-size:.92rem;margin:1rem 0 .5rem}
.chips{display:flex;gap:.5rem;flex-wrap:wrap}
.chip{background:#fff;border:1px solid var(--brand-soft);border-radius:999px;padding:.35rem .9rem;font-size:.85rem;color:var(--brand);font-weight:500}
.chip:hover{background:var(--brand-soft)}
.ask{display:flex;gap:.6rem;align-items:center;border:1px solid var(--line);border-radius:14px;padding:.4rem .5rem .4rem .4rem;background:#fff;margin-top:1rem}
.ask input{border:0;flex:1;padding:.55rem .75rem;min-width:0;background:transparent}
.ask input:focus{outline:0}
.ask button{width:42px;height:42px;border-radius:12px;background:var(--brand);color:#fff;border:0;display:grid;place-items:center;font-size:1.05rem;flex:none}
.ask button:disabled{opacity:.5}
.ask-meta{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted);margin-top:.35rem}
.typing{display:inline-flex;gap:4px}.typing i{width:6px;height:6px;border-radius:50%;background:var(--brand);animation:pulse 1s infinite}.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}

/* ---------- alerts / misc ---------- */
.flash{border-radius:12px;padding:.75rem 1rem;margin-bottom:1rem;font-size:.92rem;display:flex;gap:.6rem;align-items:flex-start}
.flash.err{background:var(--bad-bg);color:#9c1f33}.flash.okk{background:var(--ok-bg);color:#14693a}
.flash ul{margin:0;padding-inline-start:1.1rem}
.auth-wrap{min-height:calc(100vh - 140px);display:grid;place-items:center;padding:1.5rem}
.auth-card{width:100%;max-width:440px;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:2rem}
.auth-card h1{font-size:1.5rem;margin-bottom:.25rem}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.steps3 .s{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.3rem;box-shadow:var(--shadow)}
.steps3 .s .n{width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700;margin-bottom:.6rem}
@media (max-width:767.98px){.steps3{grid-template-columns:1fr}}
.prose{max-width:46rem}.prose h2{font-size:1.15rem;margin:1.6rem 0 .5rem}.prose li{margin-bottom:.35rem}
.modal-content{border-radius:18px;border:0}
.dropdown-menu{border-radius:12px;border-color:var(--line);box-shadow:var(--shadow)}
.visually-hidden-focusable:focus{position:static}

.page-head .meta{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .6rem;margin:.2rem 0 0}
.page-head .meta>span+span:before{content:"·";margin-inline-end:.6rem;color:var(--muted)}
.page-head .meta>.badge-s+span:before{content:none}
.msg.bot{flex-direction:row-reverse;justify-content:flex-start}
