/* ── /static/css/redesign-sales.css ── */
/* AlSaeb CRM — Redesign: Sales / Leads (modern clean) — v2 */
:root{ --rd-ease: cubic-bezier(.22,.61,.36,1); --rd-radius:18px; }
@keyframes rdRise{ from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
@keyframes rdShimmer{ 0%{background-position:-480px 0} 100%{background-position:480px 0} }
#leads-table-wrap{ border-radius:var(--rd-radius)!important; border:1px solid var(--color-divider,#EAECF0)!important; box-shadow:0 8px 26px rgba(37,99,235,.08),0 2px 6px rgba(16,24,40,.05)!important; animation:rdRise .35s var(--rd-ease) both; }
#leads-table-wrap thead th{ background:var(--color-bg,#F7F8FB)!important; color:var(--color-text-muted,#667085)!important; font-size:12px!important; font-weight:700!important; letter-spacing:.3px; padding:15px 16px!important; border-bottom:1px solid var(--color-divider,#EAECF0)!important; box-shadow:none!important; white-space:nowrap; }
#leads-body td{ padding:17px 16px!important; font-variant-numeric:tabular-nums; border-bottom:1px solid var(--color-divider,#EAECF0)!important; }
#leads-body tr{ animation:rdRise .4s var(--rd-ease) both; transition:background-color .15s var(--rd-ease),box-shadow .18s var(--rd-ease); }
#leads-body tr:nth-child(even){ background:transparent!important; }
#leads-body tr:hover{ background:linear-gradient(270deg,rgba(37,99,235,.07),rgba(37,99,235,.02))!important; box-shadow:inset 4px 0 0 var(--color-primary,#2563EB)!important; }
#leads-body tr:last-child td{ border-bottom:none!important; }
#leads-body tr:nth-child(1){animation-delay:.02s}#leads-body tr:nth-child(2){animation-delay:.05s}#leads-body tr:nth-child(3){animation-delay:.08s}#leads-body tr:nth-child(4){animation-delay:.11s}#leads-body tr:nth-child(5){animation-delay:.14s}#leads-body tr:nth-child(6){animation-delay:.17s}#leads-body tr:nth-child(7){animation-delay:.20s}#leads-body tr:nth-child(8){animation-delay:.23s}#leads-body tr:nth-child(9){animation-delay:.26s}#leads-body tr:nth-child(10){animation-delay:.29s}#leads-body tr:nth-child(11){animation-delay:.32s}#leads-body tr:nth-child(12){animation-delay:.35s}#leads-body tr:nth-child(13){animation-delay:.38s}#leads-body tr:nth-child(14){animation-delay:.41s}
#leads-body .chip,#leads-kanban .chip,#leads-body [class*="status-"],#leads-kanban [class*="status-"]{ border-radius:999px!important; padding:6px 13px!important; font-weight:700!important; font-size:12.5px!important; display:inline-flex!important; align-items:center; gap:7px; line-height:1!important; border:1px solid transparent!important; }
#leads-body .chip::before,#leads-kanban .chip::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
#leads-body tr td:last-child .btn{ opacity:.5; transition:opacity .15s,transform .15s var(--rd-ease); }
#leads-body tr:hover td:last-child .btn{ opacity:1; }
#leads-body tr td:last-child .btn:hover{ transform:translateY(-1px); }
.kanban-board{ gap:14px!important; }
.kanban-column{ background:var(--color-bg,#F7F8FB)!important; border:1px solid var(--color-divider,#EAECF0)!important; border-radius:16px!important; overflow:hidden; }
.kanban-column-header{ padding:13px 14px!important; }
.kanban-column-count{ background:rgba(37,99,235,.12)!important; color:var(--color-primary,#2563EB)!important; border-radius:999px!important; padding:2px 10px!important; font-weight:800!important; }
.kanban-card{ border-radius:13px!important; border:1px solid var(--color-divider,#EAECF0)!important; box-shadow:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.06)!important; transition:transform .18s var(--rd-ease),box-shadow .2s var(--rd-ease),border-color .18s!important; }
.kanban-card:hover{ transform:translateY(-3px)!important; box-shadow:0 14px 38px rgba(37,99,235,.14),0 4px 12px rgba(16,24,40,.06)!important; border-color:rgba(37,99,235,.32)!important; }
#leads-total-badge{ box-shadow:0 1px 2px rgba(16,24,40,.06)!important; border:1px solid rgba(37,99,235,.18)!important; }
.rd-skeleton{ background:linear-gradient(90deg,var(--color-bg) 25%,rgba(0,0,0,.05) 37%,var(--color-bg) 63%); background-size:960px 100%; animation:rdShimmer 1.4s linear infinite; border-radius:8px; }
@media (prefers-reduced-motion: reduce){ #leads-body tr,.kanban-card,#leads-table-wrap{ animation:none!important; } }

/* ── /static/css/redesign-distribute.css ── */
@keyframes rdRiseD{ from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
section[data-view="distribute"]:not(.hidden){ display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:20px; align-items:start; }
section[data-view="distribute"] > h2{ grid-column:1/-1; margin-bottom:2px !important; }
section[data-view="distribute"] .card{ max-width:none !important; margin:0 !important; background:var(--color-card,#fff) !important; border:1px solid var(--color-divider,#EAECF0) !important; border-radius:18px !important; box-shadow:0 8px 26px rgba(37,99,235,.06) !important; padding:24px !important; animation:rdRiseD .35s cubic-bezier(.22,.61,.36,1) both; }
section[data-view="distribute"] label{ color:var(--color-text-muted,#667085) !important; font-weight:600 !important; font-size:13.5px !important; }
section[data-view="distribute"] input, section[data-view="distribute"] select{ background:var(--color-surface,#fff) !important; border:1px solid var(--color-divider,#D7DEEA) !important; border-radius:11px !important; padding:11px 13px !important; color:var(--color-text,#111827) !important; font-size:15px !important; width:100% !important; transition:border-color .15s, box-shadow .2s; }
section[data-view="distribute"] input:hover, section[data-view="distribute"] select:hover{ border-color:#C7D2E4 !important; }
section[data-view="distribute"] input:focus, section[data-view="distribute"] select:focus{ outline:none !important; border-color:var(--color-primary,#2563EB) !important; box-shadow:0 0 0 4px rgba(37,99,235,.12) !important; }
section[data-view="distribute"] button[type="submit"]{ background:var(--color-primary,#2563EB) !important; color:#fff !important; border:none !important; border-radius:12px !important; padding:13px !important; font-weight:700 !important; box-shadow:0 1px 2px rgba(37,99,235,.25) !important; transition:transform .15s, box-shadow .15s, background .15s; cursor:pointer; }
section[data-view="distribute"] button[type="submit"]:hover{ background:var(--color-primary-600,#1D4ED8) !important; transform:translateY(-1px); box-shadow:0 4px 12px rgba(37,99,235,.3) !important; }
section[data-view="distribute"] h3{ font-size:18px !important; }
.rd-card-title{ display:flex; align-items:center; gap:8px; font-size:18px; font-weight:800; color:var(--color-text,#111827); margin-bottom:4px; }
.rd-card-title i{ color:var(--color-primary,#2563EB); }
.rd-card-sub{ font-size:12.5px; color:var(--color-text-muted,#667085); margin-bottom:16px; line-height:1.6; }
.rd-dist-ok{ border:1px solid rgba(16,185,129,.30); background:rgba(16,185,129,.08); border-radius:14px; padding:18px; animation:rdRiseD .3s ease both; }
.rd-dist-ok-h{ display:flex; align-items:center; gap:8px; color:#047857; font-weight:800; font-size:16px; margin-bottom:14px; }
.rd-dist-stats{ display:flex; gap:14px; flex-wrap:wrap; }
.rd-dist-stat{ flex:1; min-width:110px; background:var(--color-surface,#fff); border:1px solid var(--color-divider,#EAECF0); border-radius:12px; padding:14px; text-align:center; }
.rd-dist-num{ font-size:28px; font-weight:800; color:var(--color-primary,#2563EB); font-variant-numeric:tabular-nums; }
.rd-dist-lbl{ font-size:12.5px; color:var(--color-text-muted,#667085); margin-top:2px; }

/* ── /static/css/redesign-dashboard.css ── */
@keyframes rdRiseDash{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
[data-view="dashboard"] .kpi-card{ border-radius:16px !important; border:1px solid var(--color-divider,#EAECF0) !important; background:var(--color-card,#fff) !important; box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06) !important; padding:18px 20px !important; transition:transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s !important; animation:rdRiseDash .42s cubic-bezier(.22,.61,.36,1) both; }
[data-view="dashboard"] .kpi-card:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(37,99,235,.10),0 3px 8px rgba(16,24,40,.05) !important; }
[data-view="dashboard"] .kpi-value{ font-variant-numeric:tabular-nums; }
[data-view="dashboard"] #dash-quick-stats > *:nth-child(1){ animation-delay:.04s; }
[data-view="dashboard"] #dash-quick-stats > *:nth-child(2){ animation-delay:.10s; }
[data-view="dashboard"] #dash-quick-stats > *:nth-child(3){ animation-delay:.16s; }
[data-view="dashboard"] #dash-quick-stats > *:nth-child(4){ animation-delay:.22s; }
[data-view="dashboard"] .card-v2{ border-radius:16px !important; transition:transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s, border-color .2s !important; }
[data-view="dashboard"] .card-v2:hover{ box-shadow:0 10px 28px rgba(37,99,235,.07),0 2px 6px rgba(16,24,40,.05) !important; }
[data-view="dashboard"] #pipeline-cards .chip[class*="status-"]{ border-radius:999px !important; font-weight:700 !important; font-size:11.5px !important; border:1px solid transparent !important; padding:4px 11px !important; }

/* ── /static/css/redesign-global.css ── */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]), select, textarea{ border-radius:11px !important; border:1px solid var(--color-divider,#E2E8F0) !important; background:var(--color-surface,#fff) !important; color:var(--color-text,#111827) !important; transition:border-color .15s ease, box-shadow .2s ease, background-color .15s ease !important; }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):hover, select:hover, textarea:hover{ border-color:#C7D2E4 !important; }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):focus, select:focus, textarea:focus{ outline:none !important; border-color:var(--color-primary,#2563EB) !important; box-shadow:0 0 0 4px rgba(37,99,235,.12) !important; }
::placeholder{ color:var(--color-text-dim,#98A2B3); opacity:1; }
.card{ border-radius:16px !important; border:1px solid var(--color-divider,#EAECF0) !important; background:var(--color-card,#fff) !important; box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06) !important; }
[id$="-modal"] > div, .modal-box, .modal-content{ border-radius:16px !important; border:1px solid var(--color-divider,#EAECF0) !important; box-shadow:0 24px 60px rgba(16,24,40,.22) !important; }
.bg-crm-primary, button[type="submit"]{ border-radius:11px !important; transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease, opacity .15s ease !important; }
.bg-crm-primary:hover:not(:disabled), button[type="submit"]:hover:not(:disabled){ transform:translateY(-1px); }
.badge{ border-radius:999px !important; }

/* ── /static/css/redesign-realestate.css ── */
.rd-filterwrap{ display:flex !important; flex-wrap:wrap; gap:10px !important; align-items:center; }
.rd-filterwrap > select{ flex:1 1 200px; min-width:0 !important; max-width:280px !important; height:42px !important; border-radius:12px !important; font-size:14px !important; }
.rd-filterwrap > input{ flex:2 1 240px; min-width:0 !important; height:42px !important; border-radius:12px !important; font-size:14px !important; }
.rd-filterwrap > .rd-more-btn{ flex:0 0 auto; height:42px; }
.rd-advwrap{ display:none !important; flex-wrap:wrap; gap:10px; align-items:center; width:100%; margin-top:12px; }
.rd-advwrap.rd-open{ display:flex !important; animation:rdSlideDown .26s cubic-bezier(.22,.61,.36,1); }
.rd-advwrap > select, .rd-advwrap > input{ flex:1 1 175px; min-width:0 !important; max-width:230px !important; height:42px !important; border-radius:12px !important; font-size:14px !important; }
.rd-advwrap > input#lst-search, .rd-advwrap > input#bh-q{ flex:2 1 260px; max-width:none !important; }
@keyframes rdSlideDown{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
section[data-view="listings"] select, section[data-view="listings"] input, #bh-offplan select, #bh-offplan input{ border-radius:12px !important; transition:border-color .15s ease, box-shadow .2s ease, transform .12s ease !important; }
section[data-view="listings"] select:hover, #bh-offplan select:hover{ transform:translateY(-1px); }
#listings-grid .bh-card, #offplan-list .bh-card, #developers-list .card{ animation:rdCardIn .44s cubic-bezier(.22,.61,.36,1) both; }
@keyframes rdCardIn{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
#listings-grid .bh-card:nth-child(1),#offplan-list .bh-card:nth-child(1),#developers-list .card:nth-child(1){animation-delay:.02s}
#listings-grid .bh-card:nth-child(2),#offplan-list .bh-card:nth-child(2),#developers-list .card:nth-child(2){animation-delay:.05s}
#listings-grid .bh-card:nth-child(3),#offplan-list .bh-card:nth-child(3),#developers-list .card:nth-child(3){animation-delay:.08s}
#listings-grid .bh-card:nth-child(4),#offplan-list .bh-card:nth-child(4),#developers-list .card:nth-child(4){animation-delay:.11s}
#listings-grid .bh-card:nth-child(5),#offplan-list .bh-card:nth-child(5),#developers-list .card:nth-child(5){animation-delay:.14s}
#listings-grid .bh-card:nth-child(6),#offplan-list .bh-card:nth-child(6),#developers-list .card:nth-child(6){animation-delay:.17s}
#listings-grid .bh-card:nth-child(7),#offplan-list .bh-card:nth-child(7),#developers-list .card:nth-child(7){animation-delay:.20s}
#listings-grid .bh-card:nth-child(8),#offplan-list .bh-card:nth-child(8),#developers-list .card:nth-child(8){animation-delay:.23s}
#offplan-list .card, #developers-list .card{ transition:transform .22s cubic-bezier(.2,.7,.3,1), box-shadow .22s ease, border-color .2s ease !important; }
#offplan-list .card:hover, #developers-list .card:hover{ transform:translateY(-5px); box-shadow:0 14px 36px rgba(37,99,235,.12),0 4px 12px rgba(16,24,40,.06) !important; }
.rd-more-btn{ box-shadow:0 1px 2px rgba(16,24,40,.05); }
@media (prefers-reduced-motion: reduce){ #listings-grid .bh-card, #offplan-list .bh-card, #developers-list .card, .rd-advwrap.rd-open{ animation:none !important; } }

/* ── /static/css/realestate-detail.css ── */
#lst-detail .rdx{ background:var(--color-card,#fff); border:1px solid var(--color-divider,#e6e8eb); border-radius:16px; padding:22px 24px; animation:rdxIn .3s ease; }
@keyframes rdxIn{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
.rdx-bar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.rdx-close{ display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 16px; border-radius:10px; border:1px solid var(--color-divider,#e6e8eb); background:var(--color-surface,#fff); color:var(--color-text,#1f2937); font-weight:700; font-size:14px; cursor:pointer; transition:all .15s; }
.rdx-close:hover{ background:var(--color-danger,#ef4444); color:#fff; border-color:transparent; }
.rdx-editbtn{ height:40px; padding:0 16px; border-radius:10px; border:1px solid var(--color-divider,#e6e8eb); background:var(--color-surface,#fff); color:var(--color-primary,#2563eb); font-weight:700; font-size:14px; cursor:pointer; }
.rdx-editbtn:hover{ background:rgba(37,99,235,.08); }
.rdx-headrow{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:14px; }
.rdx-title{ font-size:26px; font-weight:800; color:var(--color-text,#1f2937); margin:0; line-height:1.3; }
.rdx-pills{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.rdx-pill{ color:#fff; font-size:12px; font-weight:700; padding:6px 13px; border-radius:999px; }
.rdx-pill-soft{ background:var(--color-bg,#eef2f7) !important; color:var(--color-text-muted,#667085) !important; }
.rdx-bigprice{ font-size:24px; font-weight:800; color:var(--color-primary,#1d4ed8); white-space:nowrap; }
.rdx-tabs{ display:flex; gap:6px; border-bottom:1px solid var(--color-divider,#e6e8eb); margin-bottom:22px; flex-wrap:wrap; position:sticky; top:0; background:var(--color-card,#fff); z-index:4; padding-top:4px; }
.rdx-tab{ background:none; border:none; padding:11px 16px; font-size:14.5px; font-weight:700; color:var(--color-text-muted,#667085); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; transition:color .15s; }
.rdx-tab:hover{ color:var(--color-primary,#2563eb); }
.rdx-tab.active{ color:var(--color-primary,#2563eb); border-bottom-color:var(--color-primary,#2563eb); }
.rdx-main{ display:grid; grid-template-columns:1fr 1.15fr; gap:28px; align-items:start; scroll-margin-top:60px; }
@media(max-width:920px){ .rdx-main{ grid-template-columns:1fr; } }
.rdx-sec{ margin-top:34px; scroll-margin-top:60px; }
.rdx-sec h2{ font-size:20px; font-weight:800; color:var(--color-text,#1f2937); margin:0 0 14px; }
.rdx-rows{ display:flex; flex-direction:column; }
.rdx-row{ display:flex; gap:16px; padding:13px 2px; border-bottom:1px solid var(--color-divider,#eef1f4); font-size:14.5px; }
.rdx-row .k{ color:var(--color-text-muted,#667085); min-width:130px; }
.rdx-row .v{ font-weight:700; color:var(--color-text,#1f2937); }
.rdx-about{ font-size:14.5px; line-height:1.9; color:var(--color-text,#374151); white-space:pre-line; }
.rdx-feats{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media(max-width:560px){ .rdx-feats{ grid-template-columns:1fr; } }
.rdx-feat{ display:flex; align-items:center; gap:10px; background:var(--color-bg,#f7f9fc); border:1px solid var(--color-divider,#eef1f4); border-radius:10px; padding:11px 13px; font-size:14px; font-weight:600; }
.rdx-feat span{ color:var(--color-success,#16a34a); font-weight:800; }
.rdx-muted{ color:var(--color-text-dim,#98a2b3); }
.rdx-maplink{ display:inline-block; margin-top:14px; color:var(--color-primary,#2563eb); font-weight:700; text-decoration:none; }
.rdx-gal{ position:relative; border-radius:16px; overflow:hidden; height:440px; background:linear-gradient(135deg,#9fb6cf,#5b7da6 55%,#3c5a80); }
.rdx-gal img{ width:100%; height:100%; object-fit:cover; cursor:zoom-in; display:block; }
.rdx-noimg{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:18px; }
.rdx-nav{ position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:none; background:rgba(255,255,255,.92); color:#1f2937; font-size:22px; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.2); }
.rdx-nav.prev{ inset-inline-start:12px; } .rdx-nav.next{ inset-inline-end:12px; }
.rdx-expand{ position:absolute; top:12px; inset-inline-end:12px; width:40px; height:40px; border-radius:10px; border:none; background:rgba(0,0,0,.55); color:#fff; font-size:18px; cursor:pointer; }
.rdx-thumbs{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.rdx-thumb{ width:90px; height:62px; object-fit:cover; border-radius:9px; cursor:pointer; border:2px solid transparent; background:#cbd5e1; transition:border-color .15s, transform .15s; }
.rdx-thumb:hover{ transform:translateY(-2px); }
.rdx-thumb.active{ border-color:var(--color-primary,#2563eb); }
.rdx-lb{ position:fixed; inset:0; z-index:2147483600; background:rgba(0,0,0,.92); display:flex; align-items:center; justify-content:center; }
.rdx-lb img{ max-width:90vw; max-height:86vh; object-fit:contain; border-radius:8px; }
.rdx-lb-close{ position:fixed; top:18px; inset-inline-end:22px; width:46px; height:46px; border-radius:50%; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:22px; cursor:pointer; }
.rdx-lb-nav{ position:fixed; top:50%; transform:translateY(-50%); width:56px; height:56px; border-radius:50%; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:30px; cursor:pointer; }
.rdx-lb-nav.prev{ inset-inline-start:22px; } .rdx-lb-nav.next{ inset-inline-end:22px; }
.rdx-lb-count{ position:fixed; bottom:22px; left:50%; transform:translateX(-50%); color:#fff; font-size:14px; background:rgba(0,0,0,.4); padding:6px 14px; border-radius:999px; }
#listings-body tr{ cursor:pointer; }

/* ── /static/css/map-boost.css ── */
.mb-legend{ position:absolute; bottom:14px; inset-inline-start:14px; z-index:600; background:rgba(255,255,255,.96); border:1px solid #e6e8eb; border-radius:10px; padding:9px 12px; font-size:12px; box-shadow:0 4px 14px rgba(0,0,0,.14); color:#1f2937; }
.mb-legend b{ display:block; margin-bottom:6px; font-size:12.5px; }
.mb-legend span{ display:flex; align-items:center; gap:7px; margin:3px 0; }
.mb-legend i{ width:12px; height:12px; border-radius:50%; display:inline-block; flex:none; }
.leaflet-popup-content .mb-open:hover{ filter:brightness(1.08); }
#mb-city{ max-width:160px; }

/* ── /static/css/redesign-transactions.css ── */
[data-view="transactions"] .kpi-card{ border-radius:16px !important; border:1px solid var(--color-divider,#EAECF0) !important; background:var(--color-card,#fff) !important; box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06) !important; padding:18px 20px !important; position:relative; overflow:hidden; transition:transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s !important; animation:txRise .42s cubic-bezier(.22,.61,.36,1) both; }
[data-view="transactions"] .kpi-card:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(37,99,235,.10),0 3px 8px rgba(16,24,40,.05) !important; }
[data-view="transactions"] .kpi-card::before{ content:""; position:absolute; top:0; inset-inline-start:0; width:100%; height:3px; }
[data-view="transactions"] #txn-summary>*:nth-child(1)::before{ background:#2563eb; }
[data-view="transactions"] #txn-summary>*:nth-child(2)::before{ background:#16a34a; }
[data-view="transactions"] #txn-summary>*:nth-child(3)::before{ background:#7c3aed; }
[data-view="transactions"] #txn-summary>*:nth-child(4)::before{ background:#eab308; }
[data-view="transactions"] .kpi-value{ font-variant-numeric:tabular-nums; }
@keyframes txRise{ from{opacity:0;transform:translateY(12px);} to{opacity:1;transform:none;} }
[data-view="transactions"] .badge{ border-radius:999px !important; font-weight:700 !important; font-size:12px !important; padding:5px 12px !important; border:1px solid transparent !important; }
[data-view="transactions"] .badge-warning{ background:rgba(234,179,8,.16) !important; color:#a16207 !important; border-color:rgba(234,179,8,.28) !important; }
[data-view="transactions"] .badge-info{ background:rgba(37,99,235,.12) !important; color:#1d4ed8 !important; border-color:rgba(37,99,235,.22) !important; }
[data-view="transactions"] .badge-success{ background:rgba(22,163,74,.14) !important; color:#15803d !important; border-color:rgba(22,163,74,.26) !important; }
[data-view="transactions"] .badge-danger{ background:rgba(239,68,68,.12) !important; color:#b91c1c !important; border-color:rgba(239,68,68,.22) !important; }
[data-view="transactions"] .badge-primary{ background:rgba(124,58,237,.12) !important; color:#6d28d9 !important; border-color:rgba(124,58,237,.22) !important; }
[data-view="transactions"] .badge-muted{ background:rgba(100,116,139,.14) !important; color:#475569 !important; border-color:rgba(100,116,139,.24) !important; }
.txm-overlay{ position:fixed; inset:0; z-index:2147483600; background:rgba(16,24,40,.5); display:flex; align-items:center; justify-content:center; padding:16px; animation:txFade .18s ease; }
@keyframes txFade{ from{opacity:0;} to{opacity:1;} }
.txm-box{ background:var(--color-card,#fff); border:1px solid var(--color-divider,#EAECF0); border-radius:18px; width:100%; max-width:460px; box-shadow:0 24px 60px rgba(16,24,40,.28); animation:txPop .22s cubic-bezier(.2,.8,.2,1); overflow:hidden; }
@keyframes txPop{ from{opacity:0;transform:translateY(12px) scale(.98);} to{opacity:1;transform:none;} }
.txm{ padding:22px; direction:rtl; font-family:Cairo,sans-serif; }
.txm-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:16px; }
.txm-title{ font-size:18px; font-weight:800; color:var(--color-text,#111827); }
.txm-pill{ font-size:12.5px; font-weight:700; padding:5px 13px; border-radius:999px; white-space:nowrap; }
.txm-amounts{ display:flex; gap:12px; margin-bottom:16px; }
.txm-amt{ flex:1; background:var(--color-bg,#f7f9fc); border:1px solid var(--color-divider,#EAECF0); border-radius:12px; padding:14px; text-align:center; }
.txm-amt .l{ font-size:12.5px; color:var(--color-text-muted,#667085); margin-bottom:4px; }
.txm-amt .v{ font-size:22px; font-weight:800; font-variant-numeric:tabular-nums; }
.txm-amt .v small{ font-size:12px; font-weight:600; opacity:.8; }
.txm-rows{ display:flex; flex-direction:column; }
.txm-row{ display:flex; justify-content:space-between; gap:14px; padding:11px 2px; border-bottom:1px solid var(--color-divider,#eef1f4); font-size:14px; }
.txm-row:last-child{ border-bottom:none; }
.txm-row .k{ color:var(--color-text-muted,#667085); white-space:nowrap; }
.txm-row .v{ font-weight:700; color:var(--color-text,#111827); text-align:end; }
.txm-acts{ display:flex; gap:8px; align-items:center; margin-top:18px; }

/* ── /static/css/attendance.css ── */
.att-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:16px; }
.att-kpi{ background:var(--color-card,#fff); border:1px solid var(--color-divider,#EAECF0); border-radius:14px; padding:14px 16px; text-align:center; box-shadow:0 1px 2px rgba(16,24,40,.05); animation:attRise .4s cubic-bezier(.22,.61,.36,1) both; }
.att-kpi .v{ font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.1; }
.att-kpi .l{ font-size:12.5px; color:var(--color-text-muted,#667085); margin-top:3px; }
@keyframes attRise{ from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:none;} }
.att-cmp-td{ text-align:center !important; min-width:90px; }
.att-bar{ height:7px; border-radius:999px; background:var(--color-divider,#e5e7eb); overflow:hidden; margin:0 auto 3px; max-width:84px; }
.att-bar-fill{ height:100%; border-radius:999px; transition:width .4s ease; }
.att-bar-num{ font-size:11px; font-weight:800; font-variant-numeric:tabular-nums; }
.att-empty{ text-align:center; padding:54px 16px; color:var(--color-text-muted,#667085); }
.att-empty .ic{ font-size:48px; margin-bottom:10px; opacity:.55; }
.att-empty .t{ font-size:16px; font-weight:700; color:var(--color-text,#111827); }
.att-empty .s{ font-size:13px; margin-top:6px; line-height:1.7; }
.att-gps-toggle{ display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:10px; border:1px solid var(--color-divider,#EAECF0); background:var(--color-surface,#fff); color:var(--color-text-muted,#667085); font-weight:700; font-size:13px; cursor:pointer; margin-bottom:16px; transition:all .15s ease; }
.att-gps-toggle:hover{ color:var(--color-primary,#2563EB); border-color:var(--color-primary,#2563EB); background:rgba(37,99,235,.05); }