/* =====================================================================
   HJ ACADEMY — admin panel + sign-in.
   Loads after site.css and reuses its brand tokens (--brand, --accent,
   --ink, --blush) — the logo's jade green on near-black.
   Layout: fixed sidebar + sticky topbar on desktop; the sidebar becomes a
   slide-in drawer below 1024px.
   ===================================================================== */

:root{
  --sidebar-w: 254px;
  --topbar-h: 62px;
  --admin-bg: #F4F8F6;          /* page ground, faintly minted */
  --admin-surface: #FFFFFF;
  --admin-line: #DDE8E3;
  --admin-muted: #67736D;
  --admin-ink: #121A16;
  --sidebar-bg: #0E1512;        /* the logo's black, with a green cast */
  --sidebar-ink: rgba(255,255,255,.70);
  /* Semantic colours stay separate from the brand green so "saved" never
     reads as "this is the brand". Success is a deeper, bluer green. */
  --ok:   #1F7A4D; --ok-bg:   #E2F3EA; --ok-line:   #A9D7BF;
  --warn: #8A5D12; --warn-bg: #FAF0DC; --warn-line: #E6D2A6;
  --err:  #AD3B34; --err-bg:  #FBEAE9; --err-line:  #E9B7B2;
}

/* ==================================================== sign-in screens */
.auth-body{
  min-height:100vh; margin:0;
  background:
    radial-gradient(70% 70% at 10% 10%, rgba(62,180,137,.20) 0%, rgba(62,180,137,0) 60%),
    linear-gradient(160deg, var(--blush, #F1FAF6) 0%, #FFFFFF 60%);
  display:flex; align-items:center; justify-content:center;
  padding:32px 20px;
}
.auth-wrap{ width:100%; max-width:440px; }
.auth-card{
  background:#fff; border:1px solid var(--admin-line); border-radius:20px;
  padding:clamp(28px, 5vw, 42px);
  box-shadow:0 40px 80px -60px rgba(14,21,18,.5);
}
.auth-logo{ display:inline-flex; margin-bottom:26px; text-decoration:none; }
.auth-logo img{ height:32px; width:auto; }
.auth-sub{ color:var(--admin-muted); margin:10px 0 24px; font-size:.95rem; }

.auth-form{ display:grid; gap:18px; }
.field{ display:block; }
.field-label{
  display:block; font-size:.78rem; font-weight:600; letter-spacing:.06em;
  text-transform:uppercase; color:var(--admin-muted); margin-bottom:7px;
}
.field input[type=text],
.field input[type=email],
.field input[type=password],
.field input[type=number],
.field input[type=url],
.field select,
.field textarea{
  width:100%; padding:13px 14px; font:inherit; font-size:.97rem; color:var(--admin-ink);
  background:#fff; border:1px solid #CFDDD7; border-radius:10px;
  transition:border-color .16s linear, box-shadow .16s linear;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--accent, #18815E);
  box-shadow:0 0 0 3px rgba(62,180,137,.26);
}
.field textarea{ min-height:120px; resize:vertical; line-height:1.55; }
.field-hint{ display:block; margin-top:6px; font-size:.82rem; color:var(--admin-muted); }

.field-with-button{ position:relative; display:block; }
.field-with-button input{ padding-right:74px; }
.reveal{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  border:0; background:none; cursor:pointer; padding:8px 10px;
  font-size:.82rem; font-weight:600; color:var(--accent, #18815E);
}
.otp-input{
  font-size:1.6rem !important; letter-spacing:.42em; text-align:center; font-weight:600;
}

.alert{ padding:12px 14px; border-radius:10px; font-size:.92rem; margin-bottom:18px; }
.alert-error{ background:var(--err-bg); border:1px solid var(--err-line); color:var(--err); }
.alert-success{ background:var(--ok-bg); border:1px solid var(--ok-line); color:var(--ok); }
.alert-warn{ background:var(--warn-bg); border:1px solid var(--warn-line); color:var(--warn); }
.alert ul{ margin:8px 0 0; padding-left:18px; }
.alert li{ margin-bottom:4px; }

.auth-actions{ display:flex; gap:18px; flex-wrap:wrap; margin-top:20px; }
.inline{ display:inline; }
.link-button{
  border:0; background:none; padding:0; cursor:pointer;
  font-size:.9rem; font-weight:500; color:var(--accent, #18815E); text-decoration:underline;
}
.auth-foot{ margin-top:22px; font-size:.9rem; color:var(--admin-muted); display:flex; gap:10px; flex-wrap:wrap; }
.auth-foot a{ color:var(--admin-muted); }
.auth-hint{ margin-top:20px; font-size:.84rem; color:var(--admin-muted); line-height:1.55; }
.auth-copyright{ text-align:center; margin-top:22px; font-size:.82rem; color:var(--admin-muted); }

/* ========================================================= admin shell */
.admin-body{
  margin:0; background:var(--admin-bg); color:var(--admin-ink);
  font-family:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size:14.5px; line-height:1.6;
}

.admin-layout{ display:flex; min-height:100vh; }

/* ------------------------------------------------------------ sidebar */
.admin-sidebar{
  position:fixed; inset:0 auto 0 0; width:var(--sidebar-w); z-index:60;
  background:var(--sidebar-bg); color:var(--sidebar-ink);
  display:flex; flex-direction:column;
  padding-top:env(safe-area-inset-top, 0px);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
  overflow-y:auto;
}
.sidebar-brand{
  border-left:3px solid var(--brand, #3EB489);
  display:flex; align-items:center; gap:10px;
  height:var(--topbar-h); padding-inline:18px; flex:0 0 auto;
  border-bottom:1px solid rgba(255,255,255,.08); text-decoration:none; color:#fff;
}
.sidebar-brand img{ height:26px; width:auto; }
.sidebar-brand strong{ font-size:1rem; letter-spacing:-.02em; }

.sidebar-nav{ padding:16px 12px 28px; }
.sidebar-group{
  font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.38); padding:18px 10px 8px;
}
.sidebar-link{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:9px; margin-bottom:2px;
  color:var(--sidebar-ink); text-decoration:none; font-size:.92rem;
  transition:background .15s linear, color .15s linear;
}
.sidebar-link:hover{ background:rgba(255,255,255,.07); color:#fff; }
.sidebar-link.is-active{
  background:var(--accent, #18815E); color:#fff; font-weight:500;
  box-shadow:inset 3px 0 0 var(--brand, #3EB489);
}
.sidebar-link .dot{
  width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.55; flex:0 0 auto;
}
.sidebar-link .badge{
  margin-left:auto; background:rgba(255,255,255,.14); color:#fff;
  border-radius:20px; padding:1px 8px; font-size:.72rem; font-variant-numeric:tabular-nums;
}
.sidebar-link.is-active .badge{ background:rgba(0,0,0,.2); }

/* ------------------------------------------------------------- topbar */
.admin-main{
  flex:1; min-width:0; margin-left:var(--sidebar-w);
  display:flex; flex-direction:column;
}
.admin-topbar{
  position:sticky; top:0; z-index:50;
  height:var(--topbar-h); flex:0 0 auto;
  background:rgba(255,255,255,.94); backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid var(--admin-line);
  display:flex; align-items:center; gap:14px; padding-inline:20px;
  padding-top:env(safe-area-inset-top, 0px);
}
.topbar-toggle{
  display:none; width:40px; height:40px; border:0; background:none; cursor:pointer; padding:9px;
}
.topbar-toggle span{ display:block; height:2px; background:var(--admin-ink); border-radius:2px; }
.topbar-toggle span + span{ margin-top:5px; }
.topbar-title{ font-size:1rem; font-weight:600; letter-spacing:-.01em; margin:0; }
.topbar-right{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.topbar-link{
  font-size:.86rem; color:var(--admin-muted); text-decoration:none; white-space:nowrap;
}
.topbar-link:hover{ color:var(--accent, #18815E); }
.topbar-user{
  display:flex; align-items:center; gap:9px; padding-left:12px;
  border-left:1px solid var(--admin-line);
}
.topbar-user .avatar{
  width:32px; height:32px; border-radius:50%; background:var(--brand, #3EB489);
  color:var(--ink-deep, #0E1512);
  display:grid; place-items:center; font-weight:700; font-size:.85rem; flex:0 0 auto;
}
.topbar-user small{ display:block; color:var(--admin-muted); font-size:.75rem; line-height:1.2; }
.topbar-user b{ font-size:.85rem; font-weight:600; }

.admin-content{ padding:24px 20px 56px; flex:1; }
.admin-content > .page-head{ margin-bottom:22px; }
.page-head h1{ font-size:1.5rem; font-weight:600; letter-spacing:-.02em; margin:0 0 6px; }
.page-head p{ color:var(--admin-muted); margin:0; max-width:70ch; }

.admin-scrim{
  position:fixed; inset:0; z-index:55; background:rgba(14,21,18,.45);
  opacity:0; transition:opacity .25s linear;
}
.admin-scrim.is-visible{ opacity:1; }

/* ---------------------------------------------------------- UI pieces */
.panel{
  background:var(--admin-surface); border:1px solid var(--admin-line);
  border-radius:14px; margin-bottom:20px;
}
.panel-head{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:16px 20px; border-bottom:1px solid var(--admin-line);
}
.kpi.accent{ border-top:3px solid var(--brand, #3EB489); }
.panel-head h2{ font-size:1rem; font-weight:600; margin:0; }
.panel-head .spacer{ margin-left:auto; }
.panel-body{ padding:20px; }
.panel-body > .field + .field{ margin-top:16px; }

.grid{ display:grid; gap:18px; }
.grid-2{ grid-template-columns:1fr; }
.grid-3{ grid-template-columns:1fr; }
.grid-4{ grid-template-columns:repeat(2, 1fr); }

.kpi{
  background:var(--admin-surface); border:1px solid var(--admin-line);
  border-radius:14px; padding:18px 18px 16px;
}
.kpi b{
  display:block; font-size:1.9rem; font-weight:600; letter-spacing:-.03em; line-height:1.1;
  font-variant-numeric:tabular-nums; margin-bottom:4px;
}
.kpi span{ font-size:.84rem; color:var(--admin-muted); }
.kpi.accent b{ color:var(--accent, #18815E); }

table.data{ width:100%; border-collapse:collapse; font-size:.9rem; }
table.data th{
  text-align:left; font-size:.72rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--admin-muted); font-weight:600; padding:10px 14px;
  border-bottom:1px solid var(--admin-line); white-space:nowrap;
}
table.data td{ padding:12px 14px; border-bottom:1px solid var(--admin-line); vertical-align:top; }
table.data tr:last-child td{ border-bottom:0; }
table.data tr:hover td{ background:#F7FBF9; }
.table-wrap{ overflow-x:auto; }

.tag{
  display:inline-block; padding:2px 9px; border-radius:20px;
  font-size:.74rem; font-weight:600; letter-spacing:.02em;
  background:#EAF1EE; color:var(--admin-muted);
}
.tag-ok{ background:var(--ok-bg); color:var(--ok); }
.tag-warn{ background:var(--warn-bg); color:var(--warn); }
.tag-err{ background:var(--err-bg); color:var(--err); }
.tag-accent{ background:var(--brand-tint, #E3F4EC); color:var(--accent, #18815E); }

.btn-row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.muted{ color:var(--admin-muted); }
.small{ font-size:.85rem; }
.mono{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.85em; }

.switch{ display:flex; align-items:flex-start; gap:12px; padding:14px 0; border-bottom:1px solid var(--admin-line); }
.switch:last-child{ border-bottom:0; }
.switch input[type=checkbox]{ width:20px; height:20px; margin-top:2px; accent-color:var(--accent, #18815E); flex:0 0 auto; }
.switch b{ display:block; font-size:.94rem; font-weight:600; }
.switch span{ display:block; font-size:.86rem; color:var(--admin-muted); }

/* -------------------------------------------------- repeater rows ----
   The editable list behind a section's cards or numbered chapters. */
.repeater{
  margin-top:20px; border:1px solid var(--admin-line); border-radius:12px;
  background:#FAFDFB; overflow:hidden;
}
.repeater-head{
  padding:12px 16px; border-bottom:1px solid var(--admin-line); background:#fff;
  display:flex; flex-direction:column; gap:3px;
}
.repeater-row{
  display:grid; gap:12px; grid-template-columns:1fr;
  padding:16px; border-top:1px solid var(--admin-line);
}
.repeater-row:first-of-type{ border-top:0; }
.repeater-num{
  font-weight:700; font-size:.92rem; color:var(--accent, #18815E);
  font-variant-numeric:tabular-nums; padding-top:24px;
}
.repeater-fields{ display:grid; gap:12px; }
.repeater-fields textarea{ min-height:76px; }

@media (min-width:700px){
  .repeater-row{ grid-template-columns:42px 1fr; gap:14px; }
  .repeater-fields{ grid-template-columns:minmax(180px, 1fr) 2fr; align-items:start; }
}

/* ------------------------------------------------------- image slots */
.slot-grid{ display:grid; gap:16px; grid-template-columns:1fr; }
.slot{
  background:var(--admin-surface); border:1px solid var(--admin-line);
  border-radius:14px; overflow:hidden; display:flex; flex-direction:column;
}
.slot-preview{
  aspect-ratio:16/10; background:
    repeating-linear-gradient(45deg, #E8F2EE 0 10px, #F5FAF8 10px 20px);
  display:grid; place-items:center; border-bottom:1px solid var(--admin-line);
}
.slot-preview img{ max-width:100%; max-height:100%; object-fit:contain; }
.slot-preview .empty{ color:var(--admin-muted); font-size:.82rem; }
.slot-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.slot-body h3{ font-size:.98rem; font-weight:600; margin:0; }
.slot-spec{
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size:.78rem; color:var(--accent, #18815E);
  background:var(--brand-tint, #E3F4EC); border-radius:8px; padding:8px 10px; line-height:1.5;
}
.slot-guide{ font-size:.84rem; color:var(--admin-muted); }
.slot form{ margin-top:auto; display:grid; gap:10px; }
.slot input[type=file]{
  width:100%; font-size:.85rem; padding:9px; border:1px dashed var(--brand-soft, #7ACCAB);
  border-radius:9px; background:#F7FBF9;
}

/* -------------------------------------------------------- responsive */
@media (min-width:700px){
  .grid-2{ grid-template-columns:repeat(2, 1fr); }
  .grid-4{ grid-template-columns:repeat(4, 1fr); }
  .slot-grid{ grid-template-columns:repeat(2, 1fr); }
  .admin-content{ padding-inline:26px; }
}
@media (min-width:1100px){
  .grid-3{ grid-template-columns:repeat(3, 1fr); }
  .slot-grid{ grid-template-columns:repeat(3, 1fr); }
}

@media (max-width:1023px){
  .admin-sidebar{ transform:translateX(-102%); box-shadow:20px 0 50px -40px rgba(14,21,18,.75); }
  .admin-sidebar.is-open{ transform:translateX(0); }
  .admin-main{ margin-left:0; }
  .topbar-toggle{ display:block; }
  body.sidebar-open{ overflow:hidden; }
  .topbar-user small{ display:none; }
}
@media (max-width:560px){
  .admin-content{ padding:18px 16px 48px; }
  .grid-4{ grid-template-columns:repeat(2, 1fr); }
  .topbar-link{ display:none; }
  .page-head h1{ font-size:1.25rem; }
}

/* ------------------------------------------------- case studies  v1.4 */
.cs-tag-picker{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.cs-tag-picker button{ border:0; cursor:pointer; font:inherit; font-size:.76rem; }
.cs-tag-picker button:hover{ background:var(--accent, #18815E); color:#fff; }
.cs-tag-picker button.is-on{ opacity:.45; }

.cs-metric-fields{ display:grid; gap:12px; grid-template-columns:1fr 1fr; }
.cs-metric-fields .field:first-child{ grid-column:1 / -1; }

.cs-admin-gallery{ list-style:none; margin:0; padding:0; display:grid; gap:12px;
  grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); }
.cs-admin-gallery label{ display:block; cursor:pointer; border:1px solid var(--admin-line); border-radius:10px; overflow:hidden; background:#fff; }
.cs-admin-gallery img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.cs-admin-gallery span{ display:flex; align-items:center; gap:6px; padding:7px 9px; font-size:.82rem; color:var(--admin-muted); }
.cs-admin-gallery label:has(input:checked){ border-color:var(--err); }
.cs-admin-gallery label:has(input:checked) img{ opacity:.45; }

.cs-inline-form{ display:flex; gap:8px; align-items:center; }
.cs-inline-form input[type=text]{
  width:min(260px, 100%); padding:7px 10px; border:1px solid #CFDDD7; border-radius:8px; font:inherit; font-size:.9rem;
}

@media (min-width:700px){
  .cs-metric-fields{ grid-template-columns:2fr 1fr 1fr; }
  .cs-metric-fields .field:first-child{ grid-column:auto; }
}

/* ------------------------------------------------------ courses  v1.5 */
.admin-tabs{
  display:flex; gap:4px; overflow-x:auto; margin:0 0 20px; padding:4px;
  background:var(--admin-surface); border:1px solid var(--admin-line); border-radius:12px;
  scrollbar-width:none;
}
.admin-tabs::-webkit-scrollbar{ display:none; }
.admin-tabs a{
  flex:0 0 auto; padding:9px 14px; border-radius:9px; font-size:.88rem; font-weight:500;
  color:var(--admin-muted); text-decoration:none; white-space:nowrap;
}
.admin-tabs a:hover{ color:var(--admin-ink); background:#F1F7F4; }
.admin-tabs a.is-active{ background:var(--accent, #18815E); color:#fff; }

.is-off{ opacity:.6; }
.mini-check{ display:inline-flex; align-items:center; gap:6px; font-size:.84rem; color:var(--admin-muted); white-space:nowrap; }
.mini-check input[type=checkbox]{ width:17px; height:17px; accent-color:var(--accent, #18815E); }
.num-sm{ width:64px !important; }
.admin-body input[type=number], .admin-body select{ font:inherit; }

/* one-line editable rows (categories) */
.admin-rows{ display:grid; gap:0; }
.admin-row{
  display:grid; gap:10px; grid-template-columns:1fr; align-items:end;
  padding:14px 0; border-bottom:1px solid var(--admin-line);
}
.admin-row:first-child{ padding-top:0; }
.admin-row:last-child{ border-bottom:0; padding-bottom:0; }
.admin-row.is-new{ background:#F7FBF9; margin:0 -20px -20px; padding:16px 20px 20px; border-radius:0 0 14px 14px; }
.admin-row-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.admin-row .field input, .admin-row .field select{ width:100%; }

/* curriculum */
.curr-admin-head{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; align-items:center; }
.curr-admin-head > *:not(.curr-admin-num):not(.curr-admin-title){ grid-column:2; }
.curr-admin-num{
  display:grid; place-items:center; width:28px; height:28px; border-radius:50%;
  background:var(--brand-tint, #E3F4EC); color:var(--accent, #18815E); font-weight:700; font-size:.85rem;
}
.curr-admin-head input[type=text], .curr-admin-head textarea, .curr-admin-head select, .curr-admin-head input[type=number]{
  padding:8px 10px; border:1px solid #CFDDD7; border-radius:8px; font:inherit; font-size:.9rem; background:#fff;
}
.curr-admin-title{ font-weight:600 !important; font-size:1rem !important; width:100%; }
.curr-admin-desc{ width:100%; min-height:0; resize:vertical; }

.lesson-rows{ display:grid; }
.lesson-row{
  display:grid; gap:8px; align-items:center;
  grid-template-columns:56px minmax(0,1fr);
  padding:10px 16px; border-top:1px solid var(--admin-line);
}
.lesson-row > *:nth-child(n+6){ grid-column:auto; }
.lesson-row input[type=text], .lesson-row input[type=number], .lesson-row select{
  width:100%; padding:7px 9px; border:1px solid #CFDDD7; border-radius:8px; font:inherit; font-size:.88rem; background:#fff;
}
.lesson-title-cell{ display:grid; gap:4px; min-width:0; }
.lesson-desc{ font-size:.8rem !important; color:var(--admin-muted); border-style:dashed !important; }
.lesson-row.is-new{ background:#F7FBF9; }
.lesson-row-head{ display:none; font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--admin-muted); }
.lesson-actions{ display:flex; gap:6px; }

.plan-admin-grid{ display:grid; gap:0 20px; grid-template-columns:1fr; }

@media (min-width:700px){
  .admin-row-cat{ grid-template-columns:minmax(0,2fr) minmax(0,1.3fr) 80px 110px auto; }
}
@media (min-width:1100px){
  .curr-admin-head{ grid-template-columns:28px minmax(0,1fr) 64px auto 110px auto auto; }
  .curr-admin-head > *:not(.curr-admin-num):not(.curr-admin-title){ grid-column:auto; }
  .curr-admin-desc{ grid-column:2 / -1 !important; }
  .lesson-row, .lesson-row-head{ grid-template-columns:56px minmax(0,1fr) 130px 72px 64px 72px 150px; }
  .lesson-row-head{ display:grid; padding-top:8px; padding-bottom:8px; background:#FAFDFB; }
  .plan-admin-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}

/* ==================================================== page builder (v1.6) */
.pb-section{ scroll-margin-top:calc(var(--topbar-h) + 16px); }
.pb-section.is-off{ opacity:.72; border-style:dashed; }
.pb-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.pb-grid{ display:grid; grid-template-columns:1fr; gap:22px; }
.pb-grid.has-image{ grid-template-columns:minmax(0,1fr) 300px; }
.pb-fields{ min-width:0; }
.pb-image{ min-width:0; }
.pb-preview{
  position:relative; aspect-ratio:6/5; border-radius:14px; overflow:hidden;
  background:var(--blush, #F1FAF6); border:1px solid var(--admin-line); margin-bottom:12px;
}
.pb-preview img{ width:100%; height:100%; object-fit:cover; display:block; }
.pb-preview svg{ width:100%; height:100%; display:block; }
.pb-ph-note{
  position:absolute; left:10px; right:10px; bottom:10px; text-align:center;
  font-size:.76rem; font-weight:600; color:var(--admin-muted);
  background:rgba(255,255,255,.88); border-radius:999px; padding:5px 10px;
}
.pb-more{ margin-top:18px; border-top:1px solid var(--admin-line); padding-top:14px; }
.pb-more > summary{ cursor:pointer; font-weight:600; color:var(--accent, #18815E); font-size:.92rem; }
.pb-more[open] > summary{ margin-bottom:14px; }
.mono-area{ font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.86rem; line-height:1.6; }
@media (max-width:1100px){ .pb-grid.has-image{ grid-template-columns:1fr; } .pb-preview{ max-width:360px; } }

/* ==================================================== enquiries (v1.6) */
.enq-grid{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:22px; align-items:start; }
.enq-message{ white-space:normal; line-height:1.65; background:var(--admin-bg); border:1px solid var(--admin-line); border-radius:12px; padding:14px 16px; }
.enq-contact p{ margin:0 0 8px; word-break:break-word; }
.enq-timeline{ list-style:none; margin:0; padding:0 0 0 18px; border-left:2px solid var(--admin-line); }
.enq-timeline li{ position:relative; padding:0 0 18px 6px; }
.enq-timeline li::before{ content:""; position:absolute; left:-25px; top:4px; width:12px; height:12px; border-radius:50%; background:#fff; border:2px solid var(--accent, #18815E); }
.enq-timeline li:last-child{ padding-bottom:0; }
.enq-when{ font-size:.78rem; color:var(--admin-muted); margin-bottom:3px; }
.enq-search{ padding:8px 12px; border:1px solid var(--admin-line); border-radius:999px; font:inherit; font-size:.88rem; min-width:200px; }
tr.enq-new td:first-child{ box-shadow:inset 3px 0 0 var(--accent, #18815E); }
@media (max-width:1024px){ .enq-grid{ grid-template-columns:1fr; } }
/* placeholder art inside the builder preview (same look as the public pages) */
.pb-preview{ background:linear-gradient(145deg, #E3F4EC 0%, #F4FBF8 100%); }
.pb-preview .ph-blob{ fill:#fff; opacity:.45; }
.pb-preview .ph-blob-b{ opacity:.3; }
.pb-preview .ph-card{ fill:rgba(255,255,255,.72); stroke:rgba(24,129,94,.18); stroke-width:2; }
.pb-preview .ph-icon{ fill:none; stroke:var(--accent, #18815E); stroke-width:7; stroke-linecap:round; stroke-linejoin:round; }
.pb-preview .ph-dot{ fill:var(--brand, #3EB489); }

/* ==================================================== assessments, activities, question bank (v1.7) */
.help-box{ background:var(--admin-surface); border:1px solid var(--admin-line); border-left:4px solid var(--accent, #18815E);
  border-radius:12px; padding:14px 18px; margin:0 0 18px; font-size:.9rem; line-height:1.6; color:var(--admin-ink); max-width:95ch; }
.help-box a{ font-weight:600; }
.check-grid{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:8px; }
.act-steps{ display:grid; gap:14px; margin-top:16px; }
.act-step{ display:flex; gap:14px; align-items:flex-start; padding:14px; border:1px solid var(--admin-line); border-radius:12px; background:var(--admin-bg); }
.act-step > div{ min-width:0; }
.act-step b{ display:block; margin-bottom:8px; }
.act-step textarea{ width:100%; padding:12px 14px; font:inherit; font-size:.93rem; border:1px solid var(--admin-line); border-radius:10px; background:#fff; }
.act-step-num{ flex:none; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--accent, #18815E); color:#fff; font-weight:700; font-size:.85rem; }
.cp-admin{ display:grid; gap:8px; padding:12px 16px 16px; border-top:1px dashed var(--admin-line); }
.cp-admin-end{ border:1px dashed var(--admin-line); border-radius:14px; margin:0 0 20px; background:var(--admin-surface); }
.cp-chip{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; padding:9px 12px; border-radius:10px; background:var(--admin-bg);
  border:1px solid var(--admin-line); text-decoration:none; color:var(--admin-ink); font-size:.88rem; }
.cp-chip:hover{ border-color:var(--accent, #18815E); }
.cp-chip.is-gate{ background:var(--brand-tint, #E3F4EC); border-color:rgba(24,129,94,.3); }
.cp-chip .muted{ font-size:.8rem; }
.qb-summary .panel-body{ display:flex; flex-wrap:wrap; gap:14px 34px; }
.qb-summary .panel-body > div{ display:grid; gap:2px; }
.qb-note{ margin:0 0 16px; max-width:95ch; }
.qb-q.is-off{ opacity:.65; }
.qb-options{ margin-top:14px; display:grid; gap:8px; max-width:720px; }
.qb-opt{ display:grid; grid-template-columns:minmax(0,1fr) 84px; gap:10px; align-items:center; }
.qb-opt-head{ font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--admin-muted); }
.qb-opt input[type=text], .qb-opt input[type=number], .qb-band input{
  width:100%; padding:9px 12px; font:inherit; font-size:.92rem; border:1px solid var(--admin-line); border-radius:9px; background:#fff; }
.qb-opt .mini-check{ justify-content:center; }
.qb-band{ display:grid; grid-template-columns:90px 90px minmax(0,1fr) minmax(0,2fr) 50px; gap:10px; align-items:center; margin-bottom:8px; }
.qb-band-head{ font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--admin-muted); }
.sub-files{ list-style:none; margin:0 0 14px; padding:0; display:grid; gap:8px; }
.sub-files li{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border:1px solid var(--admin-line); border-radius:10px; }
.sub-files a{ display:inline-flex; align-items:center; gap:10px; font-weight:600; word-break:break-all; }
.sub-ext{ flex:none; font-size:.68rem; font-weight:700; padding:4px 7px; border-radius:6px; background:var(--brand-tint, #E3F4EC); color:var(--accent, #18815E); }
[hidden]{ display:none !important; }
@media (max-width:700px){
  .qb-band{ grid-template-columns:1fr 1fr; }
  .qb-band-head{ display:none; }
  .act-step{ flex-direction:column; }
}
.attempt-opts{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.attempt-opts li{ padding:8px 12px; border:1px solid var(--admin-line); border-radius:9px; font-size:.92rem; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.attempt-opts li.is-picked{ border-color:var(--accent, #18815E); background:var(--brand-tint, #E3F4EC); font-weight:600; }

/* ==================================================== learners (v1.8) */
.lrn-id{ display:flex; align-items:center; gap:16px; margin-top:8px; }
.lrn-id h1{ margin:0; }
.lrn-id p{ margin:4px 0 0; }
.lrn-row{ display:flex; align-items:center; gap:10px; }
.ac-avatar{ flex:none; width:40px; height:40px; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:var(--brand-tint, #E3F4EC); color:var(--accent, #18815E); font-weight:700; font-size:.85rem; }
.ac-avatar img{ width:100%; height:100%; object-fit:cover; }
.lrn-id .ac-avatar{ width:64px; height:64px; font-size:1.3rem; }
.lrn-dl{ display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:14px 20px; margin:0; }
.lrn-dl dt{ font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--admin-muted); }
.lrn-dl dd{ margin:3px 0 0; font-size:.93rem; }
.lrn-enrol-row{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.lrn-enrol-row select, .lrn-enrol-row input{ padding:6px 8px; border:1px solid var(--admin-line); border-radius:8px; font:inherit; font-size:.84rem; }
