/* ============================================================
   merciboku — mb-portaal.css (v119)
   Stijllaag naar het ontwerp uit het reclamefilmpje
   (ontwerp-leerkrachtportaal/leerkrachtportaal-mockup.html).
   PUUR VISUEEL: geen gedrag, geen structuur, geen id's.
   Weghalen = de <link>-regel verwijderen; alles werkt dan
   exact zoals voorheen, in de oude stijl.
   ============================================================ */

/* ---- zachtere vensters (ontwerp: radius 26, diepe paarse schaduw) ---- */
.card{
  border-radius:26px !important;
  box-shadow:0 30px 80px rgba(58,12,163,.12) !important;
  border:1px solid #e6e3f5 !important;
}

/* ---- code-pills in de klaskop (🏫 schoolcode · 🔑 klascode) ---- */
#detailCard b.code{
  background:#f3f1ff; border:1px solid #e0daf7; border-radius:999px;
  padding:4px 14px; color:#3a0ca3; font-size:.85rem;
}

/* ---- hoofdtabbladen van de klas: echte tabbladenbalk ---- */
#detailCard > .tabs{
  gap:5px; border-bottom:2px solid #eee9fa; padding-bottom:0;
  flex-wrap:wrap; margin-top:16px;
}
#detailCard > .tabs button{
  flex:0 1 auto; min-width:0;
  background:none; border:2px solid transparent; border-bottom:none;
  border-radius:14px 14px 0 0; padding:11px 17px;
  color:#5a5f78; font-size:.88rem; position:relative; top:2px;
}
#detailCard > .tabs button:hover{ color:#3a0ca3; }
#detailCard > .tabs button.on{
  background:#f6f3ff; color:#3a0ca3; border-color:#e6dffb; font-weight:700;
}

/* ---- ouderportaal: zelfde tabbladenbalk voor de navigatie ---- */
.navbar{
  display:flex; gap:5px; flex-wrap:wrap;
  border-bottom:2px solid #eee9fa; padding-bottom:0; margin-bottom:14px;
}
.navbar .navbtn{
  background:none; border:2px solid transparent; border-bottom:none;
  border-radius:14px 14px 0 0; padding:11px 17px;
  color:#5a5f78; font-size:.88rem; position:relative; top:2px; font-weight:400;
}
.navbar .navbtn:hover{ color:#3a0ca3; }
.navbar .navbtn.prim{
  background:#f6f3ff; color:#3a0ca3; border-color:#e6dffb; font-weight:700;
}

/* ---- rijen (klassen, lijsten, thema's, bibliotheek): zachter kader ---- */
.lcard{
  border-radius:16px !important; border-color:#ece9fb !important;
}

/* ---- knopjes: één ronde pill-taal (zoals de pillen in het ontwerp) ---- */
.iconbtn{ border-radius:999px !important; }
.stbtn{ border-radius:999px !important; }

/* ---- invulvelden en keuzelijsten: zachtere hoeken ---- */
input:not([type=checkbox]):not([type=radio]), select, textarea{
  border-radius:12px;
}

/* ---- grote actieknoppen ---- */
.btn{ border-radius:14px !important; }

/* ---- beheersing: de bolletjes-legende iets groter en rustiger ---- */
#paneBest table{ font-size:1rem; }

/* ---- klasnaam groter, zoals in het ontwerp ---- */
#detailCard #dName{ font-size:1.35rem; }