/*
 * STIRSHAKEN.AI — unified product theme
 *
 * One shared visual language for the public website, authentication,
 * customer portal, CRM/admin workspace and native form controls. This layer
 * is cosmetic only: routes, layouts, field names and application behavior stay intact.
 */

:root{
  color-scheme:dark;
  --font-display:"Space Grotesk",Inter,system-ui,sans-serif;
  --font-body:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --f-disp:var(--font-display);--f-body:var(--font-body);--f-mono:var(--font-mono);
  --purple:#6a3eff;--purple-light:#8b6cff;--purple-dark:#5130c9;
  --purple-glow:rgba(106,62,255,.38);--navy:#262b33;--black:#0f1317;
  --white:#f8fafc;--muted:#a2a6ad;--glass:rgba(255,255,255,.045);
  --glass-border:rgba(162,166,173,.16);
  --ui-bg:#0f1317;--ui-bg-raised:#151a20;--ui-panel:#1a2028;--ui-panel-strong:#262b33;
  --ui-line:rgba(162,166,173,.16);--ui-line-strong:rgba(139,108,255,.38);
  --ui-text:#f8fafc;--ui-copy:#c4ccd7;--ui-muted:#8e99a8;
  --ui-purple:#6a3eff;--ui-purple-light:#8b6cff;--ui-cyan:#38bdf8;
  --ui-success:#34d399;--ui-warning:#fbbf24;--ui-danger:#f87171;
  --ui-radius:12px;--ui-radius-lg:16px;--ui-focus:0 0 0 3px rgba(106,62,255,.2);
  --ui-shadow:0 22px 58px -34px rgba(0,0,0,.78);
}

/* Typography: one hierarchy everywhere. */
body.system-surface{
  font-family:var(--font-body)!important;color:var(--ui-text);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body.system-surface :is(button,input,select,textarea):not([style*="monospace"]){font-family:var(--font-body)!important}
body.system-surface :is(h1,h2,h3,h4,h5,h6,.dash-topbar-title,.panel-head h2,.panel-head h3,.aw-title,.iw-title){font-family:var(--font-display)!important}
body.system-surface :is(code,kbd,pre,.section-label,.hero-eyebrow,.breadcrumb,.dash-nav-label,table th,.badge,.pill-select,.aw-label,.rv-lbl){font-family:var(--font-mono)!important}
body.system-surface :is(.kpi .num,.kpi-value,.score-ring,.stat-number,.mini-stat-num){font-family:var(--font-display)!important;font-variant-numeric:tabular-nums}

/* CRM and portal shells use the same charcoal surface system as public. */
body.admin-surface,body.portal-surface{background:var(--ui-bg)!important}
body.system-surface .dash-body{background:var(--ui-bg)!important;color:var(--ui-text)}
body.system-surface .dash-sidebar{
  background:linear-gradient(180deg,#151a20,#11161b)!important;
  border-right-color:var(--ui-line)!important;
}
body.system-surface .dash-sidebar-logo{border-bottom-color:var(--ui-line)!important}
body.system-surface .dash-topbar{
  background:rgba(15,19,23,.96)!important;border-bottom-color:var(--ui-line)!important;
  box-shadow:0 14px 34px -28px rgba(0,0,0,.9);
}
body.system-surface .dash-content{
  background:radial-gradient(circle at 86% 0,rgba(106,62,255,.075),transparent 29rem),var(--ui-bg);
}
body.system-surface .dash-nav a,body.system-surface .dash-nav-group-toggle{
  font-family:var(--font-body)!important;border-radius:10px!important;
}
body.system-surface .dash-nav a:hover,body.system-surface .dash-nav-group-toggle:hover{background:rgba(106,62,255,.11)!important}
body.system-surface .dash-nav a.active{
  background:linear-gradient(135deg,rgba(106,62,255,.27),rgba(56,189,248,.07))!important;
  border-color:rgba(139,108,255,.34)!important;
}

/* Shared surfaces retain page-specific content while matching the material. */
body.system-surface .panel{
  background:linear-gradient(145deg,rgba(38,43,51,.72),rgba(21,26,32,.9))!important;
  border-color:var(--ui-line)!important;border-radius:var(--ui-radius-lg)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),var(--ui-shadow)!important;
}
body.system-surface .kpi{border-radius:var(--ui-radius-lg)!important;border-color:rgba(139,108,255,.22)!important}
body.system-surface .table-wrap{
  border-color:var(--ui-line)!important;border-radius:var(--ui-radius)!important;
  background:rgba(21,26,32,.38);
}
body.system-surface table{font-family:var(--font-body)!important}
body.system-surface table th{
  color:var(--ui-muted)!important;background:rgba(255,255,255,.028)!important;
  border-color:var(--ui-line)!important;font-size:10.5px!important;letter-spacing:.08em!important;
}
body.system-surface table td{border-color:rgba(162,166,173,.1)!important}
body.system-surface .dash-body table tbody tr:hover{background:rgba(106,62,255,.055)!important}

/* Native inputs and every .form-control share one material and focus state. */
body.system-surface :is(
  .form-control,.pill-select,
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]),
  select,textarea
){
  color:var(--ui-text)!important;background-color:rgba(21,26,32,.92)!important;
  border-color:var(--ui-line)!important;border-radius:10px!important;
  caret-color:var(--ui-purple-light);box-shadow:inset 0 1px rgba(255,255,255,.025);
}
body.system-surface :is(.form-control,input,select,textarea)::placeholder{color:#778391!important;opacity:1}
body.system-surface :is(.form-control,input,select,textarea):focus{
  outline:0!important;border-color:var(--ui-purple-light)!important;box-shadow:var(--ui-focus)!important;
}
body.system-surface :is(.form-control,input,select,textarea):disabled{opacity:.58!important;cursor:not-allowed!important}
body.system-surface :is(input,textarea)[readonly]{background-color:rgba(38,43,51,.55)!important;color:#aeb8c5!important}
body.system-surface select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23A2A6AD' d='M1 1l5 5 5-5'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 14px center!important;
  background-size:12px!important;padding-right:40px!important;
}
body.system-surface select option,body.system-surface select optgroup{
  color:var(--ui-text)!important;background:#151a20!important;font-family:var(--font-body)!important;
}
body.system-surface :is(input[type="checkbox"],input[type="radio"]){accent-color:var(--ui-purple)}
body.system-surface input[type="file"]::file-selector-button{
  margin-right:12px;padding:8px 12px;border:1px solid var(--ui-line-strong);
  border-radius:8px;background:rgba(106,62,255,.13);color:#ded7ff;
  font:700 12px var(--font-body);cursor:pointer;
}
body.system-surface input:-webkit-autofill,body.system-surface input:-webkit-autofill:hover,body.system-surface input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--ui-text)!important;box-shadow:0 0 0 1000px #151a20 inset!important;
  transition:background-color 9999s ease-out 0s;
}
body.system-surface .form-group label,body.system-surface .checker-field label{
  color:#c4ccd7!important;font-family:var(--font-mono)!important;font-size:10.5px!important;
  font-weight:600!important;letter-spacing:.1em!important;
}

