
:root{
  --saith-blue-950:#081624;
  --saith-blue-900:#0E2238;
  --saith-blue-800:#143253;
  --saith-blue-700:#183B63;
  --saith-blue-600:#255A91;
  --saith-blue-500:#3D78B4;
  --saith-gold-700:#9A7428;
  --saith-gold-600:#B88B32;
  --saith-gold-500:#C9A24D;
  --saith-gold-300:#E4C77A;

  --saith-positive:#2E9B62;
  --saith-positive-bg:#EAF7F0;
  --saith-negative:#C84242;
  --saith-negative-bg:#FCECEC;
  --saith-warning:#C28728;
  --saith-warning-bg:#FFF5DF;

  --saith-bg:#F4F6F9;
  --saith-surface:#FFFFFF;
  --saith-surface-2:#F8FAFC;
  --saith-border:#E2E7ED;
  --saith-text:#16202A;
  --saith-muted:#6B7682;

  --saith-radius:18px;
  --saith-radius-sm:12px;
  --saith-shadow:0 10px 30px rgba(17,38,63,.07);
  --saith-shadow-hover:0 14px 34px rgba(17,38,63,.12);
}

*{box-sizing:border-box}

html{background:var(--saith-bg)}

body{
  margin:0;
  background:
    radial-gradient(circle at 88% 0%, rgba(61,120,180,.08), transparent 28rem),
    var(--saith-bg);
  color:var(--saith-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--saith-blue-700);text-decoration:none}
a:hover{color:var(--saith-blue-500)}

button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}

.container{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto;
  padding:28px 0 48px;
}

h1,h2,h3{letter-spacing:-.025em}
h1{font-size:clamp(1.65rem,2.7vw,2.35rem);margin:0 0 8px}
h2{font-size:1.17rem}
.muted{color:var(--saith-muted)!important}

.card,
.feed,
.hub,
.data-card,
.summary-card,
.role-card,
.widget-fallback{
  background:rgba(255,255,255,.96)!important;
  border:1px solid var(--saith-border)!important;
  border-radius:var(--saith-radius)!important;
  box-shadow:var(--saith-shadow)!important;
}

.card{padding:20px}

