/* =========================================================
   FINAL PROFESSIONAL POLISH
   Bhuyar School Information & Management Portal
   ========================================================= */

:root{
  --brand-navy:#08233d;
  --brand-blue:#2563eb;
  --brand-teal:#0f766e;
  --brand-emerald:#10b981;
  --brand-gold:#f59e0b;
  --brand-purple:#7c3aed;
  --surface-border:#dbe5ee;
  --surface-shadow:0 14px 38px rgba(8,35,61,.08);
  --surface-shadow-hover:0 20px 48px rgba(8,35,61,.12);
}

/* ---------- Overall rhythm ---------- */
html{background:#eef4f8}
body{min-height:100vh}
.main-content{position:relative;isolation:isolate}
.container{width:min(1220px,calc(100% - 36px))}
.section{padding-top:64px;padding-bottom:64px}
.section+.section{border-top:1px solid rgba(216,227,236,.65)}
.section-head,.dashboard-head{margin-bottom:28px}
.section-head h1,.section-head h2,.dashboard-head h1{line-height:1.25}
.section-head p,.dashboard-head p{max-width:760px;line-height:1.7}

/* ---------- Subtle decorative canvas ---------- */
.main-content:before{
  content:"";
  position:fixed;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 6% 30%,rgba(37,99,235,.025),transparent 18%),
    radial-gradient(circle at 94% 60%,rgba(15,118,110,.028),transparent 19%);
}

/* ---------- Header refinement ---------- */
.site-header{
  transition:box-shadow .2s ease,background .2s ease,border-color .2s ease;
}
.site-header.is-scrolled{
  background:rgba(255,255,255,.985);
  box-shadow:0 10px 32px rgba(8,35,61,.10);
  border-bottom-color:#d5e1ea;
}
.nav a:not(.btn){
  border-radius:9px;
  padding:8px 5px;
  transition:color .18s ease,background .18s ease;
}
.nav a:not(.btn):hover{
  background:linear-gradient(135deg,#eef5ff,#f0fdfa);
}
.nav a.active:not(.btn){
  color:#1d4ed8;
  background:linear-gradient(135deg,#eaf2ff,#ecfdf5);
  box-shadow:inset 0 0 0 1px #d6e5ed;
}
.nav a.active:not(.btn):after{right:6px;left:6px;bottom:1px}
.nav .btn-outline{box-shadow:0 5px 14px rgba(8,35,61,.055)}

/* ---------- Premium panels ---------- */
.panel,.coord-panel,.completion-kpi,.module-summary-card,.download-card,
.gallery-card,.task-group,.my-task-card,.snapshot-card,.month-kpi,
.doc-admin-card,.gallery-admin-card,.hm-module,.hm-month-card,.hm-task-card{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.panel:hover,.coord-panel:hover{
  box-shadow:var(--surface-shadow-hover);
}
.panel,.coord-panel{
  border-radius:21px;
}
.panel-head{
  padding-bottom:12px;
  border-bottom:1px solid #edf2f6;
  margin-bottom:18px;
}
.panel-head h3{line-height:1.35}

/* ---------- KPI polish ---------- */
.kpi,.coord-kpi,.completion-kpi,.snapshot-card,.month-kpi,.my-task-kpi{
  border-radius:19px;
  box-shadow:var(--surface-shadow);
}
.kpi:hover,.coord-kpi:hover,.completion-kpi:hover,.snapshot-card:hover,.month-kpi:hover{
  transform:translateY(-2px);
  box-shadow:var(--surface-shadow-hover);
}
.kpi-icon,.coord-kpi-icon{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 5px 14px rgba(8,35,61,.06);
}

/* ---------- Buttons ---------- */
.btn,.coord-action{
  position:relative;
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,border-color .18s ease;
}
.btn:active,.coord-action:active{transform:translateY(0) scale(.985)}
.btn-primary:before,.coord-action.primary:before{
  content:"";
  position:absolute;
  top:0;left:-80%;
  width:45%;height:100%;
  transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
  transition:left .45s ease;
}
.btn-primary:hover:before,.coord-action.primary:hover:before{left:135%}
.btn-outline:hover{box-shadow:0 8px 18px rgba(8,35,61,.07)}

/* ---------- Forms ---------- */
.form-stack input,.form-stack textarea,.form-stack select,
.upload-grid input,.upload-grid textarea,.upload-grid select,
.gallery-upload-grid input,.gallery-upload-grid textarea,.gallery-upload-grid select,
.task-create-grid input,.task-create-grid textarea,.task-create-grid select,
.report-form-grid textarea,
.doc-edit input,.doc-edit textarea,.doc-edit select,
.gallery-edit input,.gallery-edit textarea,.gallery-edit select{
  border-radius:12px !important;
  min-height:43px;
  box-shadow:inset 0 1px 2px rgba(8,35,61,.025);
}
textarea{line-height:1.65}
label{letter-spacing:0}

/* ---------- Tables ---------- */
.table-wrap{
  border:1px solid #e1eaf1;
  border-radius:14px;
  background:#fff;
  box-shadow:0 5px 16px rgba(8,35,61,.035);
}
.table-wrap table{margin:0}
table thead th:first-child{border-top-left-radius:12px}
table thead th:last-child{border-top-right-radius:12px}
th{padding-top:13px;padding-bottom:13px}
td{padding-top:13px;padding-bottom:13px}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:rgba(247,250,253,.6)}
tbody tr:hover{background:#f0f7ff}

/* ---------- Search / filters ---------- */
input[type="search"],input[type="month"],input[type="date"]{
  min-height:42px;
  border-radius:11px !important;
}
.gallery-filter{
  transition:.18s ease;
}
.gallery-filter:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(8,35,61,.07)}

/* ---------- Breadcrumb ---------- */
.breadcrumb{
  display:inline-flex;
  background:rgba(255,255,255,.82);
  border:1px solid #e1e9f0;
  border-radius:999px;
  padding:7px 11px;
  box-shadow:0 5px 15px rgba(8,35,61,.04);
}

/* ---------- Page heroes ---------- */
.completion-hero,.monthly-hero,.gallery-hero,.download-hero{
  position:relative;
  overflow:hidden;
}
.completion-hero:after,.monthly-hero:after,.gallery-hero:after,.download-hero:after{
  content:"";
  position:absolute;
  right:-80px;top:-110px;
  width:270px;height:270px;border-radius:50%;
  border:1px solid rgba(37,99,235,.08);
  box-shadow:0 0 0 48px rgba(15,118,110,.025),0 0 0 96px rgba(245,158,11,.018);
  pointer-events:none;
}

/* ---------- Completion status ---------- */
.status-chip,.hm-status,.report-status,.coord-badge,.task-chip,.my-task-chip{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);
}
.completion-bar,.hm-progress,.priority-bar,.coord-health-bar,.progress{box-shadow:inset 0 1px 2px rgba(8,35,61,.08)}
.module-summary-card{
  background:linear-gradient(145deg,#fff,#fbfdff);
  box-shadow:0 7px 20px rgba(8,35,61,.045);
}

/* ---------- Gallery ---------- */
.gallery-image-btn{position:relative}
.gallery-image-btn:after{
  content:"🔍";
  position:absolute;right:12px;top:12px;
  width:34px;height:34px;display:grid;place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  box-shadow:0 6px 18px rgba(8,35,61,.16);
  opacity:0;transform:translateY(-4px);transition:.2s ease;
}
.gallery-card:hover .gallery-image-btn:after{opacity:1;transform:none}

/* ---------- Download cards ---------- */
.download-card:hover,.gallery-card:hover,.module-card:hover,.school-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--surface-shadow-hover);
}
.download-card h3,.gallery-card-body h3{line-height:1.45}

