/* PHASE 8C — responsive/mobile + sidebar + smart operational refresh */

/* Admin sidebar: keep every item reachable and footer visible */
.tl-sidebar{
  height:100dvh!important;
  max-height:100dvh!important;
  overflow:hidden!important;
}
.tl-sidebar-brand,.tl-sidebar-label{flex:0 0 auto}
.tl-sidebar-nav{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-inline-end:.2rem;
  scrollbar-width:thin;
}
.tl-sidebar-nav::-webkit-scrollbar{width:6px}
.tl-sidebar-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:999px}
.tl-sidebar>.mt-auto{
  flex:0 0 auto!important;
  margin-top:.75rem!important;
  padding-top:.75rem!important;
  background:inherit;
}
.tl-sidebar-nav .nav-link{flex:0 0 auto}

/* Portal header desktop */
.tl8c-portal-bar{
  min-height:64px;
  display:flex;
  align-items:center;
  gap:1rem;
  padding-top:.5rem;
  padding-bottom:.5rem;
}
.tl8c-portal-brand{display:flex;align-items:center;gap:.55rem;flex:0 0 auto}
.tl8c-portal-menu{display:flex;align-items:center;gap:1rem;flex:1 1 auto;min-width:0}
.tl8c-portal-links{display:flex;align-items:center;gap:.25rem;flex:1 1 auto;min-width:0}
.tl8c-portal-account{display:flex;align-items:center;gap:.55rem;flex:0 0 auto}
.tl8c-portal-toggle{
  display:none;
  width:42px;height:42px;border:1px solid var(--tl-border);border-radius:12px;
  background:#fff;color:var(--tl-green);font-size:1.25rem;align-items:center;justify-content:center
}

/* General responsive safety */
img,video,iframe{max-width:100%}
.table-responsive{max-width:100%}
.tl-card,.tl-hero,.tl-auth-card{max-width:100%}
.form-control,.form-select,.btn{min-height:40px}
.modal-dialog{max-width:min(94vw,900px)}
.tl-page{overflow-x:hidden}

/* Tablet */
@media (max-width:1199.98px){
  .tl-page{padding-inline:1rem!important}
  .tl-page-head{gap:1rem;align-items:flex-start!important}
  .tl-stat,.tl-control-stat{min-height:118px!important}
  .tl-class-card{grid-template-columns:minmax(100px,.8fr) minmax(180px,1.4fr) auto!important}
}

/* Mobile/tablet portal menu */
@media (max-width:991.98px){
  .tl8c-portal-bar{position:relative;min-height:58px;gap:.55rem}
  .tl8c-portal-brand{max-width:calc(100% - 54px)}
  .tl8c-portal-brand .tl-brand-logo{max-height:38px!important}
  .tl8c-portal-toggle{display:inline-flex;margin-inline-start:auto;flex:0 0 auto}
  .tl8c-portal-menu{
    display:none;
    position:absolute;
    top:calc(100% + 1px);
    inset-inline:0;
    margin-inline:.75rem;
    padding:.75rem;
    border:1px solid var(--tl-border);
    border-radius:0 0 18px 18px;
    background:#fff;
    box-shadow:0 16px 34px rgba(10,35,28,.14);
    flex-direction:column;
    align-items:stretch;
    z-index:1060
  }
  .tl8c-portal-menu.open{display:flex}
  .tl8c-portal-links{display:grid!important;grid-template-columns:1fr 1fr;gap:.45rem;width:100%}
  .tl8c-portal-links .nav-link{
    text-align:center;
    border:1px solid var(--tl-border);
    border-radius:12px;
    padding:.65rem .5rem;
    white-space:normal!important;
  }
  .tl8c-portal-account{
    width:100%;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:.5rem;
    padding-top:.7rem;
    border-top:1px solid var(--tl-border)
  }
  .tl8c-portal-account form,.tl8c-portal-account button{width:100%}
  .tl-portal-nav nav{overflow:visible!important;max-width:none!important}

  .tl-classroom-grid{grid-template-columns:1fr!important}
  .tl-classroom-panel{max-height:320px}
  .tl-jaas-frame,.tl7ga-admin-jaas{height:min(68vh,620px)!important}
  .tl-resource-panel{width:min(94vw,620px)!important}
}

/* Phones */
@media (max-width:575.98px){
  html{font-size:15px}
  .container-fluid.px-3,.container-fluid.px-lg-4{padding-inline:.7rem!important}
  .tl8c-portal-links{grid-template-columns:1fr}
  .tl8c-portal-menu{margin-inline:.4rem}
  .tl-page{padding:.75rem!important}
  .tl-page-head{flex-direction:column!important}
  .tl-page-head>.d-flex,.tl-page-head .btn{width:100%}
  .tl-page-head>.d-flex{display:grid!important;grid-template-columns:1fr!important}
  .tl-card-header{gap:.65rem;flex-wrap:wrap}
  .tl-card-body{padding:1rem!important}
  .tl-hero{padding:1.1rem!important;border-radius:18px!important}
  .tl-hero h1{font-size:1.55rem!important}
  .tl-class-card{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:.65rem!important;
    padding:1rem!important
  }
  .tl-class-card .tl-time{text-align:start!important}
  .tl-private-card{gap:.75rem!important}
  .tl-private-card>.d-flex{width:100%;flex-wrap:wrap}
  .tl-private-card .btn{width:100%}
  .tl-student-classroom-bar,.tl-teacher-classroom-bar{
    align-items:flex-start!important;
    flex-direction:column!important
  }
  .tl-student-classroom-bar>.d-flex,.tl-teacher-classroom-bar>.d-flex{width:100%}
  .tl-student-classroom-bar .btn,.tl-teacher-classroom-bar .btn{flex:1 1 auto}
  .tl-student-policy-strip{display:grid!important;grid-template-columns:1fr!important}
  .table-responsive table{min-width:720px}
  .tl-topbar{padding-inline:.75rem!important}
  .tl-topbar-kicker{display:none}
}

/* Small admin sidebar */
@media (max-width:991.98px){
  .tl-sidebar{width:min(310px,88vw)!important;padding:1rem .75rem!important}
  .tl-sidebar-nav .nav-link{padding:.65rem .7rem}
}