.topbar{
  min-height:64px;
  padding:0 24px!important;
  background:rgba(14,34,56,.96)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 8px 24px rgba(8,22,36,.14);
  backdrop-filter:blur(14px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  position:sticky;
  top:0;
  z-index:60;
}
.topbar a,.topbar strong{color:#fff!important}
.topbar a{opacity:.9}
.topbar a:hover{opacity:1;color:var(--saith-gold-300)!important}

.saith-shell{min-height:100vh}
.saith-main{min-width:0}

.saith-brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:#fff;
  font-weight:850;
  letter-spacing:.01em;
}
.saith-brand-mark{
  width:35px;height:35px;border-radius:11px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,var(--saith-gold-300),var(--saith-gold-600));
  color:var(--saith-blue-950);
  font-weight:950;
  box-shadow:inset 0 1px rgba(255,255,255,.45);
}
.saith-brand small{display:block;font-size:10px;color:#B9C7D5;font-weight:650;letter-spacing:.09em;text-transform:uppercase}

.saith-sidebar{
  width:252px;
  position:fixed;
  inset:0 auto 0 0;
  background:
    radial-gradient(circle at 80% 4%,rgba(61,120,180,.24),transparent 15rem),
    var(--saith-blue-950);
  color:#DCE7F1;
  padding:20px 14px;
  z-index:70;
  border-right:1px solid rgba(255,255,255,.07);
  display:flex;
  flex-direction:column;
}
.saith-sidebar .saith-brand{padding:7px 8px 25px}
.saith-nav{display:grid;gap:6px}
.saith-nav a{
  color:#C7D3DF;
  padding:11px 12px;
  border-radius:11px;
  display:flex;
  align-items:center;
  gap:11px;
  font-size:14px;
  font-weight:650;
  transition:.18s ease;
}
.saith-nav a:hover,.saith-nav a.active{
  background:linear-gradient(90deg,rgba(61,120,180,.23),rgba(201,162,77,.09));
  color:#fff;
}
.saith-nav a.active{box-shadow:inset 3px 0 var(--saith-gold-500)}
.saith-nav .nav-dot{
  width:8px;height:8px;border-radius:999px;background:#63768A;
}
.saith-nav a.active .nav-dot{background:var(--saith-gold-500)}
.saith-sidebar-footer{
  margin-top:auto;
  padding:12px 8px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.saith-sidebar-footer a{color:#B9C7D5;font-size:13px}

body.saith-admin{padding-left:252px}
body.saith-admin .topbar{left:252px}
body.saith-admin .container{width:min(1240px,calc(100% - 38px))}

.saith-page-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:22px;
}
.saith-page-head p{margin:5px 0 0;color:var(--saith-muted)}
.saith-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}

.saith-btn,.saith-actions a,.quick-actions a{
  min-height:42px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  padding:10px 14px!important;
  border-radius:11px!important;
  border:1px solid var(--saith-border);
  background:#fff!important;
  color:var(--saith-blue-800)!important;
  font-weight:750!important;
  box-shadow:none!important;
}
.saith-btn-primary{
  background:var(--saith-blue-700)!important;
  border-color:var(--saith-blue-700)!important;
  color:#fff!important;
}
.saith-btn-gold{
  background:linear-gradient(135deg,var(--saith-gold-500),var(--saith-gold-300))!important;
  border-color:transparent!important;
  color:var(--saith-blue-950)!important;
}

.stats,.dashboard-grid,.summary-grid{
  gap:13px!important;
}
.stats .card,.dashboard-grid .card,.summary-card{
  position:relative;
  overflow:hidden;
  min-height:112px;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.stats .card:hover,.dashboard-grid .card:hover,.summary-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--saith-shadow-hover)!important;
  border-color:#CFD8E3!important;
}
.stats .card::after,.dashboard-grid .card::after,.summary-card::after{
  content:"";
  position:absolute;
  width:74px;height:74px;border-radius:50%;
  right:-28px;top:-27px;
  background:rgba(61,120,180,.07);
}
.stats .card span,.dashboard-grid .card span,.summary-card span{
  color:var(--saith-muted)!important;
  font-size:12px!important;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.stats .card strong,.dashboard-grid .card strong,.summary-card strong{
  color:var(--saith-blue-900);
  font-size:clamp(1.65rem,3vw,2.15rem)!important;
}
.stat-positive strong,.text-positive{color:var(--saith-positive)!important}
.stat-negative strong,.text-negative{color:var(--saith-negative)!important}
.stat-gold strong{color:var(--saith-gold-700)!important}

.hubs,.menu-grid,.data-grid{
  gap:14px!important;
}
.hub,.menu-grid a,.data-card{
  position:relative;
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.hub:hover,.menu-grid a:hover,.data-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--saith-shadow-hover)!important;
  border-color:#CDD7E2!important;
}
.hub .icon{
  width:42px;height:42px;border-radius:12px;
  display:grid!important;place-items:center;
  background:#EEF4FA;
  color:var(--saith-blue-700);
  font-size:20px!important;
}
.hub strong,.menu-grid strong{color:var(--saith-blue-950)!important}
.hub small,.menu-grid small{color:var(--saith-muted)!important}

.feed{overflow:hidden}
.feed-grid{gap:16px!important}

