/*
 * Etlalat Al Mostakbal — Media Department System
 * Brand UI layer — Build 1.0 RC
 * Main identity color sampled from the supplied official logo: #20BCC6
 */
:root{
  --brand:#20bcc6;
  --brand-50:#effcfd;
  --brand-100:#d8f7f9;
  --brand-200:#b2eef2;
  --brand-300:#77e0e7;
  --brand-400:#3dcbd4;
  --brand-500:#20bcc6;
  --brand-600:#11a6b0;
  --brand-700:#0d828b;
  --brand-800:#11676e;
  --brand-900:#11545a;
  --brand-dark:#0d828b;
  --navy:#0b343a;
  --navy-2:#08272c;
  --ink:#15363b;
  --ink-2:#26484d;
  --muted:#71878b;
  --muted-2:#9aabad;
  --bg:#f5f9f9;
  --surface-2:#eef5f5;
  --card:#ffffff;
  --line:#e0ebec;
  --line-strong:#c9dcde;
  --danger:#c94d52;
  --danger-soft:#fff0f1;
  --success:#16845f;
  --success-soft:#eaf8f2;
  --warn:#b77a16;
  --warn-soft:#fff6df;
  --info:#3476a8;
  --info-soft:#edf6ff;
  --radius:18px;
  --radius-lg:26px;
  --radius-sm:12px;
  --shadow:0 14px 44px rgba(10,58,64,.07);
  --shadow-hover:0 18px 50px rgba(10,58,64,.12);
  --sidebar-w:286px;
  --topbar-h:82px;
}

html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 8% 2%,rgba(32,188,198,.055),transparent 26rem),
    linear-gradient(180deg,#f7fbfb 0,#f4f8f8 100%);
  color:var(--ink);
  letter-spacing:0;
  overflow-x:hidden;
}
a{color:inherit}
button,input,select,textarea{font-family:inherit}
::selection{background:rgba(32,188,198,.2);color:var(--navy)}
:focus-visible{outline:3px solid rgba(32,188,198,.22);outline-offset:2px}

