.auth-body{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg,var(--deep-dark) 0%, var(--deep) 65%, var(--teal) 140%);
  padding:24px;
}
.auth-card{
  background:#fff; border-radius:var(--radius-md); box-shadow:var(--shadow);
  padding:40px 36px; width:100%; max-width:400px;
}
.auth-brand{text-align:center; margin-bottom:24px;}
.auth-brand img{height:48px; margin:0 auto 12px;}
.auth-brand h1{font-size:1.25rem; margin-bottom:.1em;}
.auth-note{text-align:center; font-size:.82rem; margin-top:18px;}

/* ---------- Dashboard shell ---------- */
.dash-body{background:var(--paper); margin:0;}
.dash-shell{display:flex; min-height:100vh;}

.dash-sidebar{
  width:250px; flex-shrink:0; background:var(--deep-dark); color:#DCEAE8;
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto;
}
.dash-brand{
  display:flex; align-items:center; gap:10px; padding:22px 20px;
  font-family:'Newsreader',serif; font-weight:600; font-size:1.05rem; color:#fff;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.dash-brand img{height:32px;}
.dash-nav{display:flex; flex-direction:column; padding:16px 12px; gap:2px; flex:1;}
.dash-tab{
  padding:12px 14px; border-radius:var(--radius-sm); color:#B9D0CC; font-weight:500; font-size:.94rem;
  transition:background .15s ease, color .15s ease;
}
.dash-tab:hover{background:rgba(255,255,255,0.08); color:#fff;}
.dash-tab.active{background:var(--teal); color:#fff;}
.dash-logout{margin-top:auto; border-top:1px solid rgba(255,255,255,0.12); margin-top:12px; padding-top:16px;}

.dash-main{flex:1; min-width:0;}
.dash-topbar{
  height:64px; background:#fff; border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:16px; padding:0 24px; position:sticky; top:0; z-index:10;
}
.dash-menu-btn{display:none; background:none; border:none; font-size:1.3rem; cursor:pointer; color:var(--ink);}
.dash-topbar-title{font-weight:600; color:var(--deep-dark);}
.dash-topbar-user{margin-left:auto; font-size:.9rem; color:var(--ink-soft);}

.dash-content{padding:32px; max-width:1100px;}
.dash-panel{display:none;}
.dash-panel.active{display:block;}

@media (max-width:920px){
  .dash-sidebar{
    position:fixed; left:0; top:0; z-index:200; transform:translateX(-100%);
    transition:transform .2s ease; box-shadow:0 0 40px rgba(0,0,0,.25);
  }
  .dash-sidebar.open{transform:translateX(0);}
  .dash-menu-btn{display:block;}
  .dash-content{padding:20px;}
}

/* ---------- Stat cards ---------- */
.stat-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-md); padding:20px;}
.stat-label{display:block; font-size:.8rem; color:var(--ink-soft); margin-bottom:8px;}
.stat-value{display:block; font-family:'Newsreader',serif; font-size:1.5rem; color:var(--deep-dark);}

/* ---------- Badges ---------- */
.badge{display:inline-block; padding:4px 11px; border-radius:20px; font-size:.78rem; font-weight:600;}
.badge-success{background:#E4F3EC; color:#1F6B47;}
.badge-warn{background:#FBF1DE; color:#9A6A0C;}
.badge-danger{background:#FBEAE6; color:var(--danger);}
.badge-neutral{background:var(--paper-alt); color:var(--ink-soft);}

/* ---------- Tables ---------- */
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius-md); background:#fff;}
.dash-table{width:100%; border-collapse:collapse; font-size:.92rem;}
.dash-table th, .dash-table td{padding:12px 16px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap;}
.dash-table th{background:var(--paper-alt); font-weight:600; color:var(--ink);}
.dash-table tbody tr:last-child td{border-bottom:none;}
.dash-table tbody tr:hover{background:var(--paper);}

/* ---------- Attendance ---------- */
.attendance-box{background:#fff; border:1px solid var(--line); border-radius:var(--radius-md); padding:8px 24px; max-width:520px;}
.attendance-row{display:flex; align-items:center; justify-content:space-between; padding:20px 0; border-bottom:1px solid var(--line);}
.attendance-row:last-child{border-bottom:none;}

/* ---------- Messages ---------- */
.dash-msg{margin-top:14px; font-size:.9rem; color:var(--ink-soft);}
.dash-msg-success{color:#1F6B47; font-weight:600;}
.dash-msg-error{color:var(--danger); font-weight:600;}

/* ---------- Product presentation (details/summary) ---------- */
.presentation-list{display:flex; flex-direction:column; gap:12px;}
.presentation-item{background:#fff; border:1px solid var(--line); border-radius:var(--radius-md); padding:0;}
.presentation-item summary{
  cursor:pointer; padding:18px 22px; display:flex; align-items:center; justify-content:space-between;
  font-weight:600; color:var(--deep-dark); list-style:none;
}
.presentation-item summary::-webkit-details-marker{display:none;}
.presentation-item[open] summary{border-bottom:1px solid var(--line);}
.presentation-body{padding:22px;}
.mr-notes{background:var(--teal-light); border-radius:var(--radius-sm); padding:14px 16px; margin-top:16px;}
.mr-notes h4{margin:0 0 .4em; font-family:'Inter',sans-serif; font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; color:var(--deep);}
.mr-notes p{margin:0; font-size:.92rem; color:var(--ink-soft);}

.filter-bar{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:20px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:14px;}
.filter-bar select, .filter-bar input{padding:9px 12px; border:1.5px solid var(--line); border-radius:var(--radius-sm); font-size:.9rem; font-family:inherit;}