.saith-badge,.pill{
  display:inline-flex!important;
  align-items:center;
  border-radius:999px!important;
  padding:5px 9px!important;
  font-size:11px!important;
  font-weight:800!important;
  background:#EDF2F7!important;
  color:var(--saith-blue-800)!important;
}
.saith-badge.positive{background:var(--saith-positive-bg)!important;color:var(--saith-positive)!important}
.saith-badge.negative{background:var(--saith-negative-bg)!important;color:var(--saith-negative)!important}
.saith-badge.warning{background:var(--saith-warning-bg)!important;color:var(--saith-warning)!important}
.saith-badge.gold{background:#FFF7E4!important;color:var(--saith-gold-700)!important}

.list-row,.item,.kv,.person{
  border-color:var(--saith-border)!important;
}
.list-row a,.item a,.person a{
  font-weight:750;
}

input,select,textarea{
  border:1px solid #CBD5E1!important;
  background:#fff!important;
  color:var(--saith-text)!important;
  border-radius:11px!important;
  min-height:44px;
  padding:10px 12px!important;
  outline:none;
  transition:border .15s ease,box-shadow .15s ease;
}
textarea{min-height:96px}
input:focus,select:focus,textarea:focus{
  border-color:var(--saith-blue-500)!important;
  box-shadow:0 0 0 3px rgba(61,120,180,.13);
}
button{
  border-radius:11px!important;
  min-height:42px;
  font-weight:780!important;
}
form button[type=submit]{
  background:var(--saith-blue-700)!important;
  color:#fff!important;
  border:1px solid var(--saith-blue-700)!important;
}
form button[type=submit]:hover{background:var(--saith-blue-800)!important}

.alert{
  border-radius:12px!important;
  border:1px solid #F1D6A5!important;
  background:#FFF7E8!important;
  color:#77551B!important;
}

.saith-entity-link{
  color:inherit!important;
  font-weight:800!important;
  text-decoration:none;
  border-bottom:1px dashed rgba(24,59,99,.32);
}
.saith-entity-link:hover{
  color:var(--saith-blue-600)!important;
  border-bottom-color:var(--saith-gold-500);
}

.saith-mobile-nav{
  display:none;
  position:fixed;
  left:10px;right:10px;bottom:10px;
  z-index:100;
  background:rgba(14,34,56,.97);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  box-shadow:0 15px 35px rgba(8,22,36,.28);
  padding:7px;
  grid-template-columns:repeat(5,1fr);
  backdrop-filter:blur(15px);
}
.saith-mobile-nav a{
  min-height:51px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  color:#BFD0E0;
  font-size:10px;
  font-weight:700;
  border-radius:12px;
}
.saith-mobile-nav a .mi{font-size:18px;line-height:1}
.saith-mobile-nav a.active{
  color:#fff;
  background:rgba(61,120,180,.24);
}
.saith-mobile-nav a.active .mi{color:var(--saith-gold-300)}

.saith-search{
  width:min(360px,40vw);
  position:relative;
}
.saith-search input{
  width:100%;
  min-height:38px!important;
  border-color:transparent!important;
  background:#F0F4F8!important;
  padding-left:35px!important;
  font-size:13px;
}
.saith-search::before{
  content:"⌕";
  position:absolute;left:12px;top:8px;
  color:#6A7988;z-index:1
}

body.saith-resident .topbar{
  background:rgba(14,34,56,.98)!important;
}
.saith-resident-hero{
  color:#fff;
  background:
    radial-gradient(circle at 90% 10%,rgba(201,162,77,.25),transparent 15rem),
    linear-gradient(135deg,var(--saith-blue-900),var(--saith-blue-700));
  border-radius:22px;
  padding:22px;
  box-shadow:0 16px 34px rgba(14,34,56,.20);
  margin-bottom:16px;
}
.saith-resident-hero h1{margin:0;font-size:1.55rem}
.saith-resident-hero p{margin:6px 0 0;color:#D3DFEA}
.saith-resident-hero a{color:var(--saith-gold-300)}

body.saith-registration{
  background:
    radial-gradient(circle at 8% 0%,rgba(201,162,77,.13),transparent 19rem),
    radial-gradient(circle at 96% 8%,rgba(61,120,180,.16),transparent 24rem),
    var(--saith-bg)!important;
}
body.saith-registration .brand h1{color:var(--saith-blue-900)}
body.saith-registration .progress span{background:#D9E1E9!important}
body.saith-registration .progress span.on{
  background:linear-gradient(90deg,var(--saith-blue-700),var(--saith-gold-500))!important;
}
body.saith-registration .rolecard{
  border-color:var(--saith-border)!important;
  transition:.16s ease;
}
body.saith-registration .rolecard:has(input:checked){
  border-color:var(--saith-blue-500)!important;
  background:#F2F7FC;
  box-shadow:0 0 0 3px rgba(61,120,180,.10);
}
body.saith-registration .next,
body.saith-registration .submit{
  background:var(--saith-blue-700)!important;
}
body.saith-registration .add{
  background:#EEF3F8!important;
  color:var(--saith-blue-800)!important;
}

@media(max-width:980px){
  body.saith-admin{padding-left:0}
  .saith-sidebar{display:none}
  body.saith-admin .topbar{left:0}
  .saith-page-head{align-items:flex-start}
}

@media(max-width:700px){
  .container{
    width:min(100% - 20px,680px);
    padding:18px 0 92px;
  }
  .topbar{
    min-height:58px;
    padding:0 14px!important;
  }
  h1{font-size:1.55rem}
  .card{padding:16px}
  .saith-page-head{flex-direction:column;margin-bottom:16px}
  .saith-actions{width:100%}
  .saith-actions a,.saith-actions .saith-btn{flex:1}
  .dashboard-grid,.stats,.summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .dashboard-grid .card,.stats .card,.summary-card{
    min-height:104px;
    padding:15px!important;
  }
  .hubs,.menu-grid,.data-grid{
    grid-template-columns:1fr!important;
  }
  .menu-grid a,.hub{
    min-height:auto!important;
    padding:17px!important;
  }
  body.saith-resident .saith-mobile-nav,
  body.saith-maintenance .saith-mobile-nav{
    display:grid;
  }
  body.saith-resident,
  body.saith-maintenance{
    padding-bottom:72px;
  }
  body.saith-registration .wrap{padding:10px!important}
  body.saith-registration .card{padding:17px!important}
}

@media(max-width:430px){
  .dashboard-grid,.stats,.summary-grid{
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
  }
  .dashboard-grid .card strong,.stats .card strong,.summary-card strong{
    font-size:1.55rem!important;
  }
  .saith-mobile-nav{left:7px;right:7px;bottom:7px}
}


/* V24.3.1 — semantic color cleanup */
a.btn,
.btn,
button,
input[type="submit"],
input[type="button"],
.saith-btn,
.quick-actions a,
.page-actions button{
  background:var(--saith-blue-700)!important;
  border-color:var(--saith-blue-700)!important;
  color:#fff!important;
}
a.btn:hover,
.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.saith-btn:hover,
.quick-actions a:hover,
.page-actions button:hover{
  background:var(--saith-blue-800)!important;
  border-color:var(--saith-blue-800)!important;
  color:#fff!important;
}

/* secondary / neutral controls */
.btn-secondary,
.btn-light,
.button-secondary,
.saith-btn.secondary{
  background:#fff!important;
  border-color:var(--saith-border)!important;
  color:var(--saith-blue-800)!important;
}

/* red is reserved for destructive actions */
.btn-danger,
.danger,
button[name="action"][value*="delete"],
button[name="action"][value*="remove"],
button[name="action"][value*="deactivate"]{
  background:var(--saith-negative)!important;
  border-color:var(--saith-negative)!important;
  color:#fff!important;
}

/* counts of unseen/new items = red alert */
.notification-count,
.announcement-count,
.unread-count,
.badge-count,
.notification-badge,
.announcement-badge{
  background:var(--saith-negative)!important;
  color:#fff!important;
  border-color:var(--saith-negative)!important;
}

/* unread dot */
.notification-mini.unread strong::before,
.notice.unread strong::before{
  background:var(--saith-negative)!important;
}

/* Keep semantic positive indicators green, but not action buttons */
.status-paid,
.status-approved,
.status-resolved,
.status-completed,
.positive,
.text-positive{
  color:var(--saith-positive)!important;
}
