/* SX AGENCY CRM — PREMIUM OBSIDIAN + CHROME | DESIGN ONLY
   Loaded AFTER existing V6 CSS. No application JS, data/auth/API or navigation changes.
   The user-supplied Deep Space video remains the live moving layer;
   a separate stationary reflective-sphere layer is blended ABOVE the video, BELOW the UI. */
:root{
  --sx-obsidian:#08090d;
  --sx-graphite:#161a22;
  --sx-panel:rgba(12,16,24,.55);
  --sx-silver:#9da5b3;
  --sx-text:#f2f3f5;
  --sx-text-secondary:#9299a6;
  --sx-rim:rgba(220,229,239,.23);
  --sx-elev:0 18px 42px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.085),inset 0 -1px rgba(0,0,0,.26);
  color-scheme:dark;
}
html{background:var(--sx-obsidian)}
body{color:var(--sx-text);background:#08090d none!important;overflow-x:hidden}
#app{position:relative;z-index:1;min-height:100vh}
#toast{z-index:1400}
/* Layered motion/background. The existing script controls the same persistent video node. */
.sx-space-background{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;isolation:isolate;background:#08090d url('assets/sx-deep-space-poster.jpg') center/cover no-repeat}
.sx-space-background video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;pointer-events:none}
.sx-space-background::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:url('assets/sx-chrome-sphere-atmosphere.png') center center/cover no-repeat;
  mix-blend-mode:screen;opacity:.60;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.9) 0%,#000 73%,rgba(0,0,0,.78) 100%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.9) 0%,#000 73%,rgba(0,0,0,.78) 100%);
}
.sx-space-background::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:
  linear-gradient(90deg,rgba(3,4,8,.35),rgba(3,5,9,.04) 39%,rgba(2,3,7,.24)),
  linear-gradient(180deg,rgba(4,5,9,.14),transparent 24%,rgba(3,5,8,.29) 100%)}