/* ---------- Home refinements ---------- */
.home-strip-inner{
  box-shadow:0 22px 54px rgba(8,35,61,.13);
}
.home-strip-item{transition:background .18s ease}
.home-strip-item:hover{background:linear-gradient(135deg,#f8fbff,#f4fcf9)}
.home-kpi,.home-school-card,.home-download-card,.home-facility-card{
  border-color:#dce7ef;
}
.home-school-card .school-index{box-shadow:inset 0 0 0 1px #dce7ef}
.home-gallery-card:after{
  content:"";
  position:absolute;inset:0;
  border:1px solid rgba(255,255,255,.15);
  border-radius:inherit;
  pointer-events:none;
}

/* ---------- Coordinator refinements ---------- */
.coord-toolbar,.coord-health,.coord-priority{
  backdrop-filter:blur(10px);
}
.coord-actions .coord-action:not(.primary):nth-child(2){border-color:#d8e8ef;background:linear-gradient(135deg,#fff,#f0fdfa)}
.coord-actions .coord-action:not(.primary):nth-child(3){border-color:#e4ddfa;background:linear-gradient(135deg,#fff,#faf5ff)}
.coord-actions .coord-action:not(.primary):nth-child(4){border-color:#fde7ba;background:linear-gradient(135deg,#fff,#fffaf0)}
.coord-actions .coord-action:not(.primary):nth-child(5){border-color:#d7e6f5;background:linear-gradient(135deg,#fff,#f4f8ff)}
.coord-actions .coord-action:not(.primary):nth-child(6){border-color:#e3def8;background:linear-gradient(135deg,#fff,#faf7ff)}
.coord-actions .coord-action:not(.primary):nth-child(7){border-color:#d8e8e0;background:linear-gradient(135deg,#fff,#f3fbf7)}
.facility-modern{transition:.18s ease}
.facility-modern:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(8,35,61,.06)}

/* ---------- Footer redesign support ---------- */
.site-footer{
  margin-top:0;
  padding:0;
}
.footer-main{
  position:relative;
  padding:42px 0 30px;
}
.footer-main:after{
  content:"";
  position:absolute;
  left:50%;top:0;
  width:min(1220px,calc(100% - 36px));
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
}
.footer-layout{
  display:grid;
  grid-template-columns:1.35fr .8fr .8fr;
  gap:36px;
  align-items:start;
}
.footer-brand{display:flex;gap:14px;align-items:center}
.footer-logo{
  width:58px;height:58px;flex:0 0 auto;
  border-radius:50%;background:#fff;padding:3px;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}
.footer-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.footer-brand strong{display:block;font-size:17px}
.footer-brand p{margin:5px 0 0;color:#bdd2df;font-size:11px;line-height:1.6}
.footer-heading{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#7dd3fc;font-weight:700;margin-bottom:10px}
.footer-links{display:grid;gap:7px}
.footer-links a{font-size:11px;color:#d6e6ee;transition:.18s ease}
.footer-links a:hover{color:#fff;transform:translateX(3px)}
.footer-info{display:grid;gap:7px;color:#d6e6ee;font-size:11px}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding:13px 0;
  background:rgba(0,0,0,.08);
}
.footer-bottom-inner{display:flex;justify-content:space-between;gap:16px;align-items:center;color:#afc7d4;font-size:10px}
.footer-live{display:inline-flex;align-items:center;gap:6px}
.footer-live i{width:6px;height:6px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 4px rgba(74,222,128,.12)}

/* ---------- Accessibility / motion ---------- */
:focus-visible{
  outline:3px solid rgba(37,99,235,.3);
  outline-offset:2px;
  border-radius:6px;
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .footer-layout{grid-template-columns:1fr 1fr}
  .footer-layout>div:first-child{grid-column:1/-1}
}
@media(max-width:760px){
  .container{width:min(100% - 24px,1220px)}
  .section{padding-top:50px;padding-bottom:50px}
  .nav a:not(.btn){padding:10px 11px}
  .nav a.active:not(.btn):after{display:none}
  .table-wrap{border-radius:12px}
  .footer-layout{grid-template-columns:1fr;gap:25px}
  .footer-layout>div:first-child{grid-column:auto}
  .footer-bottom-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:480px){
  .section{padding-top:42px;padding-bottom:42px}
  .panel{border-radius:17px;padding:17px}
  .btn{border-radius:10px}
}


/* ---------- Professional coordinator management dropdown ---------- */
.nav-dropdown{position:relative}
.nav-dropdown summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:5px;
  padding:8px 5px;border-radius:9px;font-weight:700;color:inherit;
  transition:background .18s ease,color .18s ease;
}
.nav-dropdown summary::-webkit-details-marker{display:none}
.nav-dropdown summary:hover,.nav-dropdown summary.active{
  color:#1d4ed8;background:linear-gradient(135deg,#eef5ff,#f0fdfa);
  box-shadow:inset 0 0 0 1px #d6e5ed;
}
.nav-dropdown summary span{font-size:9px;transition:transform .18s ease}
.nav-dropdown[open] summary span{transform:rotate(180deg)}
.nav-dropdown-menu{
  position:absolute;right:0;top:calc(100% + 10px);z-index:90;
  width:230px;padding:8px;border-radius:15px;background:rgba(255,255,255,.98);
  border:1px solid #dbe5ee;box-shadow:0 18px 46px rgba(8,35,61,.16);
  backdrop-filter:blur(12px);
}
.nav-dropdown-menu:before{
  content:"";position:absolute;right:22px;top:-6px;width:11px;height:11px;
  background:#fff;border-left:1px solid #dbe5ee;border-top:1px solid #dbe5ee;
  transform:rotate(45deg);
}
.nav-dropdown-menu a{
  display:flex!important;align-items:center!important;width:100%;
  padding:9px 10px!important;border-radius:9px!important;font-size:11px!important;
  white-space:nowrap;
}
.nav-dropdown-menu a:after{display:none!important}
.nav-dropdown-menu a+a{margin-top:2px}
.nav-dropdown-menu a:hover,.nav-dropdown-menu a.active{
  background:linear-gradient(135deg,#eef5ff,#f0fdfa)!important;color:#1d4ed8!important;
}

@media(max-width:760px){
  .nav-dropdown{width:100%}
  .nav-dropdown summary{padding:10px 11px}
  .nav-dropdown-menu{
    position:static;width:100%;margin-top:6px;padding:6px;
    box-shadow:none;background:#f8fbff;border-color:#dfe7ef;
  }
  .nav-dropdown-menu:before{display:none}
  .nav-dropdown-menu a{padding:10px 11px!important}
}