@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

/* AFSOS Founder Command Center — Global Application Theme */
:root{
  --afs-navy:#152D4F;
  --afs-navy-2:#1B3A62;
  --afs-bg:#F4F7FB;
  --afs-white:#FFFFFF;
  --afs-text:#182337;
  --afs-muted:#697586;
  --afs-border:#DFE6EF;
  --afs-border-2:#D5DEEA;
  --afs-blue:#2D6CA3;
  --afs-green:#2E8B62;
  --afs-green-bg:#E8F7EF;
  --afs-red:#B72F2F;
  --afs-red-bg:#FDECEC;
  --afs-soft:#F8FAFC;
  --afs-shadow:0 10px 30px rgba(21,45,79,.07);
  --afs-shadow-hover:0 12px 28px rgba(21,45,79,.12);
  --afs-radius:15px;
  --afs-radius-sm:10px;
}

html{background:var(--afs-bg)}
body,
body *{font-family:'Poppins',Arial,sans-serif}
body{background:var(--afs-bg)!important;color:var(--afs-text)}
a{color:inherit}

/* Global top/header variants used by different AFSOS modules */
.topbar,
.top{
  min-height:64px!important;
  height:auto!important;
  background:var(--afs-navy)!important;
  color:#fff!important;
  padding:0 30px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  border:0!important;
  box-shadow:none!important;
}
.topbar .brand,
.top .brand,
.brand{
  color:#fff!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:800!important;
  letter-spacing:1.15px!important;
}
.topbar a,.top a,.top .nav a,.topbar .nav a{color:#fff!important;text-decoration:none!important}
.top-right,.user-menu{font-size:13px!important}

/* Global module navigation */
.module-bar{
  background:var(--afs-navy-2)!important;
  color:#fff!important;
  min-height:56px!important;
  padding:0 30px!important;
  display:flex!important;
  align-items:center!important;
  border:0!important;
  overflow:hidden!important;
}
.module-bar nav,
.top .nav,
.topbar .nav,
.nav{
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  overflow-x:auto!important;
  white-space:nowrap!important;
  width:100%!important;
  scrollbar-width:thin;
}
.module-bar nav a,
.top .nav a,
.topbar .nav a,
.nav a{
  color:#fff!important;
  text-decoration:none!important;
  padding:8px 10px!important;
  border-radius:8px!important;
  display:inline-block!important;
  flex:0 0 auto!important;
  font-size:12px!important;
  font-weight:700!important;
  transition:background .15s ease,opacity .15s ease!important;
}
.module-bar nav a:hover,
.top .nav a:hover,
.topbar .nav a:hover,
.nav a:hover{background:rgba(255,255,255,.11)!important}

/* Page containers */
.page,.wrap,.content{
  max-width:1380px!important;
  margin:0 auto!important;
  padding:30px 30px 50px!important;
}

/* Hero/header blocks */
.hero{
  background:var(--afs-white)!important;
  border:1px solid var(--afs-border)!important;
  border-radius:var(--afs-radius)!important;
  box-shadow:var(--afs-shadow)!important;
}
.hero h1,
h1{
  color:var(--afs-navy)!important;
  font-weight:800!important;
  letter-spacing:-.025em!important;
}
.hero h1{font-size:30px!important;line-height:1.18!important}
h1{font-size:30px!important;line-height:1.2!important}
.hero p,.sub,.welcome{color:var(--afs-muted)!important}
.eyebrow,.kicker{
  color:var(--afs-muted)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

/* Dashboard-style cards */
.card,.panel,.metric,.role-badge{
  background:var(--afs-white)!important;
  border:1px solid var(--afs-border)!important;
  border-radius:var(--afs-radius)!important;
  box-shadow:var(--afs-shadow)!important;
}
.card,.panel{padding:22px!important}
.metric{padding:20px!important}
.card h2,.panel h2,.card h3,.panel h3{
  color:var(--afs-navy)!important;
  font-weight:800!important;
}
.card h2,.panel h2{font-size:19px!important;line-height:1.3!important}
.card h3,.panel h3{font-size:16px!important}
.metric-label,.metric label,.metric span,.label,.metric small{
  color:var(--afs-muted)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
}
.metric-value,.metric strong,.value,.num{
  color:var(--afs-navy)!important;
  font-size:29px!important;
  font-weight:800!important;
}
.metric-note,.muted,.small,.meta,.help{color:var(--afs-muted)!important}

/* Dashboard-style module/action cards */
.module,.item,.row,.group,.school,.guardian,.af-performance-card,.af-tracking-card{
  border-color:var(--afs-border)!important;
}
.module{
  background:#FBFCFE!important;
  color:var(--afs-navy)!important;
  border-radius:10px!important;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease!important;
}
.module:hover{background:#fff!important;border-color:#8EA7C1!important;box-shadow:var(--afs-shadow-hover)!important;transform:translateY(-1px)!important}
.module span{color:var(--afs-muted)!important}

/* Buttons */
.btn,
button,
input[type="submit"],
input[type="button"]{
  font-family:'Poppins',Arial,sans-serif!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.2!important;
  border-radius:10px!important;
  padding:11px 15px!important;
  border:1px solid var(--afs-border-2)!important;
  background:#fff!important;
  color:var(--afs-navy)!important;
  cursor:pointer!important;
  text-decoration:none!important;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease!important;
}
.btn:hover,button:hover,input[type="submit"]:hover,input[type="button"]:hover{
  border-color:#9EB2C8!important;
  box-shadow:0 6px 16px rgba(21,45,79,.10)!important;
}
.btn.primary,.primary,.btn-primary,.btn-block{
  background:var(--afs-navy)!important;
  color:#fff!important;
  border-color:var(--afs-navy)!important;
}
.btn.primary:hover,.primary:hover,.btn-primary:hover,.btn-block:hover{background:var(--afs-navy-2)!important;border-color:var(--afs-navy-2)!important}
.btn.secondary,.secondary,.btn-secondary{
  background:#EEF2F6!important;
  color:var(--afs-navy)!important;
  border-color:#E0E6ED!important;
}
.btn.secondary:hover,.secondary:hover,.btn-secondary:hover{background:#E5EBF2!important}
.danger{background:#fff!important;color:var(--afs-red)!important;border-color:#EFCACA!important}

/* Forms */
input,select,textarea,.input,.select{
  font-family:'Poppins',Arial,sans-serif!important;
  color:var(--afs-text)!important;
  background:#fff!important;
  border:1px solid var(--afs-border-2)!important;
  border-radius:10px!important;
  min-height:44px!important;
  box-shadow:none!important;
}
input,select,.input,.select{padding:10px 12px!important}
textarea{padding:11px 12px!important}
input:focus,select:focus,textarea:focus,.input:focus,.select:focus{
  outline:0!important;
  border-color:var(--afs-navy)!important;
  box-shadow:0 0 0 3px rgba(21,45,79,.10)!important;
}
label{color:var(--afs-text)!important;font-size:11px!important;font-weight:700!important}

/* Tables */
.tablewrap{border-color:var(--afs-border)!important;border-radius:10px!important}
.table th{background:#F7F9FC!important;color:var(--afs-muted)!important;border-color:var(--afs-border)!important;font-size:10px!important;font-weight:700!important}
.table td{border-color:#E8EDF3!important;color:var(--afs-text)!important;font-size:12px!important}
.table tr:hover td{background:#FBFCFE!important}

/* Status/badges/tags */
.badge,.pill,.tag,.status{
  border-radius:999px!important;
  font-size:10px!important;
  font-weight:700!important;
}
.status,.tag.active,.pill.green,.active{background:var(--afs-green-bg)!important;color:var(--afs-green)!important}
.success{background:var(--afs-green-bg)!important;color:#187B55!important}
.error,.alert-error{background:var(--afs-red-bg)!important;color:var(--afs-red)!important}
.notice,.alert-info,.info{background:#EEF3FA!important;color:#536B88!important;border-color:#DCE6F2!important}
.empty{border-color:#D8E1EB!important;color:#7A899E!important;background:#fff!important}

/* Common navigation/back links */
.back{color:var(--afs-navy)!important;font-size:12px!important;font-weight:700!important;text-decoration:none!important}
.back:hover{text-decoration:underline!important}

/* Security/sidebar pages: visually align them with Founder theme */
.app-shell{background:var(--afs-bg)!important}
.sidebar{background:var(--afs-navy)!important;color:#fff!important}
.nav-item{color:#C6D0DC!important}
.nav-item:hover,.nav-item.active{background:var(--afs-navy-2)!important;color:#fff!important}
.main-area{background:var(--afs-bg)!important}
.topbar{border-bottom:0!important}

/* Detail/profile definition rows */
.info-row,.security-row,.statline{border-color:var(--afs-border)!important}
.info-label{color:var(--afs-muted)!important}
.info-value{color:var(--afs-text)!important;font-weight:700!important}

/* Keep specialized performance UI readable while sharing global chrome */
.af-section-title h3,.af-performance-name,.af-performance-result,.af-performance-headline{color:var(--afs-navy)!important}
.af-performance-message{color:#5B6F86!important}

/* Responsive */
@media(max-width:1000px){
  .page,.wrap,.content{padding:24px 20px 42px!important}
}
@media(max-width:700px){
  .topbar,.top{padding:0 18px!important;min-height:60px!important}
  .module-bar{padding:0 16px!important}
  .page,.wrap,.content{padding:20px 16px 36px!important}
  .hero{padding:22px!important}
  .card,.panel{padding:18px!important}
}

/* Navigation active state */
.afs-global-nav{
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  overflow-x:auto!important;
  white-space:nowrap!important;
  width:100%!important;
  scrollbar-width:thin;
}
.afs-nav-link{
  color:#fff!important;
  text-decoration:none!important;
  padding:8px 10px!important;
  border-radius:8px!important;
  display:inline-block!important;
  flex:0 0 auto!important;
  font-size:12px!important;
  font-weight:700!important;
  opacity:.94!important;
  transition:background .15s ease,opacity .15s ease!important;
}
.afs-nav-link:hover{background:rgba(255,255,255,.11)!important;opacity:1!important}
.afs-nav-link.is-active{background:rgba(255,255,255,.15)!important;box-shadow:inset 0 -2px 0 rgba(255,255,255,.85)!important;opacity:1!important}
