/* ===== Tamanna design system (matches tamanna.ncert.gov.in) =====
   Moved out of base.html's inline <style> so it caches across every page.
   URLs here are relative to this file's location (/static/tamanna/). */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/poppins-400.woff2') format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/poppins-500.woff2') format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/poppins-600.woff2') format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/poppins-700.woff2') format('woff2');}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Poppins',sans-serif;background:#d7edf9;color:#212529;-webkit-font-smoothing:antialiased}
a{color:#0b6ba0;text-decoration:none}
a:hover{text-decoration:underline}

.page{background:linear-gradient(145deg,#e0f2f9 0%,#8ed8f8 35%,#32ade8 100%);
      min-height:calc(100vh - 20px);margin:10px;border-radius:30px;overflow:hidden;
      display:flex;flex-direction:column}
.container{flex:1;max-width:1500px;width:100%;margin:0 auto;padding:1.3rem 2.2rem 2.4rem;position:relative}

/* header: nav (left) + government logo pill (center) */
.topbar{position:relative;min-height:150px}
.topbar.nonav{min-height:130px}
.nav{display:flex;flex-wrap:wrap;gap:6px;position:relative;z-index:3}
.nav a{background:#008ccc;color:#fff;font-weight:600;font-size:.95rem;text-decoration:none;
       padding:.5rem .9rem;border-radius:5px;box-shadow:1px 2px 3px #404040;line-height:1}
.nav a:hover{background:#0079b3;text-decoration:none}
.logo-pill{position:absolute;top:6px;left:50%;transform:translateX(-50%);
           background:#fff;border-radius:15% / 50%;box-shadow:2px 3px 6px #666;
           padding:.6rem 1.5rem;display:flex;align-items:center;gap:1rem;z-index:2}
.logo-pill img{height:58px;width:auto;display:block}
.logo-pill .moe{height:66px}

main{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:.4rem 0 1rem}

h1{color:#16365e;font-size:1.7rem;font-weight:700;margin-bottom:1rem}
h2{color:#1a4e7a;font-size:1.25rem;font-weight:600;margin-bottom:.7rem}

.card{background:#fff;border-radius:18px;box-shadow:0 6px 22px rgba(10,60,90,.12);
      padding:1.5rem 1.8rem;margin-bottom:1.2rem}

.btn{display:inline-block;padding:.6rem 1.3rem;border:none;border-radius:8px;cursor:pointer;
     font-family:'Poppins',sans-serif;font-weight:600;font-size:.92rem;text-decoration:none;
     background:linear-gradient(180deg,#1ba0db,#0b82bd);color:#fff;box-shadow:0 2px 5px rgba(11,130,189,.35);
     transition:filter .15s}
.btn:hover{filter:brightness(1.06);text-decoration:none;color:#fff}
.btn-green{background:linear-gradient(90deg,#377d3f 0%,#158f23 35%,#36bd46 100%);box-shadow:0 2px 5px rgba(21,143,35,.35)}
.btn-orange{background:linear-gradient(180deg,#f7a83a,#ef6c00)}
.btn-grey{background:#6c8794;box-shadow:none}

.form-group{margin-bottom:1rem}
label{display:block;font-weight:600;margin-bottom:.3rem;color:#2c4a5e;font-size:.85rem}
input,select,textarea{width:100%;padding:.6rem .8rem;border:1.5px solid #cfe0ee;border-radius:8px;
     font-family:'Poppins',sans-serif;font-size:.92rem;background:#fafdff;color:#212529}
input:focus,select:focus,textarea:focus{outline:none;border-color:#1fa0d8;background:#fff}

table{width:100%;border-collapse:collapse;font-size:.9rem}
th{background:#eaf6fd;color:#15557e;padding:.7rem;text-align:left;border-bottom:2px solid #d3e9f6}
td{padding:.7rem;border-bottom:1px solid #eef4f9;vertical-align:middle}
tr:hover td{background:#f7fcff}

.msg{padding:.7rem 1rem;border-radius:8px;margin-bottom:1rem;font-size:.9rem}
.msg-error{background:#ffebee;color:#c62828;border:1px solid #ef9a9a}
.msg-success{background:#e8f5e9;color:#2e7d32;border:1px solid #a5d6a7}
.msg-info{background:#e3f2fd;color:#1565c0;border:1px solid #90caf9}
.msg-warning{background:#fff8e1;color:#ef6c00;border:1px solid #ffe082}

footer{background:#006d9f url('home/border.png') repeat 50% 50% / 160px 48px;
       color:#dbf3ff;font-weight:700;text-align:center;padding:1rem;line-height:1.7;font-size:.88rem}
footer a{color:#dbf3ff}

@media (max-width:992px){
  .container{padding:1.1rem 1.1rem 2rem}
  .logo-pill{position:static;transform:none;margin:.8rem auto 0;width:max-content;max-width:100%;justify-content:center}
  .topbar,.topbar.nonav{min-height:0}
  main{padding-top:1rem}
}
@media (max-width:600px){
  .logo-pill img{height:44px}.logo-pill .moe{height:50px}
  .card{padding:1.1rem 1rem}
}

/* ===== logged-in student: LEFT SIDEBAR layout (matches the live /student/* pages) ===== */
.shell{display:flex;min-height:100vh;background:#c1e2f3}
.side-bar{width:230px;flex-shrink:0;background:#c1e2f3;position:relative;display:flex;
          flex-direction:column;padding-top:84px;
          box-shadow:inset -22px 0 20px -22px rgba(3,55,85,.55)}
.menu{display:flex;flex-direction:column;gap:2px}
.menu-link{display:flex;align-items:center;gap:.7rem;padding:.72rem 1rem;color:#12303f;
           font-weight:600;font-size:1rem;border-radius:0 6px 6px 0;text-decoration:none;
           transition:background .12s}
.menu-link i{width:20px;text-align:center;font-size:1rem;flex-shrink:0}
.menu-link:hover{background:rgba(255,255,255,.5);text-decoration:none;color:#12303f}
.menu-link.active{background:#008ccc;color:#fff;box-shadow:0 3px 7px rgba(0,80,120,.35)}
.menu-link.active:hover{background:#008ccc;color:#fff}
.side-toggle{margin:auto 0 26px;width:34px;height:34px;border:none;border-radius:0 8px 8px 0;
             background:#0f88c4;color:#fff;cursor:pointer;font-size:.9rem;
             box-shadow:1px 2px 4px rgba(0,0,0,.3)}

.main-card{flex:1;min-width:0;display:flex;flex-direction:column;
           background:linear-gradient(145deg,#e0f2f9 0%,#8ed8f8 35%,#32ade8 100%);
           margin:10px 10px 0 0;border-radius:30px;overflow:hidden}
.topuser{position:relative;min-height:130px;padding:1.1rem 1.6rem 0}
.main-card .logo-pill{position:absolute;top:14px;left:50%;transform:translateX(-50%)}
.main-card main{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:.4rem 1.4rem 1.4rem}

/* user dropdown — pure CSS via <details>/<summary> (CSP-safe, no inline handlers) */
.user-menu{position:absolute;top:26px;right:24px;z-index:20}
.user-menu summary{list-style:none;display:flex;align-items:center;gap:.55rem;cursor:pointer;
                   background:#008ccc;border:1px solid rgba(255,255,255,.9);border-radius:6px;
                   padding:.35rem .7rem;color:#fff;font-weight:700;font-size:.92rem;
                   box-shadow:0 2px 5px rgba(0,60,90,.3)}
.user-menu summary::-webkit-details-marker{display:none}
.user-menu summary::marker{content:''}
.user-menu summary img,.user-menu .uava{width:30px;height:30px;border-radius:50%;object-fit:cover;
                   background:#fff;display:flex;align-items:center;justify-content:center;color:#008ccc}
.user-drop{position:absolute;right:0;margin-top:.45rem;background:#fff;border-radius:10px;min-width:180px;
           box-shadow:0 8px 24px rgba(10,60,90,.22);overflow:hidden}
.user-drop a{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;color:#15557e;
             font-weight:600;font-size:.9rem}
.user-drop a:hover{background:#eaf6fd;text-decoration:none}
.user-drop a i{width:18px;text-align:center}

/* collapsed sidebar (toggle) */
.shell.collapsed .side-bar{width:62px}
.shell.collapsed .menu-link span{display:none}
.shell.collapsed .menu-link{justify-content:center;padding:.72rem 0;border-radius:0}
.shell.collapsed .side-toggle i{transform:rotate(180deg)}

@media (max-width:860px){
  .shell{flex-direction:column;min-height:0}
  .side-bar{width:100%!important;flex-direction:row;align-items:center;overflow-x:auto;
            padding:6px 8px;gap:4px;box-shadow:0 4px 10px rgba(3,55,85,.18)}
  .menu{flex-direction:row}
  .menu-link{white-space:nowrap;border-radius:8px;padding:.5rem .8rem;font-size:.86rem}
  .menu-link.active{border-radius:8px}
  .side-toggle{display:none}
  .main-card{margin:8px}
  .main-card .logo-pill{position:static;transform:none;margin:.6rem auto 0}
  .topuser{min-height:0;display:flex;flex-direction:column-reverse;align-items:center;gap:.7rem;padding-top:.6rem}
  .user-menu{position:static;align-self:center}
  .user-drop{left:50%;right:auto;transform:translateX(-50%)}
}