/* Shell */
.sidebar{
  width:var(--sidebar-w);
  padding:17px 14px 14px;
  background:
    radial-gradient(circle at 20% -8%,rgba(32,188,198,.20),transparent 18rem),
    linear-gradient(180deg,#0c3c43 0%,#082c31 58%,#07272c 100%);
  border-left:1px solid rgba(255,255,255,.06);
  box-shadow:-16px 0 42px rgba(5,43,48,.06);
  overflow:hidden;
  transition:width .28s cubic-bezier(.4,0,.2,1),transform .28s ease;
}
.sidebar:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 75%)}
.brand-block{position:relative;z-index:2;display:grid;grid-template-columns:70px 1fr 32px;gap:10px;align-items:center;padding:10px 6px 17px;border-bottom:1px solid rgba(255,255,255,.09)}
.brand-logo-wrap{display:grid;place-items:center;width:66px;height:54px;text-decoration:none;overflow:hidden}
.brand-logo{width:66px;height:auto;display:block;filter:drop-shadow(0 5px 16px rgba(0,0,0,.12))}
.brand-system-copy strong{font-size:13px;color:#fff;font-weight:800;white-space:nowrap}.brand-system-copy span{display:block;color:#98c2c6;font-size:10px;margin-top:5px;white-space:nowrap}.sidebar-collapse{width:30px;height:30px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);color:#9fd4d8;border-radius:10px;font-size:20px;cursor:pointer;transition:.2s}.sidebar-collapse:hover{background:rgba(32,188,198,.2);color:#fff;border-color:rgba(32,188,198,.35)}
.nav-list{position:relative;z-index:2;margin-top:13px;gap:3px;overflow-y:auto;overflow-x:hidden;padding:0 2px 12px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent}
.nav-section-label{display:block;padding:13px 12px 6px;color:#6fa4a8;font-size:9px;font-weight:800;letter-spacing:.7px;white-space:nowrap;transition:.2s}
.nav-item{min-height:43px;padding:10px 11px;border-radius:13px;gap:11px;color:#c8dde0;font-size:12px;font-weight:600;position:relative;overflow:hidden}
.nav-item:before{content:"";position:absolute;right:0;top:8px;bottom:8px;width:3px;border-radius:9px;background:transparent;transition:.2s}
.nav-item:hover{background:rgba(255,255,255,.055);color:#fff;transform:translateX(-2px)}
.nav-item.active{background:linear-gradient(90deg,rgba(32,188,198,.18),rgba(32,188,198,.08));color:#fff;box-shadow:inset 0 0 0 1px rgba(32,188,198,.12)}
.nav-item.active:before{background:var(--brand);box-shadow:0 0 16px rgba(32,188,198,.65)}
.nav-icon{width:23px;height:23px;min-width:23px;display:grid;place-items:center;color:#7fcdd2;transition:.2s}.nav-icon svg{width:18px;height:18px;fill:currentColor}.nav-item:hover .nav-icon,.nav-item.active .nav-icon{color:#51d2da}.nav-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-sub{margin-right:32px!important;padding:7px 10px!important;min-height:32px;font-size:10px!important;opacity:.82!important;border-radius:10px!important}.nav-sub:hover{opacity:1!important}.nav-rail{width:12px;height:1px;background:#54858a;position:relative}.nav-rail:before{content:"";position:absolute;right:-7px;top:-6px;width:7px;height:7px;border-right:1px solid #54858a;border-bottom:1px solid #54858a;border-radius:0 0 5px 0}
.sidebar-foot{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.08);padding:13px 5px 2px}.server-pill{width:100%;justify-content:center;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06);color:#93b9bd;padding:9px 8px}.server-pill i{background:#37d894;box-shadow:0 0 0 4px rgba(55,216,148,.09),0 0 12px rgba(55,216,148,.4)}.sidebar-signature{text-align:center;color:#557f83;font-size:8px;margin-top:8px}
.main-area{margin-right:var(--sidebar-w);transition:margin .28s cubic-bezier(.4,0,.2,1)}
body.sidebar-collapsed .sidebar{width:82px}body.sidebar-collapsed .main-area{margin-right:82px}body.sidebar-collapsed .brand-block{grid-template-columns:1fr;padding-inline:0}body.sidebar-collapsed .brand-logo-wrap{width:54px;margin:auto}body.sidebar-collapsed .brand-logo{width:56px}body.sidebar-collapsed .brand-system-copy,body.sidebar-collapsed .sidebar-collapse,body.sidebar-collapsed .nav-text,body.sidebar-collapsed .nav-section-label,body.sidebar-collapsed .sidebar-signature{display:none}body.sidebar-collapsed .nav-item{justify-content:center;padding:10px;margin-right:0!important}body.sidebar-collapsed .nav-sub{display:none}body.sidebar-collapsed .server-pill{width:42px;height:34px;margin:auto}body.sidebar-collapsed .server-pill i{margin:0}
.sidebar-backdrop{display:none}

/* Top bar */
.topbar{height:var(--topbar-h);padding:0 30px;background:rgba(250,253,253,.88);border-color:rgba(211,226,227,.9);box-shadow:0 5px 20px rgba(10,57,62,.025);backdrop-filter:blur(18px) saturate(130%);z-index:30}
.topbar-start{display:flex;align-items:center;gap:12px}.top-title h1{font-size:15px;color:var(--navy);font-weight:850}.top-title p{font-size:10px;margin-top:5px}.top-actions{gap:8px}.icon-btn{width:40px;height:40px;border-color:var(--line);border-radius:13px;color:var(--ink-2);box-shadow:0 3px 11px rgba(20,55,59,.025);transition:.2s}.icon-btn svg{width:18px;height:18px;fill:currentColor}.icon-btn:hover{border-color:#bcdedf;color:var(--brand-700);background:var(--brand-50);transform:translateY(-1px)}.notification-btn b{top:-4px;left:-4px;border:2px solid #f8fcfc;min-width:19px;height:19px;font-size:9px;box-shadow:0 3px 8px rgba(201,77,82,.3)}
.quick-search-btn{height:40px;min-width:166px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:0 11px;color:var(--muted);cursor:pointer;transition:.2s}.quick-search-btn:hover{border-color:#b8dde0;background:var(--brand-50);color:var(--brand-800)}.quick-search-btn span{font-size:17px}.quick-search-btn em{font-style:normal;font-size:10px}.quick-search-btn kbd{margin-right:auto;border:1px solid var(--line);background:#f7fafa;border-radius:6px;padding:3px 5px;font:8px/1.2 monospace;color:#89a0a3;direction:ltr}.live-clock{height:40px;min-width:66px;border:1px solid var(--line);background:#fff;border-radius:13px;padding:5px 10px;text-align:center}.live-clock strong,.live-clock small{display:block}.live-clock strong{font-size:11px;direction:ltr}.live-clock small{font-size:8px;color:var(--muted);margin-top:1px}
.user-menu-wrap{position:relative}.user-chip{border:1px solid transparent;background:transparent;border-radius:14px;padding:4px 6px 4px 9px;cursor:pointer;transition:.2s}.user-chip:hover,.user-chip[aria-expanded="true"]{background:#fff;border-color:var(--line);box-shadow:0 8px 22px rgba(12,57,62,.06)}.user-chip img,.avatar-fallback{width:38px;height:38px;border-radius:12px}.avatar-fallback{background:linear-gradient(145deg,var(--brand-100),#fff);color:var(--brand-800);box-shadow:inset 0 0 0 1px rgba(32,188,198,.13)}.user-chip-copy strong{font-size:11px}.user-chip-copy small{font-size:9px}.user-chevron{font-size:11px;color:var(--muted);transition:.2s}.user-chip[aria-expanded="true"] .user-chevron{transform:rotate(180deg)}
.user-popover{position:absolute;left:0;top:calc(100% + 9px);width:230px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:8px;box-shadow:0 22px 60px rgba(10,48,53,.16);opacity:0;visibility:hidden;transform:translateY(-5px) scale(.98);transform-origin:top left;transition:.18s;z-index:100}.user-popover.open{opacity:1;visibility:visible;transform:none}.user-popover-head{padding:11px 11px 12px;border-bottom:1px solid var(--line);margin-bottom:5px}.user-popover-head strong,.user-popover-head span{display:block}.user-popover-head strong{font-size:12px}.user-popover-head span{font-size:9px;color:var(--muted);margin-top:4px}.user-popover a,.user-popover button{display:block;width:100%;padding:10px 11px;border:0;background:transparent;border-radius:10px;text-decoration:none;text-align:right;font-size:10px;color:var(--ink);cursor:pointer}.user-popover a:hover{background:var(--surface-2)}.user-popover form{border-top:1px solid var(--line);margin-top:4px;padding-top:4px}.user-popover button{color:#a84347}.user-popover button:hover{background:var(--danger-soft)}
.logout-btn{display:none}

/* Main surfaces */
.page-wrap{padding:31px 32px 46px;max-width:1680px}.page-head{margin-bottom:23px}.page-head h2{font-size:28px;line-height:1.35;color:var(--navy);font-weight:900;letter-spacing:-.2px}.page-head p{font-size:12px;line-height:1.9}.eyebrow{color:var(--brand-700);font-size:10px;letter-spacing:.2px}.head-date{border:1px solid #d6e9ea;background:rgba(255,255,255,.65);color:var(--brand-800);padding:9px 13px;box-shadow:0 4px 16px rgba(16,67,73,.035)}
.panel{border-color:var(--line);border-radius:20px;box-shadow:var(--shadow)}.panel:hover{border-color:#d5e5e6}.panel-head{padding:20px 22px}.panel-head h3{font-size:14px;color:var(--navy);font-weight:850}.panel-head p{font-size:10px;line-height:1.6}.panel-head a,.panel-link{color:var(--brand-700);font-weight:750}.panel-kicker{display:block;font-size:8px;color:var(--brand-700);font-weight:800;margin-bottom:5px}.detail-copy{padding:21px 23px;line-height:1.95}.detail-copy h3,.detail-copy h4{color:var(--navy)}.detail-copy p{color:var(--ink-2);font-size:12px}
.kpi-grid{gap:13px}.kpi-card{position:relative;padding:18px 19px;border-color:var(--line);border-radius:18px;box-shadow:0 8px 26px rgba(10,58,64,.045);overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}.kpi-card:after{content:"";position:absolute;right:-40px;bottom:-52px;width:110px;height:110px;border-radius:50%;background:rgba(32,188,198,.035)}.kpi-card:hover{transform:translateY(-2px);border-color:#c9e2e4;box-shadow:var(--shadow-hover)}.kpi-card span,.kpi-card small{font-size:10px}.kpi-card strong{font-size:29px;color:var(--navy);font-weight:900;margin:9px 0 6px}.kpi-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--brand-50);color:var(--brand-700);font-weight:900;margin-bottom:14px;border:1px solid var(--brand-100)}.kpi-accent{background:linear-gradient(145deg,#fff,var(--brand-50))}.success-card{background:linear-gradient(145deg,#fff,var(--success-soft));border-color:#d1eadd}

/* Buttons */
.btn{min-height:40px;padding:9px 15px;border-radius:12px;font-size:11px;font-weight:800;gap:7px;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--brand-500),var(--brand-600));box-shadow:0 8px 18px rgba(17,166,176,.18);color:#fff}.btn-primary:hover{background:linear-gradient(135deg,var(--brand-600),var(--brand-700));box-shadow:0 11px 22px rgba(17,166,176,.24)}.btn-ghost{background:#fff;border-color:var(--line);color:var(--ink-2)}.btn-ghost:hover{border-color:#b8dcde;background:var(--brand-50);color:var(--brand-800)}.btn-light{background:#fff;color:var(--brand-800);box-shadow:0 10px 22px rgba(0,0,0,.09)}.btn-light:hover{background:#f5ffff}.btn-glass{color:#fff;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);backdrop-filter:blur(8px)}.btn-glass:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.32)}

/* Forms */
.form-panel{padding:25px}.form-grid{gap:18px}.form-group label,.stack-form label{font-size:11px;color:var(--ink);font-weight:800}.field-input{min-height:43px;border-color:#d4e3e4;border-radius:12px;background:#fcfefe;padding:11px 12px;font-size:12px;transition:.18s}.field-input:hover{border-color:#c1d9db}.field-input:focus{background:#fff;border-color:var(--brand-400);box-shadow:0 0 0 4px rgba(32,188,198,.085)}textarea.field-input,.field-textarea{line-height:1.8}.field-error,.form-error{border-color:#f0d2d4;background:var(--danger-soft);color:#9e3f43}.form-actions{padding-top:17px}.permission-list label{background:#fff;border-color:var(--line);transition:.15s}.permission-list label:hover{border-color:#b9dfe1;background:var(--brand-50)}.deny-list label:hover{border-color:#edc8cb;background:var(--danger-soft)}input[type="checkbox"],input[type="radio"]{accent-color:var(--brand-600)}input[type="file"]::file-selector-button{border:0;background:var(--brand-50);color:var(--brand-800);padding:8px 11px;border-radius:8px;margin-left:9px;font:inherit;font-size:10px;cursor:pointer}

/* Tables */
.table-panel{border-radius:20px}.table-toolbar{padding:13px 16px;background:#fbfdfd}.table-wrap{scrollbar-width:thin;scrollbar-color:#c9dcde transparent}.data-table{font-size:11px}.data-table th{background:#f8fbfb;color:#71888b;font-size:9px;font-weight:850;letter-spacing:.1px;position:sticky;top:0;z-index:1}.data-table th,.data-table td{padding:13px 16px}.data-table tbody tr{transition:.14s}.data-table tr:hover td{background:#f5fbfb}.data-table tbody tr:last-child td{border-bottom:0}.person-cell strong{font-size:11px}.mini-avatar{background:linear-gradient(145deg,var(--brand-100),#fff);color:var(--brand-800);box-shadow:inset 0 0 0 1px rgba(32,188,198,.13)}.row-actions a{padding:5px 7px;border-radius:7px}.row-actions a:hover{background:var(--brand-50);color:var(--brand-800)}.badge{padding:5px 9px;font-size:9px;font-weight:800;border:1px solid transparent}.badge.success{background:var(--success-soft);color:var(--success);border-color:#d4eddf}.badge.muted{background:#f0f4f4;color:#6c8083;border-color:#e4ebec}.badge.warning{background:var(--warn-soft);color:var(--warn);border-color:#f0dfb2}.badge.info{background:var(--info-soft);color:var(--info);border-color:#d7e9f8}.badge.priority-high{background:#fff0f1;color:#b3454a}.badge.priority-medium{background:#fff6df;color:#9d6811}.badge.priority-normal{background:#edf7f7;color:#27727a}

/* Tabs */
.campaign-tabs{display:flex;gap:6px;overflow-x:auto;padding:5px;background:#edf5f5;border:1px solid var(--line);border-radius:14px;margin:14px 0 18px;scrollbar-width:none}.campaign-tabs a{white-space:nowrap;text-decoration:none;padding:9px 13px;border-radius:10px;color:#687f82;font-size:10px;font-weight:750;transition:.18s}.campaign-tabs a:hover{background:rgba(255,255,255,.7);color:var(--brand-800)}.campaign-tabs a.active{background:#fff;color:var(--brand-800);box-shadow:0 5px 15px rgba(16,74,80,.08)}

/* Dashboard */
.dashboard-hero{position:relative;display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center;min-height:238px;margin-bottom:28px;padding:34px 37px;color:#fff;border-radius:28px;overflow:hidden;background:linear-gradient(125deg,#0a4b53 0%,#0d7780 47%,#16adb7 100%);box-shadow:0 24px 60px rgba(8,92,101,.18)}.dashboard-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 7% 120%,rgba(91,233,239,.32),transparent 27rem),linear-gradient(110deg,transparent 48%,rgba(255,255,255,.04));pointer-events:none}.dashboard-hero:after{content:"";position:absolute;left:35%;top:-160px;width:1px;height:500px;background:rgba(255,255,255,.12);transform:rotate(25deg);box-shadow:75px 0 rgba(255,255,255,.07),150px 0 rgba(255,255,255,.035)}.dashboard-watermark{position:absolute;left:-45px;bottom:-48px;width:410px;opacity:.055;filter:drop-shadow(0 10px 30px rgba(0,0,0,.1));pointer-events:none}.dashboard-hero-copy{position:relative;z-index:2;max-width:760px}.hero-overline{display:inline-flex;align-items:center;gap:8px;font-size:9px;color:#c9f7fa;font-weight:800}.hero-overline i{width:7px;height:7px;border-radius:50%;background:#71f0c0;box-shadow:0 0 0 5px rgba(113,240,192,.1)}.dashboard-hero h2{font-size:34px;margin:12px 0 8px;line-height:1.3}.dashboard-hero p{margin:0;color:#d2eef0;max-width:720px;font-size:12px;line-height:1.9}.dashboard-actions{margin-top:21px}.dashboard-hero-status{position:relative;z-index:2;width:145px;display:flex;flex-direction:column;align-items:center;gap:10px}.status-ring{width:108px;height:108px;border:1px solid rgba(255,255,255,.15);background:rgba(6,63,70,.19);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:inset 0 0 0 9px rgba(255,255,255,.025),0 15px 30px rgba(0,0,0,.08);backdrop-filter:blur(10px)}.status-ring span{width:9px;height:9px;border-radius:50%;background:#6af0b8;box-shadow:0 0 14px rgba(106,240,184,.8);margin-bottom:7px}.status-ring strong{font-size:13px}.status-ring small{font-size:8px;color:#b9e5e8;margin-top:3px}.hero-build{font-size:8px;color:#bce5e8;border:1px solid rgba(255,255,255,.13);padding:5px 8px;border-radius:99px}.dashboard-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:13px}.dashboard-section-head h3{font-size:19px;margin:5px 0 0;color:var(--navy)}.dashboard-kpis{grid-template-columns:repeat(auto-fit,minmax(185px,1fr));margin-bottom:18px}.dashboard-main-grid{grid-template-columns:minmax(0,1.38fr) minmax(330px,.82fr);margin-top:17px}.notification-row{text-decoration:none;color:inherit}.notification-row .row-arrow{color:#aac0c2;opacity:0;transform:translateX(5px);transition:.15s}.notification-row:hover .row-arrow{opacity:1;transform:none}.notification-row.unread{background:linear-gradient(90deg,var(--brand-50),transparent)}.empty-state .empty-icon{margin:0 auto 9px;width:44px;height:44px;border-radius:14px;background:var(--success-soft);color:var(--success);display:grid;place-items:center;font-size:20px}.empty-state strong{display:block;color:var(--ink);margin-bottom:3px}.empty-state p{margin:0;font-size:10px}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:15px}.quick-grid a{position:relative;display:grid;grid-template-columns:39px 1fr auto;grid-template-rows:auto auto;gap:1px 10px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:14px;text-decoration:none;background:#fff;transition:.18s;overflow:hidden}.quick-grid a:after{content:"";position:absolute;left:-22px;bottom:-28px;width:65px;height:65px;border-radius:50%;background:var(--brand-50);transition:.2s}.quick-grid a:hover{transform:translateY(-2px);border-color:#b8dde0;box-shadow:0 10px 24px rgba(15,76,82,.07)}.quick-grid a:hover:after{transform:scale(1.35)}.quick-icon{grid-row:1/3;width:39px;height:39px;border-radius:12px;background:var(--brand-50);color:var(--brand-700);display:grid;place-items:center;font-weight:900}.quick-grid strong{font-size:11px;color:var(--navy)}.quick-grid small{font-size:8px;color:var(--muted)}.quick-grid b{position:relative;z-index:2;grid-column:3;grid-row:1/3;color:#aec2c4;font-size:13px}.integration-strip{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:18px;padding:22px 25px;background:linear-gradient(145deg,#fff,#f5fbfb)}.integration-strip h3{font-size:16px;margin:7px 0 4px}.integration-strip p{font-size:10px;color:var(--muted);margin:0;max-width:700px;line-height:1.8}.integration-live{font-size:8px;color:var(--success);font-weight:800}.integration-live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#35cf90;margin-left:5px}.integration-flow{display:flex;align-items:center;gap:6px;direction:rtl}.integration-flow span{padding:8px 10px;border:1px solid var(--line);background:#fff;border-radius:9px;font-size:9px;font-weight:800;color:var(--ink-2)}.integration-flow b{color:var(--brand-400)}

/* Login */
.auth-main .page-wrap{padding:0;max-width:none}.login-layout{min-height:100dvh;grid-template-columns:1.1fr .9fr;background:#fff}.login-visual{padding:clamp(45px,7vw,95px);align-items:center;background:linear-gradient(145deg,#08383f 0%,#0b6670 48%,#18acb6 100%)}.login-visual:after{width:560px;height:560px;background:#4ed8df;filter:blur(120px);opacity:.22;top:-12%;left:-8%}.visual-grid{opacity:.13;background-size:42px 42px;transform:none;mask-image:linear-gradient(to bottom,black,transparent 95%)}.login-orb{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.11);box-shadow:inset 0 0 0 18px rgba(255,255,255,.015)}.orb-one{width:310px;height:310px;left:6%;top:8%}.orb-two{width:170px;height:170px;right:12%;bottom:11%}.login-hero-mark{position:absolute;width:min(45vw,620px);opacity:.04;left:-6%;bottom:-3%;pointer-events:none}.visual-copy{max-width:700px}.login-brand-white{width:170px;height:auto;display:block;margin-bottom:30px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.12))}.visual-copy .eyebrow{color:#9ef3f5}.visual-copy h1{font-size:clamp(39px,4vw,60px);margin:10px 0 14px;font-weight:900;letter-spacing:-1px}.visual-copy h1 b{color:#8ff0f3}.visual-copy p{font-size:13px;line-height:2;max-width:610px;color:#d1ecef}.login-feature-pills{display:flex;gap:7px;flex-wrap:wrap;margin-top:25px}.login-feature-pills span{padding:7px 10px;border-radius:99px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.055);color:#c8edef;font-size:8px;backdrop-filter:blur(5px)}.login-build{position:absolute;bottom:25px;right:clamp(45px,7vw,95px);font-size:8px;color:#8cc8cc}.login-panel{padding:50px;background:linear-gradient(180deg,#fff,#fbfdfd)}.login-card{width:min(410px,100%);padding:13px}.login-card-logo{display:block;width:132px;height:auto;margin:0 0 28px auto}.login-heading .eyebrow{display:block;margin-bottom:7px}.login-heading h2{font-size:29px;color:var(--navy);font-weight:900}.login-heading p{font-size:11px;line-height:1.8;margin-bottom:24px}.input-with-icon{position:relative}.input-with-icon>span{position:absolute;right:13px;top:50%;transform:translateY(-50%);color:#9aacaf;font-size:12px;z-index:2}.input-with-icon .field-input{padding-right:37px;height:48px}.password-input .field-input{padding-left:44px}.password-toggle{position:absolute;left:7px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;background:transparent;color:#8ca2a5;border-radius:8px;cursor:pointer}.password-toggle:hover{background:var(--surface-2);color:var(--brand-700)}.login-submit{height:48px;margin-top:3px;justify-content:space-between;padding-inline:16px}.login-submit b{font-size:18px}.security-note{display:flex;align-items:center;justify-content:center;gap:7px;font-size:9px}.security-note i{width:6px;height:6px;border-radius:50%;background:#4ed19b}

/* Campaigns / tasks / sales hero consistency */
.campaign-hero,.task-hero,.sales-campaign-hero{position:relative;border-radius:24px;padding:25px 27px;margin-bottom:15px;overflow:hidden;background:linear-gradient(125deg,#0a4650,#0d7d86 55%,#18acb6);box-shadow:0 17px 44px rgba(10,92,101,.14)}.campaign-hero:after,.task-hero:after,.sales-campaign-hero:after{content:"";position:absolute;left:-50px;top:-100px;width:280px;height:280px;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 35px rgba(255,255,255,.018),0 0 0 70px rgba(255,255,255,.013);pointer-events:none}.campaign-hero>*,.task-hero>*,.sales-campaign-hero>*{position:relative;z-index:2}.campaign-hero h2,.task-hero h2,.sales-campaign-hero h2{font-size:27px;margin:7px 0 4px;color:#fff}.campaign-hero p,.task-hero p,.sales-campaign-hero p{color:#cfeaec;font-size:10px}.campaign-hero a:not(.btn),.task-hero a:not(.btn){color:#fff}.task-progress-ring{border:7px solid rgba(255,255,255,.11);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.task-progress-ring strong{color:#fff}.task-progress-ring span{color:#cce8ea}.campaign-result-strip{border-radius:19px}.campaign-result-strip strong{color:var(--navy)}

/* Sales */
.sales-home-grid{gap:16px}.campaign-sales-card{border-color:var(--line);background:linear-gradient(145deg,#fff,#fbfefe);border-radius:16px}.campaign-sales-card:hover{border-color:#b9dcde;box-shadow:0 12px 30px rgba(12,70,76,.08)}.province-mark{background:var(--brand-50);color:var(--brand-800);border:1px solid var(--brand-100)}.sales-filter-grid{background:#fbfdfd;gap:7px}.sheet-note{background:#f2f8f8}.sales-sheet thead{box-shadow:0 2px 8px rgba(16,72,77,.04)}.yes-mark{background:var(--brand-50);color:var(--brand-700)}.sales-tabs{background:#edf5f5}.badge.category-dealer{background:#eaf8f2}.badge.category-electrician{background:#edf5ff}.badge.status-no_response{background:var(--danger-soft)}.badge.status-waiting{background:var(--warn-soft)}.badge.status-dealer_confirmed{background:var(--success-soft)}.badge.status-directed{background:#edf5ff}.comparison-builder{padding:19px}.compare-columns form{background:#fcfefe;border-radius:15px}.compare-columns form:hover{border-color:#c5dfe1}

/* Production */
.task-layout{gap:17px}.file-card{border-color:var(--line);transition:.18s}.file-card:hover{border-color:#b7dadd;transform:translateY(-1px);box-shadow:0 8px 22px rgba(13,78,85,.07)}.comment{border-bottom-color:var(--line)}.comment header strong{color:var(--navy)}.submission{border-color:var(--line);border-radius:15px}.large-upload-progress{background:#edf5f5}.large-upload-progress i{background:linear-gradient(90deg,var(--brand-300),var(--brand-500))}

/* System, AI, notes */
.storage-meter{background:#e7efef;height:9px}.storage-meter i{background:linear-gradient(90deg,var(--brand-400),var(--brand-700))}.system-warning{border-color:#eedba4;background:var(--warn-soft);color:#76570c}.management-thread{border-radius:18px}.management-replies{border-right-color:var(--brand-200)}.management-reply{background:#f4f9f9}.ai-analysis-card{border-radius:18px}.ai-privacy{background:var(--brand-50);border-color:var(--brand-200);color:var(--brand-900)}

/* Flash/toast */
.flash-stack{position:fixed;top:95px;left:24px;z-index:300;display:flex;flex-direction:column;gap:8px;width:min(390px,calc(100vw - 32px))}.flash{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 18px 45px rgba(8,45,50,.13);font-size:10px;animation:toast-in .25s ease}.flash.success{border-right:4px solid var(--success)}.flash.error{border-right:4px solid var(--danger)}.flash.warning{border-right:4px solid var(--warn)}.flash.info{border-right:4px solid var(--brand)}.flash button{border:0;background:transparent;color:#90a3a5;cursor:pointer;font-size:16px}@keyframes toast-in{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}

/* Command palette */
.command-palette{position:fixed;inset:0;z-index:500;display:grid;place-items:start center;padding-top:min(16vh,150px);opacity:0;visibility:hidden;transition:.17s}.command-palette.open{opacity:1;visibility:visible}.command-backdrop{position:absolute;inset:0;border:0;background:rgba(4,30,34,.38);backdrop-filter:blur(6px);cursor:default}.command-dialog{position:relative;width:min(620px,calc(100vw - 30px));background:#fff;border:1px solid rgba(207,226,228,.9);border-radius:20px;box-shadow:0 30px 90px rgba(4,36,40,.25);overflow:hidden;transform:translateY(-8px) scale(.985);transition:.17s}.command-palette.open .command-dialog{transform:none}.command-search-row{height:58px;display:flex;align-items:center;gap:10px;padding:0 15px;border-bottom:1px solid var(--line)}.command-search-icon{font-size:20px;color:var(--brand-700)}.command-search-row input{flex:1;height:100%;border:0;outline:0;font:inherit;font-size:13px;color:var(--ink);background:transparent}.command-search-row kbd{border:1px solid var(--line);background:#f6f9f9;color:#839699;border-radius:7px;padding:4px 7px;font-size:8px}.command-results{max-height:340px;overflow:auto;padding:8px}.command-item{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:11px;text-decoration:none;color:var(--ink);font-size:11px}.command-item:hover,.command-item.selected{background:var(--brand-50);color:var(--brand-900)}.command-item-icon{width:29px;height:29px;border-radius:9px;background:#edf5f5;display:grid;place-items:center;color:var(--brand-700)}.command-item small{margin-right:auto;color:var(--muted);font-size:8px}.command-empty{padding:30px;text-align:center;color:var(--muted);font-size:10px}.command-hint{display:flex;gap:15px;padding:9px 14px;border-top:1px solid var(--line);background:#fafcfc;color:#93a5a8;font-size:8px}

/* Loading and micro interactions */
body.is-navigating:after{content:"";position:fixed;top:0;right:0;height:3px;width:35%;z-index:1000;background:linear-gradient(90deg,transparent,var(--brand),transparent);animation:navload 1s infinite}@keyframes navload{from{transform:translateX(150vw)}to{transform:translateX(-150vw)}}
.click-row{cursor:pointer}.progress-mini{background:#eaf1f1}.progress-mini i{background:linear-gradient(90deg,var(--brand-400),var(--brand-700))}

/* Responsive */
.mobile-only{display:none}
@media(max-width:1180px){
  .quick-search-btn{min-width:40px;width:40px;padding:0;justify-content:center}.quick-search-btn em,.quick-search-btn kbd{display:none}
  .dashboard-main-grid{grid-template-columns:1fr}
  .integration-strip{align-items:flex-start;flex-direction:column}.integration-flow{flex-wrap:wrap}
}
@media(max-width:980px){
  :root{--sidebar-w:286px}
  .sidebar{transform:translateX(110%);box-shadow:-20px 0 60px rgba(4,32,36,.25);width:286px!important}
  .sidebar.open{transform:none}
  .main-area,body.sidebar-collapsed .main-area{margin-right:0}
  .mobile-only{display:grid}
  .sidebar-collapse{display:none}
  .brand-system-copy,.nav-text,.nav-section-label,.sidebar-signature{display:block!important}
  .nav-item{justify-content:flex-start!important}.nav-sub{display:flex!important;margin-right:32px!important}
  .sidebar-backdrop{display:block;position:fixed;inset:0;z-index:19;border:0;background:rgba(4,31,35,.3);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.2s}.sidebar.open~.sidebar-backdrop,.sidebar.open + .sidebar-backdrop{opacity:1;visibility:visible}
  .topbar{padding:0 18px}.page-wrap{padding:24px 20px 38px}.dashboard-hero{padding:29px;grid-template-columns:1fr}.dashboard-hero-status{display:none}
}
@media(max-width:720px){
  .top-title p,.live-clock,.user-chip-copy,.user-chevron{display:none}.user-chip{padding:3px}.top-actions{gap:5px}.topbar{height:70px}.page-wrap{padding:20px 14px 34px}
  .page-head{align-items:flex-start;flex-direction:column}.page-head h2{font-size:24px}.head-actions{width:100%}.head-actions .btn{flex:1}
  .dashboard-hero{border-radius:20px;padding:24px 21px;min-height:220px}.dashboard-hero h2{font-size:28px}.dashboard-hero p{font-size:10px}.dashboard-watermark{width:280px}.dashboard-section-head{align-items:flex-start;flex-direction:column}.dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-grid{grid-template-columns:1fr}.integration-flow{gap:4px}.integration-flow span{font-size:8px;padding:7px}.integration-flow b{font-size:9px}
  .login-layout{display:block}.login-visual{display:none}.login-panel{min-height:100dvh;padding:28px 22px}.login-card-logo{width:118px;margin-bottom:31px}.login-card{margin:auto}
  .form-grid{grid-template-columns:1fr}.permission-list ul{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .campaign-hero,.task-hero,.sales-campaign-hero{padding:22px;align-items:flex-start;flex-direction:column}.campaign-hero h2,.task-hero h2,.sales-campaign-hero h2{font-size:23px}
  .flash-stack{top:80px;left:12px}
}
@media(max-width:480px){
  .dashboard-kpis,.kpi-grid{grid-template-columns:1fr}.dashboard-actions{width:100%}.dashboard-actions .btn{flex:1}.integration-strip{padding:18px}.campaign-tabs{border-radius:12px}
  .topbar{padding:0 12px}.icon-btn,.quick-search-btn{width:38px;height:38px}.user-chip img,.avatar-fallback{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Print-friendly management reports */
@media print{
  body{background:#fff!important}.sidebar,.topbar,.sidebar-backdrop,.flash-stack,.command-palette,.head-actions,.hero-actions,.btn,.table-toolbar{display:none!important}.main-area{margin:0!important}.page-wrap{padding:0!important;max-width:none!important}.panel,.kpi-card,.campaign-hero,.sales-campaign-hero,.task-hero{box-shadow:none!important;break-inside:avoid}.campaign-hero,.sales-campaign-hero,.task-hero{background:#fff!important;color:#111!important;border:1px solid #ddd}.campaign-hero h2,.sales-campaign-hero h2,.task-hero h2,.campaign-hero p,.sales-campaign-hero p,.task-hero p{color:#111!important}.data-table th{position:static}.table-wrap,.sales-sheet-wrap{overflow:visible!important;max-height:none!important}.data-table{min-width:0;font-size:9pt}.page-head h2{font-size:20pt}.dashboard-hero{background:#fff!important;color:#111!important;box-shadow:none!important;border:1px solid #ddd}.dashboard-hero h2,.dashboard-hero p{color:#111!important}.dashboard-watermark{display:none}}

/* ==========================================================
   RC2 visual polish — stronger identity, clearer surfaces
   ========================================================== */
body{background:
  radial-gradient(circle at 92% 0%,rgba(32,188,198,.10),transparent 32rem),
  radial-gradient(circle at 5% 35%,rgba(13,130,139,.055),transparent 28rem),
  linear-gradient(180deg,#f2f9f9 0%,#f7fbfb 42%,#eef6f6 100%)}
.page-wrap:before{content:"";position:fixed;inset:var(--topbar-h) 0 auto var(--sidebar-w);height:160px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(32,188,198,.035),transparent)}

/* Panels must visually separate from the page instead of looking like white sheets. */
.panel{background:linear-gradient(145deg,rgba(255,255,255,.98) 0%,rgba(237,250,250,.86) 100%);border:1px solid rgba(171,215,218,.72);box-shadow:0 12px 34px rgba(8,72,78,.075),inset 0 1px 0 rgba(255,255,255,.95)}
.panel:hover{border-color:rgba(94,193,199,.68);box-shadow:0 17px 42px rgba(8,72,78,.105)}
.table-panel{background:linear-gradient(160deg,#fff 0%,#f3fbfb 100%)}
.panel-head{border-bottom:1px solid rgba(174,216,219,.55);background:linear-gradient(90deg,rgba(32,188,198,.065),rgba(255,255,255,.35));border-radius:20px 20px 0 0}

/* KPI cards carry distinct brand gradients so values are immediately scannable. */
.kpi-card{border:1px solid rgba(117,204,210,.55);background:linear-gradient(135deg,#e8fbfc 0%,#f8ffff 58%,#d9f4f6 100%);box-shadow:0 12px 30px rgba(10,104,111,.085)}
.kpi-card:nth-child(4n+2){background:linear-gradient(135deg,#e4f8f7 0%,#f8ffff 58%,#d8eeee 100%)}
.kpi-card:nth-child(4n+3){background:linear-gradient(135deg,#eaf7ff 0%,#fbfeff 58%,#dceff4 100%)}
.kpi-card:nth-child(4n+4){background:linear-gradient(135deg,#f0fbf4 0%,#fbfffd 58%,#dff2e7 100%)}
.kpi-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,var(--brand-300),var(--brand-700));opacity:.85}
.kpi-card:after{background:radial-gradient(circle,rgba(32,188,198,.17),rgba(32,188,198,0) 68%);width:150px;height:150px;right:auto;left:-45px;bottom:-70px}
.kpi-card strong{color:#073c42;text-shadow:0 1px 0 rgba(255,255,255,.85)}
.kpi-icon{background:linear-gradient(145deg,var(--brand-500),var(--brand-700));color:#fff;border:0;box-shadow:0 8px 20px rgba(17,166,176,.20)}
.success-card{background:linear-gradient(135deg,#e1f8ec,#fbfffd 62%,#d9f2e5)!important}

/* Dashboard work-center cards */
.quick-grid a{background:linear-gradient(135deg,#f8ffff,#e8f8f9);border-color:#c6e6e8;box-shadow:0 7px 18px rgba(10,89,96,.05)}
.quick-grid a:nth-child(even){background:linear-gradient(135deg,#f8fcff,#e8f4f6)}
.quick-grid a:hover{background:linear-gradient(135deg,#e8fbfc,#fff);border-color:var(--brand-300);box-shadow:0 15px 32px rgba(13,124,133,.13)}
.quick-icon{background:linear-gradient(145deg,var(--brand-500),var(--brand-700));color:#fff;box-shadow:0 7px 17px rgba(13,130,139,.18)}
.integration-strip{background:linear-gradient(120deg,#e8fbfc 0%,#fff 50%,#e1f4f5 100%);border-color:#bfe4e6}

/* Navigation icon containers: stronger, deliberate visual hierarchy. */
.nav-icon{width:31px;height:31px;min-width:31px;border-radius:10px;background:rgba(97,221,228,.08);border:1px solid rgba(118,222,228,.08);color:#83d9de}
.nav-icon svg{width:17px;height:17px}
.nav-item:hover .nav-icon{background:rgba(32,188,198,.17);border-color:rgba(71,210,218,.2);color:#d5fbfd}
.nav-item.active .nav-icon{background:linear-gradient(145deg,#2dd0da,#109aa4);border-color:rgba(255,255,255,.16);color:#fff;box-shadow:0 8px 18px rgba(0,0,0,.18)}
.nav-scope-dot{width:7px;height:7px;min-width:7px;border-radius:50%;background:#5ed6dc;box-shadow:0 0 0 4px rgba(94,214,220,.09)}
.nav-empty-scope{font-size:9px;color:#658f93;padding:7px 45px 9px}

/* Collapsed sidebar always keeps a visible re-open control. */
body.sidebar-collapsed .brand-block{grid-template-columns:1fr!important;position:relative;padding-bottom:48px}
body.sidebar-collapsed .sidebar-collapse{display:grid!important;place-items:center;position:absolute;right:50%;bottom:8px;transform:translateX(50%) rotate(180deg);width:36px;height:30px;background:rgba(32,188,198,.18);border-color:rgba(71,210,218,.32);color:#fff;z-index:8}
body.sidebar-collapsed .sidebar-collapse:hover{background:var(--brand-600)}
body.sidebar-collapsed .nav-item{min-height:48px}
body.sidebar-collapsed .nav-icon{width:35px;height:35px;min-width:35px}
body.sidebar-collapsed .nav-item[data-nav-label]{overflow:visible}
body.sidebar-collapsed .nav-item[data-nav-label]:hover:after{content:attr(data-nav-label);position:absolute;right:54px;top:50%;transform:translateY(-50%);background:#062d32;color:#fff;border:1px solid rgba(255,255,255,.08);padding:7px 10px;border-radius:9px;white-space:nowrap;font-size:9px;box-shadow:0 10px 25px rgba(0,0,0,.18);z-index:20}
body.sidebar-collapsed .page-wrap:before{left:82px}

/* Native date/time pickers are visually explicit across the whole system. */
.field-input[type="date"],.field-input[type="datetime-local"]{cursor:pointer;background:linear-gradient(135deg,#fff,#eaf9fa);border-color:#abdadd;min-height:46px;font-variant-numeric:tabular-nums;color:#16484e}
.field-input[type="date"]::-webkit-calendar-picker-indicator,.field-input[type="datetime-local"]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.72;padding:7px;border-radius:8px;background-color:rgba(32,188,198,.10)}

/* Permission matrix is a screen map, not a wall of technical permissions. */
.permission-list ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;list-style:none}
.permission-list label{display:flex;gap:9px;align-items:flex-start;padding:11px 12px;border-radius:12px;line-height:1.55}
.permission-list input{margin-top:2px}

@media(max-width:720px){.permission-list ul{grid-template-columns:1fr}}
.review-inbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}.review-inbox-card{padding:20px;background:linear-gradient(145deg,#effcfd,#fff 58%,#e3f6f7)}.review-inbox-card h3{font-size:15px;color:var(--navy);margin:14px 0 5px}.review-inbox-card>p{font-size:10px;color:var(--muted)}.review-card-top,.review-card-meta{display:flex;justify-content:space-between;gap:10px;align-items:center}.review-card-meta{font-size:9px;color:#71878b;padding:11px 0;border-block:1px solid rgba(171,215,218,.55);margin:12px 0}.review-card-note{min-height:50px;font-size:10px;line-height:1.8;color:var(--ink-2);margin-bottom:14px}
.file-center-filters{display:grid;grid-template-columns:2fr 1.5fr 1fr auto;gap:8px}.report-launch-grid,.settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.report-launch,.settings-card{padding:20px;text-decoration:none;color:inherit;display:flex;gap:14px;align-items:center}.report-launch>span,.settings-card>span{width:44px;height:44px;min-width:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,var(--brand-500),var(--brand-700));color:#fff;font-weight:900;box-shadow:0 8px 20px rgba(17,166,176,.18)}.report-launch h3,.settings-card h3{font-size:13px;color:var(--navy);margin:0 0 5px}.report-launch p,.settings-card p{font-size:9px;color:var(--muted);margin:0;line-height:1.7}.report-launch>b{margin-right:auto;color:var(--brand-700)}.report-launch:hover,.settings-card:hover{transform:translateY(-2px)}
@media(max-width:1000px){.report-launch-grid,.settings-grid{grid-template-columns:1fr 1fr}.file-center-filters{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.report-launch-grid,.settings-grid,.file-center-filters{grid-template-columns:1fr}}


/* RC2 — high-contrast dashboard identity requested in acceptance review */
.dashboard-kpis .kpi-card{color:#fff;border-color:rgba(255,255,255,.20);background:linear-gradient(135deg,#22c4ce 0%,#1199a4 55%,#08717b 100%);box-shadow:0 16px 34px rgba(5,102,111,.19),inset 0 1px 0 rgba(255,255,255,.20);overflow:hidden}
.dashboard-kpis .kpi-card:nth-child(4n+2){background:linear-gradient(135deg,#2bcbd3 0%,#16a4ad 52%,#0a7d86 100%)}
.dashboard-kpis .kpi-card:nth-child(4n+3){background:linear-gradient(135deg,#33bfd0 0%,#168fa0 55%,#086676 100%)}
.dashboard-kpis .kpi-card:nth-child(4n+4){background:linear-gradient(135deg,#19bfc5 0%,#0d8e98 56%,#075d68 100%)}
.dashboard-kpis .kpi-card:before{width:0}
.dashboard-kpis .kpi-card:after{content:"";position:absolute;width:180px;height:180px;left:-58px;bottom:-88px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.21),rgba(255,255,255,0) 70%)}
.dashboard-kpis .kpi-card>span,.dashboard-kpis .kpi-card>small,.dashboard-kpis .kpi-card>strong{color:#fff;text-shadow:0 1px 2px rgba(0,50,55,.20)}
.dashboard-kpis .kpi-icon{background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.22);box-shadow:none;color:#fff;backdrop-filter:blur(4px)}
.dashboard-kpis .kpi-card:hover{transform:translateY(-4px);box-shadow:0 21px 42px rgba(5,102,111,.26)}
.hero-person-name{color:#fff;font-weight:900}

/* Separate re-open handle guarantees the compact sidebar can always be expanded again. */
.sidebar-expand-fab{display:none;position:fixed;right:58px;top:92px;width:40px;height:40px;border:1px solid rgba(255,255,255,.18);border-radius:13px;background:linear-gradient(145deg,#25c7d0,#0b7d87);color:#fff;font-size:26px;line-height:1;z-index:160;cursor:pointer;box-shadow:0 12px 28px rgba(4,62,68,.28)}
body.sidebar-collapsed .sidebar-expand-fab{display:grid;place-items:center}
body.sidebar-collapsed .sidebar-collapse{visibility:hidden!important;pointer-events:none!important}
.sidebar-expand-fab:hover{transform:translateX(-2px);background:linear-gradient(145deg,#35d5de,#0b8d97)}
@media(max-width:980px){.sidebar-expand-fab,body.sidebar-collapsed .sidebar-expand-fab{display:none!important}}

/* A bit more life on main content blocks without turning every page into KPI cards. */
.page-head{background:linear-gradient(120deg,rgba(32,188,198,.10),rgba(255,255,255,.50));border:1px solid rgba(122,207,212,.33);border-radius:20px;padding:18px 20px;box-shadow:0 9px 24px rgba(7,92,99,.055)}
.table-panel .data-table thead th{background:linear-gradient(180deg,#0c737d,#075962);color:#fff;border-color:rgba(255,255,255,.08)}
.data-table tbody tr:nth-child(even){background:rgba(228,247,248,.48)}
.data-table tbody tr:hover{background:rgba(32,188,198,.10)}
.side-panel-title{display:flex;justify-content:space-between;gap:8px;align-items:center}.side-panel-title h3{margin:0}.mini-action{font-size:8px;padding:5px 8px;border-radius:8px;background:rgba(32,188,198,.12);color:var(--brand-700);text-decoration:none;font-weight:800}.team-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.team-role-card{padding:16px;border:1px solid rgba(117,204,210,.50);border-radius:16px;background:linear-gradient(145deg,#ecfbfc,#fff);display:grid;gap:13px}.team-role-card label{font-size:9px;font-weight:800;color:var(--ink-2);display:grid;gap:6px}.lead-choice{display:flex!important;align-items:center;gap:8px!important}.campaign-tabs{scrollbar-width:thin;scrollbar-color:rgba(32,188,198,.45) transparent}.campaign-tabs a{white-space:nowrap}
@media(max-width:760px){.team-role-grid{grid-template-columns:1fr}}
.file-pick-status{margin-top:5px;padding:7px 9px;border:1px dashed rgba(32,188,198,.40);border-radius:9px;background:rgba(32,188,198,.055);color:#4f7b80;font-size:8px;transition:.18s}.file-drop-active .file-pick-status{background:rgba(32,188,198,.16);border-color:var(--brand-500);color:var(--brand-800);transform:translateY(-1px)}input[type="file"]{cursor:pointer}

/* =========================================================
   DARK MODE HARDENING
   Keep this block at the END of theme.css
   ========================================================= */

html[data-theme="dark"]{
    color-scheme: dark;

    --bg: #07151b;
    --card: #0d2129;
    --card-soft: #102730;
    --surface: #0a1c23;
    --surface-2: #112a33;

    --ink: #edf8f9;
    --muted: #91a8b0;
    --line: #1d3942;

    --brand: #26c0cc;
    --brand-dark: #62dce4;

    --shadow: 0 12px 34px rgba(0,0,0,.25);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .main-area,
html[data-theme="dark"] .page-wrap{
    background: var(--bg) !important;
    color: var(--ink) !important;
}


/* Main cards / containers */
html[data-theme="dark"] .panel,
html[data-theme="dark"] .form-panel,
html[data-theme="dark"] .side-panel,
html[data-theme="dark"] .task-hero,
html[data-theme="dark"] .kpi-card,
html[data-theme="dark"] .submission,
html[data-theme="dark"] .comment,
html[data-theme="dark"] .review-inbox-card,
html[data-theme="dark"] .large-upload-box,
html[data-theme="dark"] .budget-preview > div,
html[data-theme="dark"] .profile-preview,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .permission-section,
html[data-theme="dark"] .permission-global-toolbar,
html[data-theme="dark"] .permission-count-pill,
html[data-theme="dark"] .file-card,
html[data-theme="dark"] .brief-file-mini,
html[data-theme="dark"] .brief-image-thumb,
html[data-theme="dark"] .upload-preview-item{
    background: var(--card) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}


/* Nested softer areas */
html[data-theme="dark"] .permission-section-head,
html[data-theme="dark"] .review-history > div,
html[data-theme="dark"] .command-search-row,
html[data-theme="dark"] .command-results,
html[data-theme="dark"] .upload-preview-file-icon{
    background: var(--card-soft) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}


/* Tables */
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .data-table,
html[data-theme="dark"] table{
    background: var(--card) !important;
    color: var(--ink) !important;
}

html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .data-table td,
html[data-theme="dark"] table th,
html[data-theme="dark"] table td{
    background: transparent !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

html[data-theme="dark"] .data-table thead,
html[data-theme="dark"] table thead{
    background: var(--surface-2) !important;
}


/* Forms */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .field-input,
html[data-theme="dark"] .field-select,
html[data-theme="dark"] .field-textarea{
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{
    color: #718d96 !important;
}


/* Buttons / interactive surfaces */
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .paste-upload-btn,
html[data-theme="dark"] .mini-action,
html[data-theme="dark"] .permission-mini-action{
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}


/* Text */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] strong,
html[data-theme="dark"] .detail-copy,
html[data-theme="dark"] .permission-copy strong{
    color: var(--ink) !important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] small,
html[data-theme="dark"] .muted-copy,
html[data-theme="dark"] .helper,
html[data-theme="dark"] .permission-copy small{
    color: var(--muted) !important;
}


/* Topbar */
html[data-theme="dark"] .topbar{
    background: rgba(10,28,35,.96) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}


/* Command palette */
html[data-theme="dark"] .command-dialog{
    background: var(--card) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}


/* Scrollbars */
html[data-theme="dark"]{
    scrollbar-color: #31505a #07151b;
}


/* Preserve active turquoise UI */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .badge.success,
html[data-theme="dark"] .version-pill{
    color: #fff;
}


/* =========================================================
   DARK MODE FINAL SURFACE FIX
   ========================================================= */

/* Page hero / page headings */
html[data-theme="dark"] .page-head,
html[data-theme="dark"] .task-hero{
    background:
      linear-gradient(
        135deg,
        #12333c 0%,
        #193d46 55%,
        #234a53 100%
      ) !important;
    border-color:#28535d !important;
    color:#edf8f9 !important;
}

html[data-theme="dark"] .page-head h1,
html[data-theme="dark"] .page-head h2,
html[data-theme="dark"] .page-head h3,
html[data-theme="dark"] .task-hero h2{
    color:#f2fbfc !important;
}

html[data-theme="dark"] .page-head p,
html[data-theme="dark"] .task-hero p{
    color:#9eb7be !important;
}


/* =========================================================
   TABLE / FILTER WHITE STRIPS
   ========================================================= */

html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .table-toolbar,
html[data-theme="dark"] .table-filters,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .filters,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .search-panel,
html[data-theme="dark"] .list-toolbar{
    background:#0d2129 !important;
    border-color:#1d3942 !important;
    color:#edf8f9 !important;
}

/* forms sitting directly above tables */
html[data-theme="dark"] .table-wrap > form,
html[data-theme="dark"] .panel > form.filter-form,
html[data-theme="dark"] form.filters,
html[data-theme="dark"] form.table-filters{
    background:#0d2129 !important;
    border-color:#1d3942 !important;
}


/* =========================================================
   TABLE ROWS
   ========================================================= */

html[data-theme="dark"] .data-table tbody tr,
html[data-theme="dark"] table tbody tr{
    background:#0d2129 !important;
    color:#edf8f9 !important;
}

html[data-theme="dark"] .data-table tbody tr:nth-child(even),
html[data-theme="dark"] table tbody tr:nth-child(even){
    background:#102830 !important;
}

html[data-theme="dark"] .data-table tbody tr:hover,
html[data-theme="dark"] table tbody tr:hover{
    background:#173640 !important;
}

html[data-theme="dark"] .data-table td,
html[data-theme="dark"] table td{
    color:#e9f5f6 !important;
    border-color:#1d3942 !important;
}


/* =========================================================
   DASHBOARD / WORK CENTER CARDS
   ========================================================= */

html[data-theme="dark"] .workspace-card,
html[data-theme="dark"] .work-card,
html[data-theme="dark"] .work-center-card,
html[data-theme="dark"] .quick-link,
html[data-theme="dark"] .quick-link-card,
html[data-theme="dark"] .route-card,
html[data-theme="dark"] .module-card,
html[data-theme="dark"] .shortcut-card{
    background:
      linear-gradient(
        145deg,
        #102830,
        #0b1f26
      ) !important;
    color:#edf8f9 !important;
    border-color:#1f424c !important;
    box-shadow:
      inset 1px 1px 0 rgba(255,255,255,.025),
      0 8px 20px rgba(0,0,0,.14) !important;
}

html[data-theme="dark"] .workspace-card strong,
html[data-theme="dark"] .work-card strong,
html[data-theme="dark"] .work-center-card strong,
html[data-theme="dark"] .quick-link strong,
html[data-theme="dark"] .quick-link-card strong,
html[data-theme="dark"] .route-card strong,
html[data-theme="dark"] .module-card strong,
html[data-theme="dark"] .shortcut-card strong{
    color:#edf8f9 !important;
}

html[data-theme="dark"] .workspace-card small,
html[data-theme="dark"] .work-card small,
html[data-theme="dark"] .work-center-card small,
html[data-theme="dark"] .quick-link small,
html[data-theme="dark"] .quick-link-card small,
html[data-theme="dark"] .route-card small,
html[data-theme="dark"] .module-card small,
html[data-theme="dark"] .shortcut-card small{
    color:#90aab1 !important;
}


/* =========================================================
   BRAND / ENTITY CARDS
   ========================================================= */

html[data-theme="dark"] .brand-card,
html[data-theme="dark"] .brand-item,
html[data-theme="dark"] .entity-card,
html[data-theme="dark"] .project-card{
    background:#0d2129 !important;
    color:#edf8f9 !important;
    border-color:#1d3942 !important;
}

html[data-theme="dark"] .brand-card h3,
html[data-theme="dark"] .brand-card strong,
html[data-theme="dark"] .brand-item h3,
html[data-theme="dark"] .entity-card h3{
    color:#edf8f9 !important;
}

html[data-theme="dark"] .brand-card p,
html[data-theme="dark"] .brand-item p,
html[data-theme="dark"] .entity-card p{
    color:#91a8b0 !important;
}


/* =========================================================
   GENERIC LIST ITEMS / WHITE SURFACES
   ========================================================= */

html[data-theme="dark"] .list-row,
html[data-theme="dark"] .list-item,
html[data-theme="dark"] .result-row,
html[data-theme="dark"] .summary-row{
    background:#0d2129 !important;
    color:#edf8f9 !important;
    border-color:#1d3942 !important;
}


/* Search / filter inputs */
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] .search-input{
    background:#0a1b22 !important;
    color:#edf8f9 !important;
    border-color:#24444e !important;
}


/* Prevent old hard-coded white cards from leaking through */
html[data-theme="dark"] .panel [style*="background: white"],
html[data-theme="dark"] .panel [style*="background:#fff"],
html[data-theme="dark"] .panel [style*="background: #fff"]{
    background:#0d2129 !important;
    color:#edf8f9 !important;
}


/* Dark mode fix: dashboard quick work-center cards only */
html[data-theme="dark"] .quick-grid > a{
    background:
      linear-gradient(
        145deg,
        #102830 0%,
        #0b1f26 100%
      ) !important;
    border-color:#214650 !important;
    color:#edf8f9 !important;
    box-shadow:
      inset 1px 1px 0 rgba(255,255,255,.025),
      0 8px 18px rgba(0,0,0,.16) !important;
}

html[data-theme="dark"] .quick-grid > a strong{
    color:#edf8f9 !important;
}

html[data-theme="dark"] .quick-grid > a small{
    color:#91a8b0 !important;
}

html[data-theme="dark"] .quick-grid > a > b{
    color:#55d6df !important;
}

html[data-theme="dark"] .quick-grid > a:hover{
    background:
      linear-gradient(
        145deg,
        #15333d 0%,
        #0e252d 100%
      ) !important;
    border-color:#2b6570 !important;
}