/*
 * SalesCord brand layer. Loaded last on index.php and admin.php, so the palette and logo
 * are decided here rather than in each stylesheet.
 *
 *   Blue        #4c4ce0  primary: logo, buttons, highlights          (~45%)
 *   Deep Navy   #091d42  typography, headings, important text         (~30%)
 *   White       #ffffff  main background, cards                       (~15%)
 *   Bright Cyan #19c7c3  accent: icons, small highlights, CTA details (~7%)
 *   Soft Tint   #f1f2ff  light backgrounds, sections, UI surfaces     (~3%)
 *
 * Cyan is never used for text on white: it fails contrast there. It fills things, with navy on top.
 */
:root{
  --brand:#4c4ce0;--brand-dark:#3b3bc4;--brand-deeper:#2f2fa6;
  --brand-300:#9393ec;--brand-200:#b7b7f3;--brand-100:#dbdbf9;--tint:#f1f2ff;
  --navy:#091d42;--navy-700:#24477a;--navy-500:#4a6fa5;--navy-300:#93a9cc;--navy-100:#cfdaea;--navy-50:#e9eef6;
  --cyan:#19c7c3;--cyan-deep:#0e9e9a;--cyan-soft:#e3f8f7;
  --ink:#091d42;--muted:#66718c;--blue:#4c4ce0;--blue-soft:#eceefe;
  --canvas:#f1f2ff;--card:#ffffff;--line:#e0e3f2;
  --shadow:0 3px 6px rgba(9,29,66,.05),0 12px 24px rgba(9,29,66,.08);
}
::selection{background:rgba(76,76,224,.2)}
body{background:radial-gradient(ellipse at 8% 0%,rgba(76,76,224,.07) 0,transparent 45%),radial-gradient(ellipse at 100% 100%,rgba(25,199,195,.06) 0,transparent 40%),var(--canvas) fixed;color:var(--ink)}
h1,h2,h3,h4{color:var(--ink)}

/* ---------------------------------------------------------------- logo */
.brand{height:76px;padding:0 18px;gap:0;align-items:center;border-bottom:1px solid var(--line)}
.brand-logo{display:block;height:36px;width:auto;max-width:100%}
.brand-icon{display:none;width:34px;height:34px}
.sidebar.collapsed .brand{padding:0;justify-content:center}
.sidebar.collapsed .brand-logo{display:none}
.sidebar.collapsed .brand-icon{display:block}
.auth-brand{display:flex;justify-content:flex-start;height:auto;padding:0;border:0;margin-bottom:22px}
.auth-brand .brand-logo{height:44px}
@media(max-width:520px){.auth-brand .brand-logo{height:38px}}

/* ---------------------------------------------------------------- app chrome */
.sidebar{background:#fff;border-right:1px solid var(--line)}
.nav-item{color:var(--navy)}
.nav-item:hover{background:var(--tint)}
.nav-item.active{background:var(--brand);color:#fff;box-shadow:0 8px 18px -6px rgba(76,76,224,.55)}
.nav-item.active.has-unread .nav-icon:after{box-shadow:0 0 0 2px var(--brand)}
.nav-count,.notif-count{background:var(--cyan);color:var(--navy);font-weight:700}
.topbar{background:#fff;border-bottom:1px solid var(--line);color:var(--navy)}
.topbar a{color:var(--brand)}
.trial-dot{background:var(--cyan);box-shadow:0 0 0 3px rgba(25,199,195,.22)}
.workspace-name{background:var(--tint);color:var(--brand);border-color:var(--brand-100)}

.btn.primary,.btn.blue,.auth-submit{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover,.btn.blue:hover,.auth-submit:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn.primary:disabled,.quick-actions .btn.primary:disabled{background:#9aa1b8;border-color:#9aa1b8}
.assign-editor .btn.primary{background:var(--brand);border-color:var(--brand)}
.btn.dark{background:var(--navy);border-color:var(--navy);color:#fff}
.toggle.on{background:var(--cyan)}
.input:focus,.select:focus,.textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(76,76,224,.16)}
:focus-visible{outline-color:var(--brand)}
.auth-switch button{color:var(--brand)}

.auth-screen{background:radial-gradient(ellipse at 12% 8%,rgba(76,76,224,.14) 0,transparent 48%),radial-gradient(ellipse at 92% 100%,rgba(25,199,195,.14) 0,transparent 44%),var(--canvas)}
.auth-card{border-top:4px solid var(--brand)}

::-webkit-scrollbar-thumb{background:#c9ccef}

/* The AI assistant launcher: a navy tile with the flower in brand cyan → blue. */
.ai-launcher{background:var(--navy);border-color:#1d3460}
.ai-flower i{background:linear-gradient(145deg,var(--cyan),var(--brand))}

/* ---------------------------------------------------------------- Owner dashboard (admin.php) */
.owner-brand{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;height:auto;padding:22px 24px 18px;border-bottom:1px solid var(--line)}
.owner-brand .brand-logo{height:34px}
.owner-brand small{margin:0;font-size:9.5px;font-weight:700;letter-spacing:1.8px;color:var(--cyan-deep)}
.admin-sidebar{background:#fff;border-right:1px solid var(--line)}
.admin-sidebar nav button:hover{background:var(--tint)}
.admin-sidebar nav button.active{background:var(--brand);color:#fff;box-shadow:0 8px 18px -6px rgba(76,76,224,.55)}
.workspace-chip{background:var(--tint);color:var(--brand)}
.auth-wrap{background:radial-gradient(circle at 50% 0,rgba(76,76,224,.16),transparent 52%),radial-gradient(circle at 100% 100%,rgba(25,199,195,.12),transparent 40%),var(--canvas)}
.auth-brand .auth-role{align-self:flex-end;margin:0 0 4px 10px;font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--cyan-deep)}
.admin-top{background:#fff;border-bottom-color:var(--line);color:var(--navy)}