/* All existing application sections retain their DOM structure and events. */
.sx-space-layout,.layout,.main,.sx-space-layout .main{background:transparent!important}
.sx-space-layout .sidebar,.sidebar{
  background:linear-gradient(155deg,rgba(10,13,20,.87),rgba(8,11,16,.80))!important;
  border-right:1px solid rgba(219,227,238,.19)!important;
  box-shadow:inset -1px 0 rgba(255,255,255,.055),5px 0 28px rgba(0,0,0,.12)!important;
  -webkit-backdrop-filter:blur(16px) saturate(110%);backdrop-filter:blur(16px) saturate(110%);
}
.sx-space-layout .sx-topbar,.topbar{background:transparent!important;border-bottom-color:transparent!important}
/* Smoked glass: light-catching top rim, restrained silver outline, no opaque blocks. */
:where(.kpi,.panel,.sx-kpi,.sx-panel,.v3-toolbar,.glass-toolbar,.li-panel,.li-stat,.li-safetybar,.li-tabs,.sx-command-metrics section,.sx-command-panel,.ops-panel,.ops-metrics section,.rel-panel,.rel-metrics>span,.sx-bi-panel,.sx-bi-grid>div,.table-scroll,.pipe-col,.deal-card){
  background:linear-gradient(146deg,rgba(29,36,46,.64) 0%,rgba(12,16,24,.57) 55%,rgba(8,11,17,.68) 100%)!important;
  border:1px solid var(--sx-rim)!important;
  box-shadow:var(--sx-elev)!important;
  -webkit-backdrop-filter:blur(13px) saturate(115%);backdrop-filter:blur(13px) saturate(115%);
}
:where(.kpi,.panel,.li-panel,.sx-command-metrics section,.sx-command-panel,.ops-panel,.ops-metrics section,.rel-panel,.sx-bi-panel,.v3-toolbar){border-radius:20px!important}
:where(.kpi,.panel,.li-panel,.sx-command-panel,.ops-panel,.rel-panel,.deal-card){transition:border-color .24s ease,box-shadow .24s ease,background-color .24s ease!important}
:where(.kpi,.panel,.li-panel,.sx-command-panel,.ops-panel,.rel-panel,.deal-card):hover{
  border-color:rgba(233,239,246,.32)!important;
  box-shadow:0 22px 48px rgba(0,0,0,.27),inset 0 1px rgba(255,255,255,.11)!important;
  transform:none!important;
}
/* Information must remain readable; translucent table rows, not another black slab. */
:where(.table-scroll,.sx-table-wrap,.li-table-wrap,.ops-table-wrap,.rel-table){background:rgba(10,14,22,.57)!important;border-color:rgba(218,225,235,.20)!important}
:where(th,.sx-leads-table th,.li-table th){background:rgba(25,30,40,.60)!important;color:#b4bbc7!important}
:where(td,.sx-leads-table td,.li-table td){border-color:rgba(220,226,234,.11)!important}
:where(tr:hover td){background:rgba(164,179,198,.07)!important}
:where(.pipe-col){background:rgba(12,16,24,.68)!important}
:where(.deal-card){background:linear-gradient(145deg,rgba(27,32,43,.74),rgba(13,17,25,.79))!important}
:where(.muted,.li-muted,.sx-command-header p,.ops-header p,.rel-note){color:#aeb5c0!important}
:where(.eyebrow,.li-overline,.ops-kicker,.rel-kicker){color:#aab2bd!important}
:where(h1,h2,h3,.kpi-value,.sx-command-metrics strong){color:#f2f3f5}
/* Sidebar active states: silver, not blue or bright chrome. */
:where(.sx-nav button,.nav button){transition:background .24s,border-color .24s,color .24s!important}
:where(.sx-nav button:hover,.nav button:hover){background:rgba(199,210,224,.105)!important;border-color:rgba(220,230,241,.10)!important}
:where(.sx-nav button.active,.nav button.active){
  background:linear-gradient(120deg,rgba(219,225,236,.23),rgba(146,160,182,.09))!important;
  border-color:rgba(237,244,254,.27)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.16),0 7px 19px rgba(0,0,0,.09)!important;
}
:where(.sx-identity,.identity){background:linear-gradient(125deg,rgba(25,31,41,.7),rgba(9,13,20,.72))!important;border-color:rgba(220,228,240,.23)!important}
/* Refined inputs + legible native/custom dropdown surfaces. */
:where(input:not([type=checkbox]):not([type=radio]),textarea,select,.li-input,.sx-global-search-field,.glass-filter-trigger,.form-glass-trigger,.li-select-trigger){
  background:linear-gradient(145deg,rgba(24,30,40,.85),rgba(12,16,24,.87))!important;
  color:#f2f3f5!important;
  border-color:rgba(213,225,241,.25)!important;
  border-radius:12px;
}
.sx-global-search-field input{background:transparent!important;border:0!important;box-shadow:none!important}
:where(input,textarea,select,.glass-filter-trigger,.form-glass-trigger):focus-visible{outline:2px solid rgba(222,234,251,.85);outline-offset:2px}
:where(input::placeholder,textarea::placeholder){color:#a5adba!important}
:where(.glass-filter-menu,.form-glass-menu,.li-select-menu,.li-glass-menu,.sx-global-results,[role=listbox]){
  background:linear-gradient(156deg,rgba(29,34,43,.98),rgba(13,17,24,.995))!important;
  -webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);
  border:1px solid rgba(224,232,244,.34)!important;
  box-shadow:0 22px 45px rgba(0,0,0,.65),inset 0 1px rgba(255,255,255,.11)!important;
  color:#f2f3f5!important;
}
:where(.glass-filter-option,.form-glass-option,.li-select-option,.li-glass-option,[role=option]){color:#d9dfe9!important}
:where(.glass-filter-option:hover,.glass-filter-option.is-selected,.form-glass-option:hover,.form-glass-option.is-selected,.li-select-option:hover,.li-select-option.is-selected,.li-glass-option:hover,.li-glass-option.is-selected,[role=option]:hover,[role=option][aria-selected=true]){
  background:rgba(190,203,219,.18)!important;color:white!important;
}
option,optgroup{background:#161a22!important;color:#f2f3f5!important}
/* Keep native white primary actions readable and secondary buttons professional. */
:where(.btn:not(.btn-primary),.glass-filter-trigger,.li-btn-secondary,.rel-outline,.ops-outline){transition:background .24s,border-color .24s,box-shadow .24s!important}
:where(.btn:not(.btn-primary):hover,.li-btn-secondary:hover,.rel-outline:hover){background:rgba(177,193,211,.16)!important;border-color:rgba(227,236,247,.35)!important;transform:none!important}
:where(.modal,.li-modal,.dialog,.ops-modal){background:linear-gradient(155deg,rgba(28,33,43,.96),rgba(10,14,22,.98))!important;border-color:rgba(235,241,250,.25)!important;box-shadow:0 35px 100px rgba(0,0,0,.7),inset 0 1px rgba(255,255,255,.11)!important}
/* Preserve meaningful status color states (won, overdue, error). */
:where(.stage.won,.status-won){color:#b5dec7!important}
@media(max-width:770px){
  .sx-space-background::before{background-size:auto 100%;background-position:66% center;opacity:.34}
  .sx-space-layout .sidebar,.sidebar{background:rgba(9,12,19,.94)!important}
  :where(.kpi,.panel,.li-panel,.sx-command-panel,.ops-panel,.rel-panel){-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}
}
@media(prefers-reduced-motion:reduce){
  .sx-space-background video{display:none!important}
  :where(.kpi,.panel,.li-panel,.sx-command-panel,.ops-panel,.rel-panel,.btn,.nav button,.sx-nav button){transition:none!important}
}
@media(prefers-reduced-transparency:reduce){
  :where(.panel,.kpi,.li-panel,.sx-command-panel,.ops-panel,.rel-panel){background:#141924!important;-webkit-backdrop-filter:none;backdrop-filter:none}
}