/* One button family; size classes keep their existing spacing. */
body.system-surface :is(.btn,.btn-primary,.btn-secondary,.btn-outline,.btn-ghost,.btn-check,.btn-sm,.aw-next,.aw-back){
  font-family:var(--font-body)!important;border-radius:10px!important;font-weight:700!important;
  letter-spacing:0!important;text-transform:none!important;
}
body.system-surface :is(.btn-primary,.btn-check,.aw-next),body.system-surface .dash-body :is(.btn.primary,.btn.btn-primary,.btn-sm.primary){
  color:#fff!important;background:linear-gradient(135deg,var(--ui-purple),#5130c9)!important;
  border-color:rgba(139,108,255,.68)!important;box-shadow:0 10px 26px -16px rgba(106,62,255,.85)!important;
}
body.system-surface :is(.btn-primary,.btn-check,.aw-next):hover,body.system-surface .dash-body :is(.btn.primary,.btn.btn-primary,.btn-sm.primary):hover{
  background:linear-gradient(135deg,#7955ff,#5a36d5)!important;
  box-shadow:0 14px 34px -15px rgba(106,62,255,.9)!important;
}
body.system-surface :is(.btn-outline,.btn-ghost,.btn-secondary,.aw-back),body.system-surface .dash-body :is(.btn:not(.primary):not(.btn-primary):not(.danger):not(.btn-danger),.btn.secondary,.btn.btn-secondary,.btn-sm.ghost){
  color:#d4dbe5!important;background:rgba(255,255,255,.035)!important;border-color:var(--ui-line)!important;
}
body.system-surface :is(.btn-outline,.btn-ghost,.btn-secondary,.aw-back):hover,body.system-surface .dash-body :is(.btn:not(.primary):not(.btn-primary):not(.danger):not(.btn-danger),.btn.secondary,.btn.btn-secondary,.btn-sm.ghost):hover{
  color:#fff!important;background:rgba(106,62,255,.09)!important;border-color:var(--ui-line-strong)!important;
}
body.system-surface .dash-body :is(.btn.danger,.btn-sm.danger,.btn.btn-danger){
  color:#fecaca!important;background:rgba(239,68,68,.1)!important;border-color:rgba(248,113,113,.3)!important;
}
body.system-surface :is(button,.btn,.btn-primary,.btn-secondary,.btn-outline,.btn-ghost,.btn-sm):disabled{
  opacity:.52!important;cursor:not-allowed!important;transform:none!important;box-shadow:none!important;
}

/* Repeated interactions: tabs, status, alerts and modal surfaces. */
body.system-surface :is(.tab-btn,.rh-tab,.smx-tab,.cp-tab,.shield-tab,.leads-tab,.pip-tab,.rd-tab,.cs-tab,.siat-tab,[role="tab"]){
  font-family:var(--font-body)!important;border-radius:9px!important;
}
body.system-surface :is(.tab-btn,.rh-tab,.smx-tab,.cp-tab,.shield-tab,.leads-tab,.pip-tab,.rd-tab,.cs-tab,.siat-tab,[role="tab"]).active,
body.system-surface [role="tab"][aria-selected="true"]{
  color:#fff!important;border-color:rgba(139,108,255,.4)!important;background:rgba(106,62,255,.13)!important;
}
body.system-surface .badge{
  border-radius:999px!important;border:1px solid rgba(162,166,173,.12);
  font-size:10px!important;letter-spacing:.06em!important;
}
body.system-surface :is(.alert,.alert-success,.alert-error,.alert-warning,.dash-alert){
  border-radius:12px!important;font-family:var(--font-body)!important;
}
body.system-surface :is(.modal-content,.modal-card,.siaw-modal,.dialog-card){
  color:var(--ui-text)!important;background:linear-gradient(145deg,#1a2028,#11161b)!important;
  border-color:var(--ui-line-strong)!important;border-radius:var(--ui-radius-lg)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.62)!important;
}

body.system-surface ::selection{background:rgba(106,62,255,.38);color:#fff}
body.system-surface :is(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--ui-purple-light)!important;outline-offset:2px!important;
}

@media(max-width:768px){body.system-surface :is(.form-control,input,select,textarea){font-size:16px!important}}
@media(prefers-reduced-motion:reduce){
  body.system-surface *,body.system-surface *::before,body.system-surface *::after{
    scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}