/* ============================================================================
   SKILL HUB — DESIGN SYSTEM
   Trustworthy / premium education marketplace.
   Palette (5 colors): Indigo primary, Amber accent, Ink/Slate neutrals, Surface.
   Fonts (2 families): Plus Jakarta Sans (headings) + Inter (body).
   ============================================================================ */

:root {
  /* Brand */
  --sh-indigo-900: #1e1b4b;
  --sh-indigo-700: #3730a3;
  --sh-indigo-600: #4338ca;
  --sh-indigo-500: #4f46e5;
  --sh-indigo-100: #e0e7ff;
  --sh-indigo-50:  #eef2ff;

  --sh-amber-500: #f59e0b;
  --sh-amber-100: #fef3c7;

  /* Neutrals */
  --sh-ink:       #0f172a; /* slate-900 */
  --sh-slate-700: #334155;
  --sh-slate-500: #64748b;
  --sh-slate-400: #94a3b8;
  --sh-slate-300: #cbd5e1;
  --sh-slate-200: #e2e8f0;
  --sh-slate-100: #f1f5f9;
  --sh-slate-50:  #f8fafc;
  --sh-white:     #ffffff;

  /* Semantic tokens */
  --sh-primary:        var(--sh-indigo-600);
  --sh-primary-hover:  var(--sh-indigo-700);
  --sh-primary-soft:   var(--sh-indigo-50);
  --sh-accent:         var(--sh-amber-500);
  --sh-bg:             var(--sh-slate-50);
  --sh-surface:        var(--sh-white);
  --sh-text:           var(--sh-ink);
  --sh-text-muted:     var(--sh-slate-500);
  --sh-border:         var(--sh-slate-200);

  /* State colors */
  --sh-success:  #16a34a;
  --sh-success-soft: #dcfce7;
  --sh-warning:  #d97706;
  --sh-warning-soft: #fef3c7;
  --sh-danger:   #dc2626;
  --sh-danger-soft:  #fee2e2;
  --sh-info:     #0ea5e9;
  --sh-info-soft:    #e0f2fe;

  /* Typography */
  --sh-font-head: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  --sh-font-body: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;

  /* Radii & shadows */
  --sh-radius-sm: 8px;
  --sh-radius:    14px;
  --sh-radius-lg: 20px;
  --sh-radius-pill: 999px;
  --sh-shadow-sm: 0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.04);
  --sh-shadow:    0 4px 16px rgba(15,23,42,.08);
  --sh-shadow-lg: 0 12px 40px rgba(30,27,75,.14);

  /* Layout */
  --sh-container: 1200px;
  --sh-gutter: 24px;
  --sh-header-h: 72px;
  --sh-bottomnav-h: 64px;
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sh-font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--sh-text);
  background: var(--sh-bg);
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4,h5 { font-family: var(--sh-font-head); color: var(--sh-ink); line-height: 1.2; margin: 0 0 .5em; font-weight: 700; letter-spacing: -.01em; }
h1 { font-size: clamp(2rem, 4vw, 3rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); }
h3 { font-size: 1.35rem; }
p { margin: 0 0 1rem; }
a { color: var(--sh-primary); text-decoration: none; }
a:hover { color: var(--sh-primary-hover); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0 0 1rem; padding-left: 1.25rem; }
:focus-visible { outline: 3px solid var(--sh-indigo-100); outline-offset: 2px; border-radius: 4px; }

.sh-skip-link { position: absolute; left: -999px; top: 0; background: var(--sh-primary); color:#fff; padding: 10px 16px; z-index: 9999; border-radius: 0 0 8px 0; }
.sh-skip-link:focus { left: 0; }

/* ---------- Layout helpers ---------- */
.sh-container { width: 100%; max-width: var(--sh-container); margin-inline: auto; padding-inline: var(--sh-gutter); }
.sh-section { padding-block: clamp(48px, 7vw, 88px); }
.sh-section--tight { padding-block: clamp(32px, 4vw, 48px); }
.sh-grid { display: grid; gap: 24px; }
/* Auto-collapsing column sets — used by the public pages and every dashboard
   section so nothing needs inline grid-template-columns. */
.sh-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sh-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sh-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sh-flex { display: flex; }
.sh-items-center { align-items: center; }
.sh-justify-between { justify-content: space-between; }
.sh-gap-8 { gap: 8px; } .sh-gap-12 { gap: 12px; } .sh-gap-16 { gap: 16px; } .sh-gap-24 { gap: 24px; }
.sh-wrap { flex-wrap: wrap; }
.sh-text-center { text-align: center; }
.sh-muted { color: var(--sh-text-muted); }
.sh-eyebrow { display:inline-block; font-family: var(--sh-font-head); font-weight: 700; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--sh-primary); margin-bottom: 12px; }
.sh-lead { font-size: 1.125rem; color: var(--sh-slate-700); max-width: 60ch; }
.sh-mt-8{margin-top:8px}.sh-mt-16{margin-top:16px}.sh-mt-24{margin-top:24px}.sh-mt-32{margin-top:32px}
.sh-mb-0{margin-bottom:0}

/* ---------- Buttons ---------- */
.sh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--sh-font-head); font-weight: 600; font-size: .95rem;
  padding: 12px 22px; border-radius: var(--sh-radius-pill); border: 1px solid transparent;
  cursor: pointer; transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
  text-align: center; line-height: 1;
}
.sh-btn:active { transform: translateY(1px); }
.sh-btn--primary { background: var(--sh-primary); color: #fff; box-shadow: var(--sh-shadow-sm); }
.sh-btn--primary:hover { background: var(--sh-primary-hover); color:#fff; box-shadow: var(--sh-shadow); }
.sh-btn--accent { background: var(--sh-accent); color: var(--sh-ink); }
.sh-btn--accent:hover { filter: brightness(.96); color: var(--sh-ink); }
.sh-btn--outline { background: transparent; color: var(--sh-primary); border-color: var(--sh-slate-300); }
.sh-btn--outline:hover { border-color: var(--sh-primary); background: var(--sh-primary-soft); }
.sh-btn--ghost { background: transparent; color: var(--sh-slate-700); }
.sh-btn--ghost:hover { background: var(--sh-slate-100); }
.sh-btn--block { width: 100%; }
.sh-btn--sm { padding: 8px 14px; font-size: .85rem; }
.sh-btn--lg { padding: 15px 30px; font-size: 1.05rem; }
.sh-btn[disabled], .sh-btn.is-loading { opacity: .7; pointer-events: none; }

/* ---------- Badges / pills / chips ---------- */
.sh-badge { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; font-weight: 700; font-family: var(--sh-font-head); padding: 4px 10px; border-radius: var(--sh-radius-pill); letter-spacing: .02em; }
.sh-badge--verified { background: var(--sh-indigo-50); color: var(--sh-indigo-700); }
.sh-badge--trial { background: var(--sh-amber-100); color: var(--sh-warning); }
.sh-badge--success { background: var(--sh-success-soft); color: var(--sh-success); }
.sh-badge--warning { background: var(--sh-warning-soft); color: var(--sh-warning); }
.sh-badge--danger { background: var(--sh-danger-soft); color: var(--sh-danger); }
.sh-badge--accent { background: var(--sh-amber-100); color: var(--sh-amber-500); }
.sh-badge--info { background: var(--sh-info-soft); color: var(--sh-info); }
.sh-badge--neutral { background: var(--sh-slate-100); color: var(--sh-slate-500); }

.sh-chip { display:inline-flex; align-items:center; gap:6px; padding: 6px 12px; border-radius: var(--sh-radius-pill); background: var(--sh-slate-100); color: var(--sh-slate-700); font-size: .82rem; font-weight: 500; border: 1px solid transparent; }
.sh-chip--outline { background: transparent; border-color: var(--sh-border); }

/* Status dot (online/offline) */
.sh-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.sh-dot--online { background: var(--sh-success); box-shadow: 0 0 0 3px var(--sh-success-soft); }
.sh-dot--offline { background: var(--sh-slate-400); box-shadow: 0 0 0 3px var(--sh-slate-100); }

/* Status labels (verification pipeline) */
.sh-status { display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:700; padding:5px 11px; border-radius: var(--sh-radius-pill); }
.sh-status--pending  { background: var(--sh-warning-soft); color: var(--sh-warning); }
.sh-status--approved { background: var(--sh-success-soft); color: var(--sh-success); }
.sh-status--rejected { background: var(--sh-danger-soft);  color: var(--sh-danger); }
.sh-status--review   { background: var(--sh-info-soft);    color: var(--sh-info); }
.sh-status::before { content:""; width:7px; height:7px; border-radius:50%; background: currentColor; }

/* Rating */
.sh-rating { display:inline-flex; align-items:center; gap:6px; font-weight:700; font-family: var(--sh-font-head); }
.sh-rating .sh-stars { color: var(--sh-amber-500); letter-spacing: 1px; }
.sh-rating small { color: var(--sh-text-muted); font-weight: 500; }

/* ---------- Cards ---------- */
.sh-card { background: var(--sh-surface); border: 1px solid var(--sh-border); border-radius: var(--sh-radius); box-shadow: var(--sh-shadow-sm); overflow: hidden; }
.sh-card--pad { padding: 24px; }
.sh-card--hover { transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease; }
.sh-card--hover:hover { box-shadow: var(--sh-shadow-lg); transform: translateY(-3px); border-color: var(--sh-indigo-100); }

/* ---------- Forms ---------- */
.sh-field { margin-bottom: 18px; }
.sh-label { display:block; font-family: var(--sh-font-head); font-weight:600; font-size:.9rem; margin-bottom: 7px; color: var(--sh-slate-700); }
.sh-input, .sh-select, .sh-textarea {
  width: 100%; padding: 12px 14px; font-family: var(--sh-font-body); font-size: .95rem;
  border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-sm); background: #fff; color: var(--sh-ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.sh-input:focus, .sh-select:focus, .sh-textarea:focus { border-color: var(--sh-primary); box-shadow: 0 0 0 4px var(--sh-indigo-50); outline: none; }
.sh-input::placeholder, .sh-textarea::placeholder { color: var(--sh-slate-400); }
.sh-textarea { min-height: 120px; resize: vertical; }
.sh-input--error { border-color: var(--sh-danger); }
.sh-help { font-size: .8rem; color: var(--sh-text-muted); margin-top: 6px; }
.sh-error-text { font-size: .8rem; color: var(--sh-danger); margin-top: 6px; }
.sh-input-group { position: relative; display:flex; align-items:center; }
.sh-input-group .sh-input { padding-left: 42px; }
.sh-input-group .sh-input-icon { position:absolute; left: 14px; color: var(--sh-slate-400); pointer-events:none; }
.sh-checkbox, .sh-radio { display:flex; align-items:flex-start; gap:10px; font-size:.92rem; color: var(--sh-slate-700); }
.sh-checkbox input, .sh-radio input { margin-top: 3px; width:18px; height:18px; accent-color: var(--sh-primary); }

/* ---------- Header / nav ---------- */
.sh-header { position: sticky; top: 0; z-index: 500; background: rgba(255,255,255,.92); backdrop-filter: saturate(180%) blur(10px); border-bottom: 1px solid var(--sh-border); }
.sh-header__inner { height: var(--sh-header-h); display:flex; align-items:center; gap:24px; }
.sh-logo { display:flex; align-items:center; gap:10px; font-family: var(--sh-font-head); font-weight: 800; font-size: 1.25rem; color: var(--sh-ink); letter-spacing:-.02em; }
.sh-logo__mark { width:34px; height:34px; border-radius:10px; background: linear-gradient(135deg, var(--sh-indigo-600), var(--sh-indigo-500)); display:grid; place-items:center; color:#fff; font-weight:800; }
.sh-nav { display:flex; align-items:center; justify-content:center; gap: 6px; margin-left:auto; margin-right:auto; min-width:0; }
.sh-nav a { padding: 10px 14px; border-radius: var(--sh-radius-sm); color: var(--sh-slate-700); font-weight: 500; font-size: .95rem; }
.sh-nav a:hover { color: var(--sh-primary); background: var(--sh-primary-soft); }
.sh-header__actions { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.sh-burger { display:none; background:none; border:1px solid var(--sh-border); border-radius: 10px; padding: 9px; cursor:pointer; color: var(--sh-slate-700); }

/* mobile drawer */
.sh-drawer { position: fixed; inset: 0; z-index: 900; visibility:hidden; }
.sh-drawer.is-open { visibility: visible; }
.sh-drawer__overlay { position:absolute; inset:0; background: rgba(15,23,42,.5); opacity:0; transition:opacity .2s ease; }
.sh-drawer.is-open .sh-drawer__overlay { opacity:1; }
.sh-drawer__panel { position:absolute; top:0; right:0; height:100%; width: min(84vw, 340px); background:#fff; transform: translateX(100%); transition: transform .25s ease; padding: 20px; overflow-y:auto; box-shadow: var(--sh-shadow-lg); }
.sh-drawer.is-open .sh-drawer__panel { transform: translateX(0); }
.sh-drawer__panel a { display:block; padding: 14px 12px; border-radius: 10px; color: var(--sh-slate-700); font-weight: 500; border-bottom: 1px solid var(--sh-slate-100); }
.sh-drawer__panel a:hover { background: var(--sh-primary-soft); color: var(--sh-primary); }

/* ---------- Hero ---------- */
.sh-hero { position: relative; background: radial-gradient(1200px 500px at 100% -10%, var(--sh-indigo-50), transparent 60%), var(--sh-surface); overflow: hidden; }
.sh-hero__grid { display:grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items:center; padding-block: clamp(48px, 7vw, 96px); }
.sh-hero__badge { display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--sh-border); border-radius: var(--sh-radius-pill); padding: 7px 14px; font-size:.82rem; font-weight:600; color: var(--sh-slate-700); box-shadow: var(--sh-shadow-sm); }
.sh-hero h1 { margin-top: 18px; }
.sh-hero__cta { display:flex; gap: 14px; flex-wrap:wrap; margin-top: 28px; }
.sh-hero__trust { display:flex; gap: 28px; flex-wrap:wrap; margin-top: 34px; }
.sh-hero__trust .num { font-family: var(--sh-font-head); font-weight:800; font-size:1.6rem; color: var(--sh-ink); }
.sh-hero__trust .lbl { font-size:.85rem; color: var(--sh-text-muted); }
.sh-hero__media { border-radius: var(--sh-radius-lg); overflow:hidden; box-shadow: var(--sh-shadow-lg); border:1px solid var(--sh-border); }

/* Search bar (hero) */
.sh-searchbar { display:flex; gap:8px; background:#fff; border:1px solid var(--sh-border); border-radius: var(--sh-radius-pill); padding: 8px; box-shadow: var(--sh-shadow); margin-top: 24px; max-width: 560px; }
.sh-searchbar .sh-input { border:none; box-shadow:none !important; padding: 10px 14px; }
.sh-searchbar .sh-input:focus { box-shadow:none; }

/* ---------- Category tiles ---------- */
.sh-cats { display:grid; grid-template-columns: repeat(6, 1fr); gap:16px; }
.sh-cat { display:flex; flex-direction:column; align-items:center; gap:10px; padding: 22px 14px; background:#fff; border:1px solid var(--sh-border); border-radius: var(--sh-radius); text-align:center; transition: .18s ease; }
.sh-cat:hover { border-color: var(--sh-indigo-100); box-shadow: var(--sh-shadow); transform: translateY(-2px); }
.sh-cat__icon { width:48px; height:48px; border-radius:12px; background: var(--sh-indigo-50); color: var(--sh-primary); display:grid; place-items:center; }
.sh-cat__name { font-weight:600; font-size:.95rem; color: var(--sh-ink); }
.sh-cat__count { font-size:.78rem; color: var(--sh-text-muted); }

/* ---------- Teacher card ---------- */
.sh-teacher-card { display:flex; flex-direction:column; }
.sh-teacher-card__top { padding: 18px 18px 0; display:flex; gap:14px; }
.sh-teacher-card__avatar { position:relative; flex:0 0 auto; }
.sh-teacher-card__avatar img { width:72px; height:72px; border-radius: 16px; object-fit:cover; border:1px solid var(--sh-border); }
.sh-teacher-card__status { position:absolute; bottom:-3px; right:-3px; background:#fff; border-radius:50%; padding:3px; }
.sh-teacher-card__name { display:flex; align-items:center; gap:6px; font-family: var(--sh-font-head); font-weight:700; font-size:1.05rem; color: var(--sh-ink); margin:0; }
.sh-teacher-card__subjects { color: var(--sh-text-muted); font-size:.88rem; margin: 2px 0 8px; }
.sh-teacher-card__meta { display:flex; flex-wrap:wrap; gap: 6px 14px; font-size:.82rem; color: var(--sh-slate-700); }
.sh-teacher-card__meta span { display:inline-flex; align-items:center; gap:5px; }
.sh-teacher-card__intro { padding: 12px 18px; color: var(--sh-slate-700); font-size:.9rem; }
.sh-teacher-card__tags { display:flex; flex-wrap:wrap; gap:6px; padding: 0 18px 12px; }
.sh-teacher-card__pricing { display:flex; gap: 18px; padding: 14px 18px; border-top:1px dashed var(--sh-border); border-bottom:1px dashed var(--sh-border); margin: 0 0 14px; }
.sh-teacher-card__price .amt { font-family: var(--sh-font-head); font-weight:800; font-size:1.15rem; color: var(--sh-ink); }
.sh-teacher-card__price .per { font-size:.75rem; color: var(--sh-text-muted); }
.sh-teacher-card__footer { margin-top:auto; padding: 0 18px 18px; display:flex; gap:10px; align-items:center; }
.sh-teacher-card__compare { margin-left:auto; }
.sh-teacher-card__videoflag { position:absolute; top:10px; left:10px; }

/* ---------- Filters (search page) ---------- */
.sh-search-layout { display:grid; grid-template-columns: 288px 1fr; gap: 28px; align-items:start; }
.sh-filter { position: sticky; top: calc(var(--sh-header-h) + 16px); }
.sh-filter__group { padding: 18px 0; border-bottom:1px solid var(--sh-border); }
.sh-filter__group:first-child { padding-top:0; }
.sh-filter__title { font-family: var(--sh-font-head); font-weight:700; font-size:.95rem; margin-bottom:12px; }
.sh-results-head { display:flex; align-items:center; justify-content:space-between; margin-bottom: 20px; flex-wrap:wrap; gap:12px; }
.sh-results-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }

/* Compare tray */
.sh-compare-tray { position: fixed; left:0; right:0; bottom: 0; z-index: 600; background:#fff; border-top:1px solid var(--sh-border); box-shadow: 0 -8px 30px rgba(15,23,42,.10); transform: translateY(110%); transition: transform .25s ease; }
.sh-compare-tray.is-open { transform: translateY(0); }
.sh-compare-tray__inner { display:flex; align-items:center; gap:16px; padding: 14px 0; }

/* ---------- Teacher profile ---------- */
.sh-profile-hero { background: linear-gradient(180deg, var(--sh-indigo-50), transparent); border-bottom:1px solid var(--sh-border); }
.sh-profile-hero__inner { display:grid; grid-template-columns: auto 1fr auto; gap: 28px; align-items:center; padding-block: 36px; }
.sh-profile-hero__avatar img { width:132px; height:132px; border-radius: 24px; object-fit:cover; border:3px solid #fff; box-shadow: var(--sh-shadow); }
.sh-profile-layout { display:grid; grid-template-columns: 1fr 360px; gap: 32px; align-items:start; padding-block: 40px; }
.sh-profile-tabs { display:flex; gap:4px; overflow-x:auto; border-bottom:1px solid var(--sh-border); margin-bottom: 24px; position: sticky; top: var(--sh-header-h); background: var(--sh-bg); z-index: 20; }
.sh-profile-tabs a { padding: 14px 16px; font-weight:600; color: var(--sh-slate-500); border-bottom:2px solid transparent; white-space:nowrap; }
.sh-profile-tabs a.is-active, .sh-profile-tabs a:hover { color: var(--sh-primary); border-color: var(--sh-primary); }
.sh-profile-section { scroll-margin-top: calc(var(--sh-header-h) + 60px); margin-bottom: 32px; }
.sh-booking-card { position: sticky; top: calc(var(--sh-header-h) + 16px); }
.sh-video-wrap { position: relative; aspect-ratio: 16/9; border-radius: var(--sh-radius); overflow:hidden; background: var(--sh-ink); }
.sh-video-wrap .sh-play { position:absolute; inset:0; margin:auto; width:64px; height:64px; border-radius:50%; background: rgba(255,255,255,.92); display:grid; place-items:center; color: var(--sh-primary); border:none; cursor:pointer; }
.sh-doc-list { display:grid; gap:10px; }
.sh-doc { display:flex; align-items:center; gap:12px; padding: 12px 14px; border:1px solid var(--sh-border); border-radius: var(--sh-radius-sm); background:#fff; }
.sh-review { padding: 18px 0; border-bottom:1px solid var(--sh-border); }
.sh-avail-grid { display:grid; grid-template-columns: repeat(7, 1fr); gap:8px; }
.sh-avail-slot { padding: 8px; text-align:center; border:1px solid var(--sh-border); border-radius:8px; font-size:.8rem; cursor:pointer; }
.sh-avail-slot.is-free { border-color: var(--sh-success); color: var(--sh-success); background: var(--sh-success-soft); }
.sh-avail-slot.is-booked { background: var(--sh-slate-100); color: var(--sh-slate-400); cursor:not-allowed; }

/* ---------- Teacher profile (BEM markup used by single-teacher.php) ---------- */
.sh-profile__grid { display:grid; grid-template-columns: 1fr 360px; gap:32px; align-items:start; padding-block:40px; }
.sh-profile__aside { position:sticky; top:calc(var(--sh-header-h) + 16px); }
.sh-profile__main { min-width:0; }
.sh-profile__id { min-width:0; }
.sh-profile__head { display:flex; gap:20px; align-items:flex-start; margin-bottom:24px; }
.sh-profile__avatar { position:relative; flex:0 0 auto; }
.sh-profile__avatar img { width:112px; height:112px; border-radius:20px; object-fit:cover; border:3px solid #fff; box-shadow:var(--sh-shadow); }
.sh-profile__statusdot { position:absolute; right:4px; bottom:4px; }
.sh-profile__name { display:flex; align-items:center; gap:10px; font-family:var(--sh-font-head); font-size:1.6rem; }
.sh-profile__subjects { color:var(--sh-text-muted); margin-top:4px; }
.sh-profile__facts { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; font-size:.9rem; color:var(--sh-text-muted); }
.sh-profile__flags { display:flex; gap:8px; margin-top:12px; }
.sh-section__title { font-family:var(--sh-font-head); font-size:1.25rem; margin-bottom:14px; }
.sh-section__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.sh-subhead { font-family:var(--sh-font-head); font-size:1rem; margin:18px 0 10px; }
.sh-video__play { position:absolute; inset:0; margin:auto; width:64px; height:64px; border-radius:50%; background:rgba(255,255,255,.92); display:grid; place-items:center; color:var(--sh-primary); border:none; cursor:pointer; }
.sh-video__badge { position:absolute; right:12px; bottom:12px; padding:2px 8px; background:rgba(15,23,42,.8); color:#fff; border-radius:6px; font-size:.75rem; }
.sh-timeline__item { display:flex; gap:16px; padding:14px 0; border-bottom:1px solid var(--sh-border); }
.sh-timeline__year { flex:0 0 64px; font-weight:600; color:var(--sh-primary); }
.sh-doclist { display:grid; gap:10px; }
.sh-doclist__item { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border:1px solid var(--sh-border); border-radius:var(--sh-radius-sm); background:#fff; }
.sh-doclist__name { font-weight:600; }
.sh-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.sh-pricing-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.sh-pricing-grid__item { padding:20px; border:1px solid var(--sh-border); border-radius:var(--sh-radius); text-align:center; background:#fff; }
.sh-pricing-grid__item--feature { border-color:var(--sh-primary); box-shadow:0 0 0 3px var(--sh-primary-soft); }
.sh-pricing-grid__amt { font-family:var(--sh-font-head); font-size:1.6rem; font-weight:700; margin:8px 0 4px; }
.sh-avail { display:grid; grid-template-columns:repeat(7, 1fr); gap:8px; }
.sh-avail__col { display:grid; gap:6px; }
.sh-avail__day { font-size:.75rem; font-weight:600; text-align:center; color:var(--sh-text-muted); }
.sh-avail__slot { padding:8px; text-align:center; border:1px solid var(--sh-border); border-radius:8px; font-size:.8rem; cursor:pointer; background:none; width:100%; }
.sh-avail__slot.is-free { border-color:var(--sh-success); color:var(--sh-success); background:var(--sh-success-soft); }
.sh-avail__slot.is-busy { background:var(--sh-slate-100); color:var(--sh-slate-400); cursor:not-allowed; }
.sh-reviews__item { padding:18px 0; border-bottom:1px solid var(--sh-border); }
.sh-reviews__head { display:flex; align-items:center; justify-content:space-between; }
.sh-booking-box__price { font-family:var(--sh-font-head); font-size:1.8rem; font-weight:700; margin-bottom:6px; }
.sh-booking-box__price .per { font-size:.9rem; font-weight:400; color:var(--sh-text-muted); }
.sh-booking-box__meta { display:flex; align-items:center; gap:8px; margin-bottom:16px; font-size:.85rem; }
.sh-booking-box__list { list-style:none; margin:16px 0 0; padding:0; display:grid; gap:8px; font-size:.85rem; color:var(--sh-text-muted); }
.sh-booking-box__note { margin-top:14px; font-size:.78rem; color:var(--sh-text-muted); }
.sh-mobile-book { display:none; position:fixed; left:0; right:0; bottom:0; z-index:500; background:#fff; border-top:1px solid var(--sh-border); padding:12px 16px; align-items:center; justify-content:space-between; box-shadow:0 -8px 30px rgba(15,23,42,.10); }
.sh-mobile-book__price { font-size:1rem; }
.sh-mb-12 { margin-bottom:12px; }
@media (max-width: 900px) {
  .sh-profile__grid { grid-template-columns:1fr; }
  .sh-profile__aside { position:static; }
  .sh-mobile-book { display:flex; }
}

/* ---------- Modal title + fieldset legend ---------- */
.sh-modal__title { font-family:var(--sh-font-head); font-size:1.2rem; margin-bottom:16px; }
.sh-field__legend { font-family:var(--sh-font-head); }

/* ---------- Blog fallback (index.php) ---------- */
.sh-article-card { padding:24px 0; border-bottom:1px solid var(--sh-border); }
.sh-article-head { margin-bottom:8px; }
.sh-article-title a { font-family:var(--sh-font-head); font-size:1.3rem; color:var(--sh-text); }
.sh-article-meta { font-size:.85rem; color:var(--sh-text-muted); }
.sh-article-excerpt { color:var(--sh-text-muted); margin-top:8px; }

/* ---------- Missing state variant ---------- */
.sh-state--loading .sh-state__icon { background:var(--sh-slate-100); color:var(--sh-slate-500); }

/* ---------- Compare checkbox on teacher cards ---------- */
.sh-compare-check { width:16px; height:16px; cursor:pointer; }

/* ---------- Tables (become mobile cards) ---------- */
.sh-table-wrap { overflow-x:auto; border:1px solid var(--sh-border); border-radius: var(--sh-radius); background:#fff; }
.sh-table { width:100%; border-collapse:collapse; }
.sh-table th, .sh-table td { padding: 14px 16px; text-align:left; font-size:.9rem; border-bottom:1px solid var(--sh-slate-100); }
.sh-table th { font-family: var(--sh-font-head); font-weight:700; color: var(--sh-slate-500); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; background: var(--sh-slate-50); }
.sh-table tr:last-child td, .sh-table tbody tr:last-child td { border-bottom:none; }

/* ---------- States: loading, empty, error, success ---------- */
.sh-skeleton { background: linear-gradient(90deg, var(--sh-slate-100) 25%, var(--sh-slate-200) 37%, var(--sh-slate-100) 63%); background-size: 400% 100%; animation: sh-shimmer 1.4s ease infinite; border-radius: 8px; }
@keyframes sh-shimmer { 0%{background-position:100% 0} 100%{background-position:-100% 0} }
.sh-spinner { width: 22px; height:22px; border-radius:50%; border:3px solid var(--sh-indigo-100); border-top-color: var(--sh-primary); animation: sh-spin .7s linear infinite; }
@keyframes sh-spin { to { transform: rotate(360deg); } }
.sh-state { text-align:center; padding: 48px 24px; border:1px dashed var(--sh-border); border-radius: var(--sh-radius); background:#fff; }
.sh-state__icon { width:56px; height:56px; border-radius:16px; display:grid; place-items:center; margin: 0 auto 14px; }
.sh-state--empty .sh-state__icon { background: var(--sh-slate-100); color: var(--sh-slate-500); }
.sh-state--error .sh-state__icon { background: var(--sh-danger-soft); color: var(--sh-danger); }
.sh-state--success .sh-state__icon { background: var(--sh-success-soft); color: var(--sh-success); }
.sh-state h3 { margin-bottom: 6px; }
.sh-state p { color: var(--sh-text-muted); max-width: 44ch; margin-inline:auto; }

/* Toast / alert */
.sh-alert { display:flex; gap:12px; padding: 14px 16px; border-radius: var(--sh-radius-sm); border:1px solid; align-items:flex-start; }
.sh-alert--success { background: var(--sh-success-soft); border-color:#bbf7d0; color:#166534; }
.sh-alert--error   { background: var(--sh-danger-soft); border-color:#fecaca; color:#991b1b; }
.sh-alert--info    { background: var(--sh-info-soft); border-color:#bae6fd; color:#075985; }
.sh-alert--warning { background: var(--sh-warning-soft); border-color:#fde68a; color:#92400e; }

/* ---------- Modal ---------- */
.sh-modal { position: fixed; inset:0; z-index: 1000; display:none; align-items:center; justify-content:center; padding: 20px; }
.sh-modal.is-open { display:flex; }
.sh-modal__overlay { position:absolute; inset:0; background: rgba(15,23,42,.55); backdrop-filter: blur(2px); }
.sh-modal__dialog { position:relative; background:#fff; border-radius: var(--sh-radius-lg); box-shadow: var(--sh-shadow-lg); width: min(560px, 100%); max-height: 90vh; overflow:auto; }
.sh-modal__head { display:flex; align-items:center; justify-content:space-between; padding: 20px 24px; border-bottom:1px solid var(--sh-border); }
.sh-modal__body { padding: 24px; }
.sh-modal__foot { padding: 16px 24px; border-top:1px solid var(--sh-border); display:flex; gap:10px; justify-content:flex-end; }
.sh-modal__close { background:none; border:none; cursor:pointer; color: var(--sh-slate-500); padding:6px; border-radius:8px; }
.sh-modal__close:hover { background: var(--sh-slate-100); }

/* ---------- Dashboard shell ---------- */
.sh-dash { display:grid; grid-template-columns: 260px 1fr; min-height: calc(100vh - var(--sh-header-h)); }
.sh-dash__side { background:#fff; border-right:1px solid var(--sh-border); padding: 20px 14px; }
.sh-dash__side nav a { display:flex; align-items:center; gap:12px; padding: 11px 14px; border-radius: 10px; color: var(--sh-slate-700); font-weight:500; font-size:.92rem; margin-bottom:2px; }
.sh-dash__side nav a:hover { background: var(--sh-slate-100); }
.sh-dash__side nav a.is-active { background: var(--sh-primary-soft); color: var(--sh-primary); font-weight:600; }
.sh-dash__main { padding: 28px; min-width: 0; }
.sh-dash__head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom: 24px; flex-wrap:wrap; }
.sh-widgets { display:grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.sh-widget { padding: 20px; background:#fff; border:1px solid var(--sh-border); border-radius: var(--sh-radius); }
.sh-widget__label { font-size:.82rem; color: var(--sh-text-muted); font-weight:600; }
.sh-widget__value { font-family: var(--sh-font-head); font-weight:800; font-size:1.9rem; color: var(--sh-ink); margin-top:6px; }
.sh-widget__trend { font-size:.8rem; margin-top:4px; font-weight:600; }
.sh-widget__trend.up { color: var(--sh-success); } .sh-widget__trend.down { color: var(--sh-danger); }
.sh-widget__icon { width:42px; height:42px; border-radius:12px; background: var(--sh-indigo-50); color: var(--sh-primary); display:grid; place-items:center; float:right; }

/* ---------- Footer ---------- */
.sh-footer { background: var(--sh-indigo-900); color: #c7d2fe; padding-block: 56px 32px; margin-top: 40px; }
.sh-footer a { color:#c7d2fe; } .sh-footer a:hover { color:#fff; }
.sh-footer__grid { display:grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 32px; }
.sh-footer h4 { color:#fff; font-size:1rem; margin-bottom:14px; }
.sh-footer ul { list-style:none; padding:0; margin:0; }
.sh-footer li { margin-bottom:9px; font-size:.9rem; }
.sh-footer__bottom { border-top:1px solid rgba(255,255,255,.12); margin-top: 40px; padding-top: 22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:.85rem; }

/* ---------- Mobile app bottom nav ---------- */
.sh-bottomnav { display:none; position: fixed; left:0; right:0; bottom:0; z-index: 700; background:#fff; border-top:1px solid var(--sh-border); height: var(--sh-bottomnav-h); padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -4px 20px rgba(15,23,42,.06); }
.sh-bottomnav__inner { display:grid; grid-template-columns: repeat(5, 1fr); height: var(--sh-bottomnav-h); }
.sh-bottomnav a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color: var(--sh-slate-500); font-size:.68rem; font-weight:600; }
.sh-bottomnav a.is-active { color: var(--sh-primary); }
.sh-bottomnav a .ico { width:22px; height:22px; }

/* ---------- Page header (generic) ---------- */
.sh-pagehead { background: linear-gradient(180deg, var(--sh-indigo-50), transparent); border-bottom:1px solid var(--sh-border); padding-block: 44px; }
.sh-breadcrumb { font-size:.82rem; color: var(--sh-text-muted); margin-bottom:10px; }
.sh-breadcrumb a { color: var(--sh-slate-500); }

/* Pricing */
.sh-price-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 24px; align-items:stretch; }
.sh-price-card { display:flex; flex-direction:column; padding: 28px; }
.sh-price-card--feat { border:2px solid var(--sh-primary); box-shadow: var(--sh-shadow-lg); position:relative; }
.sh-price-card__amt { font-family: var(--sh-font-head); font-weight:800; font-size: 2.4rem; color: var(--sh-ink); }
.sh-price-card ul { list-style:none; padding:0; margin: 18px 0; }
.sh-price-card li { padding: 8px 0; border-bottom:1px solid var(--sh-slate-100); font-size:.92rem; display:flex; gap:10px; align-items:flex-start; }

/* FAQ / accordion */
.sh-accordion__item { border:1px solid var(--sh-border); border-radius: var(--sh-radius-sm); margin-bottom:12px; background:#fff; overflow:hidden; }
.sh-accordion__q { display:flex; align-items:center; justify-content:space-between; gap:16px; padding: 16px 20px; cursor:pointer; font-family: var(--sh-font-head); font-weight:600; }
.sh-accordion__a { padding: 0 20px; max-height:0; overflow:hidden; transition: max-height .25s ease, padding .25s ease; color: var(--sh-slate-700); }
.sh-accordion__item.is-open .sh-accordion__a { padding: 0 20px 18px; max-height: 400px; }
.sh-accordion__item.is-open .sh-accordion__q .chev { transform: rotate(180deg); }
.sh-accordion__q .chev { transition: transform .2s ease; color: var(--sh-slate-400); }

/* Steps / how it works */
.sh-steps { display:grid; grid-template-columns: repeat(3,1fr); gap: 24px; counter-reset: step; }
.sh-step { padding: 24px; background:#fff; border:1px solid var(--sh-border); border-radius: var(--sh-radius); }
.sh-step__num { width:40px; height:40px; border-radius:12px; background: var(--sh-primary); color:#fff; font-family: var(--sh-font-head); font-weight:800; display:grid; place-items:center; margin-bottom:14px; }

/* Section heading */
.sh-sec-head { max-width: 620px; margin: 0 auto 40px; text-align:center; }

/* Utility: hide/show */
.sh-desktop-only { display: initial; }
.sh-mobile-only  { display: none; }

/* ============================================================
   RESPONSIVE — tablet
   ============================================================ */
@media (max-width: 1024px) {
  .sh-hero__grid { grid-template-columns: 1fr; }
  .sh-hero__media { order:-1; }
  .sh-cats { grid-template-columns: repeat(4, 1fr); }
  .sh-search-layout { grid-template-columns: 1fr; }
  .sh-filter { position: static; }
  .sh-profile-layout { grid-template-columns: 1fr; }
  .sh-booking-card { position: static; }
  .sh-profile-hero__inner { grid-template-columns: auto 1fr; }
  .sh-price-grid { grid-template-columns: 1fr; max-width: 480px; margin-inline:auto; }
  .sh-steps { grid-template-columns: 1fr; }
  .sh-footer__grid { grid-template-columns: 1fr 1fr 1fr; }
  .sh-widgets { grid-template-columns: repeat(2, 1fr); }
  .sh-grid--3, .sh-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sh-dash { grid-template-columns: 1fr; }
  .sh-dash__side { display:none; }
}

/* ============================================================
   RESPONSIVE — mobile
   ============================================================ */
@media (max-width: 720px) {
  body { padding-bottom: calc(var(--sh-bottomnav-h) + env(safe-area-inset-bottom)); }
  .sh-nav { display:none; }
  .sh-header__inner { width:100%; max-width:none; padding-left:14px; padding-right:8px; gap:10px; }
  .sh-header__actions { margin-left:auto; gap:6px; }
  .sh-burger { margin-left:0; flex:0 0 auto; }
  .sh-header__actions .sh-btn--outline { display:none; }
  .sh-burger { display:inline-flex; }
  .sh-bottomnav { display:block; }
  .sh-cats { grid-template-columns: repeat(2, 1fr); }
  .sh-results-grid { grid-template-columns: 1fr; }
  .sh-hero__trust { gap: 18px; }
  .sh-footer__grid { grid-template-columns: 1fr 1fr; }
  .sh-profile-hero__inner { grid-template-columns: 1fr; text-align:center; justify-items:center; }
  .sh-widgets { grid-template-columns: 1fr 1fr; }
  .sh-grid--2, .sh-grid--3, .sh-grid--4 { grid-template-columns: 1fr; }
  .sh-desktop-only { display: none !important; }
  .sh-mobile-only  { display: initial; }

  /* Tables -> cards */
  .sh-table-responsive thead { display:none; }
  .sh-table-responsive, .sh-table-responsive tbody, .sh-table-responsive tr, .sh-table-responsive td { display:block; width:100%; }
  .sh-table-responsive tr { border:1px solid var(--sh-border); border-radius: var(--sh-radius-sm); margin-bottom:12px; padding: 6px 4px; background:#fff; }
  .sh-table-responsive td { border:none !important; display:flex; justify-content:space-between; gap:16px; padding: 8px 14px; text-align:right; }
  .sh-table-responsive td::before { content: attr(data-label); font-weight:700; color: var(--sh-slate-500); font-family: var(--sh-font-head); font-size:.8rem; text-align:left; }
}

@media (max-width: 420px) {
  .sh-cats { grid-template-columns: 1fr 1fr; }
  .sh-widgets { grid-template-columns: 1fr; }
  .sh-teacher-card__pricing { gap: 12px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ============================================================================
   PHASE 2 — Dashboards, forms, auth, content pages
   Additions below reuse the Phase 1 token set only (no new colors or fonts).
   ============================================================================ */

/* ---------- Phase 1 gap fixes ----------
   These class names are referenced by page.php, modals.php and theme.js but
   were never defined in the Phase 1 stylesheet. Defined here so existing
   templates render correctly. */

.sh-main { display: block; }
.sh-page-head { background: linear-gradient(180deg, var(--sh-indigo-50), transparent); border-bottom: 1px solid var(--sh-border); padding-block: 44px; margin-bottom: 40px; }
.sh-page-title { margin-bottom: 0; }
.sh-content-narrow { max-width: 760px; margin-inline: auto; }
.sh-page-links { margin-top: 24px; font-size: .9rem; }

/* Long-form editorial content (legal pages, about, post content) */
.sh-prose { color: var(--sh-slate-700); font-size: 1.02rem; }
.sh-prose > *:first-child { margin-top: 0; }
.sh-prose h2 { margin-top: 2em; font-size: 1.6rem; }
.sh-prose h3 { margin-top: 1.6em; font-size: 1.2rem; }
.sh-prose ul, .sh-prose ol { padding-left: 1.4rem; }
.sh-prose li { margin-bottom: .5rem; }
.sh-prose a { text-decoration: underline; text-underline-offset: 2px; }
.sh-prose blockquote { margin: 1.5rem 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--sh-indigo-100); color: var(--sh-slate-500); font-style: italic; }
.sh-prose hr { border: none; border-top: 1px solid var(--sh-border); margin: 2.5rem 0; }
.sh-prose table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: .92rem; }
.sh-prose th, .sh-prose td { padding: 10px 12px; border: 1px solid var(--sh-border); text-align: left; }
.sh-prose th { background: var(--sh-slate-50); font-family: var(--sh-font-head); }
.sh-prose code { background: var(--sh-slate-100); padding: 2px 6px; border-radius: 5px; font-size: .9em; }

/* Notices — theme.js injects .sh-notice; mirrors .sh-alert visuals */
.sh-notice { display: flex; gap: 10px; align-items: flex-start; padding: 12px 15px; border-radius: var(--sh-radius-sm); border: 1px solid var(--sh-border); background: var(--sh-slate-50); font-size: .9rem; color: var(--sh-slate-700); margin-bottom: 16px; }
.sh-notice--success { background: var(--sh-success-soft); border-color: #bbf7d0; color: #166534; }
.sh-notice--error   { background: var(--sh-danger-soft); border-color: #fecaca; color: #991b1b; }
.sh-notice--info    { background: var(--sh-info-soft); border-color: #bae6fd; color: #075985; }
.sh-notice--warning { background: var(--sh-warning-soft); border-color: #fde68a; color: #92400e; }
.sh-notice--accent  { background: var(--sh-amber-100); border-color: #fde68a; color: #92400e; font-weight: 600; }

/* Small spinner used inside buttons during submit */
.sh-spinner--sm { width: 15px; height: 15px; border-width: 2px; border-color: rgba(255,255,255,.45); border-top-color: #fff; }

/* Alias so theme.js `.sh-profile__tabs` selector matches the Phase 1 markup */
.sh-profile__tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--sh-border); margin-bottom: 24px; }
.sh-profile__tabs a { padding: 14px 16px; font-weight: 600; color: var(--sh-slate-500); border-bottom: 2px solid transparent; white-space: nowrap; }
.sh-profile__tabs a.is-active, .sh-profile__tabs a:hover { color: var(--sh-primary); border-color: var(--sh-primary); }

/* ---------- Forms: scoped defaults ----------
   Lets templates write plain <input>/<label> inside .sh-form and still get the
   design system, which is what modals.php already assumes. */
.sh-form label { display: block; font-family: var(--sh-font-head); font-weight: 600; font-size: .9rem; margin-bottom: 7px; color: var(--sh-slate-700); }
.sh-form input[type="text"], .sh-form input[type="email"], .sh-form input[type="password"],
.sh-form input[type="tel"], .sh-form input[type="url"], .sh-form input[type="number"],
.sh-form input[type="date"], .sh-form input[type="time"], .sh-form input[type="search"],
.sh-form input[type="file"], .sh-form select, .sh-form textarea {
  width: 100%; padding: 12px 14px; font-family: var(--sh-font-body); font-size: .95rem;
  border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-sm); background: #fff; color: var(--sh-ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.sh-form input:focus, .sh-form select:focus, .sh-form textarea:focus { border-color: var(--sh-primary); box-shadow: 0 0 0 4px var(--sh-indigo-50); outline: none; }
.sh-form input::placeholder, .sh-form textarea::placeholder { color: var(--sh-slate-400); }
.sh-form textarea { min-height: 110px; resize: vertical; }
.sh-form input[type="checkbox"], .sh-form input[type="radio"] { width: 18px; height: 18px; accent-color: var(--sh-primary); }
.sh-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sh-form__row--3 { grid-template-columns: repeat(3, 1fr); }
.sh-form__note { font-size: .82rem; color: var(--sh-text-muted); margin: 14px 0; }
.sh-form__actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 20px; }
.sh-form__actions--split { justify-content: space-between; }
.sh-fieldset { border: 1px solid var(--sh-border); border-radius: var(--sh-radius); padding: 20px; margin: 0 0 20px; }
.sh-fieldset legend { font-family: var(--sh-font-head); font-weight: 700; font-size: .95rem; padding: 0 8px; }
.sh-required { color: var(--sh-danger); }

/* Inline validation states */
.sh-field.is-invalid input, .sh-field.is-invalid select, .sh-field.is-invalid textarea { border-color: var(--sh-danger); }
.sh-field.is-valid input, .sh-field.is-valid select { border-color: var(--sh-success); }

/* Choice cards (role pickers, plan pickers) */
.sh-choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.sh-choice { position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 16px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: #fff; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.sh-choice:hover { border-color: var(--sh-indigo-100); box-shadow: var(--sh-shadow-sm); }
.sh-choice input { margin-top: 2px; flex: 0 0 auto; }
.sh-choice__title { font-family: var(--sh-font-head); font-weight: 700; font-size: .95rem; display: block; }
.sh-choice__desc { font-size: .82rem; color: var(--sh-text-muted); }
.sh-choice:has(input:checked) { border-color: var(--sh-primary); background: var(--sh-primary-soft); box-shadow: 0 0 0 3px var(--sh-indigo-50); }

/* Toggle switch */
.sh-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: .9rem; color: var(--sh-slate-700); }
.sh-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.sh-switch__track { width: 42px; height: 24px; border-radius: var(--sh-radius-pill); background: var(--sh-slate-300); position: relative; transition: background .18s ease; flex: 0 0 auto; }
.sh-switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .18s ease; box-shadow: var(--sh-shadow-sm); }
.sh-switch input:checked + .sh-switch__track { background: var(--sh-primary); }
.sh-switch input:checked + .sh-switch__track::after { transform: translateX(18px); }
.sh-switch input:focus-visible + .sh-switch__track { outline: 3px solid var(--sh-indigo-100); outline-offset: 2px; }

/* ---------- Multi-step form (Become a Teacher) ---------- */
.sh-stepper { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 28px; counter-reset: shstep; }
.sh-stepper__item { display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: var(--sh-radius-pill); background: #fff; border: 1px solid var(--sh-border); font-size: .85rem; font-weight: 600; color: var(--sh-slate-500); white-space: nowrap; flex: 0 0 auto; }
.sh-stepper__num { width: 26px; height: 26px; border-radius: 50%; background: var(--sh-slate-100); color: var(--sh-slate-500); display: grid; place-items: center; font-family: var(--sh-font-head); font-weight: 800; font-size: .8rem; flex: 0 0 auto; }
.sh-stepper__item.is-active { border-color: var(--sh-primary); background: var(--sh-primary-soft); color: var(--sh-primary); }
.sh-stepper__item.is-active .sh-stepper__num { background: var(--sh-primary); color: #fff; }
.sh-stepper__item.is-done { border-color: var(--sh-success); color: var(--sh-success); background: var(--sh-success-soft); }
.sh-stepper__item.is-done .sh-stepper__num { background: var(--sh-success); color: #fff; }
.sh-step-panel { display: none; }
.sh-step-panel.is-active { display: block; }
.sh-progress-track { height: 6px; border-radius: var(--sh-radius-pill); background: var(--sh-slate-200); overflow: hidden; }
.sh-progress-track__fill { height: 100%; border-radius: inherit; background: var(--sh-primary); transition: width .3s ease; }

/* ---------- Progress bars / meters ---------- */
.sh-meter { margin-bottom: 16px; }
.sh-meter__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 7px; font-size: .88rem; }
.sh-meter__label { font-weight: 600; color: var(--sh-slate-700); }
.sh-meter__value { font-family: var(--sh-font-head); font-weight: 800; color: var(--sh-ink); }
.sh-meter__bar { height: 9px; border-radius: var(--sh-radius-pill); background: var(--sh-slate-100); overflow: hidden; }
.sh-meter__fill { height: 100%; border-radius: inherit; background: var(--sh-primary); }
.sh-meter__fill--success { background: var(--sh-success); }
.sh-meter__fill--warning { background: var(--sh-warning); }
.sh-meter__fill--danger { background: var(--sh-danger); }

/* Ring meter (AI score) */
.sh-ring { --pct: 0; width: 132px; height: 132px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto;
  background: conic-gradient(var(--sh-primary) calc(var(--pct) * 1%), var(--sh-slate-200) 0); }
.sh-ring__inner { width: 104px; height: 104px; border-radius: 50%; background: #fff; display: grid; place-items: center; text-align: center; }
.sh-ring__value { font-family: var(--sh-font-head); font-weight: 800; font-size: 1.7rem; line-height: 1; color: var(--sh-ink); }
.sh-ring__label { font-size: .7rem; color: var(--sh-text-muted); text-transform: uppercase; letter-spacing: .06em; }

/* ---------- Dashboard shell additions ---------- */
.sh-dash__brand { display: flex; align-items: center; gap: 10px; padding: 0 12px 16px; margin-bottom: 12px; border-bottom: 1px solid var(--sh-border); }
.sh-dash__role { font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; font-weight: 700; color: var(--sh-primary); background: var(--sh-primary-soft); padding: 3px 9px; border-radius: var(--sh-radius-pill); }
.sh-dash__side nav { display: flex; flex-direction: column; }
.sh-dash__side nav .ico { width: 20px; text-align: center; flex: 0 0 auto; opacity: .85; }
.sh-dash__navgroup { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--sh-slate-400); padding: 16px 14px 6px; }
.sh-dash__side-foot { margin-top: 20px; padding: 14px 12px 0; border-top: 1px solid var(--sh-border); }
.sh-dash__count { margin-left: auto; font-size: .7rem; font-weight: 700; background: var(--sh-danger); color: #fff; border-radius: var(--sh-radius-pill); padding: 1px 7px; }
.sh-dash__title { margin-bottom: 4px; font-size: 1.5rem; }
.sh-dash__sub { color: var(--sh-text-muted); font-size: .92rem; margin: 0; }
.sh-dash__mobilebar { display: none; padding: 14px 0; }
.sh-dash__mobilebar select { width: 100%; padding: 12px 14px; border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-sm); background: #fff; font-family: var(--sh-font-head); font-weight: 600; font-size: .92rem; color: var(--sh-ink); }
.sh-widget-area { margin-bottom: 20px; }
.sh-widget-area__title { font-size: .95rem; margin-bottom: 8px; }

/* Section block inside a dashboard */
.sh-block { margin-bottom: 28px; }
.sh-block__head { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.sh-block__title { font-family: var(--sh-font-head); font-weight: 700; font-size: 1.1rem; margin: 0; }
.sh-block__sub { font-size: .85rem; color: var(--sh-text-muted); margin: 2px 0 0; }

/* Two-column dashboard split */
.sh-split { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.sh-split--even { grid-template-columns: 1fr 1fr; }
.sh-split--wide { grid-template-columns: 380px 1fr; }

/* Table toolbar (search + filters above a table) */
.sh-toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.sh-toolbar__search { position: relative; flex: 1 1 240px; min-width: 0; }
.sh-toolbar__search input { width: 100%; padding: 10px 14px 10px 38px; border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-pill); font-size: .9rem; background: #fff; }
.sh-toolbar__search .ico { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--sh-slate-400); pointer-events: none; }
.sh-toolbar select { padding: 10px 12px; border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-pill); background: #fff; font-size: .88rem; color: var(--sh-slate-700); }

/* Segmented filter tabs */
.sh-segment { display: inline-flex; padding: 4px; background: var(--sh-slate-100); border-radius: var(--sh-radius-pill); gap: 2px; overflow-x: auto; max-width: 100%; }
.sh-segment a, .sh-segment button { padding: 8px 16px; border-radius: var(--sh-radius-pill); font-size: .85rem; font-weight: 600; color: var(--sh-slate-500); background: none; border: none; cursor: pointer; white-space: nowrap; font-family: var(--sh-font-head); }
.sh-segment a.is-active, .sh-segment button.is-active { background: #fff; color: var(--sh-primary); box-shadow: var(--sh-shadow-sm); }

/* Table cell helpers */
.sh-table__user { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sh-table__user img { width: 36px; height: 36px; border-radius: 10px; object-fit: cover; flex: 0 0 auto; }
.sh-table__name { font-weight: 600; color: var(--sh-ink); font-size: .9rem; }
.sh-table__meta { font-size: .78rem; color: var(--sh-text-muted); }
.sh-table__actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sh-table tfoot td { background: var(--sh-slate-50); font-weight: 700; font-family: var(--sh-font-head); }
.sh-table--compact th, .sh-table--compact td { padding: 10px 14px; }
.sh-num { font-variant-numeric: tabular-nums; font-family: var(--sh-font-head); font-weight: 700; }
.sh-num--pos { color: var(--sh-success); } .sh-num--neg { color: var(--sh-danger); }

/* Avatar */
.sh-avatar { border-radius: 12px; object-fit: cover; border: 1px solid var(--sh-border); flex: 0 0 auto; }
.sh-avatar--sm { width: 32px; height: 32px; border-radius: 9px; }
.sh-avatar--md { width: 48px; height: 48px; }
.sh-avatar--lg { width: 72px; height: 72px; border-radius: 16px; }
.sh-avatar-stack { display: flex; }
.sh-avatar-stack img { width: 32px; height: 32px; border-radius: 50%; border: 2px solid #fff; margin-left: -9px; object-fit: cover; }
.sh-avatar-stack img:first-child { margin-left: 0; }

/* ---------- Calendar widget ---------- */
.sh-cal__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.sh-cal__month { font-family: var(--sh-font-head); font-weight: 700; font-size: 1rem; }
.sh-cal__nav { display: flex; gap: 6px; }
.sh-cal__nav button { width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--sh-border); background: #fff; cursor: pointer; color: var(--sh-slate-700); display: grid; place-items: center; }
.sh-cal__nav button:hover { background: var(--sh-slate-100); }
.sh-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.sh-cal__dow { text-align: center; font-size: .68rem; font-weight: 700; color: var(--sh-slate-400); text-transform: uppercase; letter-spacing: .04em; padding-bottom: 6px; }
.sh-cal__day { position: relative; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; border-radius: 9px; font-size: .85rem; color: var(--sh-slate-700); border: 1px solid transparent; background: none; cursor: pointer; font-family: var(--sh-font-body); }
.sh-cal__day:hover { background: var(--sh-slate-100); }
.sh-cal__day--muted { color: var(--sh-slate-300); }
.sh-cal__day--today { border-color: var(--sh-primary); color: var(--sh-primary); font-weight: 700; }
.sh-cal__day--selected { background: var(--sh-primary); color: #fff; font-weight: 700; }
.sh-cal__day--selected:hover { background: var(--sh-primary-hover); }
.sh-cal__dots { display: flex; gap: 2px; height: 5px; }
.sh-cal__dot { width: 5px; height: 5px; border-radius: 50%; background: var(--sh-primary); }
.sh-cal__day--selected .sh-cal__dot { background: #fff; }
.sh-cal__dot--accent { background: var(--sh-accent); }
.sh-cal__legend { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--sh-border); font-size: .78rem; color: var(--sh-text-muted); }
.sh-cal__legend span { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Class / list item rows ---------- */
.sh-item { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--sh-slate-100); }
.sh-item:last-child { border-bottom: none; }
.sh-item__body { min-width: 0; flex: 1 1 auto; }
.sh-item__title { font-family: var(--sh-font-head); font-weight: 700; font-size: .95rem; margin: 0; color: var(--sh-ink); }
.sh-item__meta { font-size: .82rem; color: var(--sh-text-muted); display: flex; gap: 6px 14px; flex-wrap: wrap; margin-top: 3px; }
.sh-item__aside { margin-left: auto; text-align: right; flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.sh-item__time { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 12px; background: var(--sh-primary-soft); color: var(--sh-primary); flex: 0 0 auto; }
.sh-item__time .d { font-size: 1.1rem; font-weight: 800; font-family: var(--sh-font-head); line-height: 1; }
.sh-item__time .m { font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; }

/* Live/next class highlight */
.sh-nextclass { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; padding: 22px; border-radius: var(--sh-radius); background: linear-gradient(135deg, var(--sh-indigo-700), var(--sh-indigo-500)); color: #fff; }
.sh-nextclass h3, .sh-nextclass .sh-nextclass__title { color: #fff; margin: 0 0 4px; font-size: 1.15rem; }
.sh-nextclass__meta { color: #c7d2fe; font-size: .88rem; }
.sh-nextclass__cta { margin-left: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.sh-live { display: inline-flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; background: rgba(255,255,255,.18); padding: 4px 10px; border-radius: var(--sh-radius-pill); }
.sh-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #4ade80; animation: sh-pulse 1.6s ease infinite; }
@keyframes sh-pulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }

/* ---------- Verification timeline ---------- */
.sh-timeline { list-style: none; padding: 0; margin: 0; }
.sh-timeline li { position: relative; padding: 0 0 26px 34px; }
.sh-timeline li::before { content: ""; position: absolute; left: 10px; top: 22px; bottom: 0; width: 2px; background: var(--sh-border); }
.sh-timeline li:last-child { padding-bottom: 0; }
.sh-timeline li:last-child::before { display: none; }
.sh-timeline__dot { position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: .7rem; font-weight: 800; background: var(--sh-slate-100); color: var(--sh-slate-400); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--sh-border); }
.sh-timeline li.is-done .sh-timeline__dot { background: var(--sh-success); color: #fff; box-shadow: 0 0 0 1px var(--sh-success); }
.sh-timeline li.is-current .sh-timeline__dot { background: var(--sh-warning); color: #fff; box-shadow: 0 0 0 1px var(--sh-warning); }
.sh-timeline li.is-rejected .sh-timeline__dot { background: var(--sh-danger); color: #fff; box-shadow: 0 0 0 1px var(--sh-danger); }
.sh-timeline__title { font-family: var(--sh-font-head); font-weight: 700; font-size: .93rem; margin: 0; }
.sh-timeline__meta { font-size: .8rem; color: var(--sh-text-muted); margin: 2px 0 0; }

/* Verification status banner */
.sh-verify { display: flex; gap: 16px; align-items: flex-start; padding: 20px; border-radius: var(--sh-radius); border: 1px solid var(--sh-border); background: #fff; }
.sh-verify__icon { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-size: 1.2rem; flex: 0 0 auto; }
.sh-verify--pending  { border-color: #fde68a; background: var(--sh-warning-soft); }
.sh-verify--pending .sh-verify__icon { background: var(--sh-amber-500); color: #fff; }
.sh-verify--approved { border-color: #bbf7d0; background: var(--sh-success-soft); }
.sh-verify--approved .sh-verify__icon { background: var(--sh-success); color: #fff; }
.sh-verify--rejected { border-color: #fecaca; background: var(--sh-danger-soft); }
.sh-verify--rejected .sh-verify__icon { background: var(--sh-danger); color: #fff; }
.sh-verify--review { border-color: #bae6fd; background: var(--sh-info-soft); }
.sh-verify--review .sh-verify__icon { background: var(--sh-info); color: #fff; }
.sh-verify h3 { margin: 0 0 4px; font-size: 1.05rem; }
.sh-verify p { margin: 0; font-size: .9rem; }
.sh-verify__actions { margin-left: auto; flex: 0 0 auto; }

/* ---------- Document upload ---------- */
.sh-dropzone { border: 2px dashed var(--sh-slate-300); border-radius: var(--sh-radius); background: var(--sh-slate-50); padding: 30px 20px; text-align: center; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.sh-dropzone:hover, .sh-dropzone:focus-within { border-color: var(--sh-primary); background: var(--sh-primary-soft); }
.sh-dropzone__icon { width: 46px; height: 46px; border-radius: 13px; background: var(--sh-indigo-50); color: var(--sh-primary); display: grid; place-items: center; margin: 0 auto 12px; font-size: 1.2rem; }
.sh-dropzone__title { font-family: var(--sh-font-head); font-weight: 700; font-size: .95rem; margin-bottom: 4px; }
.sh-dropzone__hint { font-size: .8rem; color: var(--sh-text-muted); }
.sh-dropzone input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }

.sh-filelist { display: grid; gap: 10px; }
.sh-file { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-sm); background: #fff; }
.sh-file__icon { width: 38px; height: 38px; border-radius: 10px; background: var(--sh-slate-100); color: var(--sh-slate-500); display: grid; place-items: center; font-size: .95rem; flex: 0 0 auto; }
.sh-file__body { min-width: 0; flex: 1 1 auto; }
.sh-file__name { font-weight: 600; font-size: .9rem; color: var(--sh-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-file__meta { font-size: .78rem; color: var(--sh-text-muted); }
.sh-file__aside { margin-left: auto; display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.sh-file--uploading .sh-file__icon { background: var(--sh-indigo-50); color: var(--sh-primary); }
.sh-file--rejected { border-color: #fecaca; background: var(--sh-danger-soft); }
.sh-file--approved .sh-file__icon { background: var(--sh-success-soft); color: var(--sh-success); }

/* ---------- Messages / chat ---------- */
.sh-chat { display: grid; grid-template-columns: 300px 1fr; height: min(70vh, 620px); border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: #fff; overflow: hidden; }
.sh-chat__list { border-right: 1px solid var(--sh-border); overflow-y: auto; min-width: 0; }
.sh-chat__search { padding: 12px; border-bottom: 1px solid var(--sh-border); }
.sh-chat__search input { width: 100%; padding: 9px 12px; border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius-pill); font-size: .85rem; }
.sh-chat__thread-item { display: flex; gap: 11px; align-items: flex-start; padding: 13px 14px; border-bottom: 1px solid var(--sh-slate-100); cursor: pointer; text-align: left; width: 100%; background: none; border-left: none; border-right: none; border-top: none; font-family: inherit; }
.sh-chat__thread-item:hover { background: var(--sh-slate-50); }
.sh-chat__thread-item.is-active { background: var(--sh-primary-soft); }
.sh-chat__thread-body { min-width: 0; flex: 1 1 auto; }
.sh-chat__thread-name { font-weight: 700; font-size: .88rem; color: var(--sh-ink); font-family: var(--sh-font-head); display: flex; align-items: center; gap: 6px; }
.sh-chat__thread-preview { font-size: .8rem; color: var(--sh-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-chat__thread-time { font-size: .7rem; color: var(--sh-slate-400); flex: 0 0 auto; }
.sh-chat__unread { min-width: 18px; height: 18px; border-radius: var(--sh-radius-pill); background: var(--sh-primary); color: #fff; font-size: .68rem; font-weight: 700; display: grid; place-items: center; padding: 0 5px; }
.sh-chat__panel { display: flex; flex-direction: column; min-width: 0; }
.sh-chat__head { display: flex; align-items: center; gap: 12px; padding: 13px 18px; border-bottom: 1px solid var(--sh-border); flex: 0 0 auto; }
.sh-chat__body { flex: 1 1 auto; overflow-y: auto; padding: 20px 18px; display: flex; flex-direction: column; gap: 14px; background: var(--sh-slate-50); }
.sh-chat__daysep { text-align: center; font-size: .72rem; color: var(--sh-slate-400); font-weight: 600; }
.sh-bubble { max-width: 74%; padding: 11px 15px; border-radius: 16px; font-size: .9rem; line-height: 1.5; }
.sh-bubble--in { background: #fff; border: 1px solid var(--sh-border); border-bottom-left-radius: 5px; align-self: flex-start; color: var(--sh-slate-700); }
.sh-bubble--out { background: var(--sh-primary); color: #fff; border-bottom-right-radius: 5px; align-self: flex-end; }
.sh-bubble__time { display: block; font-size: .68rem; opacity: .7; margin-top: 5px; }
.sh-chat__compose { display: flex; gap: 10px; align-items: flex-end; padding: 12px 14px; border-top: 1px solid var(--sh-border); background: #fff; flex: 0 0 auto; }
.sh-chat__compose textarea { flex: 1 1 auto; min-height: 42px; max-height: 110px; padding: 11px 14px; border: 1px solid var(--sh-slate-300); border-radius: var(--sh-radius); resize: none; font-family: var(--sh-font-body); font-size: .9rem; }
.sh-chat__safety { font-size: .74rem; color: var(--sh-text-muted); padding: 0 14px 12px; background: #fff; }

/* ---------- Children switcher (parent) ---------- */
.sh-kids { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 6px; }
.sh-kid { display: flex; gap: 11px; align-items: center; padding: 12px 16px 12px 12px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: #fff; cursor: pointer; flex: 0 0 auto; min-width: 190px; text-align: left; font-family: inherit; }
.sh-kid:hover { border-color: var(--sh-indigo-100); box-shadow: var(--sh-shadow-sm); }
.sh-kid.is-active { border-color: var(--sh-primary); background: var(--sh-primary-soft); box-shadow: 0 0 0 3px var(--sh-indigo-50); }
.sh-kid__name { font-family: var(--sh-font-head); font-weight: 700; font-size: .92rem; color: var(--sh-ink); }
.sh-kid__meta { font-size: .78rem; color: var(--sh-text-muted); }
.sh-kid--add { border-style: dashed; justify-content: center; color: var(--sh-primary); font-weight: 600; min-width: 150px; }

/* ---------- Availability manager ---------- */
.sh-avail-manager { overflow-x: auto; }
.sh-avail-manager table { width: 100%; border-collapse: separate; border-spacing: 4px; min-width: 620px; }
.sh-avail-manager th { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--sh-slate-500); font-family: var(--sh-font-head); padding-bottom: 4px; }
.sh-avail-manager td:first-child, .sh-avail-manager th:first-child { text-align: left; font-size: .8rem; color: var(--sh-slate-500); font-weight: 600; width: 74px; }
.sh-slot-toggle { width: 100%; padding: 9px 4px; border-radius: 8px; border: 1px solid var(--sh-border); background: #fff; font-size: .74rem; color: var(--sh-slate-400); cursor: pointer; font-family: var(--sh-font-head); font-weight: 600; }
.sh-slot-toggle:hover { border-color: var(--sh-primary); color: var(--sh-primary); }
.sh-slot-toggle.is-on { background: var(--sh-success-soft); border-color: var(--sh-success); color: var(--sh-success); }
.sh-slot-toggle.is-booked { background: var(--sh-indigo-50); border-color: var(--sh-indigo-100); color: var(--sh-primary); cursor: not-allowed; }

/* ---------- Earnings / stat rows ---------- */
.sh-statlist { list-style: none; padding: 0; margin: 0; }
.sh-statlist li { display: flex; justify-content: space-between; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--sh-slate-100); font-size: .9rem; }
.sh-statlist li:last-child { border-bottom: none; }
.sh-statlist .lbl { color: var(--sh-text-muted); }
.sh-statlist .val { font-family: var(--sh-font-head); font-weight: 700; color: var(--sh-ink); }

/* Bar chart (pure CSS, decorative — labelled for a11y) */
.sh-bars { display: flex; align-items: flex-end; gap: 8px; height: 150px; padding-top: 10px; }
.sh-bars__col { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 7px; height: 100%; justify-content: flex-end; }
.sh-bars__bar { width: 100%; max-width: 34px; border-radius: 6px 6px 0 0; background: var(--sh-indigo-100); min-height: 3px; }
.sh-bars__col.is-peak .sh-bars__bar { background: var(--sh-primary); }
.sh-bars__lbl { font-size: .7rem; color: var(--sh-text-muted); }

/* ---------- Auth pages ---------- */
.sh-auth {
  display: grid;
  grid-template-columns: minmax(320px, .9fr) minmax(420px, 1.1fr);
  width: min(1180px, calc(100% - 48px));
  min-height: min(720px, calc(100vh - var(--sh-header-h) - 48px));
  margin: 24px auto;
  background: var(--sh-surface);
  border: 1px solid var(--sh-border);
  border-radius: var(--sh-radius-lg);
  overflow: hidden;
  box-shadow: var(--sh-shadow-lg);
}
.sh-auth__aside { background: linear-gradient(160deg, var(--sh-indigo-700), var(--sh-indigo-900)); color: #e0e7ff; padding: clamp(36px, 5vw, 72px); display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.sh-auth__aside h2 { color: #fff; }
.sh-auth__points { list-style: none; padding: 0; margin: 26px 0 0; display: grid; gap: 14px; }
.sh-auth__points li { display: flex; gap: 12px; align-items: flex-start; font-size: .93rem; }
.sh-auth__tick { width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.16); color: #fff; display: grid; place-items: center; font-size: .72rem; flex: 0 0 auto; }
.sh-auth__main { display: flex; align-items: center; justify-content: center; min-width: 0; padding: clamp(36px, 5vw, 72px) clamp(28px, 5vw, 64px); background:#fff; }
.sh-auth__card { width: min(100%, 480px); max-width: 480px; margin-inline:auto; }
.sh-auth__divider { display: flex; align-items: center; gap: 14px; margin: 22px 0; color: var(--sh-slate-400); font-size: .8rem; }
.sh-auth__divider::before, .sh-auth__divider::after { content: ""; height: 1px; background: var(--sh-border); flex: 1 1 auto; }
.sh-pw-wrap { position: relative; }
.sh-pw-wrap input { padding-right: 68px !important; }
.sh-pw-toggle { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: none; color: var(--sh-primary); font-size: .8rem; font-weight: 700; cursor: pointer; padding: 6px 8px; border-radius: 6px; font-family: var(--sh-font-head); }
.sh-pw-toggle:hover { background: var(--sh-primary-soft); }
.sh-pw-meter { display: flex; gap: 4px; margin-top: 8px; }
.sh-pw-meter span { height: 4px; flex: 1 1 0; border-radius: var(--sh-radius-pill); background: var(--sh-slate-200); }
.sh-pw-meter[data-level="1"] span:nth-child(1) { background: var(--sh-danger); }
.sh-pw-meter[data-level="2"] span:nth-child(-n+2) { background: var(--sh-warning); }
.sh-pw-meter[data-level="3"] span:nth-child(-n+3) { background: var(--sh-info); }
.sh-pw-meter[data-level="4"] span { background: var(--sh-success); }

/* ---------- Subjects / category page ---------- */
.sh-subject-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sh-subject { display: flex; flex-direction: column; gap: 12px; padding: 22px; background: #fff; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); transition: .18s ease; }
.sh-subject:hover { border-color: var(--sh-indigo-100); box-shadow: var(--sh-shadow); transform: translateY(-2px); }
.sh-subject__icon { width: 52px; height: 52px; border-radius: 14px; background: var(--sh-indigo-50); color: var(--sh-primary); display: grid; place-items: center; font-size: 1.3rem; }
.sh-subject__name { font-family: var(--sh-font-head); font-weight: 700; font-size: 1.05rem; color: var(--sh-ink); margin: 0; }
.sh-subject__desc { font-size: .87rem; color: var(--sh-text-muted); margin: 0; }
.sh-subject__foot { margin-top: auto; padding-top: 12px; border-top: 1px dashed var(--sh-border); display: flex; justify-content: space-between; align-items: center; font-size: .82rem; }
.sh-subject__tags { display: flex; flex-wrap: wrap; gap: 6px; }

/* ---------- Pricing extras ---------- */
.sh-price-card__badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: var(--sh-primary); color: #fff; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: 5px 14px; border-radius: var(--sh-radius-pill); font-family: var(--sh-font-head); white-space: nowrap; }
.sh-price-card__per { font-size: .85rem; color: var(--sh-text-muted); font-weight: 500; }
.sh-price-card__tick { color: var(--sh-success); flex: 0 0 auto; font-weight: 800; }
.sh-price-card__cross { color: var(--sh-slate-300); flex: 0 0 auto; }
.sh-price-toggle { display: inline-flex; align-items: center; gap: 12px; padding: 6px; background: var(--sh-slate-100); border-radius: var(--sh-radius-pill); margin: 0 auto 34px; }
.sh-compare-table th:first-child { text-align: left; }
.sh-compare-table td { text-align: center; }

/* ---------- Contact ---------- */
.sh-contact-grid { display: grid; grid-template-columns: 1fr 380px; gap: 32px; align-items: start; }
.sh-contact-card { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: #fff; margin-bottom: 14px; }
.sh-contact-card__icon { width: 42px; height: 42px; border-radius: 12px; background: var(--sh-indigo-50); color: var(--sh-primary); display: grid; place-items: center; flex: 0 0 auto; }
.sh-contact-card h4 { margin: 0 0 3px; font-size: .95rem; }
.sh-contact-card p { margin: 0; font-size: .86rem; color: var(--sh-text-muted); }

/* ---------- Pagination ---------- */
.sh-pagination { display: flex; gap: 6px; justify-content: center; align-items: center; margin-top: 28px; flex-wrap: wrap; }
.sh-pagination a, .sh-pagination span { min-width: 38px; height: 38px; padding: 0 10px; display: grid; place-items: center; border-radius: 9px; border: 1px solid var(--sh-border); background: #fff; font-size: .88rem; font-weight: 600; color: var(--sh-slate-700); font-family: var(--sh-font-head); }
.sh-pagination a:hover { border-color: var(--sh-primary); color: var(--sh-primary); }
.sh-pagination .is-current { background: var(--sh-primary); border-color: var(--sh-primary); color: #fff; }
.sh-pagination .is-disabled { color: var(--sh-slate-300); background: var(--sh-slate-50); }

/* ---------- Skeleton compositions ---------- */
.sh-skel-line { height: 12px; margin-bottom: 9px; }
.sh-skel-line--sm { height: 9px; width: 55%; }
.sh-skel-line--lg { height: 18px; width: 72%; }
.sh-skel-avatar { width: 48px; height: 48px; border-radius: 12px; flex: 0 0 auto; }
.sh-skel-row { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--sh-slate-100); }
.sh-skel-row > div { flex: 1 1 auto; }

/* Screen-reader helper (WP core class, ensured present) */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ============================================================================
   PHASE 3 — Auth, application wizard, subject directory, pricing, contact, legal
   Additions below reuse the Phase 1 token set only (no new colors or fonts).
   ============================================================================ */

/* ---------- Phase 1/2 gap fixes ----------
   Referenced by archive-teacher.php and the Phase 3 page header helper but
   never defined. */
.sh-page-lead { color: var(--sh-slate-700); font-size: 1.125rem; max-width: 60ch; margin-bottom: 0; }
.sh-breadcrumbs { font-size: .82rem; color: var(--sh-text-muted); margin-bottom: 10px; }
.sh-breadcrumbs a { color: var(--sh-slate-500); }
.sh-mx-auto { margin-inline: auto; }

/* ---------- Multi-step wizard chrome ---------- */
.sh-wizard { max-width: 760px; margin-inline: auto; }
.sh-wizard-head { margin-bottom: 26px; }
.sh-wizard-head .sh-stepper { margin-bottom: 0; margin-top: 18px; }
.sh-stepper__item { cursor: pointer; user-select: none; }
.sh-stepper__item:hover { border-color: var(--sh-indigo-100); }
.sh-wizard__aside { display: grid; gap: 14px; }

/* Repeatable rows (subjects a teacher offers, children a parent links) */
.sh-repeater { display: grid; gap: 12px; }
.sh-repeater__row { display: grid; grid-template-columns: 1fr 1fr 130px auto; gap: 10px; align-items: end; padding: 14px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-sm); background: var(--sh-slate-50); }
.sh-repeater__row .sh-field { margin-bottom: 0; }
.sh-repeater__remove { background: none; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-sm); color: var(--sh-slate-500); cursor: pointer; padding: 11px 13px; font-family: var(--sh-font-head); }
.sh-repeater__remove:hover { border-color: var(--sh-danger); color: var(--sh-danger); background: var(--sh-danger-soft); }

/* Checkbox / radio grids used for subjects, levels and languages */
.sh-check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.sh-check-tile { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-sm); background: #fff; font-size: .9rem; color: var(--sh-slate-700); cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.sh-check-tile:hover { border-color: var(--sh-indigo-100); }
.sh-check-tile:has(input:checked) { border-color: var(--sh-primary); background: var(--sh-primary-soft); color: var(--sh-primary); font-weight: 600; }
.sh-check-tile input { flex: 0 0 auto; }

/* Review summary shown on the wizard's final step */
.sh-summary { list-style: none; padding: 0; margin: 0; }
.sh-summary li { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--sh-slate-100); font-size: .9rem; }
.sh-summary li:last-child { border-bottom: none; }
.sh-summary .lbl { color: var(--sh-text-muted); }
.sh-summary .val { font-weight: 600; color: var(--sh-ink); text-align: right; }

/* ---------- Auth extras ---------- */
.sh-auth__head { margin-bottom: 24px; }
.sh-auth__head h1 { font-size: 1.75rem; margin-bottom: 6px; }
.sh-auth__head p { color: var(--sh-text-muted); font-size: .93rem; margin: 0; }
.sh-auth__foot { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--sh-border); font-size: .9rem; color: var(--sh-text-muted); text-align: center; }
.sh-auth__legal { font-size: .78rem; color: var(--sh-text-muted); margin-top: 16px; }
.sh-auth__legal a { text-decoration: underline; text-underline-offset: 2px; }
.sh-modal .sh-auth__aside { display: none; }

/* ---------- Subject directory ---------- */
.sh-subject-group { margin-bottom: 40px; }
.sh-subject-group:last-child { margin-bottom: 0; }
.sh-subject-group__head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; padding-bottom: 10px; border-bottom: 1px solid var(--sh-border); }
.sh-subject-group__title { font-family: var(--sh-font-head); font-weight: 700; font-size: 1.15rem; margin: 0; }
.sh-subject__name a:hover { color: var(--sh-primary); }

/* ---------- Pricing extras ---------- */
.sh-price-toggle .sh-btn { border: none; }
.sh-fee-note { font-size: .85rem; color: var(--sh-text-muted); }
.sh-compare-table td:first-child, .sh-compare-table th:first-child { text-align: left; font-weight: 600; color: var(--sh-ink); }

/* ---------- FAQ group tabs ---------- */
.sh-faq-tabs { display: flex; justify-content: center; margin-bottom: 26px; }
.sh-accordion { max-width: 760px; margin-inline: auto; }
.sh-accordion--wide { max-width: none; }
.sh-accordion__q:focus-visible { outline: 3px solid var(--sh-indigo-100); outline-offset: -3px; }

/* ---------- Legal / policy pages ---------- */
.sh-legal-layout { display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: start; }
.sh-legal__meta { display: flex; gap: 8px 18px; flex-wrap: wrap; font-size: .85rem; color: var(--sh-text-muted); margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--sh-border); }
.sh-legal__section { scroll-margin-top: calc(var(--sh-header-h) + 24px); margin-bottom: 40px; }
.sh-legal__section:last-child { margin-bottom: 0; }
.sh-legal__section > h2 { display: flex; gap: 12px; align-items: baseline; font-size: 1.4rem; }
.sh-legal__num { color: var(--sh-primary); font-size: .95rem; flex: 0 0 auto; }

/* Safety rule cards (child & teacher safety pages) */
.sh-rules { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 20px 0; }
.sh-rule { display: flex; gap: 13px; align-items: flex-start; padding: 18px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: #fff; }
.sh-rule__icon { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto; font-size: .95rem; background: var(--sh-indigo-50); color: var(--sh-primary); }
.sh-rule--do .sh-rule__icon { background: var(--sh-success-soft); color: var(--sh-success); }
.sh-rule--dont .sh-rule__icon { background: var(--sh-danger-soft); color: var(--sh-danger); }
.sh-rule h4 { margin: 0 0 3px; font-size: .95rem; }
.sh-rule p { margin: 0; font-size: .86rem; color: var(--sh-text-muted); }

/* ---------- Phase 3 responsive ---------- */
@media (max-width: 1024px) {
  .sh-legal-layout { grid-template-columns: 1fr; }
  .sh-legal-layout > nav { position: static !important; }
  .sh-repeater__row { grid-template-columns: 1fr 1fr; }
  .sh-rules { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .sh-repeater__row { grid-template-columns: 1fr; }
  .sh-check-grid { grid-template-columns: 1fr; }
  .sh-price-toggle { width: 100%; justify-content: center; }
  .sh-auth__head h1 { font-size: 1.5rem; }
  .sh-summary li { flex-direction: column; gap: 2px; }
  .sh-summary .val { text-align: left; }
}

/* ============================================================
   PHASE 2 — RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  .sh-auth { grid-template-columns: 1fr; width:min(680px, calc(100% - 32px)); min-height:0; margin:16px auto; }
  .sh-auth__aside { display: none; }
}

@media (max-width: 1024px) {
  .sh-split, .sh-split--even, .sh-split--wide { grid-template-columns: 1fr; }
  .sh-subject-grid { grid-template-columns: repeat(2, 1fr); }
  .sh-contact-grid { grid-template-columns: 1fr; }
  .sh-dash__mobilebar { display: block; }
  .sh-chat { grid-template-columns: 240px 1fr; }
}

@media (max-width: 720px) {
  .sh-dash__main { padding: 20px 16px; }
  .sh-form__row, .sh-form__row--3 { grid-template-columns: 1fr; }
  .sh-subject-grid { grid-template-columns: 1fr; }
  .sh-nextclass { flex-direction: column; align-items: flex-start; }
  .sh-nextclass__cta { margin-left: 0; width: 100%; }
  .sh-nextclass__cta .sh-btn { flex: 1 1 auto; }
  .sh-verify { flex-direction: column; }
  .sh-verify__actions { margin-left: 0; width: 100%; }
  .sh-verify__actions .sh-btn { width: 100%; }
  .sh-item { flex-wrap: wrap; }
  .sh-item__aside { margin-left: 0; width: 100%; justify-content: flex-start; padding-top: 8px; }
  .sh-ring { width: 108px; height: 108px; }
  .sh-ring__inner { width: 84px; height: 84px; }
  .sh-ring__value { font-size: 1.4rem; }

  /* Chat collapses to a single pane: list first, thread when opened */
  .sh-chat { grid-template-columns: 1fr; height: auto; }
  .sh-chat__list { border-right: none; border-bottom: 1px solid var(--sh-border); max-height: 300px; }
  .sh-chat__panel { min-height: 420px; }
  .sh-bubble { max-width: 86%; }

  /* Stepper condenses to numbers only */
  .sh-stepper__item { padding: 8px; }
  .sh-stepper__item span:not(.sh-stepper__num) { display: none; }
  .sh-stepper__item.is-active span:not(.sh-stepper__num) { display: inline; }
}

/* ============================================================================
   PHASE 3 — final page templates (auth, pricing block, contact form)
   Additive only: no existing selector above is redefined, and no new tokens.
   ============================================================================ */

/* Auth: live region for the JS/plugin response (collapses when empty) */
.sh-auth__notice:empty { display: none; }
.sh-auth__notice .sh-notice:last-child { margin-bottom: 16px; }

/* Pricing block: .sh-card clips overflow, so the "Most popular" ribbon needs
   room above the grid and a card that lets it escape. */
.sh-pricing-block .sh-subject-grid { padding-top: 16px; align-items: stretch; }
.sh-pricing-block .sh-price-card { overflow: visible; position: relative; height: 100%; width: 100%; }

/* Contact: the AJAX form's inline status message + honeypot */
.sh-form__status:empty { display: none; }
.sh-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Legal: "last updated" chip row sits tight under the page head */
.sh-legal__meta strong { color: var(--sh-slate-700); font-family: var(--sh-font-head); }

/* ============================================================================
   PHASE 4 — remaining dashboard sections
   Additive only: nothing above is redefined. Everything reuses existing tokens.
   ============================================================================ */

/* Guideline / rule lists used in Safety, Privacy, Consent and Video sections. */
.sh-ticklist { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.sh-ticklist li { position: relative; padding-left: 26px; font-size: .9rem; line-height: 1.55; color: var(--sh-slate-700); }
.sh-ticklist li::before {
  content: "✓"; position: absolute; left: 0; top: 1px;
  width: 18px; height: 18px; border-radius: 50%;
  display: grid; place-items: center; font-size: .66rem; font-weight: 800;
  background: rgba(16,185,129,.12); color: var(--sh-success);
}
.sh-ticklist--warn li::before { content: "!"; background: rgba(245,158,11,.14); color: var(--sh-warning); }

/* Two-column KPI + detail split that stacks under 900px (Reports, Consent). */
.sh-panelgrid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

/* Compact key/value grid for audit-log details and report meta. */
.sh-kv { display: grid; gap: 8px 16px; grid-template-columns: auto 1fr; font-size: .88rem; margin: 0; }
.sh-kv dt { color: var(--sh-text-muted); }
.sh-kv dd { margin: 0; color: var(--sh-ink); font-weight: 600; }

/* Media preview tile used by Content management and Consent evidence. */
.sh-thumb {
  aspect-ratio: 16 / 10; border-radius: 10px; overflow: hidden;
  background: var(--sh-slate-100); display: grid; place-items: center;
  border: 1px solid var(--sh-border);
}
.sh-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Small monospaced code/reference token (IP addresses, log refs). */
.sh-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .8rem; padding: 2px 6px; border-radius: 6px;
  background: var(--sh-slate-100); color: var(--sh-slate-700);
}

/* Final mobile hardening: all operational tables/forms must fit narrow screens. */
.sh-table-wrap, .sh-avail-manager, .sh-dashboard-main { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sh-table { min-width: 640px; }
.sh-video__link { position:absolute; right:12px; bottom:12px; z-index:2; background:#fff; padding:8px 12px; border-radius:999px; font-weight:700; text-decoration:none; }
@media (max-width:720px){
  .sh-table { min-width: 560px; }
  .sh-profile__tabs { overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; }
  .sh-pricing-grid { grid-template-columns:1fr; }
  .sh-avail { display:flex; overflow-x:auto; gap:8px; padding-bottom:8px; }
  .sh-avail__col { min-width:112px; flex:0 0 112px; }
  .sh-modal__dialog { width:min(94vw,560px); max-height:92vh; overflow:auto; }
  .sh-mobile-book { padding-bottom:max(10px, env(safe-area-inset-bottom)); }
}

/* Final mobile hardening: live classroom and operational forms */
.sh-classroom-page,.sh-classroom-frame{max-width:100%;min-width:0}
.sh-classroom-frame iframe,.sh-classroom-frame video{display:block;width:100%!important;max-width:100%;min-height:min(72vh,720px);border:0}
.sh-live-form input,.sh-live-form select,.sh-live-form textarea,.sh-live-form button{max-width:100%}
@media (max-width:720px){
  .sh-classroom-page{padding-left:0;padding-right:0}
  .sh-classroom-frame iframe,.sh-classroom-frame video{min-height:68vh}
  .sh-live-form .sh-form-grid,.sh-dashboard .sh-form-grid{grid-template-columns:1fr!important}
  .sh-dashboard-actions,.sh-live-form-actions{display:flex;flex-wrap:wrap;gap:8px}
  .sh-dashboard-actions>* ,.sh-live-form-actions>*{max-width:100%}
}
@media (max-width:420px){
  .sh-classroom-frame iframe,.sh-classroom-frame video{min-height:62vh}
}

/* Teacher application audit fixes */
.sh-switch{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;column-gap:14px;min-height:32px;width:100%;}
.sh-switch__track{border:1px solid var(--sh-slate-400);background:var(--sh-slate-300);box-shadow:inset 0 0 0 1px rgba(0,0,0,.03);}
.sh-switch input:checked + .sh-switch__track{background:var(--sh-primary);border-color:var(--sh-primary);}
.sh-switch > span:last-child{display:block;line-height:1.45;padding-left:2px;}
.sh-dropzone.has-file{border-color:var(--sh-primary);background:var(--sh-indigo-50,#eef2ff);}
.sh-dropzone.has-file .sh-dropzone__title{color:var(--sh-primary);font-weight:700;overflow-wrap:anywhere;}
.sh-repeater{display:grid;gap:12px;margin-bottom:12px;}
.sh-repeater__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:12px;align-items:end;padding:12px;border:1px solid var(--sh-border);border-radius:12px;background:#fff;}
#sh-ap-degrees .sh-repeater__row,#sh-ap-certs .sh-repeater__row{grid-template-columns:repeat(4,minmax(0,1fr)) auto;}
.sh-repeater__remove{width:36px;height:36px;border:1px solid var(--sh-border);border-radius:9px;background:#fff;cursor:pointer;color:var(--sh-danger,#b91c1c);font-size:18px;}
.sh-repeater__remove{display:inline-flex;align-items:center;justify-content:center;gap:7px;width:auto;min-width:92px;min-height:44px;padding:9px 13px;font-size:.82rem;font-weight:750;line-height:1;color:var(--sh-danger,#b91c1c);background:#fff5f5;border-color:#fecaca;}
.sh-repeater__remove::after{content:"Remove";}
.sh-repeater__remove .sh-trash-icon,.sh-repeater__remove svg{display:block;width:18px;height:18px;fill:currentColor;}
.sh-repeater__remove:hover,.sh-repeater__remove:focus-visible{background:#fee2e2;border-color:#ef4444;color:#991b1b;}
.sh-duration-input{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;}
.sh-duration-input>span{font-size:.86rem;font-weight:700;color:var(--sh-slate-600);}
.sh-availability-repeater .sh-repeater__row{grid-template-columns:minmax(140px,1.2fr) minmax(120px,1fr) minmax(120px,1fr) auto;}
.sh-application-success{max-width:720px;margin:20px auto;text-align:center;}
@media(max-width:760px){
 .sh-repeater__row,#sh-ap-degrees .sh-repeater__row,#sh-ap-certs .sh-repeater__row,.sh-availability-repeater .sh-repeater__row{grid-template-columns:1fr;}
 .sh-repeater__remove{justify-self:stretch;width:100%;}
 .sh-switch{grid-template-columns:46px minmax(0,1fr);}
}

/* 2.4.1 teacher application toggle alignment/contrast fix */
#sh-apply .sh-switch{display:flex!important;flex-direction:row!important;align-items:center!important;gap:12px!important;width:100%;min-height:36px;}
#sh-apply .sh-switch__track{display:inline-block!important;width:44px!important;height:26px!important;min-width:44px;border:2px solid #64748b!important;background:#cbd5e1!important;border-radius:999px!important;position:relative!important;}
#sh-apply .sh-switch__track::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);}
#sh-apply .sh-switch input:checked + .sh-switch__track{background:var(--sh-primary)!important;border-color:var(--sh-primary)!important;}
#sh-apply .sh-switch input:checked + .sh-switch__track::after{transform:translateX(18px);}
#sh-apply .sh-switch > span:last-child{padding:0!important;line-height:1.4;}

/* 1.4.2 teacher application subject hierarchy */
.sh-subject-groups{display:grid;gap:16px}.sh-subject-group{border:1px solid var(--sh-border,#e5e7eb);border-radius:12px;padding:14px}.sh-subject-group__title{font-weight:700;margin-bottom:10px}.sh-application-success{max-width:760px;margin-inline:auto}

/* 1.4.3 dashboard profile + switch polish */
.sh-dashboard .sh-switch,
.sh-dash-main .sh-switch,
[data-sh-rest-form] .sh-switch{display:flex!important;flex-direction:row!important;align-items:center!important;gap:12px!important;width:100%;min-height:36px;}
[data-sh-rest-form] .sh-switch__track{display:inline-block!important;width:44px!important;height:26px!important;min-width:44px;border:2px solid #64748b!important;background:#cbd5e1!important;border-radius:999px!important;position:relative!important;}
[data-sh-rest-form] .sh-switch__track::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28);transition:transform .18s ease;}
[data-sh-rest-form] .sh-switch input:checked + .sh-switch__track{background:var(--sh-primary)!important;border-color:var(--sh-primary)!important;}
[data-sh-rest-form] .sh-switch input:checked + .sh-switch__track::after{transform:translateX(18px);}
.sh-teacher-profile-summary{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.sh-teacher-profile-summary__avatar{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid #e2e8f0;background:#f8fafc;}
.sh-teacher-profile-summary__avatar--empty{display:grid;place-items:center;font-size:34px;}
@media(max-width:640px){.sh-teacher-profile-summary{align-items:flex-start}.sh-teacher-profile-summary__avatar{width:68px;height:68px}}

/* Admin operations UI — human-friendly, responsive, no raw debug tables. */
.sh-admin-review__head{display:flex;align-items:center;gap:16px;margin-bottom:18px}.sh-avatar--lg{width:72px;height:72px;border-radius:50%;object-fit:cover}.sh-admin-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}.sh-admin-detail-grid>div{padding:12px;border:1px solid var(--sh-border);border-radius:12px;background:var(--sh-bg-soft,#f8fafc)}.sh-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.sh-badge{display:inline-flex;padding:4px 9px;border-radius:999px;background:#eef2ff;font-size:12px;font-weight:700}.sh-badge--success{background:#ecfdf3;color:#067647}.sh-badge--warning{background:#fffaeb;color:#b54708}.sh-btn--danger{background:#b42318;color:#fff;border-color:#b42318}.sh-admin-role{padding:12px 0;border-bottom:1px solid var(--sh-border)}.sh-admin-role summary{cursor:pointer}.sh-chip-list{display:flex;gap:6px;flex-wrap:wrap;padding:12px 0}.sh-chip{font-size:12px;padding:5px 8px;border-radius:8px;background:#f2f4f7}.sh-simple-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:8px 0}.sh-simple-row:has([data-key]){grid-template-columns:minmax(120px,.5fr) minmax(180px,1fr) auto}.sh-admin-filter{display:grid;grid-template-columns:minmax(180px,2fr) minmax(160px,1fr) auto;gap:12px;align-items:end}.sh-admin-review h3{margin-top:18px;margin-bottom:8px}@media(max-width:900px){.sh-admin-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sh-admin-filter{grid-template-columns:1fr}.sh-simple-row,.sh-simple-row:has([data-key]){grid-template-columns:1fr}.sh-actions .sh-btn{width:100%}}@media(max-width:520px){.sh-admin-detail-grid{grid-template-columns:1fr}.sh-admin-review__head{align-items:flex-start}.sh-table td{white-space:normal}}
.sh-home-banner__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}.sh-home-banner__image{width:100%;height:auto;border-radius:14px;display:block}@media(max-width:760px){.sh-home-banner__grid{grid-template-columns:1fr}}
/* 1.5.2 teacher directory: readable vertical cards, no wasted half-page whitespace. */
.sh-results-grid{grid-template-columns:minmax(0,680px);justify-content:start}
.sh-teacher-card{max-width:680px;width:100%}
.sh-teacher-card__intro{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}
@media (max-width:900px){.sh-results-grid{grid-template-columns:1fr}.sh-teacher-card{max-width:none}}

/* Booking lifecycle UX */
.sh-badge{display:inline-flex;align-items:center;padding:.22rem .55rem;border-radius:999px;background:#eef2ff;font-size:.78rem;font-weight:700;margin-top:.35rem}.sh-inline-form{display:inline-flex;gap:.5rem;align-items:end;flex-wrap:wrap;margin-top:.65rem}.sh-inline-form .sh-field{margin:0;min-width:220px}

@media (max-width: 520px) { .sh-auth { width:calc(100% - 20px); margin:10px auto; border-radius:14px; } .sh-auth__main { padding:28px 18px; } .sh-auth__card { max-width:none; } }

/* === Skill Hub LMS 1.6.0 final role-dashboard UX cleanup === */
.sh-final-avatar{border-radius:50%;object-fit:cover;background:#eef3f8;border:1px solid var(--sh-border,#dbe3ec);flex:0 0 auto}.sh-thread,.sh-case,.sh-assignment,.sh-submission{border:1px solid var(--sh-border,#dbe3ec);border-radius:16px;padding:16px;background:#fff}.sh-thread__messages{display:flex;flex-direction:column;gap:8px;margin:14px 0;max-height:420px;overflow:auto;padding:4px}.sh-bubble{max-width:78%;border-radius:14px;padding:10px 12px;background:#f2f5f8;margin:6px 0}.sh-bubble.is-mine{margin-left:auto;background:#e8f1ff}.sh-bubble small{display:block;margin-top:5px;opacity:.65;font-size:.72rem}.sh-success-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:#eaf8ef;color:#16803a;font-size:30px;font-weight:800}.sh-application-success{text-align:center;max-width:760px;margin:0 auto}.sh-review-steps{display:grid;gap:10px;text-align:left;list-style:none;padding:0;margin:22px 0}.sh-review-steps li{display:grid;gap:3px;padding:14px;border:1px solid var(--sh-border,#dbe3ec);border-radius:12px}.sh-review-steps span{color:var(--sh-muted,#637083);font-size:.9rem}.sh-profile-card{display:flex;gap:14px;align-items:center}.sh-dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.sh-action-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.sh-admin-record{gap:12px}.sh-admin-record>div:first-child{min-width:0}.sh-admin-record strong,.sh-admin-record span{overflow-wrap:anywhere}
@media(max-width:720px){.sh-bubble{max-width:92%}.sh-thread,.sh-case,.sh-assignment,.sh-submission{padding:12px}.sh-admin-record{align-items:flex-start;flex-direction:column}.sh-action-row,.sh-inline-form{width:100%}.sh-action-row .sh-btn,.sh-inline-form .sh-btn{width:100%}}

.sh-admin-course-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin-bottom:14px;background:#f2f4f7}.sh-admin-booking{min-width:0}.sh-dash__count{min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:#d92d20;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;margin-left:auto}.sh-dash__side nav a{display:flex;align-items:center;gap:8px}.sh-dash__side nav a>span:nth-child(2){min-width:0;flex:1}

.sh-course-card__image,.sh-course-hero-image{width:100%;object-fit:cover;border-radius:14px;background:#f2f4f7}.sh-course-card__image{aspect-ratio:16/9;margin-bottom:14px}.sh-course-hero-image{max-height:420px;margin-bottom:20px}

/* Responsive approved teacher video player */
.sh-video-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#0f172a;margin:14px 0}
.sh-video-embed iframe,.sh-video-embed video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain;background:#000}

/* Skill Hub LMS professional dashboard framework — 1.7.0 */
.sh-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.sh-inline-search{display:flex;gap:8px;align-items:center}.sh-inline-search input{min-width:240px}.sh-record-list{display:grid;gap:10px}.sh-record-accordion{background:#fff;border:1px solid var(--sh-border,#e5e7eb);border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(15,23,42,.03)}.sh-record-accordion>summary{list-style:none;cursor:pointer;padding:14px 16px}.sh-record-accordion>summary::-webkit-details-marker{display:none}.sh-record-summary{display:flex;align-items:center;gap:12px;min-width:0}.sh-record-main{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.sh-record-main strong{font-size:14px;color:#0f172a}.sh-record-main span{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sh-record-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:#64748b}.sh-record-chevron{font-size:18px;transition:transform .2s ease}.sh-record-accordion[open] .sh-record-chevron{transform:rotate(180deg)}.sh-record-detail{border-top:1px solid var(--sh-border,#e5e7eb);padding:18px;background:#fbfdff}.sh-review-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.sh-review-tabs>section{background:#fff;border:1px solid #e8edf3;border-radius:12px;padding:14px}.sh-review-tabs h3{margin:0 0 10px;font-size:14px}.sh-review-tabs p{margin:6px 0}.sh-review-decision{margin-top:16px;padding:16px;border-radius:12px;background:#f6f9ff;border:1px solid #dbe7ff;display:flex;justify-content:space-between;gap:16px;align-items:center}.sh-avatar--placeholder{display:inline-grid;place-items:center;background:#eaf1ff;color:#195cc8;font-weight:700}.sh-pagination{display:flex;gap:6px;justify-content:center;margin-top:18px}.sh-pagination a{min-width:34px;height:34px;display:grid;place-items:center;border:1px solid #d9e0ea;border-radius:9px;background:#fff;text-decoration:none}.sh-pagination a.is-current{background:#175fc7;color:#fff;border-color:#175fc7}.sh-admin-record{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid #edf1f5}.sh-admin-record:last-child{border-bottom:0}.sh-admin-record>div:first-child{min-width:0}.sh-admin-record strong{font-size:14px}.sh-admin-record .sh-muted{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:56ch}.sh-dashboard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}.sh-admin-course-cover{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:10px;margin-bottom:12px}.sh-dash__side nav a{position:relative}.sh-dash__count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-grid;place-items:center;background:#dc2626;color:#fff;font-size:11px;font-weight:700}.sh-dash__brand{padding:12px;border-radius:12px}.sh-dash__brand:hover{background:#f7f9fc}.sh-dash__brand .sh-avatar{box-shadow:0 0 0 2px #fff,0 0 0 3px #dbe3ee}
@media(max-width:800px){.sh-record-meta{display:none}.sh-review-tabs{grid-template-columns:1fr}.sh-review-decision{align-items:flex-start;flex-direction:column}.sh-inline-search{width:100%}.sh-inline-search input{min-width:0;flex:1}}
.sh-side-profile{margin:0 0 10px}.sh-side-profile>summary{list-style:none;cursor:pointer}.sh-side-profile>summary::-webkit-details-marker{display:none}.sh-side-profile__panel{padding:0 12px 12px}.sh-side-profile__panel input[type=file]{font-size:11px;max-width:100%}.sh-booking-admin-actions{display:grid;grid-template-columns:minmax(240px,1fr) auto;gap:14px;align-items:end;margin-top:12px}.sh-booking-admin-actions .sh-field{margin:0}@media(max-width:720px){.sh-booking-admin-actions{grid-template-columns:1fr}}

/* Unified account photo editor — one clear control for every dashboard role. */
.sh-profile-photo-card{display:grid;grid-template-columns:132px minmax(0,1fr);gap:24px;align-items:center;padding:24px;border:1px solid #dce5f1;background:linear-gradient(135deg,#fff 0%,#f8fbff 100%);box-shadow:0 12px 32px rgba(28,67,117,.08);overflow:hidden}.sh-profile-photo-card__media{position:relative;width:132px;height:132px}.sh-profile-photo-card__media>img{display:block;width:100%;height:100%;border-radius:22px;object-fit:cover;object-position:50% 18%;background:#edf3fa;border:4px solid #fff;box-shadow:0 8px 24px rgba(15,23,42,.16)}.sh-profile-photo-card__camera{position:absolute;right:-6px;bottom:-6px;width:42px;height:42px;display:grid;place-items:center;border:4px solid #fff;border-radius:50%;background:var(--sh-primary,#2563eb);color:#fff;font-size:18px;font-weight:800;cursor:pointer;box-shadow:0 5px 16px rgba(37,99,235,.3);transition:transform .18s ease,background .18s ease}.sh-profile-photo-card__camera:hover{transform:translateY(-2px);background:#174fc5}.sh-profile-photo-card__content{min-width:0}.sh-profile-photo-card__content .sh-card__title{margin:4px 0}.sh-profile-photo-card__content>.sh-muted{margin:0 0 14px}.sh-profile-photo-card__form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.sh-profile-photo-card__form input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.sh-profile-photo-card__picker{display:inline-flex;align-items:center;min-height:38px;padding:8px 14px;border:1px solid #cbd8e8;border-radius:10px;background:#fff;color:#243b5a;font-weight:700;cursor:pointer}.sh-profile-photo-card__help{margin:10px 0 0;color:#6b7b91;font-size:.82rem}.sh-side-profile .sh-dash__brand{cursor:default}
@media(max-width:640px){.sh-profile-photo-card{grid-template-columns:92px minmax(0,1fr);gap:16px;padding:18px}.sh-profile-photo-card__media{width:92px;height:92px}.sh-profile-photo-card__media>img{border-radius:18px}.sh-profile-photo-card__camera{width:36px;height:36px;right:-5px;bottom:-5px}.sh-profile-photo-card__form{align-items:stretch}.sh-profile-photo-card__picker,.sh-profile-photo-card__form .sh-btn{justify-content:center}.sh-profile-photo-card__help{grid-column:1/-1}}


/* 1.7.1 scalable operations tables — Admin + Teacher */
.sh-ops-table{min-width:1180px}.sh-ops-table th{white-space:nowrap}.sh-ops-row td{vertical-align:middle}.sh-ops-row:hover td{background:#fbfdff}.sh-row-toggle{width:32px;height:32px;border:1px solid #d9e1eb;border-radius:9px;background:#fff;color:#334155;display:inline-grid;place-items:center;cursor:pointer;font-size:18px;line-height:1;transition:.18s}.sh-row-toggle:hover{background:#f1f5f9;border-color:#cbd5e1}.sh-row-toggle[aria-expanded="true"]{transform:rotate(180deg);background:#edf4ff;color:#175fc7}.sh-ops-detail-row>td{padding:0!important;background:#f8fbff!important}.sh-ops-detail-row[hidden]{display:none!important}.sh-ops-detail-row>td>.sh-ops-detail{padding:18px}.sh-ops-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.sh-ops-detail>div{background:#fff;border:1px solid #e3e9f1;border-radius:11px;padding:12px}.sh-ops-detail strong{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#64748b;margin-bottom:5px}.sh-ops-detail p{margin:0;color:#0f172a;overflow-wrap:anywhere}.sh-ops-detail-row .sh-actions,.sh-ops-detail-row .sh-ops-actions,.sh-ops-detail-row .sh-booking-admin-actions{padding:0 18px 18px}.sh-booking-admin-actions{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(280px,1.4fr) auto;gap:12px;align-items:end}.sh-field--grow{min-width:0}.sh-inline-action-form{display:flex;gap:12px;align-items:end;flex-wrap:wrap;width:100%}.sh-inline-action-form .sh-field{flex:1 1 360px}.sh-inline-action-form textarea,.sh-booking-admin-actions textarea{min-height:72px}.sh-ops-actions{display:grid;grid-template-columns:repeat(2,minmax(280px,1fr));gap:14px}.sh-ops-actions .sh-card{margin:0}@media(max-width:900px){.sh-booking-admin-actions{grid-template-columns:1fr}.sh-ops-actions{grid-template-columns:1fr}.sh-ops-table{min-width:980px}}

/* 1.7.2 — scalable admin support/safety queues and course media */
.sh-case-detail{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.8fr);gap:24px;padding:18px 6px}.sh-case-detail__body,.sh-case-detail__manage{min-width:0}.sh-case-detail__manage{padding-left:20px;border-left:1px solid var(--sh-border,#e5e7eb)}.sh-course-cover-placeholder{height:180px;border-radius:14px;background:#f3f4f6;display:grid;place-items:center;color:#6b7280;font-weight:700;margin-bottom:14px}.sh-admin-course-cover{width:100%;height:180px;object-fit:cover;border-radius:14px;margin-bottom:14px}.sh-dash__count{min-width:10px;height:10px;padding:0;border-radius:999px;background:#dc2626;color:transparent;font-size:0;box-shadow:0 0 0 3px rgba(220,38,38,.12)}@media(max-width:900px){.sh-case-detail{grid-template-columns:1fr}.sh-case-detail__manage{padding-left:0;border-left:0;border-top:1px solid var(--sh-border,#e5e7eb);padding-top:18px}}

/* Skill Hub LMS 1.9.0 — customizable homepage / responsive presentation */
.sh-home-hidden{display:none!important}
@media (min-width:769px){.sh-hide-desktop{display:none!important}}
@media (max-width:768px){.sh-hide-mobile{display:none!important}}

.sh-home-teachers{background:var(--sh-surface);border-block:1px solid var(--sh-border)}
.sh-home-teachers .sh-results-grid{grid-template-columns:repeat(var(--home-teacher-cols,3),minmax(0,1fr));gap:18px;justify-content:stretch}
.sh-home-teachers .sh-teacher-card{max-width:none;min-width:0}
.sh-home-teachers .sh-teacher-card__top{padding:14px 14px 0;gap:10px}
.sh-home-teachers .sh-teacher-card__avatar img{width:58px;height:58px;border-radius:14px}
.sh-home-teachers .sh-teacher-card__name{font-size:.98rem;flex-wrap:wrap}
.sh-home-teachers .sh-teacher-card__subjects{font-size:.8rem;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sh-home-teachers .sh-teacher-card__meta{font-size:.76rem;gap:4px 9px}
.sh-home-teachers .sh-teacher-card>.sh-teacher-card__meta{padding:9px 14px 0!important}
.sh-home-teachers .sh-teacher-card__intro{padding:9px 14px;font-size:.82rem;line-height:1.45}
.sh-home-teachers .sh-teacher-card__tags{padding:0 14px 9px}
.sh-home-teachers .sh-teacher-card__pricing{padding:10px 14px;gap:14px;margin-bottom:10px}
.sh-home-teachers .sh-teacher-card__price .amt{font-size:1rem}
.sh-home-teachers .sh-teacher-card__footer{padding:0 14px 14px;gap:6px;flex-wrap:wrap}
.sh-home-teachers .sh-teacher-card__footer .sh-btn{padding:7px 10px;font-size:.76rem}
.sh-home-teachers .sh-teacher-card__compare{font-size:.72rem}
body:not(.customize-preview) .sh-home-teachers:not(.sh-show-teacher-intro) .sh-teacher-card__intro{display:none}

.sh-home-role-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.sh-home-safety-grid{grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.sh-home-safety-card{background:var(--sh-indigo-900);color:#e0e7ff}
.sh-home-safety-card h3{color:#fff}
.sh-home-cta{background:linear-gradient(135deg,var(--sh-indigo-700),var(--sh-indigo-500));color:#fff}
.sh-home-cta h2{color:#fff}.sh-home-cta p{color:#e0e7ff;max-width:52ch;margin:0 auto 24px}.sh-home-cta__buttons{justify-content:center}.sh-home-cta__secondary{background:#fff;color:var(--sh-indigo-700)}

.sh-home-promo__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:34px;align-items:center;overflow:hidden}
.sh-home-promo__media{min-height:300px}.sh-home-promo__media img{width:100%;height:100%;min-height:300px;max-height:430px;object-fit:cover;border-radius:var(--sh-radius-lg)}
.sh-home-promo--right .sh-home-promo__media{order:2}.sh-home-promo--right .sh-home-promo__content{order:1}
.sh-home-promo__facts{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.sh-home-promo__facts span{min-width:110px;padding:10px 12px;background:var(--sh-surface);border:1px solid var(--sh-border);border-radius:12px}.sh-home-promo__facts small,.sh-home-promo__facts strong{display:block}.sh-home-promo__facts small{color:var(--sh-text-muted);font-size:.72rem}.sh-home-promo__facts strong{margin-top:2px}

.sh-footer__mobile,.sh-footer__mobile-note{display:none}
@media(max-width:768px){
 .sh-home-teachers .sh-results-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .sh-home-teachers .sh-teacher-card__top{display:block;padding:10px 10px 0}
 .sh-home-teachers .sh-teacher-card__avatar{margin-bottom:8px}.sh-home-teachers .sh-teacher-card__avatar img{width:52px;height:52px}
 .sh-home-teachers .sh-teacher-card__name{font-size:.86rem}.sh-home-teachers .sh-teacher-card__name .sh-badge{font-size:.58rem;padding:2px 5px}
 .sh-home-teachers .sh-teacher-card__subjects{font-size:.7rem}.sh-home-teachers .sh-teacher-card__meta{font-size:.66rem}
 .sh-home-teachers .sh-teacher-card>.sh-teacher-card__meta{padding:7px 10px 0!important}.sh-home-teachers .sh-teacher-card__tags{padding:0 10px 7px}.sh-home-teachers .sh-teacher-card__pricing{padding:8px 10px;display:grid;grid-template-columns:1fr 1fr;gap:5px}.sh-home-teachers .sh-teacher-card__price .amt{font-size:.82rem}.sh-home-teachers .sh-teacher-card__footer{padding:0 10px 10px;display:grid;grid-template-columns:1fr 1fr}.sh-home-teachers .sh-teacher-card__footer .sh-btn{padding:6px 4px;font-size:.65rem}.sh-home-teachers .sh-teacher-card__compare{display:none}
 .sh-home-role-grid{grid-template-columns:1fr 1fr!important;gap:10px}.sh-home-role-grid .sh-card{padding:16px}.sh-home-role-grid h3{font-size:1rem}.sh-home-role-grid p{font-size:.78rem}
 .sh-home-safety-grid{grid-template-columns:1fr!important;gap:22px}.sh-home-promo__grid{grid-template-columns:1fr;gap:18px;padding:16px}.sh-home-promo__media,.sh-home-promo__media img{min-height:190px;max-height:260px}.sh-home-promo--right .sh-home-promo__media,.sh-home-promo--right .sh-home-promo__content{order:initial}.sh-home-promo__facts{gap:7px}.sh-home-promo__facts span{min-width:0;flex:1;padding:8px}
 .sh-footer{padding:28px 0 18px;margin-top:24px}.sh-footer__desktop{display:none!important}.sh-footer__mobile{display:block;text-align:center}.sh-footer__mobile p{margin:10px auto;color:#a5b4fc;font-size:.82rem;max-width:30ch}.sh-footer__mobile-badges{justify-content:center;flex-wrap:wrap}.sh-footer__mobile-links{display:flex;justify-content:center;gap:16px;margin-top:14px;font-size:.78rem}.sh-footer__bottom{margin-top:18px;padding-top:14px;display:block;text-align:center;font-size:.72rem}.sh-footer__desktop-note{display:none}.sh-footer__mobile-note{display:block;margin-top:5px;color:#a5b4fc}
}
@media(max-width:420px){.sh-home-teachers .sh-results-grid{gap:8px}.sh-home-teachers .sh-teacher-card__footer{grid-template-columns:1fr}.sh-home-teachers .sh-teacher-card__footer .sh-btn{width:100%}.sh-home-teachers .sh-teacher-card__pricing{grid-template-columns:1fr}.sh-home-role-grid{grid-template-columns:1fr 1fr!important}}

/* Professional teacher cards and public profile — 4.4.14. */
.shp-teacher-grid{align-items:start!important}
.shp-teacher{width:100%;min-height:0!important;border:1px solid #dce5f2;border-radius:20px!important;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.07);isolation:isolate}
.shp-teacher:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#2563eb,#7c3aed,#14b8a6);z-index:5}
.shp-teacher:hover{transform:translateY(-6px);border-color:#b9cdfa;box-shadow:0 22px 50px rgba(30,64,175,.14)}
.shp-teacher__photo{height:auto!important;aspect-ratio:4/3;background:linear-gradient(135deg,#eaf1ff,#f8fafc)}
.shp-teacher__photo img{object-position:center top;transition:transform .35s ease}
.shp-teacher:hover .shp-teacher__photo img{transform:scale(1.035)}
.shp-teacher__photo:after{height:46%;background:linear-gradient(transparent,rgba(15,23,42,.32))}
.shp-teacher__presence{top:14px!important;left:14px!important;padding:6px 10px!important;border:1px solid rgba(255,255,255,.45);backdrop-filter:blur(8px);box-shadow:0 6px 18px rgba(15,23,42,.16)}
.shp-verified{left:14px;bottom:14px;padding:6px 10px;border:1px solid rgba(16,185,129,.16);font-size:.69rem}
.shp-teacher__body{display:flex;flex-direction:column;padding:17px 18px 18px!important;min-height:0!important}
.shp-teacher__body h3{margin:0 0 6px;font-size:1.08rem;line-height:1.25;letter-spacing:-.02em;color:#0f172a}
.shp-teacher__subjects{min-height:1.35em;margin-bottom:12px!important;color:#52637c!important;line-height:1.45}
.shp-teacher__facts{justify-content:flex-start;flex-wrap:wrap;min-height:0;margin:0 0 15px;padding:8px 10px;border-radius:10px;background:#f7f9fc;color:#53657f;font-weight:600}
.shp-teacher__price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px;margin-top:0;padding:13px 0 0;border-top:1px solid #e9eef5;color:#718096}
.shp-teacher__price strong{margin:0 2px;font-size:1.03rem;font-weight:800;color:#1d4ed8}
.shp-teacher__price:after{content:"View profile  →";margin-left:auto;color:#1d4ed8;font-size:.72rem;font-weight:800;letter-spacing:.01em}

.sh-profile__grid{grid-template-columns:minmax(0,1fr) 370px;gap:34px}
.sh-profile__head{align-items:center;gap:24px;min-height:180px;padding:26px 28px!important;border:1px solid #d8e4fb!important;border-radius:22px!important;background:linear-gradient(125deg,#fff 0%,#f5f8ff 60%,#eef2ff 100%)!important;box-shadow:0 16px 42px rgba(30,64,175,.09)!important}
.sh-profile__head:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#2563eb,#7c3aed)}
.sh-profile__head:after{right:-45px;top:-85px;width:220px;height:220px;background:linear-gradient(135deg,rgba(37,99,235,.09),rgba(124,58,237,.07))}
.sh-profile__avatar img{width:124px;height:124px;border-radius:24px;border:4px solid #fff;box-shadow:0 12px 28px rgba(15,23,42,.16)}
.sh-profile__name{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:8px;font-size:2rem;letter-spacing:-.035em}
.sh-profile__subjects{margin:0 0 13px;color:#45566f;font-size:.98rem;font-weight:600}
.sh-profile__facts{display:flex;flex-wrap:wrap;gap:8px 10px}
.sh-profile__facts>span{padding:7px 10px;border:1px solid #e2e8f0;border-radius:999px;background:rgba(255,255,255,.82);color:#52637b;font-size:.82rem}
.sh-profile__flags{margin-top:12px}
.sh-profile__tabs{border:1px solid #e4eaf3;border-radius:14px;padding:5px;background:rgba(255,255,255,.94);box-shadow:0 8px 22px rgba(15,23,42,.05)}
.sh-profile__tabs a{border-radius:10px;padding:12px 15px;font-weight:700;transition:background .18s,color .18s}
.sh-profile__tabs a:hover{background:#eef4ff;color:#1d4ed8}
.sh-booking-box{padding:28px!important;border:1px solid #cbdafa!important;border-radius:22px!important;background:linear-gradient(180deg,#fff 0%,#fafcff 100%);box-shadow:0 18px 46px rgba(30,64,175,.12)!important}
.sh-booking-box__price{padding-bottom:14px;border-bottom:1px solid #e7edf7;font-size:2rem}
.sh-booking-box__meta{margin:14px 0 18px;padding:8px 10px;border-radius:10px;background:#f3f6fb}
.sh-booking-box .sh-btn{min-height:48px;margin-top:9px;border-radius:12px;font-weight:750;box-shadow:none}
.sh-booking-box .sh-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(37,99,235,.12)}
.sh-booking-box__list{margin-top:22px;padding-top:18px;border-top:1px solid #e7edf7;gap:11px}
.sh-booking-box__list li{position:relative;padding-left:4px;color:#51647d}
.sh-booking-box__note{line-height:1.6}
@media(max-width:900px){.sh-profile__grid{grid-template-columns:1fr}.sh-profile__aside{order:-1}.sh-booking-box{position:static}}
@media(max-width:560px){.shp-teacher{border-radius:16px!important}.shp-teacher__body{padding:12px!important}.shp-teacher__body h3{font-size:.92rem}.shp-teacher__facts{padding:7px 8px;font-size:.66rem}.shp-teacher__price{display:block}.shp-teacher__price:after{display:block;margin:7px 0 0}.sh-profile__head{align-items:flex-start;min-height:0;padding:20px!important}.sh-profile__avatar img{width:82px;height:82px;border-radius:18px}.sh-profile__name{font-size:1.38rem}.sh-profile__facts>span{padding:5px 8px;font-size:.72rem}.sh-booking-box{padding:22px!important}}

/* Crop-safe card media and clear booking actions — 4.4.15. */
.shp-teacher{display:flex;flex-direction:column;background:#fff!important}
.shp-teacher__photo{height:250px!important;aspect-ratio:auto!important;padding:10px;background:linear-gradient(145deg,#f7f9fd,#eef3fb)!important}
.shp-teacher__photo>a{display:block;width:100%;height:100%;border-radius:14px;overflow:hidden;background:#fff}
.shp-teacher__photo img{width:100%;height:100%;object-fit:contain!important;object-position:center center!important;background:#fff}
.shp-teacher__photo:after{display:none}
.shp-teacher__body{flex:1}
.shp-teacher__body h3 a{color:#101828;text-decoration:none}
.shp-teacher__qualification{display:-webkit-box;min-height:2.7em;margin:0 0 10px!important;color:#475569!important;font-size:.76rem!important;line-height:1.4;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal!important}
.shp-teacher__price:after{display:none!important}
.shp-teacher__actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:15px;padding-top:14px;border-top:1px solid #e8edf5}
.shp-teacher__actions .sh-btn{min-height:40px;padding:8px 10px;border-radius:10px;justify-content:center;text-align:center;font-size:.74rem;font-weight:800}
.shp-teacher__actions .sh-btn--primary:last-child:nth-child(3){grid-column:1/-1}
.sh-profile__avatar{width:132px;height:132px;padding:5px;border-radius:26px;background:#fff;box-shadow:0 12px 28px rgba(15,23,42,.14)}
.sh-profile__avatar img{width:100%!important;height:100%!important;border:0!important;border-radius:21px!important;object-fit:contain!important;object-position:center center!important;background:#f8fafc;box-shadow:none!important}
.sh-profile__qualification{display:inline-flex;align-items:center;max-width:680px;margin:0 0 12px;padding:7px 11px;border:1px solid #dce6f5;border-radius:10px;background:#fff;color:#40526b;font-size:.84rem;font-weight:650;line-height:1.45}
@media(max-width:560px){.shp-teacher__photo{height:180px!important;padding:7px}.shp-teacher__actions{grid-template-columns:1fr}.shp-teacher__actions .sh-btn--primary:last-child:nth-child(3){grid-column:auto}.sh-profile__avatar{width:92px;height:92px;border-radius:20px}.sh-profile__avatar img{border-radius:15px!important}.sh-profile__qualification{font-size:.75rem}}

/* Final live responsive refinement — 4.4.16. */
.shp-teacher__photo{position:relative;isolation:isolate;background:#eef3fb!important}
.shp-teacher__photo-bg{position:absolute!important;inset:-16px!important;width:calc(100% + 32px)!important;height:calc(100% + 32px)!important;object-fit:cover!important;filter:blur(18px) saturate(.78);opacity:.3;transform:scale(1.08);z-index:-1}
.shp-teacher__photo>a{position:relative;z-index:1;background:rgba(255,255,255,.48);backdrop-filter:blur(2px)}
.shp-teacher__photo-main{object-fit:contain!important;object-position:center!important;background:transparent!important}
.sh-profile__avatar{position:relative;overflow:hidden;isolation:isolate;background:#e9eff8!important}
.sh-profile__avatar-bg{position:absolute!important;inset:-12px!important;width:calc(100% + 24px)!important;height:calc(100% + 24px)!important;object-fit:cover!important;filter:blur(12px) saturate(.8);opacity:.34;transform:scale(1.1);z-index:-1}
.sh-profile__avatar-main{position:relative;z-index:1;object-fit:contain!important;object-position:center!important;background:transparent!important}
@media(max-width:560px){
 body.home .shp-teacher-grid,body .sh-home-teachers .shp-teacher-grid{grid-template-columns:1fr!important;gap:18px!important}
 body.home .shp-teacher{width:100%;max-width:390px;margin-inline:auto}
 .shp-teacher__photo{height:230px!important;padding:9px}
 .shp-teacher__body{padding:16px!important}
 .shp-teacher__body h3{font-size:1.05rem}
 .shp-teacher__subjects{font-size:.78rem!important;white-space:normal!important}
 .shp-teacher__qualification{font-size:.76rem!important}
 .shp-teacher__facts{font-size:.72rem}
 .shp-teacher__price{font-size:.74rem}
 .shp-teacher__price strong{font-size:1rem}
 .shp-teacher__actions{grid-template-columns:1fr 1fr}
 .shp-teacher__actions .sh-btn--primary:last-child:nth-child(3){grid-column:1/-1}
 .sh-profile__grid{display:grid!important;grid-template-columns:1fr!important;gap:16px;padding-top:22px}
 .sh-profile__main{display:contents}
 .sh-profile__main>*{order:3}
 .sh-profile__main>.sh-profile__head{order:1;margin-bottom:0}
 .sh-profile__aside{order:2!important}
 .sh-profile__head{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;padding:18px!important}
 .sh-profile__name{font-size:1.3rem}
 .sh-profile__subjects{font-size:.78rem}
 .sh-booking-box{margin:0}
 .sh-profile__tabs{position:static;order:3}
}
/* 2.1.0 professional subject/application polish */
.sh-subject-accordion{border:1px solid var(--sh-border,#e5e7eb);border-radius:14px;margin:0 0 12px;background:#fff;overflow:hidden}.sh-subject-accordion>summary{cursor:pointer;padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;align-items:center}.sh-subject-accordion[open]>summary{border-bottom:1px solid var(--sh-border,#e5e7eb)}.sh-subject-accordion .sh-check-grid{padding:16px}.sh-account-danger{border:1px solid #fecaca;border-radius:14px;padding:18px;margin-top:24px;background:#fff}.sh-account-danger h3{margin-top:0}.sh-account-danger p{max-width:760px}.sh-teacher-card__video-action{position:static!important}

/* Skill Hub LMS operational UX 2.2 */
.sh-notification-bell{position:relative;margin-left:auto}.sh-notification-bell>summary{list-style:none;cursor:pointer;position:relative;font-size:1.2rem;padding:.5rem .65rem;border:1px solid var(--sh-border,#e4e7ec);border-radius:999px;background:#fff}.sh-notification-bell>summary::-webkit-details-marker{display:none}.sh-notification-count{position:absolute;right:-4px;top:-5px;min-width:18px;height:18px;border-radius:999px;background:#d92d20;color:#fff;font-size:11px;display:grid;place-items:center;padding:0 4px}.sh-notification-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:80;width:min(360px,88vw);max-height:420px;overflow:auto;background:#fff;border:1px solid var(--sh-border,#e4e7ec);box-shadow:0 18px 45px rgba(16,24,40,.16);border-radius:16px;padding:14px}.sh-notification-item{display:grid;gap:3px;padding:10px 0;border-bottom:1px solid #eef0f3}.sh-notification-item:last-child{border-bottom:0}.sh-notification-item small{color:#667085}.sh-subject-accordion,.sh-subject-admin-group{border:1px solid var(--sh-border,#e4e7ec);border-radius:14px;background:#fff}.sh-subject-accordion>summary,.sh-subject-admin-group>summary{cursor:pointer;padding:14px 16px;list-style:none}.sh-subject-accordion>summary::-webkit-details-marker,.sh-subject-admin-group>summary::-webkit-details-marker{display:none}.sh-subject-accordion[open],.sh-subject-admin-group[open]{box-shadow:0 8px 25px rgba(16,24,40,.06)}.sh-exam-runner{max-width:900px}.sh-exam-question{padding:18px 0}.sh-exam-question h3{display:flex;justify-content:space-between;gap:12px}.sh-question-prompt{font-size:1.08rem;line-height:1.65;margin:18px 0}.sh-check-card{display:block;border:1px solid #e4e7ec;border-radius:12px;padding:12px 14px;margin:8px 0;cursor:pointer}.sh-check-card:has(input:checked){border-color:#175cd3;background:#eff8ff}.sh-card--soft{background:#f8fafc;border:1px solid #eaecf0}.sh-record-accordion>summary{cursor:pointer;list-style:none}.sh-record-accordion>summary::-webkit-details-marker{display:none}.sh-record-summary{display:flex;align-items:center;gap:12px;justify-content:space-between}.sh-record-chevron{margin-left:auto}.sh-record-accordion[open] .sh-record-chevron{transform:rotate(180deg)}
@media(max-width:700px){.sh-notification-panel{position:fixed;right:12px;left:12px;top:76px;width:auto}.sh-exam-runner{padding:16px}.sh-subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Skill Hub LMS 2.4 — three-track launch architecture */
.sh-track-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sh-track-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--sh-border,#e5e7eb);border-radius:14px;padding:16px;cursor:pointer;background:#fff}
.sh-track-card:has(input:checked){border-color:var(--sh-primary,#4338ca);box-shadow:0 0 0 2px color-mix(in srgb,var(--sh-primary,#4338ca) 18%,transparent)}
.sh-track-card input{accent-color:var(--sh-primary,#4338ca)}
.sh-track-card span{font-size:.86rem;color:var(--sh-muted,#6b7280);line-height:1.45}
[hidden]{display:none!important}

/* 2.4.3 header: a single desktop row (logo | module navigation | account actions). */
@media (max-width: 980px) and (min-width: 721px) {
  .sh-header__inner { gap:12px; }
  .sh-nav { gap:2px; }
  .sh-nav a { padding:9px 8px; font-size:.82rem; }
  .sh-header__actions { gap:6px; }
  .sh-header__actions .sh-btn { padding-left:10px; padding-right:10px; }
}

/* 2.4.4 — compact Help/Security + real exam paper builder */
.sh-inner-accordion{border:1px solid var(--sh-border,#e4e7ec);border-radius:12px;background:#fff;overflow:hidden}.sh-inner-accordion>summary{cursor:pointer;list-style:none;padding:13px 15px;background:#f8fafc}.sh-inner-accordion>summary::-webkit-details-marker{display:none}.sh-inner-accordion[open]>summary{border-bottom:1px solid var(--sh-border,#e4e7ec)}.sh-paper-questions{display:grid;gap:0;margin:14px 0}.sh-paper-questions .sh-admin-record{background:#fff}.sh-record-detail .sh-card{box-shadow:none}.sh-record-detail .sh-card.sh-block{margin:12px 0}.sh-record-detail>.sh-ops-detail{margin-bottom:14px}@media(max-width:700px){.sh-record-summary{align-items:flex-start}.sh-record-summary .sh-badge{flex:0 0 auto}.sh-paper-questions .sh-admin-record{align-items:flex-start;flex-direction:column}}

/* Exam Centre professional workflow — 2.5.9 */
.sh-exam-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:18px}.sh-exam-steps span{display:flex;align-items:center;gap:7px;padding:10px 9px;border:1px solid var(--sh-border,#e4e7ec);border-radius:10px;background:#fbfdff;font-size:.78rem;font-weight:700;color:#475467}.sh-exam-steps b{width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#175cd3;color:#fff;font-size:.72rem}.sh-exam-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:8px}.sh-step-kicker{display:block;margin-bottom:5px;color:#175cd3;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.sh-exam-create-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.sh-exam-create-form .sh-field--full,.sh-exam-create-form .sh-form__actions,.sh-exam-create-form .sh-form__note{grid-column:1/-1}.sh-exam-title-field input{width:100%!important;min-width:0!important}.sh-exam-create-form small{display:block;margin-top:6px;color:var(--sh-text-muted,#667085);line-height:1.45}.sh-notice--info{border:1px solid #b2ddff;background:#eff8ff;color:#1849a9;border-radius:12px;padding:12px 14px;margin:12px 0 16px}@media(max-width:850px){.sh-exam-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.sh-exam-create-form{grid-template-columns:1fr}.sh-exam-create-form .sh-field,.sh-exam-create-form .sh-form__actions,.sh-exam-create-form .sh-form__note{grid-column:1}.sh-exam-card-heading{flex-direction:column}}

/* =====================================================================
   2.6.0 — Premium public marketplace homepage inspired by the approved
   visual reference. Dynamic Skill Hub LMS data remains authoritative.
   ===================================================================== */
body.home{background:#fff}
body.home .sh-header{background:rgba(255,255,255,.96);border-bottom:1px solid #edf1f7;box-shadow:0 2px 18px rgba(15,23,42,.035);position:relative;z-index:30}
body.home .sh-header__inner{min-height:76px}
body.home .sh-logo{font-size:1.15rem;font-weight:800;color:#102a43}
body.home .sh-logo__mark{background:linear-gradient(145deg,#2563eb,#1d4ed8);box-shadow:0 8px 22px rgba(37,99,235,.22)}
body.home .sh-nav{gap:27px}
body.home .sh-nav a{font-size:.88rem;font-weight:650;color:#334155;position:relative}
body.home .sh-nav a:after{content:"";position:absolute;height:2px;left:0;right:100%;bottom:-9px;background:#2563eb;border-radius:9px;transition:.2s ease}
body.home .sh-nav a:hover:after{right:0}
body.home .sh-header__actions .sh-btn{border-radius:10px;padding-inline:16px}

.shp-hero{padding:38px 0 30px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.shp-hero__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:62px;align-items:center;min-height:540px}
.shp-hero__copy{padding:20px 0}
.shp-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:750;color:#1d4ed8;background:#eff6ff;border:1px solid #dbeafe;border-radius:999px;padding:7px 11px;margin-bottom:18px}
.shp-hero h1{font-size:clamp(2.65rem,4.8vw,4.55rem);line-height:.99;letter-spacing:-.055em;margin:0;color:#0f172a;max-width:740px}
.shp-hero h1 span{color:#2563eb}
.shp-hero__copy>p{font-size:1.07rem;line-height:1.75;color:#64748b;max-width:610px;margin:22px 0 24px}
.shp-search{display:grid;grid-template-columns:auto minmax(0,1.4fr) minmax(140px,.6fr) auto;align-items:center;border:1px solid #dbe3ee;border-radius:13px;background:#fff;padding:6px;box-shadow:0 10px 30px rgba(30,64,175,.06);max-width:680px}
.shp-search__icon{font-size:1.3rem;color:#94a3b8;padding-left:10px}
.shp-search input,.shp-search select{border:0!important;box-shadow:none!important;background:transparent!important;min-height:44px;color:#334155;font-size:.9rem}
.shp-search input:focus,.shp-search select:focus{outline:0!important}
.shp-search select{border-left:1px solid #e8edf4!important;border-radius:0!important}
.shp-search .sh-btn{min-height:44px;border-radius:9px;padding-inline:24px}
.shp-category-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:25px;max-width:665px}
.shp-category{border:1px solid #edf1f6;border-radius:12px;min-height:100px;padding:14px 10px;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:2px;transition:.22s ease;color:#1e293b;text-decoration:none!important}
.shp-category:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(15,23,42,.08);border-color:transparent}
.shp-category span{font-size:1.35rem;margin-bottom:3px}.shp-category strong{font-size:.78rem}.shp-category small{font-size:.7rem;color:#64748b}
.shp-category--blue{background:#f2f7ff}.shp-category--green{background:#effbf6}.shp-category--orange{background:#fff7ed}.shp-category--purple{background:#faf5ff}
.shp-hero__visual{position:relative;padding:22px 0 12px 22px;min-width:0}
.shp-hero__image-wrap{border-radius:28px;overflow:hidden;position:relative;background:linear-gradient(145deg,#edf4ff,#f8fbff);box-shadow:0 22px 55px rgba(37,99,235,.12)}
.shp-hero__image-wrap:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(37,99,235,.02),transparent 55%);z-index:1;pointer-events:none}
.shp-hero__image-wrap picture{display:block;width:100%}.shp-hero__image-wrap img{width:100%;height:auto;display:block;object-fit:contain}
.shp-float{position:absolute;z-index:3;background:#fff;border:1px solid rgba(226,232,240,.9);border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:10px;box-shadow:0 15px 38px rgba(15,23,42,.11);min-width:166px}
.shp-float strong{display:block;font-size:.82rem;color:#0f172a}.shp-float small{display:block;font-size:.68rem;color:#64748b;margin-top:2px;white-space:nowrap}.shp-float--live{left:0;top:2px}.shp-float--verified{left:-14px;top:31%}.shp-float--rating{left:-8px;bottom:18%}.shp-float--rating>span{font-size:1.3rem;color:#f59e0b}
.shp-live-dot{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px #dcfce7}.shp-mini-avatar{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#e0f2fe;color:#0369a1;font-weight:800}

.shp-section{padding-top:62px;padding-bottom:62px}.shp-section--soft{background:#fbfcfe;border-block:1px solid #f1f5f9}.shp-section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.shp-section-head h2{font-size:1.78rem;letter-spacing:-.025em;margin:3px 0 0;color:#0f172a}.shp-eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:.7rem;font-weight:800;color:#2563eb}.shp-view-all{font-size:.82rem;font-weight:750;color:#2563eb;text-decoration:none}.shp-view-all:hover{text-decoration:underline}
.shp-teacher-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.shp-teacher{position:relative;display:block;background:#fff;border:1px solid #e2e8f0;border-radius:18px;overflow:hidden;color:#0f172a;text-decoration:none!important;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;box-shadow:0 6px 20px rgba(15,23,42,.04)}.shp-teacher:focus-visible{outline:3px solid #c7d2fe;outline-offset:3px}.shp-teacher:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(15,23,42,.12);border-color:#c7d2fe}.shp-teacher__photo{height:190px;position:relative;background:linear-gradient(135deg,#eef2ff,#f8fafc);overflow:hidden}.shp-teacher__photo:after{content:"";position:absolute;inset:auto 0 0;height:35%;background:linear-gradient(transparent,rgba(15,23,42,.16));pointer-events:none}.shp-teacher__body{padding:16px 16px 17px}.shp-teacher__body h3{font-size:1rem;margin:0 0 5px}.shp-teacher__body>p{font-size:.8rem;color:#64748b;margin:0 0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shp-teacher__facts{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:.72rem;color:#64748b;margin-bottom:13px}.shp-teacher__price{border-top:1px solid #eef2f7;padding-top:11px;font-size:.72rem;color:#64748b}.shp-teacher__price strong{font-size:.9rem;color:#3730a3;margin-left:4px}.shp-teacher__price small{font-size:.68rem}.sh-profile__head{position:relative;overflow:hidden;border-color:#dbeafe;background:linear-gradient(135deg,#fff 0%,#f8fbff 100%);box-shadow:0 12px 30px rgba(37,99,235,.07)}.sh-profile__head:after{content:"";position:absolute;right:-55px;top:-70px;width:190px;height:190px;border-radius:50%;background:#eef2ff;z-index:0}.sh-profile__head>*{position:relative;z-index:1}.sh-booking-box{position:sticky;top:96px;border-color:#c7d2fe;box-shadow:0 16px 36px rgba(49,46,129,.11)}.sh-profile__tabs{position:sticky;top:72px;z-index:10;background:rgba(248,250,252,.94);backdrop-filter:blur(10px);border-bottom:1px solid #e2e8f0}@media(max-width:760px){.sh-booking-box{position:static}.sh-profile__tabs{top:72px;overflow-x:auto;white-space:nowrap}.sh-profile__tabs a{display:inline-flex}}.shp-teacher:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(15,23,42,.1);border-color:#d7e2f0}.shp-teacher__photo{height:178px;position:relative;background:#f1f5f9;overflow:hidden}.shp-teacher__photo img{width:100%;height:100%;object-fit:cover;display:block}.shp-verified{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);color:#059669;border-radius:999px;font-size:.65rem;font-weight:800;padding:5px 8px;box-shadow:0 4px 16px rgba(15,23,42,.08)}.shp-teacher__body{padding:13px 14px 15px}.shp-teacher__body h3{font-size:.94rem;margin:0 0 4px}.shp-teacher__body>p{font-size:.76rem;color:#64748b;margin:0 0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shp-teacher__facts{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:.68rem;color:#64748b;margin-bottom:11px}.shp-rating{color:#f59e0b;font-weight:700}.shp-rating small{color:#94a3b8}.shp-teacher__price{border-top:1px solid #eef2f7;padding-top:10px;font-size:.7rem;color:#64748b}.shp-teacher__price strong{font-size:.84rem;color:#1d4ed8;margin-left:4px}.shp-teacher__price small{font-size:.66rem}
.shp-course-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.shp-course{background:#fff;border:1px solid #e7edf5;border-radius:14px;overflow:hidden;text-decoration:none!important;transition:.22s ease;color:#0f172a}.shp-course:hover{transform:translateY(-4px);box-shadow:0 15px 36px rgba(15,23,42,.1)}.shp-course__media{height:142px;background:linear-gradient(135deg,#0f2746,#183f70);display:grid;place-items:center;overflow:hidden;position:relative}.shp-course__media img{width:100%;height:100%;object-fit:cover}.shp-course__symbol{font-size:2.2rem;color:#93c5fd}.shp-course--2 .shp-course__media{background:linear-gradient(135deg,#16213e,#0f3460)}.shp-course--3 .shp-course__media{background:linear-gradient(135deg,#172554,#1e3a8a)}.shp-course--4 .shp-course__media{background:linear-gradient(135deg,#3f1d52,#7e22ce)}.shp-course__body{padding:14px}.shp-course__body h3{font-size:.94rem;line-height:1.3;margin:0 0 7px}.shp-course__body p{font-size:.73rem;line-height:1.5;color:#64748b;min-height:33px;margin:0 0 11px}.shp-course__meta{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:.69rem;color:#64748b}.shp-course__meta strong{color:#1d4ed8;font-size:.78rem}.shp-empty-card{grid-column:1/-1;border:1px dashed #cbd5e1;border-radius:14px;padding:28px;text-align:center;color:#64748b}

.shp-how{background:linear-gradient(135deg,#082a4f,#062449 60%,#0a3562);color:#fff;padding:52px 0;margin:10px auto 0}.shp-how__head{text-align:center;margin-bottom:34px}.shp-how__head span{font-size:.68rem;text-transform:uppercase;letter-spacing:.13em;color:#93c5fd;font-weight:800}.shp-how__head h2{color:#fff;margin:5px 0 0;font-size:1.75rem}.shp-how__steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:20px}.shp-how__step{text-align:center;position:relative}.shp-how__step i{display:none}.shp-how__icon{width:57px;height:57px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;background:#fff;color:#1d4ed8;font-size:1.35rem;box-shadow:0 9px 24px rgba(0,0,0,.18)}.shp-how__step:nth-of-type(3) .shp-how__icon{background:#ecfdf5;color:#059669}.shp-how__step:nth-of-type(5) .shp-how__icon{background:#faf5ff;color:#7e22ce}.shp-how__step:nth-of-type(7) .shp-how__icon{background:#eff6ff;color:#2563eb}.shp-how__step h3{color:#fff;font-size:.88rem;margin:0 0 7px}.shp-how__step p{font-size:.72rem;line-height:1.55;color:#cbd5e1;margin:0 auto;max-width:175px}.shp-how__arrow{font-size:1.35rem;color:#7dd3fc;opacity:.7}
.shp-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-top:32px;padding-bottom:32px}.shp-trust>div{display:flex;align-items:center;justify-content:center;gap:10px;border-right:1px solid #edf1f6}.shp-trust>div:last-child{border-right:0}.shp-trust>div>span{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#eff6ff;color:#2563eb}.shp-trust p{margin:0}.shp-trust strong{display:block;font-size:.76rem;color:#0f172a}.shp-trust small{display:block;font-size:.66rem;color:#64748b;margin-top:2px}
.shp-cta{padding:34px 0 64px}.shp-cta__inner{border:1px solid #dce7f5;background:linear-gradient(135deg,#f8fbff,#eff6ff);border-radius:18px;padding:30px 34px;display:flex;align-items:center;justify-content:space-between;gap:24px}.shp-cta h2{font-size:1.6rem;margin:4px 0 7px}.shp-cta p{margin:0;color:#64748b}.shp-cta__buttons{display:flex;gap:10px;flex-wrap:wrap}

@media(max-width:1050px){.shp-hero__grid{gap:35px}.shp-hero h1{font-size:3.2rem}.shp-teacher-grid,.shp-course-grid{grid-template-columns:repeat(2,1fr)}.shp-category-row{grid-template-columns:repeat(2,1fr)}.shp-how__steps{gap:12px}.shp-float--verified{left:0}}
@media(max-width:820px){.shp-hero{padding-top:18px}.shp-hero__grid{display:grid;grid-template-columns:1fr!important;min-height:0}.shp-hero__copy{order:2!important;grid-row:auto!important;padding-top:0}.shp-hero__visual{order:1!important;grid-row:auto!important;max-width:590px;margin:0 auto;width:100%;padding-left:0}.shp-hero__image-wrap{aspect-ratio:auto}.shp-float--verified{left:8px}.shp-float--rating{left:14px;bottom:12%}.shp-search{grid-template-columns:auto 1fr auto}.shp-search select{display:none}.shp-how__steps{grid-template-columns:1fr 1fr;gap:28px}.shp-how__arrow{display:none}.shp-trust{grid-template-columns:1fr 1fr;gap:18px}.shp-trust>div{border-right:0;justify-content:flex-start}.shp-cta__inner{display:block}.shp-cta__buttons{margin-top:20px}}
@media(max-width:560px){.shp-hero{padding-top:10px}.shp-hero__visual{padding-top:20px}.shp-hero__image-wrap{border-radius:20px;aspect-ratio:auto}.shp-float{padding:9px 10px;min-width:0}.shp-float small{display:none}.shp-float--live{left:7px;top:6px}.shp-float--verified{left:7px;top:auto;bottom:21%}.shp-float--rating{left:auto;right:7px;bottom:8%}.shp-hero h1{font-size:2.65rem}.shp-hero__copy>p{font-size:.96rem}.shp-search{grid-template-columns:auto minmax(0,1fr) auto}.shp-search .sh-btn{padding-inline:15px}.shp-category-row{gap:8px}.shp-category{min-height:86px}.shp-section{padding-top:44px;padding-bottom:44px}.shp-section-head{align-items:center}.shp-section-head h2{font-size:1.45rem}.shp-teacher-grid,.shp-course-grid{grid-template-columns:1fr 1fr;gap:10px}.shp-teacher__photo{height:130px}.shp-teacher__body{padding:10px}.shp-teacher__facts{display:block}.shp-teacher__facts span{display:block;margin-top:4px}.shp-course__media{height:105px}.shp-course__body{padding:10px}.shp-course__body p{display:none}.shp-course__meta{display:block}.shp-course__meta strong{display:block;margin-top:5px}.shp-how{padding:42px 0}.shp-how__steps{grid-template-columns:1fr 1fr;gap:30px 14px}.shp-how__step p{font-size:.68rem}.shp-trust{grid-template-columns:1fr;padding-top:24px;padding-bottom:24px}.shp-trust>div{justify-content:flex-start;border-bottom:1px solid #edf1f6;padding:12px 0}.shp-trust>div:last-child{border-bottom:0}.shp-cta{padding-bottom:42px}.shp-cta__inner{padding:24px 20px}.shp-cta__buttons .sh-btn{width:100%}}


/* SkillHub 2.6.2 — mobile admin readability: all dashboard data fits one phone screen. */
.sh-danger-zone{margin-top:10px}.sh-danger-zone .sh-card{border-color:#fecaca}.sh-badge--danger{background:#fef2f2;color:#b42318}
@media(max-width:768px){
 .sh-dash .sh-table-wrap{overflow:visible!important;border:0;background:transparent}
 .sh-dash .sh-table{min-width:0!important;width:100%!important;display:block;border:0}
 .sh-dash .sh-table thead{display:none!important}
 .sh-dash .sh-table tbody{display:block;width:100%}
 .sh-dash .sh-table tr:not(.sh-ops-detail-row){display:block;width:100%;margin:0 0 14px;padding:10px 12px;border:1px solid var(--sh-border);border-radius:14px;background:#fff;box-shadow:0 2px 8px rgba(15,23,42,.04)}
 .sh-dash .sh-table td{display:flex!important;width:100%!important;max-width:none!important;justify-content:space-between;align-items:flex-start;gap:14px;padding:9px 2px!important;border:0!important;text-align:right!important;white-space:normal!important;overflow-wrap:anywhere}
 .sh-dash .sh-table td::before{content:attr(data-label);display:block;flex:0 0 42%;max-width:42%;font-size:.73rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--sh-slate-500);text-align:left}
 .sh-dash .sh-table td:empty{display:none!important}
 .sh-dash .sh-table .sh-actions{justify-content:flex-end;width:58%}
 .sh-dash .sh-table .sh-actions .sh-btn{width:auto;max-width:100%;white-space:normal}
 .sh-dash .sh-ops-row td:nth-child(1)::before{content:'Student ID'}.sh-dash .sh-ops-row td:nth-child(2)::before{content:'Student'}.sh-dash .sh-ops-row td:nth-child(3)::before{content:'Parent'}.sh-dash .sh-ops-row td:nth-child(4)::before{content:'Teacher'}.sh-dash .sh-ops-row td:nth-child(5)::before{content:'Subject'}.sh-dash .sh-ops-row td:nth-child(6)::before{content:'Plan'}.sh-dash .sh-ops-row td:nth-child(7)::before{content:'Fee / Paid'}.sh-dash .sh-ops-row td:nth-child(8)::before{content:'Scheduled'}.sh-dash .sh-ops-row td:nth-child(9)::before{content:'Booked'}.sh-dash .sh-ops-row td:nth-child(10)::before{content:'Status'}.sh-dash .sh-ops-row td:nth-child(11)::before{content:'Details'}
 .sh-dash .sh-ops-detail-row{display:block!important;width:100%;margin:-8px 0 14px}
 .sh-dash .sh-ops-detail-row[hidden]{display:none!important}.sh-dash .sh-ops-detail-row td{display:block!important;text-align:left!important}.sh-dash .sh-ops-detail-row td::before{display:none}
 .sh-dash .sh-admin-filter{grid-template-columns:1fr!important}.sh-dash .sh-admin-filter .sh-btn{width:100%}
 .sh-dash .sh-card{max-width:100%;overflow:hidden}.sh-dash .sh-field input,.sh-dash .sh-field select,.sh-dash .sh-field textarea{max-width:100%;width:100%}
}


/* SkillHub 2.6.3 — compact phone cards and safe action wrapping. */
@media(max-width:768px){
 .sh-dash .sh-table td{display:grid!important;grid-template-columns:minmax(92px,36%) minmax(0,1fr);gap:10px;text-align:left!important;align-items:start}
 .sh-dash .sh-table td::before{max-width:none!important;min-width:0;overflow-wrap:normal;word-break:normal}
 .sh-dash .sh-table td>*{min-width:0;max-width:100%}
 .sh-dash .sh-table td strong,.sh-dash .sh-table td small,.sh-dash .sh-table td span,.sh-dash .sh-table td a{overflow-wrap:anywhere;word-break:normal}
 .sh-dash .sh-table .sh-actions{width:100%!important;display:flex;flex-wrap:wrap;justify-content:flex-start}
 .sh-dash .sh-table .sh-actions .sh-btn{width:auto!important;min-width:0;padding:9px 12px;font-size:.82rem;line-height:1.2}
 .sh-dash .sh-subject-admin-group .sh-table td{grid-template-columns:minmax(82px,34%) minmax(0,1fr)}
 .sh-dash .sh-subject-admin-group .sh-btn--danger{width:auto!important;white-space:normal}
}

/* SkillHub 2.6.4 — consistent mobile dashboard cards for Admin, Teacher, Student and Parent. */
@media(max-width:768px){
  .sh-dash .sh-table-wrap{overflow:visible!important;border:0!important;background:transparent!important}
  .sh-dash .sh-table{display:block!important;min-width:0!important;width:100%!important}
  .sh-dash .sh-table thead{display:none!important}
  .sh-dash .sh-table tbody{display:block!important;width:100%!important}
  .sh-dash .sh-table tr:not(.sh-ops-detail-row){display:block!important;width:100%!important;margin:0 0 14px!important;padding:12px 14px!important;border:1px solid var(--sh-border)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 2px 8px rgba(15,23,42,.04)!important}
  .sh-dash .sh-table tr:not(.sh-ops-detail-row)>td{display:grid!important;grid-template-columns:minmax(98px,35%) minmax(0,1fr)!important;gap:10px!important;width:100%!important;padding:9px 0!important;border:0!important;text-align:left!important;align-items:start!important;overflow:visible!important}
  .sh-dash .sh-table tr:not(.sh-ops-detail-row)>td::before{content:attr(data-label)!important;font-size:.74rem!important;font-weight:800!important;text-transform:uppercase!important;color:var(--sh-slate-500)!important;letter-spacing:.03em!important;min-width:0!important}
  .sh-dash .sh-table td .sh-btn,.sh-dash .sh-table td button,.sh-dash .sh-table td summary{max-width:100%!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important}
  .sh-dash .sh-table td .sh-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;width:100%!important}
  .sh-dash .sh-ops-detail-row{display:block!important;width:100%!important;margin:-8px 0 14px!important}
  .sh-dash .sh-ops-detail-row>td{display:block!important;width:100%!important;padding:0!important}
  .sh-dash .sh-booking-admin-actions,.sh-dash .sh-inline-action-form{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .sh-dash .sh-subject-admin-group .sh-btn--danger{width:auto!important;min-width:120px!important;padding-inline:18px!important;white-space:nowrap!important}
  .sh-dash .sh-subject-admin-group td[data-label="Manage"] details{display:block!important;margin:4px 0!important}
}

/* 3.2 Admin operations hierarchy */
.sh-folder-stack{display:grid;gap:10px}.sh-nested-record{margin:0}.sh-student-folder>summary{background:linear-gradient(180deg,#fff,#fbfdff)}.sh-finance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.sh-finance-grid>section>h2{font-size:16px;margin:0 0 10px}.sh-recording-course{margin:10px 0}.sh-recording-course>.sh-record-detail{display:grid;gap:10px}.sh-recording-folder__summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}.sh-recording-folder__summary::-webkit-details-marker{display:none}.sh-recording-folder__summary>div{display:grid;gap:2px}.sh-recording-folder[open]>.sh-recording-folder__summary>span{transform:rotate(180deg)}
@media(max-width:760px){.sh-finance-grid{grid-template-columns:1fr}.sh-record-meta{display:none}.sh-student-folder .sh-record-summary{align-items:flex-start}.sh-nested-record .sh-record-detail{padding:12px}.sh-booking-admin-actions{display:grid}.sh-recording-folder{padding:12px!important}}
/* ---------- Professional assessment hub ---------- */
.sh-exam-hub{display:grid;gap:22px}.sh-exam-hub__intro{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 32px;border-radius:22px;color:#fff;background:linear-gradient(135deg,#172554 0%,#3730a3 52%,#4f46e5 100%);box-shadow:0 18px 40px rgba(37,29,112,.18)}.sh-exam-hub__intro h2{margin:6px 0 8px;color:#fff;font-size:clamp(1.45rem,2.4vw,2rem)}.sh-exam-hub__intro p{max-width:620px;margin:0;color:rgba(255,255,255,.78)}.sh-exam-hub__intro .sh-eyebrow{color:#c7d2fe}.sh-exam-hub__icon{display:grid;place-items:center;width:64px;height:64px;flex:0 0 64px;border:1px solid rgba(255,255,255,.25);border-radius:20px;background:rgba(255,255,255,.12);font-size:2rem}.sh-exam-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px}.sh-exam-card{display:flex;flex-direction:column;min-height:250px;padding:22px;border:1px solid var(--sh-border);border-radius:18px;background:#fff;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.sh-exam-card:hover{transform:translateY(-3px);border-color:#c7d2fe;box-shadow:0 14px 32px rgba(15,23,42,.1)}.sh-exam-card__top,.sh-exam-card__footer{display:flex;align-items:center;justify-content:space-between;gap:10px}.sh-exam-card__badge{color:#4338ca;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.sh-exam-card__status{padding:4px 9px;border-radius:999px;color:#166534;background:#dcfce7;font-size:.72rem;font-weight:700}.sh-exam-card h3{margin:22px 0 5px;color:var(--sh-ink);font-size:1.15rem}.sh-exam-card__description{margin:0;color:var(--sh-text-muted);font-size:.9rem}.sh-exam-card__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0;padding:14px 0;border-top:1px solid var(--sh-slate-100);border-bottom:1px solid var(--sh-slate-100)}.sh-exam-card__facts span{display:flex;flex-direction:column;gap:3px}.sh-exam-card__facts strong{color:var(--sh-ink);font-size:.98rem}.sh-exam-card__facts small{color:var(--sh-text-muted);font-size:.72rem}.sh-exam-card__footer{margin-top:auto;align-items:flex-end}.sh-exam-card__footer .sh-muted{max-width:130px;font-size:.74rem;line-height:1.35}.sh-exam-empty{text-align:center;padding:52px 24px}.sh-exam-empty__icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 16px;border-radius:18px;color:#4f46e5;background:#eef2ff;font-size:1.6rem}.sh-exam-empty h3{margin:0 0 8px}.sh-exam-empty p{max-width:470px;margin:0 auto;color:var(--sh-text-muted)}.sh-exam-runner{overflow:hidden;border:1px solid #dbeafe;box-shadow:0 16px 36px rgba(30,64,175,.08)}.sh-exam-progress{height:7px;margin:20px 0 14px;overflow:hidden;border-radius:99px;background:#e0e7ff}.sh-exam-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4f46e5,#818cf8);transition:width .25s ease}.sh-exam-security-note{display:flex;align-items:center;gap:8px;margin-bottom:4px;padding:10px 12px;border-radius:10px;color:#475569;background:#f8fafc;font-size:.8rem}.sh-exam-security-note span{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;color:#166534;background:#dcfce7;font-weight:800}.sh-exam-runner>[data-sh-exam-timer]{min-width:96px;padding:9px 13px;border-radius:12px;color:#3730a3;background:#eef2ff;text-align:center;font-variant-numeric:tabular-nums}.sh-exam-question{padding-top:26px}.sh-exam-question h3{display:flex;justify-content:space-between;gap:16px;margin:0 0 18px;color:var(--sh-primary);font-size:.92rem}.sh-question-prompt{margin-bottom:22px;color:var(--sh-ink);font-size:clamp(1.1rem,2vw,1.4rem);font-weight:650;line-height:1.55}.sh-exam-question [data-sh-exam-answer]{display:grid;gap:12px}.sh-exam-question .sh-check-card{display:flex;align-items:center;gap:12px;padding:15px 17px;border:1px solid var(--sh-border);border-radius:13px;background:#fff;cursor:pointer;transition:.16s ease}.sh-exam-question .sh-check-card:hover,.sh-exam-question .sh-check-card:has(input:checked){border-color:#818cf8;background:#eef2ff}.sh-exam-question textarea{width:100%;min-height:140px;resize:vertical}@media(max-width:640px){.sh-exam-hub__intro{align-items:flex-start;padding:22px}.sh-exam-hub__icon{width:48px;height:48px;flex-basis:48px;border-radius:15px;font-size:1.35rem}.sh-exam-card__footer{align-items:stretch;flex-direction:column}.sh-exam-card__footer .sh-muted{max-width:none}.sh-exam-card__footer .sh-btn{width:100%}}


/* SkillHub 3.6.2 — professional Become-a-Teacher application experience. */
.page-template-template-become-teacher #sh-apply-section{
  background:linear-gradient(180deg,#f7f8ff 0%,#fff 18%);
  padding:28px 0 72px;
}
.page-template-template-become-teacher #sh-apply-section>.sh-container{
  max-width:860px;
}
.page-template-template-become-teacher #sh-apply{
  border:1px solid #e4e7f2;
  border-radius:28px;
  padding:34px;
  box-shadow:0 20px 60px rgba(31,41,85,.09);
  background:#fff;
}
.page-template-template-become-teacher .sh-track-chooser{
  border:0;
  padding:0;
  margin:0 0 30px;
}
.page-template-template-become-teacher .sh-track-chooser>legend{
  width:100%;
  font-family:var(--sh-font-head);
  font-size:1.35rem;
  line-height:1.25;
  font-weight:800;
  color:var(--sh-ink);
  margin:0 0 8px;
  padding:0;
}
.page-template-template-become-teacher .sh-track-chooser>.sh-help{
  margin:0 0 18px;
  max-width:680px;
}
.page-template-template-become-teacher .sh-track-grid{gap:14px}
.page-template-template-become-teacher .sh-track-card{
  position:relative;
  min-width:0;
  min-height:190px;
  padding:20px;
  gap:10px;
  border:1px solid #dfe3ef;
  border-radius:20px;
  background:linear-gradient(180deg,#fff,#fafbff);
  box-shadow:0 6px 18px rgba(31,41,85,.045);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease;
}
.page-template-template-become-teacher .sh-track-card:hover{
  border-color:#b8b1f2;
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(67,56,202,.10);
}
.page-template-template-become-teacher .sh-track-card:has(input:checked){
  border-color:var(--sh-primary);
  background:linear-gradient(145deg,#f5f3ff,#fff);
  box-shadow:0 0 0 3px rgba(67,56,202,.12),0 14px 30px rgba(67,56,202,.12);
}
.page-template-template-become-teacher .sh-track-card input{
  position:absolute;
  top:18px;
  right:18px;
  width:21px;
  height:21px;
  margin:0;
}
.page-template-template-become-teacher .sh-track-card strong{
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:28px;
  font-family:var(--sh-font-head);
  font-size:1rem;
  line-height:1.3;
  color:var(--sh-ink);
}
.page-template-template-become-teacher .sh-track-card strong:before{
  content:'A';
  width:36px;height:36px;flex:0 0 36px;
  display:grid;place-items:center;
  border-radius:11px;
  background:#eeecff;color:var(--sh-primary);
  font-size:.88rem;font-weight:900;
}
.page-template-template-become-teacher .sh-track-card:nth-child(2) strong:before{content:'Q'}
.page-template-template-become-teacher .sh-track-card:nth-child(3) strong:before{content:'C'}
.page-template-template-become-teacher .sh-track-card span{
  display:block;
  font-size:.88rem;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.page-template-template-become-teacher .sh-step-panel>.sh-block__title{
  font-size:1.55rem;
  margin-bottom:6px;
}
.page-template-template-become-teacher .sh-step-panel>.sh-muted{
  line-height:1.6;
  margin-bottom:24px;
}
.page-template-template-become-teacher .sh-field{margin-bottom:20px}
.page-template-template-become-teacher .sh-field>label,
.page-template-template-become-teacher .sh-fieldset>legend{
  font-weight:750;
  color:#25304a;
}
.page-template-template-become-teacher .sh-field input:not([type=checkbox]):not([type=radio]):not([type=file]),
.page-template-template-become-teacher .sh-field select,
.page-template-template-become-teacher .sh-field textarea{
  min-height:54px;
  border-color:#d8ddea;
  border-radius:14px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.02);
}
.page-template-template-become-teacher .sh-field textarea{min-height:130px}
.page-template-template-become-teacher .sh-field input:focus,
.page-template-template-become-teacher .sh-field select:focus,
.page-template-template-become-teacher .sh-field textarea:focus{
  border-color:var(--sh-primary);
  box-shadow:0 0 0 4px rgba(67,56,202,.10);
}
.page-template-template-become-teacher .sh-help{
  font-size:.86rem;
  line-height:1.5;
  color:#707b90;
}
.page-template-template-become-teacher .sh-stepper{
  scrollbar-width:none;
  padding:4px 0 10px;
  margin:18px 0 30px;
}
.page-template-template-become-teacher .sh-stepper::-webkit-scrollbar{display:none}
.page-template-template-become-teacher .sh-stepper__item{min-height:48px}
.page-template-template-become-teacher .sh-form-actions{
  position:sticky;
  bottom:calc(74px + env(safe-area-inset-bottom));
  z-index:20;
  padding:14px 0 2px;
  background:linear-gradient(180deg,rgba(255,255,255,0),#fff 28%);
}
.page-template-template-become-teacher .sh-form-actions .sh-btn{min-height:52px}
.page-template-template-become-teacher .sh-widget{
  min-width:0;
  overflow:hidden;
}
.page-template-template-become-teacher .sh-widget__value{
  overflow-wrap:anywhere;
  word-break:normal;
}

@media(max-width:700px){
  .page-template-template-become-teacher .sh-page-head{
    padding:24px 0 30px;
    margin-bottom:22px;
  }
  .page-template-template-become-teacher .sh-page-head h1{
    font-size:2rem;
    line-height:1.08;
  }
  .page-template-template-become-teacher .sh-page-head .sh-lead{
    font-size:1rem;
    line-height:1.55;
  }
  .page-template-template-become-teacher .sh-page-head .sh-btn{
    width:100%;
    margin:0 0 10px;
  }
  .page-template-template-become-teacher .sh-section{padding-block:36px}
  .page-template-template-become-teacher .sh-section--tight{padding-block:20px}
  .page-template-template-become-teacher .sh-sec-head{margin-bottom:22px}
  .page-template-template-become-teacher .sh-sec-head h2,
  .page-template-template-become-teacher #sh-apply-section h2{
    font-size:1.75rem;
    line-height:1.16;
  }
  .page-template-template-become-teacher .sh-widgets{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .page-template-template-become-teacher .sh-widget{
    min-height:0;
    padding:16px;
    display:block;
    text-align:left;
    border-radius:18px;
  }
  .page-template-template-become-teacher .sh-widget__icon{
    width:38px;height:38px;
    margin:0 0 12px;
  }
  .page-template-template-become-teacher .sh-widget__label{
    font-size:.72rem;
    margin-bottom:3px;
  }
  .page-template-template-become-teacher .sh-widget__value{
    font-size:1.05rem;
    line-height:1.25;
    margin:0;
  }
  .page-template-template-become-teacher .sh-widget__trend{
    font-size:.72rem;
    line-height:1.35;
    margin-top:8px;
  }
  .page-template-template-become-teacher #sh-apply-section{
    padding:20px 0 90px;
  }
  .page-template-template-become-teacher #sh-apply-section>.sh-container{
    padding-inline:14px;
  }
  .page-template-template-become-teacher #sh-apply{
    padding:20px 16px 28px;
    border-radius:22px;
    box-shadow:0 14px 40px rgba(31,41,85,.08);
  }
  .page-template-template-become-teacher .sh-track-chooser>legend{
    font-size:1.2rem;
  }
  .page-template-template-become-teacher .sh-track-grid{
    grid-template-columns:1fr;
    gap:12px;
  }
  .page-template-template-become-teacher .sh-track-card{
    min-height:0;
    padding:16px 52px 16px 16px;
    gap:6px;
  }
  .page-template-template-become-teacher .sh-track-card input{
    top:50%;right:18px;
    transform:translateY(-50%);
  }
  .page-template-template-become-teacher .sh-track-card strong{
    padding-right:0;
    font-size:1rem;
  }
  .page-template-template-become-teacher .sh-track-card strong:before{
    width:34px;height:34px;flex-basis:34px;
  }
  .page-template-template-become-teacher .sh-track-card span{
    padding-left:44px;
    font-size:.82rem;
    line-height:1.45;
  }
  .page-template-template-become-teacher .sh-meter{margin:0 0 16px}
  .page-template-template-become-teacher .sh-stepper{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:7px;
    overflow:visible;
    margin:14px 0 26px;
  }
  .page-template-template-become-teacher .sh-stepper__item{
    min-width:0;
    min-height:0;
    padding:0;
    border:0;
    background:transparent;
    justify-content:center;
    box-shadow:none;
  }
  .page-template-template-become-teacher .sh-stepper__item>span:not(.sh-stepper__num){display:none}
  .page-template-template-become-teacher .sh-stepper__num{
    width:34px;height:34px;
    border:2px solid #e5e8f0;
    background:#fff;
  }
  .page-template-template-become-teacher .sh-stepper__item.is-active,
  .page-template-template-become-teacher .sh-stepper__item.is-done{
    background:transparent;border:0;
  }
  .page-template-template-become-teacher .sh-step-panel>.sh-block__title{font-size:1.35rem}
  .page-template-template-become-teacher .sh-form__row{grid-template-columns:1fr;gap:0}
  .page-template-template-become-teacher .sh-field{margin-bottom:18px}
  .page-template-template-become-teacher .sh-field input:not([type=checkbox]):not([type=radio]):not([type=file]),
  .page-template-template-become-teacher .sh-field select{
    min-height:52px;
    font-size:1rem;
  }
  .page-template-template-become-teacher .sh-notice{border-radius:15px}
  .page-template-template-become-teacher .sh-check-grid{grid-template-columns:1fr 1fr}
  .page-template-template-become-teacher .sh-dropzone{padding:22px 14px}
}
@media(max-width:390px){
  .page-template-template-become-teacher .sh-widgets{grid-template-columns:1fr 1fr}
  .page-template-template-become-teacher .sh-widget{padding:14px}
  .page-template-template-become-teacher .sh-widget__trend{display:none}
  .page-template-template-become-teacher .sh-check-grid{grid-template-columns:1fr}
}




/* 3.8.2 — exact responsive hero artwork boxes. Match Customizer recommendations exactly. */
.shp-hero__image-wrap{aspect-ratio:1/1!important;background:transparent!important}
.shp-hero__image-wrap picture{display:block!important;width:100%!important;height:100%!important}
.shp-hero__image-wrap img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}
@media(max-width:820px){
  .shp-hero__image-wrap{aspect-ratio:5/6!important}
  .shp-hero__image-wrap picture,.shp-hero__image-wrap img{width:100%!important;height:100%!important}
}

/* =====================================================================
   3.8.3 — Hero media fit refinement
   Remove excess whitespace around the hero media and let the responsive
   image use the visual column more fully on desktop and mobile.
   ===================================================================== */
@media (min-width:821px){
  .shp-hero{padding-top:18px!important;padding-bottom:20px!important}
  .shp-hero__grid{grid-template-columns:.94fr 1.06fr!important;gap:34px!important;min-height:0!important;align-items:center!important}
  .shp-hero__visual{padding:0!important;width:100%!important;max-width:700px!important;margin-left:auto!important;margin-right:0!important}
  .shp-hero__image-wrap{width:100%!important;aspect-ratio:1/1!important;margin:0!important}
  .shp-hero__image-wrap picture,.shp-hero__image-wrap img{width:100%!important;height:100%!important;display:block!important}
  .shp-hero__image-wrap img{object-fit:cover!important;object-position:center center!important}
}
@media (max-width:820px){
  .shp-hero{padding-top:0!important;padding-bottom:18px!important}
  .shp-hero__grid{min-height:0!important;gap:18px!important}
  .shp-hero__visual{padding:0!important;margin:0 auto!important;width:100%!important;max-width:620px!important}
  .shp-hero__image-wrap{width:100%!important;aspect-ratio:5/6!important;margin:0!important}
  .shp-hero__image-wrap picture,.shp-hero__image-wrap img{width:100%!important;height:100%!important;display:block!important}
  .shp-hero__image-wrap img{object-fit:cover!important;object-position:center center!important}
  .shp-hero__copy{padding-top:0!important}
}
@media (max-width:560px){
  .shp-hero__visual{padding-top:0!important}
  .shp-hero__grid{gap:14px!important}
}


/* =====================================================================
   3.8.4 — Canonical hero media layout
   One final source of truth for desktop and mobile hero fitting.
   Removes visible frame/background spacing, expands the desktop visual,
   and gives the mobile visual a controlled full-bleed treatment while
   preserving normal gutters for the text/content below.
   ===================================================================== */
.shp-hero__image-wrap{
  position:relative!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  background:none!important;
  box-shadow:0 18px 44px rgba(37,99,235,.10)!important;
  line-height:0!important;
}
.shp-hero__image-wrap:before{display:none!important}
.shp-hero__image-wrap picture{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
}
.shp-hero__image-wrap img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
}

@media (min-width:821px){
  .shp-hero{
    padding-top:10px!important;
    padding-bottom:10px!important;
  }
  .shp-hero__grid{
    max-width:1320px!important;
    grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)!important;
    gap:24px!important;
    min-height:0!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }
  .shp-hero__copy{padding:8px 0!important}
  .shp-hero__visual{
    width:100%!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
  }
  .shp-hero__image-wrap{
    width:100%!important;
    aspect-ratio:1/1!important;
    border-radius:26px!important;
  }
}

@media (max-width:820px){
  .shp-hero{
    padding-top:0!important;
    padding-bottom:10px!important;
  }
  .shp-hero__grid{
    min-height:0!important;
    gap:12px!important;
  }
  .shp-hero__visual{
    width:calc(100% + (2 * var(--sh-gutter)))!important;
    max-width:none!important;
    margin-left:calc(-1 * var(--sh-gutter))!important;
    margin-right:calc(-1 * var(--sh-gutter))!important;
    padding:0 10px!important;
  }
  .shp-hero__image-wrap{
    width:100%!important;
    aspect-ratio:5/6!important;
    border-radius:20px!important;
  }
  .shp-hero__copy{
    padding-top:0!important;
  }
}
@media (max-width:560px){
  .shp-hero__visual{padding:0 8px!important}
  .shp-hero__grid{gap:10px!important}
}


/* 3.8.6 — Hero media reduced by 20% on desktop and mobile. */
@media (min-width:821px){
  .shp-hero__visual{
    width:80%!important;
    max-width:960px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
  }
  .shp-hero__image-wrap{
    width:100%!important;
    aspect-ratio:1/1!important;
  }
}
@media (max-width:820px){
  .shp-hero__visual{
    width:80%!important;
    max-width:800px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
  }
  .shp-hero__image-wrap{
    width:100%!important;
    aspect-ratio:5/6!important;
  }
}

/* 3.8.7 — Final mobile-only hero refinement. Desktop 3.8.6 sizing is unchanged. */
@media (max-width:820px){
  .shp-hero{padding-top:0!important;padding-bottom:6px!important;}
  .shp-hero__grid{gap:8px!important;min-height:0!important;}
  .shp-hero__visual{
    width:70%!important;
    max-width:700px!important;
    margin:0 auto!important;
    padding:0!important;
  }
  .shp-hero__image-wrap{
    width:100%!important;
    aspect-ratio:5/6!important;
    border-radius:18px!important;
  }
  .shp-hero__copy{padding-top:0!important;}
  .shp-kicker{margin-bottom:12px!important;}
  .shp-float{transform:scale(.85);}
  .shp-float--live{transform-origin:left top;left:3px!important;top:3px!important;}
  .shp-float--verified{transform-origin:left center;left:3px!important;}
  .shp-float--rating{transform-origin:right bottom;left:auto!important;right:3px!important;bottom:7%!important;}
}
@media (max-width:560px){
  .shp-hero__visual{width:70%!important;max-width:420px!important;}
  .shp-hero__grid{gap:7px!important;}
  .shp-kicker{padding:6px 9px!important;font-size:.74rem!important;margin-bottom:10px!important;}
  .shp-float{padding:8px 9px!important;gap:8px!important;}
  .shp-float strong{font-size:.78rem!important;}
}

/* Skill Hub LMS 3.8.9 — reference-matched responsive hero redesign */
.shp-hero{padding:28px 0 34px!important;background:linear-gradient(180deg,#f8fbff 0%,#fff 72%)!important;overflow:hidden!important}
.shp-hero__layout{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr)!important;grid-template-areas:"copy visual" "trust trust" "search search" "areas areas"!important;gap:20px 42px!important;align-items:center!important}
.shp-hero__copy{grid-area:copy!important;padding:18px 0 8px!important;align-self:center!important}
.shp-hero__visual{grid-area:visual!important;padding:0!important;width:100%!important;max-width:610px!important;margin:0 0 0 auto!important}
.shp-hero__image-wrap{width:100%!important;aspect-ratio:1/1!important;border-radius:28px!important;overflow:hidden!important;box-shadow:0 18px 46px rgba(15,23,42,.10)!important;background:#eef6ff!important}
.shp-hero__image-wrap picture,.shp-hero__image-wrap img{display:block!important;width:100%!important;height:100%!important}
.shp-hero__image-wrap img{object-fit:cover!important;object-position:center!important}
.shp-hero__copy h1{font-size:clamp(3rem,5vw,4.55rem)!important;line-height:.98!important;letter-spacing:-.055em!important;margin:0!important;max-width:700px!important}
.shp-hero__copy>p{font-size:1.05rem!important;line-height:1.7!important;max-width:610px!important;margin:20px 0 0!important;color:#64748b!important}
.shp-hero-trustbar{grid-area:trust!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;max-width:none!important;margin:2px 0 0!important;padding:13px 18px!important;border-radius:20px!important;gap:0!important;background:linear-gradient(90deg,#eef7ff 0%,#f8fbff 52%,#eef7ff 100%)!important;border:1px solid #dbeafe!important;box-shadow:none!important}
.shp-hero-trustbar span{display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;min-width:0!important;padding:2px 16px!important;font-size:.92rem!important;font-weight:800!important;color:#123a6b!important;white-space:nowrap!important}
.shp-hero-trustbar span+span{border-left:1px solid #bfd5ec!important}
.shp-hero-trustbar i{width:34px!important;height:34px!important;flex:0 0 34px!important;font-size:1rem!important;background:#dff0ff!important;color:#1769cf!important}
.shp-hero-trustbar span:nth-child(2) i{background:#e5f9eb!important;color:#16a34a!important;font-size:.68rem!important}
.shp-hero-trustbar span:nth-child(3) i{background:#fff5d8!important;color:#d49300!important}
.shp-search{grid-area:search!important;width:100%!important;max-width:none!important;margin:0!important;min-height:66px!important;border-radius:20px!important;background:#fff!important;border:1px solid #dbe4ef!important;box-shadow:0 8px 24px rgba(15,23,42,.04)!important;padding:8px 8px 8px 18px!important;grid-template-columns:auto minmax(0,1fr) minmax(170px,auto) auto!important}
.shp-search input,.shp-search select{font-size:1rem!important}
.shp-search .sh-btn{min-height:50px!important;border-radius:14px!important;padding:0 28px!important;font-size:1rem!important}
.shp-category-row{grid-area:areas!important;width:100%!important;margin:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}
.shp-category{min-height:132px!important;border-radius:20px!important;padding:18px 14px!important;box-shadow:none!important;border:1px solid rgba(15,23,42,.04)!important}
.shp-category span{font-size:1.65rem!important;margin-bottom:8px!important}.shp-category strong{font-size:1rem!important}.shp-category small{font-size:.82rem!important}

@media(max-width:1050px) and (min-width:821px){
 .shp-hero__layout{grid-template-columns:minmax(0,1fr) minmax(360px,.9fr)!important;gap:18px 28px!important}
 .shp-hero__visual{max-width:520px!important}
 .shp-hero__copy h1{font-size:3.4rem!important}
 .shp-hero-trustbar span{font-size:.82rem!important;padding-inline:10px!important}
}

@media(max-width:820px){
 .shp-hero{padding:0 0 24px!important}
 .shp-hero__layout{width:100%!important;max-width:none!important;padding-left:0!important;padding-right:0!important;grid-template-columns:1fr!important;grid-template-areas:"visual" "trust" "copy" "search" "areas"!important;gap:16px!important}
 .shp-hero__visual{width:100vw!important;max-width:none!important;margin:0!important;padding:0!important;justify-self:stretch!important}
 .shp-hero__image-wrap{width:100%!important;height:clamp(360px,62vh,520px)!important;aspect-ratio:auto!important;border-radius:0 0 28px 28px!important;box-shadow:none!important}
 .shp-hero__image-wrap img{object-fit:cover!important;object-position:center center!important}
 .shp-hero-trustbar{width:calc(100% - 28px)!important;margin:0 auto!important;padding:10px 8px!important;border-radius:16px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .shp-hero-trustbar span{padding:2px 6px!important;gap:5px!important;font-size:.68rem!important;line-height:1.15!important;text-align:center!important;white-space:normal!important}
 .shp-hero-trustbar i{width:24px!important;height:24px!important;flex-basis:24px!important;font-size:.76rem!important}
 .shp-hero-trustbar span:nth-child(2) i{font-size:.5rem!important}
 .shp-hero__copy{padding:4px 20px 0!important;margin:0!important}
 .shp-hero__copy h1{font-size:clamp(2.65rem,12vw,4rem)!important;line-height:.98!important}
 .shp-hero__copy>p{font-size:.98rem!important;line-height:1.55!important;margin-top:18px!important}
 .shp-search{width:calc(100% - 28px)!important;margin:0 auto!important;min-height:58px!important;padding:6px 6px 6px 14px!important;grid-template-columns:auto minmax(0,1fr) auto!important;border-radius:16px!important}
 .shp-search select{display:none!important}
 .shp-search .sh-btn{min-height:46px!important;padding:0 18px!important;border-radius:12px!important}
 .shp-category-row{width:calc(100% - 28px)!important;margin:0 auto!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}
 .shp-category{min-height:105px!important;padding:12px 5px!important;border-radius:16px!important}
 .shp-category span{font-size:1.25rem!important;margin-bottom:5px!important}.shp-category strong{font-size:.72rem!important;line-height:1.1!important}.shp-category small{font-size:.62rem!important;line-height:1.15!important}
}

@media(max-width:420px){
 .shp-hero__image-wrap{height:clamp(340px,58vh,460px)!important}
 .shp-hero-trustbar{width:calc(100% - 20px)!important;padding:8px 5px!important}
 .shp-hero-trustbar span{font-size:.61rem!important;padding:2px 3px!important;gap:4px!important}
 .shp-hero-trustbar i{width:21px!important;height:21px!important;flex-basis:21px!important;font-size:.68rem!important}
 .shp-hero__copy{padding-left:16px!important;padding-right:16px!important}
 .shp-search,.shp-category-row{width:calc(100% - 20px)!important}
}

/* =====================================================================
   Skill Hub LMS 3.9.0 — unified reference hero, desktop + mobile final
   One visual hero block: copy + media, then trust/search/learning areas.
   ===================================================================== */
.shp-hero--unified{padding:22px 0 34px!important;background:#fff!important;overflow:hidden!important}
.shp-hero--unified .shp-hero__layout{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;max-width:1280px!important}
.shp-hero--unified .shp-hero-stage{display:grid!important;grid-template-columns:minmax(0,.92fr) minmax(430px,1.08fr)!important;align-items:stretch!important;min-height:500px!important;overflow:hidden!important;border:1px solid #e8f0fb!important;border-radius:30px!important;background:linear-gradient(100deg,#eef8ff 0%,#f7fbff 40%,#fff 60%)!important;box-shadow:0 18px 55px rgba(15,23,42,.07)!important}
.shp-hero--unified .shp-hero__copy{display:flex!important;flex-direction:column!important;justify-content:center!important;padding:48px 20px 48px 48px!important;min-width:0!important;z-index:2!important}
.shp-hero--unified .shp-hero__eyebrow{display:block!important;margin:0 0 18px!important;color:#34516f!important;font-size:.84rem!important;font-weight:800!important;letter-spacing:.24em!important;text-transform:uppercase!important}
.shp-hero--unified .shp-hero__copy h1{margin:0!important;max-width:590px!important;color:#071a33!important;font-size:clamp(3rem,4.8vw,4.65rem)!important;line-height:.98!important;letter-spacing:-.055em!important}
.shp-hero--unified .shp-hero__copy h1 span{color:#2167dc!important}
.shp-hero--unified .shp-hero__copy>p{max-width:540px!important;margin:24px 0 0!important;color:#496078!important;font-size:1.05rem!important;line-height:1.6!important}
.shp-hero--unified .shp-hero__visual{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;min-width:0!important;align-self:stretch!important}
.shp-hero--unified .shp-hero__image-wrap{width:100%!important;height:100%!important;min-height:500px!important;aspect-ratio:auto!important;border-radius:0!important;background:#eef6ff!important;box-shadow:none!important;overflow:hidden!important}
.shp-hero--unified .shp-hero__image-wrap picture,.shp-hero--unified .shp-hero__image-wrap img{display:block!important;width:100%!important;height:100%!important}
.shp-hero--unified .shp-hero__image-wrap img{object-fit:cover!important;object-position:center center!important}
.shp-hero--unified .shp-hero-trustbar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;max-width:none!important;margin:0!important;padding:12px 18px!important;gap:0!important;border:1px solid #dbeafe!important;border-radius:22px!important;background:linear-gradient(90deg,#eef7ff,#f8fbff,#eef7ff)!important;box-shadow:none!important}
.shp-hero--unified .shp-hero-trustbar span{display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;padding:2px 18px!important;color:#123a6b!important;font-size:.92rem!important;font-weight:800!important;white-space:nowrap!important}
.shp-hero--unified .shp-hero-trustbar span+span{border-left:1px solid #bfd5ec!important}
.shp-hero--unified .shp-hero-trustbar i{display:grid!important;place-items:center!important;width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:50%!important;background:#dff0ff!important;color:#1769cf!important;font-size:1rem!important;font-style:normal!important}
.shp-hero--unified .shp-hero-trustbar span:nth-child(2) i{background:#e5f9eb!important;color:#16a34a!important;font-size:.68rem!important}
.shp-hero--unified .shp-hero-trustbar span:nth-child(3) i{background:#fff5d8!important;color:#d49300!important}
.shp-hero--unified .shp-search{margin:0!important}
.shp-hero--unified .shp-category-row{margin-top:0!important}

@media (max-width:1050px) and (min-width:821px){
 .shp-hero--unified .shp-hero-stage{grid-template-columns:minmax(0,.9fr) minmax(390px,1.1fr)!important;min-height:450px!important}
 .shp-hero--unified .shp-hero__copy{padding:38px 18px 38px 36px!important}
 .shp-hero--unified .shp-hero__copy h1{font-size:3.35rem!important}
 .shp-hero--unified .shp-hero__image-wrap{min-height:450px!important}
 .shp-hero--unified .shp-hero-trustbar span{font-size:.82rem!important;padding-inline:10px!important}
}

@media (max-width:820px){
 .shp-hero--unified{padding:0 0 26px!important;background:linear-gradient(180deg,#f7fbff 0%,#fff 72%)!important}
 .shp-hero--unified .shp-hero__layout{width:100%!important;max-width:none!important;padding:0 14px!important;gap:14px!important}
 .shp-hero--unified .shp-hero-stage{display:grid!important;grid-template-columns:1fr!important;grid-template-areas:"copy" "visual"!important;min-height:0!important;border-radius:0 0 26px 26px!important;border-width:0 0 1px!important;background:linear-gradient(180deg,#eef8ff 0%,#fff 52%)!important;box-shadow:none!important;margin-left:-14px!important;margin-right:-14px!important;width:calc(100% + 28px)!important}
 .shp-hero--unified .shp-hero__copy{grid-area:copy!important;order:1!important;padding:28px 22px 22px!important;text-align:left!important}
 .shp-hero--unified .shp-hero__eyebrow{margin-bottom:12px!important;font-size:.68rem!important;letter-spacing:.20em!important}
 .shp-hero--unified .shp-hero__copy h1{font-size:clamp(2.35rem,11vw,3.65rem)!important;line-height:.98!important;max-width:12ch!important}
 .shp-hero--unified .shp-hero__copy>p{margin-top:16px!important;font-size:.94rem!important;line-height:1.5!important;max-width:39rem!important}
 .shp-hero--unified .shp-hero__visual{grid-area:visual!important;order:2!important;width:100%!important;max-width:none!important;padding:0!important;margin:0!important}
 .shp-hero--unified .shp-hero__image-wrap{height:clamp(310px,48vh,430px)!important;min-height:0!important;border-radius:0!important}
 .shp-hero--unified .shp-hero__image-wrap img{object-fit:cover!important;object-position:center center!important}
 .shp-hero--unified .shp-hero-trustbar{grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;margin:0!important;padding:9px 6px!important;border-radius:16px!important}
 .shp-hero--unified .shp-hero-trustbar span{min-width:0!important;padding:2px 5px!important;gap:5px!important;font-size:.66rem!important;line-height:1.15!important;text-align:center!important;white-space:normal!important}
 .shp-hero--unified .shp-hero-trustbar i{width:23px!important;height:23px!important;flex-basis:23px!important;font-size:.72rem!important}
 .shp-hero--unified .shp-hero-trustbar span:nth-child(2) i{font-size:.48rem!important}
 .shp-hero--unified .shp-search{width:100%!important;margin:0!important}
 .shp-hero--unified .shp-category-row{width:100%!important;margin:0!important}
}

@media (max-width:560px){
 .shp-hero--unified .shp-hero__layout{padding:0 10px!important;gap:12px!important}
 .shp-hero--unified .shp-hero-stage{margin-left:-10px!important;margin-right:-10px!important;width:calc(100% + 20px)!important}
 .shp-hero--unified .shp-hero__copy{padding:24px 18px 18px!important}
 .shp-hero--unified .shp-hero__copy h1{font-size:clamp(2.25rem,11.6vw,3.1rem)!important}
 .shp-hero--unified .shp-hero__image-wrap{height:clamp(290px,45vh,380px)!important}
 .shp-hero--unified .shp-hero-trustbar{padding:8px 4px!important}
 .shp-hero--unified .shp-hero-trustbar span{font-size:.60rem!important;padding-inline:3px!important;gap:4px!important}
 .shp-hero--unified .shp-hero-trustbar i{width:21px!important;height:21px!important;flex-basis:21px!important;font-size:.66rem!important}
}

@media (max-width:390px){
 .shp-hero--unified .shp-hero__copy h1{font-size:2.3rem!important}
 .shp-hero--unified .shp-hero-trustbar span{font-size:.56rem!important}
}

/* =====================================================================
   Skill Hub LMS 3.9.1 — desktop hero grid lock
   Prevent legacy named grid areas from creating implicit desktop columns.
   Mobile 3.9.0 layout remains unchanged.
   ===================================================================== */
@media (min-width:821px){
  .shp-hero--unified .shp-hero-stage{
    display:grid!important;
    grid-template-columns:minmax(0,.92fr) minmax(430px,1.08fr)!important;
    grid-template-areas:"copy visual"!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    justify-self:stretch!important;
    align-items:stretch!important;
  }
  .shp-hero--unified .shp-hero__copy{
    grid-area:copy!important;
    grid-column:1!important;
    grid-row:1!important;
    position:relative!important;
    inset:auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    align-self:stretch!important;
    justify-self:stretch!important;
    z-index:2!important;
  }
  .shp-hero--unified .shp-hero__visual{
    grid-area:visual!important;
    grid-column:2!important;
    grid-row:1!important;
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    justify-self:stretch!important;
    align-self:stretch!important;
    z-index:1!important;
  }
  .shp-hero--unified .shp-hero__image-wrap{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
  }
}
@media (min-width:821px) and (max-width:1050px){
  .shp-hero--unified .shp-hero-stage{
    grid-template-columns:minmax(0,.9fr) minmax(390px,1.1fr)!important;
    grid-template-areas:"copy visual"!important;
  }
}


/* =====================================================================
   Skill Hub LMS 3.9.2 — mobile image-first hero + centered desktop learning cards
   Desktop hero remains copy-left/media-right. Mobile hero shows media first.
   ===================================================================== */
@media (min-width:821px){
  .shp-hero--unified .shp-category-row{
    width:100%!important;
    max-width:820px!important;
    margin:0 auto!important;
    grid-template-columns:repeat(4,minmax(150px,180px))!important;
    justify-content:center!important;
    gap:18px!important;
  }
  .shp-hero--unified .shp-category{
    width:100%!important;
    min-width:0!important;
  }
}
@media (max-width:820px){
  .shp-hero--unified .shp-hero-stage{
    grid-template-areas:"visual" "copy"!important;
  }
  .shp-hero--unified .shp-hero__visual{
    grid-area:visual!important;
    order:1!important;
  }
  .shp-hero--unified .shp-hero__copy{
    grid-area:copy!important;
    order:2!important;
  }
}

/* SkillHub 3.9.3 — professional mobile filter drawer */
.sh-filter__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.sh-filter__head>strong{font-family:var(--sh-font-head);font-size:1rem}
.sh-filter__head-actions{display:flex;align-items:center;gap:10px}.sh-filter__reset{font-size:.82rem}
.sh-filter__close,.sh-mobile-filter-toggle{font:inherit}.sh-filter__close{display:none;width:38px;height:38px;border:1px solid var(--sh-border);border-radius:12px;background:#fff;color:var(--sh-text);font-size:1.55rem;line-height:1;align-items:center;justify-content:center;cursor:pointer}
.sh-mobile-filter-toggle{display:none;align-items:center;gap:8px;border:1px solid #dbe4f0;background:#fff;color:#172033;border-radius:14px;padding:10px 14px;font-weight:800;box-shadow:0 5px 16px rgba(15,23,42,.06);cursor:pointer}
.sh-mobile-filter-toggle__icon{display:inline-flex;color:var(--sh-primary)}
.sh-mobile-filter-toggle__count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--sh-primary);color:#fff;font-size:.72rem}
.sh-filter-backdrop{display:none}

@media(max-width:900px){
  .sh-search-layout{display:block}
  .sh-results-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-bottom:16px;position:relative;z-index:2}
  .sh-mobile-filter-toggle{display:inline-flex;grid-column:1}
  .sh-results-count{grid-column:2;margin:0;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sh-results-head>label{grid-column:3;justify-self:end;gap:6px}
  .sh-results-head>label>span{display:none}
  .sh-results-head .sh-select[data-sh-sort-select]{max-width:150px;height:44px;padding-top:8px;padding-bottom:8px}

  .sh-filter{position:fixed!important;top:0;left:0;bottom:0;width:min(88vw,390px);max-width:390px;z-index:10050;transform:translateX(-105%);transition:transform .28s ease;overflow-y:auto;overscroll-behavior:contain;background:#fff;box-shadow:18px 0 50px rgba(15,23,42,.22);padding:0}
  .sh-filter.is-open{transform:translateX(0)}
  .sh-filter>.sh-card{min-height:100%;border:0;border-radius:0;box-shadow:none;padding:20px 20px 28px;background:#fff}
  .sh-filter__head{position:sticky;top:0;z-index:4;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);margin:-20px -20px 6px;padding:16px 20px 12px;border-bottom:1px solid #edf2f7}
  .sh-filter__close{display:inline-flex}
  .sh-filter__group{padding:15px 0}
  .sh-filter .sh-btn[type="submit"]{position:sticky;bottom:10px;z-index:5;box-shadow:0 10px 28px rgba(37,99,235,.22);min-height:50px}
  .sh-filter-backdrop{display:block;position:fixed;inset:0;z-index:10040;background:rgba(15,23,42,.44);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .24s ease,visibility .24s ease}
  .sh-filter-backdrop.is-open{opacity:1;visibility:visible}
  body.sh-filter-drawer-open{overflow:hidden;touch-action:none}
  .sh-results-grid{scroll-margin-top:88px}
}

@media(max-width:480px){
  .sh-results-head{grid-template-columns:auto 1fr;gap:10px}
  .sh-mobile-filter-toggle{grid-column:1}
  .sh-results-count{grid-column:2;text-align:right}
  .sh-results-head>label{grid-column:1 / -1;width:100%;justify-content:flex-end}
  .sh-results-head .sh-select[data-sh-sort-select]{max-width:none;width:100%!important}
}

/* =====================================================================
   3.9.4 — Professional Become-a-Teacher conversion layout
   ===================================================================== */
.sh-teach-pro{background:#fff}.sh-teach-pro__hero{background:linear-gradient(135deg,#f5f8ff 0%,#fff 54%,#f5f7ff 100%);border-bottom:1px solid var(--sh-border,#e5e7eb);padding:46px 0 42px}.sh-teach-pro__hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);gap:48px;align-items:center}.sh-teach-pro__copy h1{font-size:clamp(42px,4.6vw,70px);line-height:1.02;letter-spacing:-.045em;margin:12px 0 18px;max-width:780px}.sh-teach-pro__copy .sh-lead{max-width:720px}.sh-teach-pro__actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px}.sh-teach-pro__faq-link{font-weight:800;color:var(--sh-primary,#4b3ad7);text-decoration:none}.sh-teach-pro__trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.sh-teach-pro__trust span{display:inline-flex;align-items:center;padding:9px 12px;border:1px solid #dfe7f6;background:rgba(255,255,255,.82);border-radius:999px;color:#334155;font-size:13px;font-weight:800}.sh-teach-pro__summary{background:rgba(255,255,255,.88);border:1px solid #dfe7f4;border-radius:26px;padding:24px;box-shadow:0 18px 50px rgba(15,23,42,.08)}.sh-teach-pro__summary-kicker{display:block;font-size:13px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--sh-primary,#4b3ad7);margin-bottom:14px}.sh-teach-pro__mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sh-teach-pro__mini-grid>div{min-height:142px;border:1px solid #e7ebf3;border-radius:18px;padding:17px;background:#fff;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.sh-teach-pro__mini-grid span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#eef2ff;color:var(--sh-primary,#4b3ad7);font-weight:900}.sh-teach-pro__mini-grid strong{font-size:16px}.sh-teach-pro__mini-grid small{color:var(--sh-muted,#687386);line-height:1.45}.sh-teach-pro__section-head{text-align:center;max-width:760px;margin:0 auto 30px}.sh-teach-pro__section-head h2{margin:8px 0 10px}.sh-teach-pro__section-head p{color:var(--sh-muted,#687386);margin:0}.sh-teach-pro__timeline{max-width:980px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.sh-teach-pro__step{border:1px solid #e4e9f1;border-radius:20px;background:#fff;padding:22px;display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start;box-shadow:0 8px 26px rgba(15,23,42,.035)}.sh-teach-pro__step>b{width:44px;height:44px;border-radius:14px;background:var(--sh-primary,#4b3ad7);color:#fff;display:grid;place-items:center;font-size:18px}.sh-teach-pro__step h3{font-size:19px;margin:3px 0 6px}.sh-teach-pro__step p{margin:0;color:var(--sh-muted,#687386);font-size:14px;line-height:1.55}.sh-teach-pro__requirements{background:#f8fafc;border-block:1px solid #e7ebf1;padding:52px 0}.sh-teach-pro__check-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.sh-teach-pro__check-grid>div{background:#fff;border:1px solid #e4e9f1;border-radius:18px;padding:18px;display:grid;grid-template-columns:42px 1fr;gap:12px}.sh-teach-pro__check-grid span{width:42px;height:42px;border-radius:13px;background:#eef2ff;display:grid;place-items:center}.sh-teach-pro__check-grid strong,.sh-teach-pro__check-grid small{grid-column:2}.sh-teach-pro__check-grid small{color:var(--sh-muted,#687386);line-height:1.45}.sh-teach-pro__mobile-cta{display:none}.sh-teach-pro__apply{background:linear-gradient(180deg,#fff 0,#f8f9ff 100%);border-top:1px solid #e6eaf1}.sh-teach-pro__support-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.sh-teach-pro__support-grid>div{border:1px solid #e5eaf1;border-radius:18px;padding:20px;background:#fff}.sh-teach-pro__support-grid span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:999px;background:#eef2ff;color:var(--sh-primary,#4b3ad7);font-weight:900;margin-bottom:12px}.sh-teach-pro__support-grid strong{display:block;font-size:17px;margin-bottom:6px}.sh-teach-pro__support-grid p{margin:0;color:var(--sh-muted,#687386);font-size:14px;line-height:1.55}
@media(max-width:900px){.sh-teach-pro__hero{padding:28px 0 30px}.sh-teach-pro__hero-grid{grid-template-columns:1fr;gap:24px}.sh-teach-pro__summary{padding:18px}.sh-teach-pro__copy h1{font-size:clamp(38px,8vw,54px)}.sh-teach-pro__timeline{grid-template-columns:1fr}.sh-teach-pro__check-grid,.sh-teach-pro__support-grid{grid-template-columns:1fr 1fr}.sh-teach-pro__step{padding:18px}}
@media(max-width:680px){.sh-teach-pro__hero{padding:24px 0 26px}.sh-teach-pro__hero-grid{gap:20px}.sh-teach-pro__copy h1{font-size:42px;line-height:1.06;margin:10px 0 14px}.sh-teach-pro__copy .sh-lead{font-size:18px;line-height:1.55}.sh-teach-pro__actions{display:grid;grid-template-columns:1fr;margin-top:22px;gap:13px}.sh-teach-pro__actions .sh-btn{width:100%;justify-content:center}.sh-teach-pro__faq-link{text-align:center}.sh-teach-pro__trust{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sh-teach-pro__trust span{justify-content:center;font-size:12px;padding:8px 9px}.sh-teach-pro__trust span:last-child{grid-column:1/-1}.sh-teach-pro__summary{border-radius:20px}.sh-teach-pro__mini-grid{grid-template-columns:1fr 1fr;gap:9px}.sh-teach-pro__mini-grid>div{min-height:118px;padding:14px}.sh-teach-pro__mini-grid strong{font-size:14px}.sh-teach-pro__mini-grid small{font-size:12px}.sh-teach-pro__process{padding-top:38px!important;padding-bottom:38px!important}.sh-teach-pro__section-head{margin-bottom:22px}.sh-teach-pro__section-head h2{font-size:32px}.sh-teach-pro__step{grid-template-columns:40px 1fr;border-radius:17px;gap:12px}.sh-teach-pro__step>b{width:40px;height:40px}.sh-teach-pro__requirements{padding:38px 0}.sh-teach-pro__check-grid,.sh-teach-pro__support-grid{grid-template-columns:1fr}.sh-teach-pro__check-grid>div{padding:15px;border-radius:16px}.sh-teach-pro__mobile-cta{display:flex;width:100%;justify-content:center;margin-top:18px}.sh-teach-pro__apply .sh-container.sh-section--tight{padding-top:36px!important;padding-bottom:6px!important}.sh-teach-pro__apply .sh-wizard{margin-top:0}.sh-teach-pro__support{padding-top:42px!important;padding-bottom:42px!important}}

/* =====================================================================
   Skill Hub LMS 3.9.5 — About page mobile refinement
   Keep desktop structure intact; make mobile layout more compact,
   scannable and consistent with the professional search/application UX.
   ===================================================================== */
@media (max-width:720px){
  .page-template-template-about .sh-page-head{
    padding:26px 0 30px;
    margin-bottom:22px;
  }
  .page-template-template-about .sh-page-head h1{
    font-size:2rem;
    line-height:1.08;
    letter-spacing:-.025em;
    max-width:17ch;
  }
  .page-template-template-about .sh-page-head .sh-lead{
    font-size:1rem;
    line-height:1.55;
    max-width:100%;
  }
}

/* SkillHub 4.5.5 — exam results and printable payment receipts */
.sh-result-intro{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.sh-grade-scale{display:grid;grid-template-columns:repeat(6,minmax(92px,1fr));gap:10px;margin:18px 0 22px}
.sh-grade-band{display:flex;flex-direction:column;gap:3px;padding:12px;border:1px solid #dce7ff;border-radius:14px;background:linear-gradient(145deg,#f7faff,#fff);color:#15345f}
.sh-grade-band strong{font-size:1.1rem;color:#2563eb}.sh-grade-band span{font-size:.75rem;color:#64748b;line-height:1.35}
.sh-grade-band.is-fail{border-color:#fecaca;background:#fff7f7}.sh-grade-band.is-fail strong,.sh-grade-band.is-fail span{color:#b42318}
.sh-result-list{display:grid;gap:16px}
.sh-result-card{padding:20px;border:1px solid #dbe4f2;border-left:5px solid #16a34a;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.06)}
.sh-result-card.is-fail{border-left-color:#dc2626;background:linear-gradient(145deg,#fff,#fff7f7)}
.sh-result-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.sh-result-card__head h3{margin:3px 0 0;color:#10233f;font-size:1.12rem}
.sh-result-outcome{flex:0 0 auto;padding:7px 12px;border-radius:999px;background:#dcfce7;color:#166534;font-weight:800;font-size:.82rem}
.sh-result-card.is-fail .sh-result-outcome{background:#fee2e2;color:#991b1b}
.sh-result-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}.sh-result-stats>div{padding:12px;border-radius:13px;background:#f7f9fc}
.sh-result-stats span,.sh-receipt-grid span,.sh-receipt-number span{display:block;color:#64748b;font-size:.75rem;margin-bottom:4px}.sh-result-stats strong{color:#12233f;font-size:1rem}
.sh-receipt-list{display:grid;gap:18px}.sh-payment-receipt{overflow:hidden;border:1px solid #dbe4f2;border-radius:20px;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.08)}
.sh-receipt-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:linear-gradient(135deg,#102a56,#265fd4);color:#fff}
.sh-receipt-head>div{display:flex;align-items:center;gap:11px}.sh-receipt-head strong{display:block;font-size:1.15rem}.sh-receipt-head small{display:block;color:#dbeafe}
.sh-receipt-logo{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#fff;color:#2563eb;font-size:1.4rem;font-weight:900}
.sh-receipt-number{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 20px;border-bottom:1px dashed #cbd5e1;background:#f8fafc}.sh-receipt-number span{margin:0}.sh-receipt-number strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#1e3a8a}
.sh-receipt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px;padding:20px}.sh-receipt-grid strong{display:block;color:#16243a;line-height:1.35}.sh-receipt-grid__wide{grid-column:1/-1}
.sh-receipt-total{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:0 20px;padding:17px 0;border-top:2px solid #e2e8f0}.sh-receipt-total span{font-weight:700;color:#475569}.sh-receipt-total strong{color:#0f766e;font-size:1.4rem}
.sh-receipt-actions{display:flex;justify-content:flex-end;padding:0 20px 20px}
@media(max-width:700px){
 .sh-grade-scale{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.sh-grade-band{padding:9px}
 .sh-result-card{padding:15px}.sh-result-card__head{display:grid}.sh-result-outcome{justify-self:start}.sh-result-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.sh-result-stats>div{padding:10px}
 .sh-receipt-head,.sh-receipt-number,.sh-receipt-grid{padding-left:14px;padding-right:14px}.sh-receipt-grid{gap:13px 10px}.sh-receipt-total{margin-left:14px;margin-right:14px}.sh-receipt-actions{padding:0 14px 16px}.sh-receipt-actions .sh-btn{width:100%;justify-content:center}
}
@media print{
 body.sh-printing-receipt *{visibility:hidden!important}body.sh-printing-receipt [data-sh-transaction-receipt],body.sh-printing-receipt [data-sh-transaction-receipt] *{visibility:visible!important}
 body.sh-printing-receipt [data-sh-transaction-receipt]{position:absolute!important;inset:0 auto auto 0!important;width:100%!important;border:0!important;box-shadow:none!important}
 body.sh-printing-receipt .sh-receipt-actions{display:none!important}
}

/* ===== Skill Hub LMS — Colorful dashboard widgets + mobile overflow fix ===== */

/* --- Global mobile overflow safety net (fixes text/cards spilling left-right) --- */
html,body{overflow-x:hidden}
.sh-dash,.sh-dash *{box-sizing:border-box}
.sh-dash .sh-card,.sh-dash .sh-widgets>*,.sh-dash .sh-statlist,.sh-dash h1,.sh-dash h2,.sh-dash h3,.sh-dash p,.sh-dash span,.sh-dash small,.sh-dash strong{overflow-wrap:anywhere;word-break:break-word}
@media(max-width:1023px){
  .sh-dash{overflow-x:hidden}
  .sh-dash-main,.sh-dashboard-main{max-width:100vw;overflow-x:hidden;padding-inline:14px!important}
  .sh-widgets{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .sh-widgets>*{min-width:0!important;max-width:100%!important}
}

/* --- Decent single-tone stat widgets (subtle brand color, not rainbow) --- */
.sh-widgets{grid-auto-rows:1fr}
.sh-widgets>.sh-widget{position:relative;border:1px solid var(--sh-border)!important;border-left:4px solid var(--sh-primary)!important;background:#fff!important;box-shadow:var(--sh-shadow-sm)}
.sh-widgets>.sh-widget .sh-widget__icon{background:var(--sh-indigo-50)!important;color:var(--sh-primary)!important}
.sh-widget__icon{border-radius:12px;transition:transform .18s ease;width:42px;height:42px;display:grid;place-items:center;font-size:1.1rem}
.sh-widgets>.sh-widget:hover{box-shadow:var(--sh-shadow-lg);transform:translateY(-2px);transition:.18s ease}
.sh-widgets>.sh-widget:hover .sh-widget__icon{transform:scale(1.08) rotate(-4deg)}

/* --- Dashboard sidebar nav group headings: colored section labels --- */
.sh-dash__nav-group{margin:18px 0 8px;padding:0 4px;font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--sh-primary);position:relative}
.sh-dash__nav-group:first-child{margin-top:4px}
.sh-dash__nav-group::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sh-primary);margin-right:7px;vertical-align:middle}
.sh-widget__value{background:linear-gradient(90deg,var(--sh-ink),var(--sh-slate-700));-webkit-background-clip:text;background-clip:text}

/* --- Colorful section headers inside dashboard cards --- */
.sh-dash .sh-card--pad>h2:first-child,.sh-dash .sh-card--pad>h3:first-child{position:relative;padding-left:14px}
.sh-dash .sh-card--pad>h2:first-child::before,.sh-dash .sh-card--pad>h3:first-child::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--sh-primary),var(--sh-info))}

/* --- Dashboard sidebar nav: colorful active/hover state --- */
.sh-dash__side nav a,.sh-dash__nav a{border-radius:10px;transition:.15s ease}
.sh-dash__side nav a:hover,.sh-dash__nav a:hover{background:var(--sh-indigo-50);color:var(--sh-primary)}
.sh-dash__side nav a.is-active,.sh-dash__nav a.is-active,.sh-dash__side nav a[aria-current="page"],.sh-dash__nav a[aria-current="page"]{background:linear-gradient(135deg,var(--sh-primary),var(--sh-indigo-500));color:#fff!important;box-shadow:0 6px 16px rgba(67,56,202,.28)}

/* --- Badges/status pop of color already themed via tokens; just add subtle shadow --- */
.sh-status{box-shadow:0 1px 3px rgba(15,23,42,.06)}

/* ===== Skill Hub LMS — Per-role dashboard color identity ===== */
.sh-dash--admin .sh-dash__nav-group{color:var(--sh-indigo-600)}.sh-dash--admin .sh-dash__nav-group::before{background:var(--sh-indigo-600)}
.sh-dash--teacher .sh-dash__nav-group{color:#0f766e}.sh-dash--teacher .sh-dash__nav-group::before{background:#0f766e}
.sh-dash--student .sh-dash__nav-group{color:#0369a1}.sh-dash--student .sh-dash__nav-group::before{background:#0369a1}
.sh-dash--parent .sh-dash__nav-group{color:#a21caf}.sh-dash--parent .sh-dash__nav-group::before{background:#a21caf}

.sh-dash--admin .sh-dash__menu-trigger,.sh-dash--admin .sh-dash__side .sh-side-profile{background:linear-gradient(135deg,#eef2ff,#f5f3ff)!important}
.sh-dash--admin .sh-dash__menu-copy small{color:var(--sh-indigo-600)!important}
.sh-dash--admin .sh-dash__nav a.is-active,.sh-dash--admin .sh-dash__nav a[aria-current="page"]{background:linear-gradient(135deg,#4338ca,#4f46e5)!important}

.sh-dash--teacher .sh-dash__menu-trigger,.sh-dash--teacher .sh-dash__side .sh-side-profile{background:linear-gradient(135deg,#ecfdf5,#f0fdfa)!important}
.sh-dash--teacher .sh-dash__menu-copy small{color:#0f766e!important}
.sh-dash--teacher .sh-dash__nav a.is-active,.sh-dash--teacher .sh-dash__nav a[aria-current="page"]{background:linear-gradient(135deg,#0d9488,#16a34a)!important}
.sh-dash--teacher .sh-dash__menu-chevron{color:#0f766e!important}

.sh-dash--student .sh-dash__menu-trigger,.sh-dash--student .sh-dash__side .sh-side-profile{background:linear-gradient(135deg,#eff6ff,#f0f9ff)!important}
.sh-dash--student .sh-dash__menu-copy small{color:#0369a1!important}
.sh-dash--student .sh-dash__nav a.is-active,.sh-dash--student .sh-dash__nav a[aria-current="page"]{background:linear-gradient(135deg,#0284c7,#0ea5e9)!important}
.sh-dash--student .sh-dash__menu-chevron{color:#0369a1!important}

.sh-dash--parent .sh-dash__menu-trigger,.sh-dash--parent .sh-dash__side .sh-side-profile{background:linear-gradient(135deg,#fdf4ff,#fff7ed)!important}
.sh-dash--parent .sh-dash__menu-copy small{color:#a21caf!important}
.sh-dash--parent .sh-dash__nav a.is-active,.sh-dash--parent .sh-dash__nav a[aria-current="page"]{background:linear-gradient(135deg,#a21caf,#d97706)!important}
.sh-dash--parent .sh-dash__menu-chevron{color:#a21caf!important}

/* Sidebar profile card polish (all roles) */
.sh-side-profile{border-radius:14px;padding:12px;margin-bottom:10px}
.sh-dash__nav a{padding:11px 12px}
.sh-dash__nav a .ico{width:26px;display:inline-flex;justify-content:center}

/* ===== Skill Hub LMS — Compact mobile widget layout (icon+label+value grid) ===== */
@media(max-width:700px){
  .sh-widgets>.sh-widget{
    padding:12px 12px!important;
    display:grid!important;
    grid-template-columns:34px 1fr!important;
    grid-template-rows:auto auto!important;
    column-gap:9px!important;
    row-gap:2px!important;
    align-items:center!important;
    min-height:0!important;
  }
  .sh-widgets>.sh-widget .sh-widget__icon{
    float:none!important;
    margin:0!important;
    grid-column:1!important;
    grid-row:1 / span 2!important;
    width:34px!important;
    height:34px!important;
    font-size:.9rem!important;
    border-radius:9px!important;
  }
  .sh-widgets>.sh-widget .sh-widget__label{
    grid-column:2!important;
    grid-row:1!important;
    font-size:.64rem!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:break-word!important;
    margin:0!important;
  }
  .sh-widgets>.sh-widget .sh-widget__value{
    grid-column:2!important;
    grid-row:2!important;
    font-size:clamp(.82rem,4.2vw,1.15rem)!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:break-word!important;
    max-width:100%!important;
    margin:2px 0 0!important;
  }
  .sh-widgets>.sh-widget .sh-widget__trend{grid-column:2;grid-row:3;font-size:.62rem!important;margin:0!important}
}


/* Skill Hub LMS 4.6.0 — one-page finance receipt printing.
   A temporary direct-body print stage prevents hidden dashboard content,
   sticky mobile navigation, and page-height rules from generating a blank page 2. */
.sh-print-stage{display:none}
@media print{
 @page{margin:10mm}
 html,body{height:auto!important;min-height:0!important;overflow:visible!important;background:#fff!important}
 body.sh-printing-receipt{margin:0!important;padding:0!important;min-height:0!important;height:auto!important}
 body.sh-printing-receipt>*:not(.sh-print-stage){display:none!important}
 body.sh-printing-receipt>.sh-print-stage{display:block!important;position:static!important;width:100%!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible!important}
 body.sh-printing-receipt>.sh-print-stage,body.sh-printing-receipt>.sh-print-stage *{visibility:visible!important}
 body.sh-printing-receipt>.sh-print-stage .is-print-target{display:block!important;position:static!important;inset:auto!important;width:100%!important;max-width:760px!important;height:auto!important;min-height:0!important;margin:0 auto!important;padding:0!important;box-sizing:border-box!important;overflow:visible!important;break-inside:avoid!important;page-break-inside:avoid!important;page-break-after:avoid!important;break-after:avoid-page!important;box-shadow:none!important}
 body.sh-printing-receipt>.sh-print-stage .sh-receipt-actions{display:none!important}
 body.sh-printing-receipt>.sh-print-stage .sh-receipt-head{break-inside:avoid!important}
 body.sh-printing-receipt>.sh-print-stage .sh-receipt-number,body.sh-printing-receipt>.sh-print-stage .sh-receipt-grid,body.sh-printing-receipt>.sh-print-stage .sh-receipt-total,body.sh-printing-receipt>.sh-print-stage .sh-receipt-note{break-inside:avoid!important;page-break-inside:avoid!important}
}


/* =====================================================================
   4.4.19 — Unified Skill Hub LMS dashboard header system
   Applies the Finance-receipt visual language to the main page heading
   across Student, Teacher, Parent and Admin dashboards without changing
   business logic or section content.
   ===================================================================== */
.sh-dash__head{
  position:relative;
  isolation:isolate;
  overflow:visible;
  padding:24px 26px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:22px;
  background:linear-gradient(135deg,#123b79 0%,#1554b7 52%,#2f6be8 100%);
  box-shadow:0 16px 36px rgba(18,59,121,.18);
}
.sh-dash__head::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  overflow:hidden;
  border-radius:inherit;
  background:
    radial-gradient(circle at 90% 8%,rgba(255,255,255,.18),transparent 28%),
    linear-gradient(120deg,rgba(255,255,255,.08),transparent 42%);
  pointer-events:none;
}
.sh-dash__head>div:first-child{min-width:0}
.sh-dash__head .sh-breadcrumb{margin-bottom:9px;color:rgba(255,255,255,.72)}
.sh-dash__head .sh-breadcrumb a{color:rgba(255,255,255,.88)}
.sh-dash__head .sh-breadcrumb a:hover{color:#fff}
.sh-dash__head .sh-breadcrumb span{color:rgba(255,255,255,.58)}
.sh-dash__title{
  margin:0 0 5px!important;
  color:#fff;
  font-size:clamp(1.55rem,2.4vw,2rem);
  line-height:1.12;
  letter-spacing:-.025em;
  text-shadow:0 1px 1px rgba(0,0,0,.08);
}
.sh-dash__sub{color:rgba(255,255,255,.78)!important;font-weight:500}
.sh-dash__head-actions{align-items:center;justify-content:flex-end}
.sh-dash__head-actions>.sh-btn,
.sh-dash__head-actions .sh-notification-bell>summary{
  min-height:40px;
  border-color:rgba(255,255,255,.34)!important;
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.sh-dash__head-actions>.sh-btn:hover,
.sh-dash__head-actions .sh-notification-bell>summary:hover{
  background:rgba(255,255,255,.2)!important;
  border-color:rgba(255,255,255,.5)!important;
}
.sh-dash__head-actions>.sh-btn--primary{
  background:#fff!important;
  border-color:#fff!important;
  color:#174fa7!important;
  box-shadow:0 8px 20px rgba(4,28,70,.16)!important;
}
.sh-dash__head-actions>.sh-btn--primary:hover{background:#f3f7ff!important;color:#123b79!important}
.sh-dash__head .sh-notification-panel{color:var(--sh-text,#172033);background:#fff}
.sh-dash__head .sh-notification-panel h3,
.sh-dash__head .sh-notification-panel strong,
.sh-dash__head .sh-notification-panel p,
.sh-dash__head .sh-notification-panel span,
.sh-dash__head .sh-notification-panel a{color:inherit}

/* Shared section-heading accent: keeps inner dashboard cards clean while
   giving major card headings the same branded language as the page header. */
.sh-dash .sh-card--pad>h1:first-child,
.sh-dash .sh-card--pad>h2:first-child,
.sh-dash .sh-card--pad>h3:first-child{
  position:relative;
  padding-left:16px;
}
.sh-dash .sh-card--pad>h1:first-child::before,
.sh-dash .sh-card--pad>h2:first-child::before,
.sh-dash .sh-card--pad>h3:first-child::before{
  content:"";
  position:absolute;
  left:0;
  top:.12em;
  bottom:.12em;
  width:5px;
  border-radius:999px;
  background:linear-gradient(180deg,#1554b7,#2f6be8);
  box-shadow:0 0 0 3px rgba(47,107,232,.08);
}

@media(max-width:1023px){
  .sh-dash__head{padding:21px 20px;border-radius:20px;margin-bottom:18px!important}
  .sh-dash__head-actions{width:100%;justify-content:flex-start}
}
@media(max-width:680px){
  .sh-dash__head{
    gap:15px!important;
    padding:19px 18px 18px!important;
    border-radius:18px!important;
    box-shadow:0 12px 28px rgba(18,59,121,.16);
  }
  .sh-dash__head .sh-breadcrumb{display:none}
  .sh-dash__title{font-size:1.55rem!important;line-height:1.16!important}
  .sh-dash__sub{font-size:.82rem!important}
  .sh-dash__head-actions{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:8px!important;
    align-items:center!important;
  }
  .sh-dash__head-actions>.sh-btn{width:100%;justify-content:center;min-width:0;padding-inline:12px!important}
  .sh-dash__head-actions>.sh-btn--primary{grid-column:1/-1}
  .sh-dash__head-actions .sh-notification-bell{justify-self:start}
  .sh-dash__head-actions .sh-notification-panel{max-width:min(88vw,360px)}
}
@media(max-width:420px){
  .sh-dash__head{padding:17px 15px 16px!important}
  .sh-dash__title{font-size:1.4rem!important}
  .sh-dash__head-actions>.sh-btn{font-size:.78rem!important;padding:8px 10px!important}
}

/* =====================================================================
   4.4.20 — Dashboard mobile stability pass
   Fixes shared role-dashboard issues without changing role/data logic:
   1) notification bell/panel layout, 2) collapsing class/list rows,
   3) WordPress menu UL rendering + tablet/mobile header breakpoint.
   ===================================================================== */

/* WordPress menus render as UL/LI. Keep the desktop primary menu on one
   clean row and remove browser list markers/margins. */
.sh-nav__menu,
.sh-nav .menu,
.sh-nav > ul{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  list-style:none;
  margin:0;
  padding:0;
  min-width:0;
}
.sh-nav__menu > li,
.sh-nav .menu > li,
.sh-nav > ul > li{
  position:relative;
  list-style:none;
  margin:0;
  padding:0;
}
.sh-nav__menu a,
.sh-nav .menu a,
.sh-nav > ul a{display:flex;align-items:center;white-space:nowrap;text-decoration:none}

/* Shared dashboard rows: never allow the text column to collapse to a
   one-character-wide min-content column beside its action button. */
.sh-dash .sh-admin-record{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}
.sh-dash .sh-admin-record > :first-child:not(.sh-btn),
.sh-dash .sh-admin-record > .sh-notification-row-link{
  flex:1 1 auto;
  min-width:0;
  width:auto;
  max-width:100%;
}
.sh-dash .sh-admin-record > .sh-btn,
.sh-dash .sh-admin-record > a.sh-btn,
.sh-dash .sh-admin-record > form{
  flex:0 0 auto;
}
.sh-dash .sh-admin-record strong,
.sh-dash .sh-admin-record .sh-muted,
.sh-dash .sh-admin-record span{
  word-break:normal!important;
  overflow-wrap:break-word!important;
}

/* Notification bell + dropdown: compact, usable, and role-independent. */
.sh-dash__head-actions .sh-notification-bell{position:relative;margin:0;flex:0 0 auto;z-index:120}
.sh-dash__head-actions .sh-notification-bell > summary{
  width:42px;
  height:42px;
  padding:0!important;
  display:grid;
  place-items:center;
  line-height:1;
  font-size:0;
  cursor:pointer;
  border-radius:13px!important;
}
.sh-dash__head-actions .sh-notification-bell > summary::before{
  content:"🔔";
  font-size:18px;
  line-height:1;
}
.sh-dash__head-actions .sh-notification-count{
  right:-5px;
  top:-6px;
  min-width:19px;
  height:19px;
  padding:0 5px;
  border:2px solid #fff;
  font-size:10px;
  font-weight:800;
}
.sh-dash__head-actions .sh-notification-panel{
  right:0;
  left:auto;
  top:calc(100% + 10px);
  width:min(390px,calc(100vw - 32px));
  max-height:min(560px,72vh);
  padding:14px;
  overflow:auto;
  border:1px solid #dce5f0;
  border-radius:18px;
  background:#fff;
  box-shadow:0 22px 55px rgba(15,23,42,.22);
  color:#172033;
  z-index:1000;
}
.sh-notification-panel > .sh-flex:first-child{
  position:sticky;
  top:-14px;
  z-index:3;
  margin:-14px -14px 8px;
  padding:14px;
  align-items:center;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #edf1f6;
  backdrop-filter:blur(8px);
}
.sh-notification-panel > .sh-flex:first-child h3{margin:0;font-size:1.05rem;line-height:1.25}
.sh-notification-item{
  position:relative;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 34px!important;
  gap:10px!important;
  align-items:start;
  padding:12px 0!important;
  border-bottom:1px solid #edf1f6!important;
}
.sh-notification-item__body{
  min-width:0;
  width:100%;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#172033!important;
  text-align:left;
  text-decoration:none;
  display:grid;
  gap:4px;
}
.sh-notification-item__body strong{font-size:.9rem;line-height:1.35;color:#152238!important}
.sh-notification-item__body span{font-size:.78rem;line-height:1.45;color:#617087!important;word-break:normal!important;overflow-wrap:break-word!important}
.sh-notification-item__body small{font-size:.72rem;line-height:1.35;color:#8793a4!important}
.sh-notification-x{
  position:static!important;
  grid-column:2!important;
  grid-row:1!important;
  width:32px!important;
  min-width:32px!important;
  height:32px!important;
  min-height:32px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid #e2e8f0!important;
  border-radius:10px!important;
  background:#f8fafc!important;
  color:#64748b!important;
  font-size:19px!important;
  line-height:1!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:none!important;
  cursor:pointer;
}
.sh-notification-x:hover{background:#fff1f2!important;border-color:#fecdd3!important;color:#be123c!important}

/* Tablet/mobile site header: switch to the drawer before the desktop menu
   becomes cramped. This also protects dashboard pages at browser zoom. */
@media(max-width:900px){
  .sh-header__inner{width:100%;max-width:none;padding-left:14px;padding-right:10px;gap:10px}
  .sh-nav{display:none!important}
  .sh-burger{display:inline-flex!important;align-items:center;justify-content:center}
  .sh-header__actions{margin-left:auto;gap:6px;min-width:0}
  .sh-header__actions > .sh-btn{display:none!important}
  .sh-header__actions .sh-currency-switcher{max-width:128px}
  .sh-logo{min-width:0;flex:0 1 auto}
  .sh-logo img,.sh-logo .custom-logo{max-width:min(170px,44vw);height:auto}
}

@media(max-width:700px){
  /* Generic class/booking/list cards become clean stacked mobile rows while
     preserving each role's own data source and grouping/folder logic. */
  .sh-dash .sh-admin-record{
    align-items:flex-start;
    gap:10px;
    padding:13px 0;
  }
  .sh-dash .sh-admin-record > :first-child:not(.sh-btn){width:calc(100% - 74px)}
  .sh-dash .sh-admin-record > .sh-btn,
  .sh-dash .sh-admin-record > a.sh-btn{
    min-width:62px;
    width:auto!important;
    justify-content:center;
  }
  .sh-dash .sh-admin-record strong{display:inline;font-size:.92rem;line-height:1.35}
  .sh-dash .sh-admin-record .sh-muted{display:inline-block;margin-top:4px;font-size:.78rem;line-height:1.45}

  .sh-dash__head{overflow:visible!important}
  .sh-dash__head-actions{grid-template-columns:auto minmax(0,1fr)!important}
  .sh-dash__head-actions .sh-notification-panel{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:calc(var(--sh-header-h,72px) + 12px)!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100dvh - var(--sh-header-h,72px) - var(--sh-bottomnav-h,72px) - 36px)!important;
    border-radius:18px!important;
  }
  .sh-notification-panel > .sh-flex:first-child{display:flex!important;flex-direction:row!important;gap:8px!important}
  .sh-notification-panel > .sh-flex:first-child form{margin-left:auto}
  .sh-notification-panel > .sh-flex:first-child .sh-btn{width:auto!important;min-height:34px!important;padding:7px 10px!important;font-size:.72rem!important}
}

@media(max-width:430px){
  .sh-dash .sh-admin-record{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
  .sh-dash .sh-admin-record > :first-child:not(.sh-btn){width:auto!important}
}

/* Skill Hub LMS 4.4.22 — universal two-column teacher discovery + crop-safe portraits. */
/* Homepage/category teacher cards: always two per row on desktop and mobile. */
html body .shp-teacher-grid,
html body.home .shp-teacher-grid,
html body .sh-home-teachers .shp-teacher-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}

/* Keep the complete top and both side edges of the portrait visible.
   The image scales by width; only excess height can disappear below the frame. */
html body.home .shp-teacher .shp-teacher__photo,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
  height:280px!important;
  padding:8px!important;
  overflow:hidden!important;
  background:#eef3fb!important;
}
html body.home .shp-teacher .shp-teacher__photo>a,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo>a{
  display:block!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.72)!important;
}
html body.home .shp-teacher .shp-teacher__photo>a>img.shp-teacher__photo-main,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo>a>img.shp-teacher__photo-main{
  display:block!important;
  width:100%!important;
  min-width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  object-fit:unset!important;
  object-position:unset!important;
  margin:0!important;
  padding:0!important;
}

/* Find Teachers / track / subject / tuition results: exactly two teacher cards per row. */
html body .sh-results-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}
html body .sh-results-grid .sh-teacher-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
html body .sh-results-grid .sh-teacher-card__avatar img{
  object-fit:contain!important;
  object-position:center top!important;
  background:#f8fafc!important;
}

@media(max-width:700px){
  html body .shp-teacher-grid,
  html body.home .shp-teacher-grid,
  html body .sh-home-teachers .shp-teacher-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  html body.home .shp-teacher,
  html body .sh-home-teachers .shp-teacher{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }
  html body.home .shp-teacher .shp-teacher__photo,
  html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
    height:170px!important;
    padding:5px!important;
  }
  html body.home .shp-teacher__body,
  html body .sh-home-teachers .shp-teacher__body{
    padding:10px!important;
  }
  html body.home .shp-teacher__body h3,
  html body .sh-home-teachers .shp-teacher__body h3{font-size:.86rem!important}
  html body.home .shp-teacher__subjects,
  html body .sh-home-teachers .shp-teacher__subjects{font-size:.66rem!important;line-height:1.35!important;margin-bottom:7px!important}
  html body.home .shp-teacher__qualification,
  html body .sh-home-teachers .shp-teacher__qualification{font-size:.63rem!important;min-height:2.6em!important;margin-bottom:7px!important}
  html body.home .shp-teacher__facts,
  html body .sh-home-teachers .shp-teacher__facts{font-size:.62rem!important;padding:6px!important;margin-bottom:8px!important}
  html body.home .shp-teacher__price,
  html body .sh-home-teachers .shp-teacher__price{font-size:.62rem!important;padding-top:8px!important}
  html body.home .shp-teacher__price strong,
  html body .sh-home-teachers .shp-teacher__price strong{font-size:.78rem!important}
  html body.home .shp-teacher__actions,
  html body .sh-home-teachers .shp-teacher__actions{grid-template-columns:1fr!important;gap:5px!important;margin-top:8px!important;padding-top:8px!important}
  html body.home .shp-teacher__actions .sh-btn,
  html body .sh-home-teachers .shp-teacher__actions .sh-btn{min-height:32px!important;padding:6px 5px!important;font-size:.62rem!important}

  html body .sh-results-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  html body .sh-results-grid .sh-teacher-card__top{
    display:block!important;
    padding:8px 8px 0!important;
  }
  html body .sh-results-grid .sh-teacher-card__avatar{
    width:100%!important;
    height:112px!important;
    margin:0 0 8px!important;
    overflow:hidden!important;
    border-radius:12px!important;
    background:#f8fafc!important;
  }
  html body .sh-results-grid .sh-teacher-card__avatar img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    border-radius:12px!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  html body .sh-results-grid .sh-teacher-card__status{right:5px!important;bottom:5px!important}
  html body .sh-results-grid .sh-teacher-card__name{font-size:.78rem!important;line-height:1.25!important;display:block!important}
  html body .sh-results-grid .sh-teacher-card__name .sh-badge{display:inline-flex!important;margin-top:4px!important;font-size:.5rem!important}
  html body .sh-results-grid .sh-teacher-card__subjects{font-size:.61rem!important;white-space:normal!important;line-height:1.3!important;margin:4px 0 6px!important}
  html body .sh-results-grid .sh-teacher-card__meta{font-size:.58rem!important;gap:3px!important}
  html body .sh-results-grid .sh-teacher-card>.sh-teacher-card__meta{padding:7px 8px 0!important}
  html body .sh-results-grid .sh-teacher-card__intro{padding:7px 8px!important;font-size:.61rem!important;line-height:1.35!important;-webkit-line-clamp:3!important}
  html body .sh-results-grid .sh-teacher-card__tags{padding:0 8px 7px!important;gap:4px!important}
  html body .sh-results-grid .sh-teacher-card__tags .sh-badge{font-size:.52rem!important;padding:3px 5px!important}
  html body .sh-results-grid .sh-teacher-card__pricing{grid-template-columns:1fr!important;padding:7px 8px!important;gap:5px!important}
  html body .sh-results-grid .sh-teacher-card__price{padding:6px!important}
  html body .sh-results-grid .sh-teacher-card__price .amt{font-size:.76rem!important}
  html body .sh-results-grid .sh-teacher-card__price .per{font-size:.52rem!important}
  html body .sh-results-grid .sh-teacher-card__footer{grid-template-columns:1fr!important;padding:0 8px 8px!important;gap:5px!important}
  html body .sh-results-grid .sh-teacher-card__footer .sh-btn{font-size:.58rem!important;padding:6px 4px!important;min-height:31px!important}
  html body .sh-results-grid .sh-teacher-card__compare{display:none!important}
}

/* Skill Hub LMS 4.4.23 — enforce exactly two teacher cards per row on desktop and mobile. */
html body .shp-teacher-grid,
html body.home .shp-teacher-grid,
html body .sh-home-teachers .shp-teacher-grid,
html body .sh-results-grid,
html body .sh-home-teachers .sh-results-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}
html body .shp-teacher-grid > *,
html body .sh-results-grid > *{
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
}
@media(max-width:700px){
  html body .shp-teacher-grid,
  html body.home .shp-teacher-grid,
  html body .sh-home-teachers .shp-teacher-grid,
  html body .sh-results-grid,
  html body .sh-home-teachers .sh-results-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
}


/* 4.4.24 — grouped upcoming-class folders on teacher/student overview */
.sh-class-folders>.sh-results-head{margin-bottom:14px}.sh-class-folder{margin:10px 0;border:1px solid var(--sh-border,#e5e7eb);border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.05)}.sh-class-folder>summary{list-style:none;cursor:pointer;padding:0}.sh-class-folder>summary::-webkit-details-marker{display:none}.sh-class-folder__summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:14px 16px;background:linear-gradient(135deg,#f8fbff 0%,#f3f7ff 100%)}.sh-class-folder[open]>.sh-class-folder__summary,.sh-class-folder[open]>summary .sh-class-folder__summary{border-bottom:1px solid var(--sh-border,#e5e7eb)}.sh-class-folder__summary .sh-avatar,.sh-class-folder__summary img{width:48px;height:48px;min-width:48px;border-radius:14px;object-fit:cover}.sh-class-folder__main{min-width:0;display:flex;flex-direction:column;gap:3px}.sh-class-folder__main strong{font-size:1rem;color:var(--sh-text,#0f172a);white-space:normal;overflow-wrap:anywhere}.sh-class-folder__main span{font-size:.86rem;color:var(--sh-muted,#64748b);white-space:normal}.sh-class-folder__count{min-width:34px;text-align:center}.sh-class-folder>.sh-class-folder__body,.sh-class-folder__body{padding:12px 14px 14px}.sh-class-folder__class{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 4px;border-bottom:1px solid #eef2f7}.sh-class-folder__class:last-child{border-bottom:0}.sh-class-folder__class>div{min-width:0;display:flex;flex-direction:column;gap:3px}.sh-class-folder__class strong,.sh-class-folder__class span{white-space:normal;overflow-wrap:anywhere}.sh-class-folder__class span{font-size:.88rem;color:var(--sh-muted,#64748b)}.sh-class-folder__body>.sh-record-accordion{margin:8px 0}.sh-class-folder[open] .sh-record-chevron{transform:rotate(180deg)}
@media(max-width:640px){.sh-class-folder__summary{grid-template-columns:auto minmax(0,1fr) auto;gap:10px;padding:12px}.sh-class-folder__summary .sh-avatar,.sh-class-folder__summary img{width:42px;height:42px;min-width:42px;border-radius:12px}.sh-class-folder__summary>.sh-record-chevron{display:none}.sh-class-folder__main strong{font-size:.95rem}.sh-class-folder__main span{font-size:.78rem;line-height:1.35}.sh-class-folder__body{padding:8px 10px 12px}.sh-class-folder__class{align-items:flex-start;gap:10px;padding:11px 2px}.sh-class-folder__class .sh-btn{flex:0 0 auto}.sh-class-folders>.sh-results-head{align-items:flex-start;gap:8px}}

/* =====================================================================
   Skill Hub LMS 4.4.31 — Full dashboard professional UI system
   Shared visual layer for Student, Teacher, Parent and Admin dashboards.
   No business logic, REST routes, data queries or form actions are changed.
   ===================================================================== */
.sh-dash{
  --dash-ink:#172033;
  --dash-muted:#69778c;
  --dash-line:#e3eaf3;
  --dash-soft:#f6f9fd;
  --dash-blue:#1f63df;
  --dash-blue-deep:#123b79;
  --dash-radius:20px;
  --dash-shadow:0 12px 32px rgba(23,45,78,.08);
}

/* Main dashboard canvas */
.sh-dash__main{min-width:0;background:linear-gradient(180deg,#f8fbff 0,#fff 240px);}
.sh-dash__main>.sh-block,
.sh-dash__main>.sh-card,
.sh-dash__main>.sh-grid,
.sh-dash__main>.sh-dashboard-grid,
.sh-dash__main>.sh-widgets,
.sh-dash__main>.sh-stack{position:relative;}

/* Sidebar */
.sh-dash__side{
  border-right:1px solid #dfe7f1;
  background:linear-gradient(180deg,#fff 0%,#f7faff 100%);
  box-shadow:10px 0 30px rgba(31,58,95,.05);
}
.sh-side-profile{padding:18px 14px 14px;margin:8px;border:1px solid #e2e9f2;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(25,50,84,.06)}
.sh-dash__brand{display:flex;gap:11px;align-items:center;min-width:0}
.sh-dash__brand .sh-avatar{border:3px solid #fff;box-shadow:0 0 0 2px #dfe9fb,0 5px 12px rgba(30,72,135,.14)}
.sh-dash__role{display:inline-flex;margin-top:3px;padding:3px 8px;border-radius:999px;background:#eef4ff;color:#2454a2;font-size:.69rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.sh-dash__nav{padding:5px 10px 16px}
.sh-dash__nav-group{margin:15px 8px 6px;color:#8793a5;font-size:.67rem;font-weight:800;letter-spacing:.10em;text-transform:uppercase}
.sh-dash__nav a{min-height:43px;margin:3px 0;padding:9px 11px;border:1px solid transparent;border-radius:12px;color:#42516a;font-weight:650;transition:.18s ease}
.sh-dash__nav a .ico{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#f1f5fb;color:#315b9b;font-size:.88rem;transition:.18s ease}
.sh-dash__nav a:hover{background:#f4f8ff;border-color:#e1eaf7;color:#173c72;transform:translateX(2px)}
.sh-dash__nav a.is-active{background:linear-gradient(135deg,#123b79,#2468df);border-color:transparent;color:#fff;box-shadow:0 8px 20px rgba(30,91,192,.20)}
.sh-dash__nav a.is-active .ico{background:rgba(255,255,255,.16);color:#fff}
.sh-dash__count{margin-left:auto;min-width:22px;height:22px;padding:0 6px;display:inline-grid;place-items:center;border-radius:999px;background:#e8f0ff;color:#2454a2;font-size:.69rem;font-weight:800}
.sh-dash__nav a.is-active .sh-dash__count{background:#fff;color:#174d9f}
.sh-dash__side-foot{padding:12px;border-top:1px solid #e5ebf3;background:rgba(255,255,255,.7)}

/* Mobile dashboard switcher */
.sh-dash__mobilebar{margin-bottom:12px}
.sh-dash__menu-trigger{border:1px solid #dce7f2!important;border-radius:18px!important;background:linear-gradient(135deg,#f3fbf9,#f4f8ff)!important;box-shadow:0 8px 22px rgba(31,65,108,.08)!important;min-height:68px!important;padding:12px 14px!important}
.sh-dash__menu-icon{width:42px!important;height:42px!important;border-radius:13px!important;background:#edf4ff!important;display:grid!important;place-content:center!important;gap:4px!important}
.sh-dash__menu-icon span{display:block!important;width:20px!important;height:3px!important;border-radius:999px!important;background:#2b6fdc!important}
.sh-dash__menu-copy small{color:#16796f!important;font-size:.66rem!important;font-weight:800!important;letter-spacing:.08em!important;text-transform:uppercase!important}
.sh-dash__menu-copy strong{color:#16233a!important;font-size:1rem!important;line-height:1.2!important}
.sh-dash__menu-chevron{color:#18877d!important;font-size:1.6rem!important}

/* Cards and sections */
.sh-dash .sh-card,
.sh-dash .sh-block,
.sh-dash .sh-profile-card,
.sh-dash .sh-mini-card,
.sh-dash .sh-tuition-card,
.sh-dash .sh-exam-card,
.sh-dash .sh-result-list,
.sh-dash .sh-submission,
.sh-dash .sh-danger-zone,
.sh-dash .sh-ops-table,
.sh-dash .sh-record-list{
  border-color:var(--dash-line)!important;
  border-radius:var(--dash-radius)!important;
  background:#fff;
  box-shadow:var(--dash-shadow);
}
.sh-dash .sh-card--soft{background:linear-gradient(180deg,#fbfdff,#f6f9fd)!important}
.sh-dash .sh-card--pad{padding:22px!important}
.sh-dash .sh-block{margin-bottom:18px}
.sh-dash .sh-block__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 18px!important;border-bottom:1px solid #e8eef5!important;
  background:linear-gradient(180deg,#fff,#fbfdff);border-radius:20px 20px 0 0;
}
.sh-dash .sh-block__head h2,
.sh-dash .sh-block__head h3,
.sh-dash .sh-card__title{margin:0;color:#17243a;letter-spacing:-.018em}
.sh-dash .sh-card__title{font-size:1.1rem;font-weight:800}
.sh-dash .sh-eyebrow,.sh-dash .sh-kicker,.sh-dash .sh-step-kicker{color:#2d63b7!important;font-size:.69rem!important;font-weight:850!important;letter-spacing:.09em!important;text-transform:uppercase}
.sh-dash .sh-muted,.sh-dash .sh-help,.sh-dash .sh-form__note{color:var(--dash-muted)!important;line-height:1.55}

/* Metric widgets */
.sh-dash .sh-widgets,
.sh-dash .sh-dashboard-grid,
.sh-dash .sh-grid{gap:14px}
.sh-dash .sh-stat,
.sh-dash .sh-widgets>.sh-widget,
.sh-dash .sh-admin-overview-widgets>*{
  position:relative;overflow:hidden;border:1px solid #e2e9f2!important;border-radius:17px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important;box-shadow:0 8px 22px rgba(21,46,80,.06)!important;
}
.sh-dash .sh-stat::before,
.sh-dash .sh-widgets>.sh-widget::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#1e63db,#6047d8)}
.sh-dash .sh-stat strong,.sh-dash .sh-widget__value{color:#13223a;font-weight:850;letter-spacing:-.025em}

/* Buttons */
.sh-dash .sh-btn{border-radius:11px!important;font-weight:750!important;box-shadow:none;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}
.sh-dash .sh-btn:hover{transform:translateY(-1px)}
.sh-dash .sh-btn--primary{background:linear-gradient(135deg,#1e5fd6,#2d72ed)!important;border-color:#1e5fd6!important;box-shadow:0 7px 16px rgba(31,99,223,.18)!important}
.sh-dash .sh-btn--secondary{background:#eef4ff!important;border-color:#d9e5fb!important;color:#2455a2!important}
.sh-dash .sh-btn--outline{border-color:#d7e2ef!important;background:#fff!important;color:#2a4f84!important}
.sh-dash .sh-btn--ghost{background:#f6f8fb!important;border-color:#e3e9f1!important;color:#4c5d76!important}
.sh-dash .sh-btn--danger{background:linear-gradient(135deg,#b9271f,#d13b32)!important;border-color:#b9271f!important;color:#fff!important}

/* Forms */
.sh-dash .sh-field label{display:block;margin-bottom:7px;color:#34445c;font-size:.81rem;font-weight:750}
.sh-dash .sh-field input:not([type=checkbox]):not([type=radio]),
.sh-dash .sh-field select,
.sh-dash .sh-field textarea{
  min-height:44px;border:1px solid #d7e1ed!important;border-radius:11px!important;background:#fff!important;color:#18253b!important;box-shadow:0 1px 2px rgba(16,24,40,.02)!important;transition:border-color .15s ease,box-shadow .15s ease;
}
.sh-dash .sh-field textarea{min-height:110px}
.sh-dash .sh-field input:focus,
.sh-dash .sh-field select:focus,
.sh-dash .sh-field textarea:focus{outline:none!important;border-color:#6f9ee9!important;box-shadow:0 0 0 4px rgba(45,114,237,.10)!important}
.sh-dash .sh-form{gap:15px}
.sh-dash .sh-form__actions{padding-top:5px}

/* Notices */
.sh-dash .sh-notice{border:1px solid #dce7f4!important;border-radius:14px!important;padding:13px 15px!important;box-shadow:0 5px 14px rgba(27,55,90,.04)}
.sh-dash .sh-notice--info{background:#f1f7ff!important;border-color:#d5e6ff!important;color:#244b7b!important}
.sh-dash .sh-notice--success{background:#effaf5!important;border-color:#ccebdd!important;color:#176647!important}
.sh-dash .sh-notice--warning{background:#fff8e8!important;border-color:#f2dfac!important;color:#825e14!important}
.sh-dash .sh-notice--error{background:#fff1f2!important;border-color:#fecdd3!important;color:#9f1d2b!important}

/* Badges and chips */
.sh-dash .sh-badge,.sh-dash .sh-chip{border-radius:999px!important;font-weight:750!important;letter-spacing:.01em}
.sh-dash .sh-badge--success{background:#e9f8f0!important;color:#16724d!important;border-color:#cbead9!important}
.sh-dash .sh-badge--warning{background:#fff6df!important;color:#8a6311!important;border-color:#f1dfad!important}
.sh-dash .sh-badge--danger{background:#fff0f1!important;color:#b12432!important;border-color:#f4cdd2!important}
.sh-dash .sh-badge--neutral{background:#f1f5f9!important;color:#526177!important;border-color:#e0e7ef!important}

/* Records, folders, accordions */
.sh-dash .sh-record-accordion,
.sh-dash .sh-class-folder,
.sh-dash .sh-student-folder,
.sh-dash .sh-inner-accordion{
  overflow:hidden;border:1px solid #e1e8f1!important;border-radius:15px!important;background:#fff!important;box-shadow:0 6px 18px rgba(25,49,81,.05)!important;
}
.sh-dash .sh-record-summary,
.sh-dash .sh-class-folder__summary{padding:14px 16px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important;cursor:pointer}
.sh-dash .sh-record-summary:hover,
.sh-dash .sh-class-folder__summary:hover{background:#f6f9ff!important}
.sh-dash .sh-record-main strong,
.sh-dash .sh-class-folder__main strong{color:#17263e;font-weight:800}
.sh-dash .sh-record-chevron{width:30px;height:30px;display:grid;place-items:center;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;color:#46628d}
.sh-dash .sh-record-detail,
.sh-dash .sh-class-folder__body{padding:14px 16px!important;border-top:1px solid #e7edf4!important;background:#fcfdff!important}
.sh-dash .sh-class-folder__count{background:#edf4ff!important;color:#2456a6!important;border-radius:999px!important;font-weight:800!important}

/* Generic list rows */
.sh-dash .sh-admin-record,
.sh-dash .sh-simple-row,
.sh-dash .sh-ops-row,
.sh-dash .sh-nested-record{border-bottom-color:#e8edf4!important}
.sh-dash .sh-admin-record{padding:13px 4px!important}
.sh-dash .sh-admin-record:last-child{border-bottom:0!important}

/* Tables */
.sh-dash .sh-table-wrap{border:1px solid #e2e9f1;border-radius:16px;background:#fff;box-shadow:0 7px 20px rgba(20,47,80,.05);overflow:auto}
.sh-dash .sh-table{margin:0!important;border-collapse:separate!important;border-spacing:0!important}
.sh-dash .sh-table thead th{position:sticky;top:0;z-index:1;background:#f5f8fc!important;color:#56677f!important;font-size:.72rem!important;font-weight:850!important;letter-spacing:.055em;text-transform:uppercase;border-bottom:1px solid #dfe7f0!important}
.sh-dash .sh-table td{border-bottom-color:#edf1f5!important;color:#27364d;vertical-align:middle!important}
.sh-dash .sh-table tbody tr:hover td{background:#fbfdff}

/* Profile/media cards */
.sh-dash .sh-profile-card{overflow:hidden}
.sh-dash .sh-profile-card .sh-avatar{border:4px solid #fff;box-shadow:0 0 0 1px #dbe4ef,0 7px 18px rgba(20,53,91,.12)}

/* Tabs */
.sh-dash .sh-admin-user-tabs{display:flex;gap:7px;padding:6px;border:1px solid #e1e8f1;border-radius:14px;background:#f7f9fc;overflow-x:auto}
.sh-dash .sh-admin-user-tabs .sh-btn{white-space:nowrap;border-radius:9px!important}

/* Exams, results, assignments and operational detail cards */
.sh-dash .sh-exam-grid{gap:14px!important}
.sh-dash .sh-exam-card{overflow:hidden!important}
.sh-dash .sh-exam-card__top{padding:17px 17px 12px!important;background:linear-gradient(180deg,#f8fbff,#fff)!important}
.sh-dash .sh-exam-card__footer{padding:12px 17px 16px!important;border-top:1px solid #edf1f5!important}
.sh-dash .sh-admin-detail-grid,.sh-dash .sh-ops-detail{gap:10px!important}
.sh-dash .sh-ops-detail-row{padding:10px 12px;border:1px solid #e7edf4;border-radius:11px;background:#f9fbfd}

/* Finance/earnings areas should feel consistent with the receipt language */
.sh-dash .sh-finance-grid,.sh-dash .sh-earnings-summary{gap:14px!important}
.sh-dash .sh-payment-receipt,.sh-dash .sh-finance-receipt{border-radius:18px!important;border-color:#dfe7f1!important;box-shadow:0 10px 26px rgba(20,48,82,.07)!important}

/* Danger/recovery areas stay distinct but polished */
.sh-dash .sh-danger-zone,.sh-dash .sh-availability-recovery{border-color:#f0d7d7!important;background:linear-gradient(180deg,#fffdfd,#fff8f8)!important}
.sh-dash .sh-account-danger{margin:14px 10px;border:1px solid #eadfe1;border-radius:14px;background:#fffafa;overflow:hidden}
.sh-dash .sh-account-danger>summary{padding:11px 13px;color:#7f3540;font-weight:750;cursor:pointer}
.sh-dash .sh-account-danger__body{padding:0 13px 13px;color:#6b4a50}

/* Desktop spacing */
@media(min-width:1024px){
  .sh-dash__main{padding-bottom:40px}
  .sh-dash__head{margin-bottom:20px}
  .sh-dash .sh-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sh-dash .sh-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Mobile dashboard polish */
@media(max-width:700px){
  .sh-dash{--dash-radius:16px;--dash-shadow:0 8px 22px rgba(23,45,78,.07)}
  .sh-dash__main{background:linear-gradient(180deg,#f7faff 0,#fff 180px);}
  .sh-dash .sh-card--pad{padding:15px!important}
  .sh-dash .sh-block__head{padding:13px 14px!important;align-items:flex-start}
  .sh-dash .sh-card__title{font-size:1rem}
  .sh-dash .sh-widgets,.sh-dash .sh-dashboard-grid,.sh-dash .sh-grid{gap:10px!important}
  .sh-dash .sh-grid--2,.sh-dash .sh-grid--3{grid-template-columns:1fr!important}
  .sh-dash .sh-form{gap:12px!important}
  .sh-dash .sh-field input:not([type=checkbox]):not([type=radio]),.sh-dash .sh-field select{min-height:43px}
  .sh-dash .sh-btn{min-height:38px}
  .sh-dash .sh-table-wrap{border-radius:13px}
  .sh-dash .sh-table{min-width:620px}
  .sh-dash .sh-record-summary,.sh-dash .sh-class-folder__summary{padding:12px 13px!important}
  .sh-dash .sh-record-detail,.sh-dash .sh-class-folder__body{padding:12px 13px!important}
  .sh-dash .sh-admin-user-tabs,.sh-dash .sh-review-tabs{border-radius:12px}
}

@media(max-width:420px){
  .sh-dash .sh-card--pad{padding:13px!important}
  .sh-dash .sh-block__head{padding:12px!important}
  .sh-dash .sh-btn--sm{font-size:.75rem!important}
}

/* =========================================================
   Skill Hub LMS Full Dashboard Section Polish 4.4.32
   Applies Teaching Setup visual language to ALL dashboard areas
   across student, teacher, parent and admin workspaces.
   ========================================================= */
.sh-dash{
  --sh-pro-blue:#1f63df;
  --sh-pro-blue-2:#2f74ee;
  --sh-pro-deep:#123b79;
  --sh-pro-ink:#14233a;
  --sh-pro-muted:#66758a;
  --sh-pro-line:#dfe7f1;
  --sh-pro-soft:#f6f9fd;
  --sh-pro-shadow:0 10px 28px rgba(24,48,82,.07);
}

/* Every section-level card/list gets the same polished surface language. */
.sh-dash :is(
  .sh-thread,.sh-case,.sh-assignment,.sh-submission,.sh-contact-card,
  .sh-admin-review,.sh-case-detail,.sh-admin-action-alert,.sh-admin-actions-grid,
  .sh-ai-student-folder,.sh-ai-week-report,.sh-ai-report-card,.sh-ai-booking-card,
  .sh-recording-folder,.sh-recording-item,.sh-result-card,.sh-review-entry,
  .sh-price-card,.sh-profile-photo-card,.sh-exam-create-card,.sh-exam-paper-library,
  .sh-tuition-card,.sh-mini-card,.sh-check-card,.sh-choice,.sh-file,
  .sh-course-proposal-structure,.sh-admin-doc-card,.sh-availability-bulk,
  .sh-progress-intro,.sh-result-intro,.sh-exam-centre-intro
){
  border:1px solid var(--sh-pro-line)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  box-shadow:var(--sh-pro-shadow)!important;
}

/* Section titles: Subjects, Courses, Bookings, Finance, Results, etc. */
.sh-dash :is(.sh-sec-head,.sh-page-head,.sh-results-head,.sh-block__head){
  position:relative;
  border:1px solid #e1e9f3!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,#f8fbff 0%,#fff 65%)!important;
  box-shadow:0 7px 20px rgba(22,48,82,.045)!important;
}
.sh-dash :is(.sh-sec-head,.sh-page-head,.sh-results-head)::before{
  content:"";position:absolute;left:14px;top:14px;bottom:14px;width:5px;border-radius:99px;
  background:linear-gradient(180deg,var(--sh-pro-blue),#6047d8);
}
.sh-dash :is(.sh-sec-head,.sh-page-head,.sh-results-head){padding:16px 18px 16px 31px!important;margin-bottom:16px!important}
.sh-dash :is(.sh-page-title,.sh-block__title,.sh-sec-head h2,.sh-sec-head h3,.sh-results-head h2,.sh-results-head h3){
  color:var(--sh-pro-ink)!important;font-weight:850!important;letter-spacing:-.02em!important;
}
.sh-dash :is(.sh-page-lead,.sh-block__sub){color:var(--sh-pro-muted)!important;line-height:1.55!important}

/* Courses / subjects / teaching catalogues */
.sh-dash :is(.sh-simple-list,.sh-chip-list,.sh-check-grid,.sh-choice-grid,.sh-course-proposal-structure){gap:12px!important}
.sh-dash .sh-simple-row{
  padding:13px 14px!important;margin:0!important;border:1px solid #e4ebf4!important;border-radius:13px!important;
  background:#fff!important;box-shadow:0 4px 12px rgba(22,47,79,.035)!important;
}
.sh-dash .sh-simple-list{display:grid!important}
.sh-dash .sh-chip{padding:7px 11px!important;border:1px solid #dce7f5!important;background:#f4f8ff!important;color:#315b99!important}
.sh-dash .sh-choice{padding:14px!important;transition:.16s ease}
.sh-dash .sh-choice:has(input:checked),.sh-dash .sh-check-card:has(input:checked){border-color:#7ea7ec!important;background:#eef5ff!important;box-shadow:0 0 0 3px rgba(31,99,223,.08)!important}
.sh-dash .sh-choice__title{color:#172840!important;font-weight:800!important}
.sh-dash .sh-choice__desc{color:#6b788b!important;line-height:1.45!important}
.sh-dash .sh-admin-course-cover{border-radius:15px!important;border:1px solid #e0e8f2!important;box-shadow:0 7px 18px rgba(24,47,80,.07)!important}

/* Booking / classes / attendance operational tables */
.sh-dash .sh-ops-table{border:1px solid #e0e8f2!important;border-radius:17px!important;background:#fff!important;box-shadow:var(--sh-pro-shadow)!important;overflow:auto!important}
.sh-dash .sh-row-toggle{width:34px;height:34px;border:1px solid #dbe5f1;border-radius:10px;background:#f7faff;color:#315d9c;font-weight:850;cursor:pointer}
.sh-dash .sh-ops-detail{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px!important;padding:12px!important;
  border:1px solid #e1e8f1;border-radius:14px;background:#f8fbff!important;
}
.sh-dash .sh-ops-detail>div{padding:10px 12px;border:1px solid #e5ecf4;border-radius:11px;background:#fff}
.sh-dash .sh-ops-detail strong{display:block;color:#627087;font-size:.7rem;letter-spacing:.055em;text-transform:uppercase;margin-bottom:4px}
.sh-dash .sh-ops-detail p{margin:0;color:#192a42;font-weight:700}
.sh-dash .sh-inline-action-form{padding:12px;border:1px solid #e4ebf3;border-radius:13px;background:#fff;box-shadow:0 4px 12px rgba(22,47,79,.035)}

/* User / student / teacher / parent management records */
.sh-dash .sh-admin-record{
  padding:13px 14px!important;margin:8px 0!important;border:1px solid #e3eaf3!important;border-radius:13px!important;
  background:#fff!important;box-shadow:0 4px 12px rgba(21,45,76,.035)!important;
}
.sh-dash .sh-admin-record:hover{border-color:#cfdbeb!important;background:#fbfdff!important}
.sh-dash .sh-record-list{gap:11px!important}
.sh-dash .sh-record-accordion[open]{border-color:#cddbef!important;box-shadow:0 9px 24px rgba(30,69,123,.08)!important}

/* Messages / communication */
.sh-dash .sh-messaging{display:grid;gap:14px}
.sh-dash .sh-thread{overflow:hidden!important;padding:0!important}
.sh-dash .sh-thread> :first-child{border-radius:18px 18px 0 0}
.sh-dash .sh-thread__messages{padding:14px!important;background:linear-gradient(180deg,#f8fbff,#fff)!important}
.sh-dash .sh-bubble{border:1px solid #e3eaf3!important;box-shadow:0 3px 9px rgba(22,47,79,.04)!important}
.sh-dash .sh-bubble.is-mine{background:#eaf3ff!important;border-color:#d4e4fb!important}

/* Assignments / results / AI reports / recordings */
.sh-dash .sh-assignment,.sh-dash .sh-submission{padding:17px!important}
.sh-dash .sh-assignment-materials{padding:12px;border:1px dashed #d6e2f1;border-radius:12px;background:#f8fbff}
.sh-dash .sh-result-card{border-left-width:5px!important}
.sh-dash .sh-result-stats>div{border:1px solid #e5ecf4!important;background:#f8fbff!important}
.sh-dash .sh-ai-folder-list,.sh-dash .sh-ai-report-list,.sh-dash .sh-recording-list{display:grid;gap:11px}
.sh-dash :is(.sh-ai-student-folder__summary,.sh-ai-week-report__summary,.sh-recording-folder__summary){padding:14px 16px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important}
.sh-dash :is(.sh-ai-student-folder__body,.sh-ai-week-report__body){padding:14px 16px!important;border-top:1px solid #e7edf4!important;background:#fcfdff!important}
.sh-dash .sh-recording-item{padding:13px!important}
.sh-dash .sh-recording-frame{overflow:hidden;border:1px solid #e1e8f1;border-radius:14px;background:#0f172a}

/* Profile / verification / documents */
.sh-dash .sh-profile-photo-card{overflow:hidden!important}
.sh-dash .sh-profile-photo-card__media{background:linear-gradient(135deg,#eef5ff,#f8fbff)!important}
.sh-dash .sh-admin-doc-grid{gap:12px!important}
.sh-dash .sh-admin-doc-card{padding:12px!important;overflow:hidden!important}
.sh-dash .sh-admin-doc-thumb{border-radius:12px!important;border:1px solid #e1e8f1!important;background:#f7f9fc!important}
.sh-dash .sh-file{padding:12px!important}
.sh-dash .sh-file__icon{border-radius:11px!important;background:#eef4ff!important;color:#285aa6!important}

/* Finance / payouts / tuition */
.sh-dash .sh-payout-slip{overflow:hidden!important;border:1px solid #dfe7f1!important;border-radius:18px!important;background:#fff!important;box-shadow:var(--sh-pro-shadow)!important}
.sh-dash .sh-payout-slip__head{padding:15px 17px!important;background:linear-gradient(135deg,#123b79,#2468df)!important;color:#fff!important}
.sh-dash .sh-payout-slip__grid{gap:10px!important}
.sh-dash .sh-payout-slip__grid>div{padding:11px 12px;border:1px solid #e4ebf4;border-radius:11px;background:#f8fbff}
.sh-dash .sh-earnings-summary>*{border:1px solid #e1e9f2!important;border-radius:16px!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;box-shadow:0 7px 18px rgba(21,47,80,.05)!important}
.sh-dash .sh-tuition-card{padding:16px!important}

/* Admin subjects / courses / roles / system / support / safety */
.sh-dash .sh-admin-filter{padding:13px;border:1px solid #e2eaf3;border-radius:14px;background:#f8fbff!important;margin-bottom:14px}
.sh-dash .sh-admin-role{padding:0!important;border:1px solid #e2e9f2!important;border-radius:14px!important;background:#fff!important;overflow:hidden!important;margin-bottom:10px!important}
.sh-dash .sh-admin-role summary{padding:13px 15px!important;background:#fbfdff!important;font-weight:800;color:#1d2d45}
.sh-dash .sh-admin-role[open] summary{border-bottom:1px solid #e7edf4}
.sh-dash .sh-admin-role>*:not(summary){margin-left:14px!important;margin-right:14px!important}
.sh-dash .sh-case-detail{overflow:hidden!important}
.sh-dash .sh-case-detail__body{padding:16px!important}
.sh-dash .sh-case-detail__manage{padding:14px 16px!important;border-top:1px solid #e7edf4!important;background:#f8fbff!important}
.sh-dash .sh-admin-action-alert{padding:14px!important}
.sh-dash .sh-admin-alert-grid{gap:12px!important}

/* Support / FAQ / safety */
.sh-dash .sh-contact-card{margin:0!important}
.sh-dash .sh-contact-card__icon{box-shadow:0 0 0 1px #dae7fb!important}
.sh-dash .sh-accordion{max-width:none!important}
.sh-dash .sh-accordion__item{border-radius:14px!important;border-color:#e1e9f2!important;box-shadow:0 4px 12px rgba(22,47,79,.035)!important}
.sh-dash .sh-accordion__q{background:#fff!important;color:#20304a!important;font-weight:800!important}
.sh-dash .sh-accordion__item.is-open .sh-accordion__q{background:#f8fbff!important}

/* Notifications full-page section */
.sh-dash .sh-notification-list{display:grid;gap:10px}
.sh-dash .sh-notification-item{border:1px solid #e2e9f2!important;border-radius:14px!important;background:#fff!important;box-shadow:0 5px 14px rgba(22,47,79,.04)!important}
.sh-dash .sh-notification-item:hover{border-color:#cfdbeb!important;background:#fbfdff!important}

/* Progress, meters, grades */
.sh-dash .sh-progress-track,.sh-dash .sh-meter{border-radius:999px!important;background:#e9eef5!important;overflow:hidden!important}
.sh-dash .sh-progress-track__fill,.sh-dash .sh-meter__fill{background:linear-gradient(90deg,#1f63df,#5d55de)!important}
.sh-dash .sh-grade-band,.sh-dash .sh-grade-scale{border:1px solid #e1e8f1;border-radius:14px;background:#f8fbff}

/* Consistent empty states */
.sh-dash .sh-empty{padding:32px 22px!important;border:1px dashed #d6e0ec!important;border-radius:16px!important;background:linear-gradient(180deg,#fbfdff,#f7faff)!important;color:#66758a!important;text-align:center!important}

/* Mobile: all sections become clean, stacked workspaces without text squeezing. */
@media(max-width:700px){
  .sh-dash :is(.sh-sec-head,.sh-page-head,.sh-results-head){padding:13px 13px 13px 27px!important;border-radius:14px!important}
  .sh-dash :is(.sh-thread,.sh-case,.sh-assignment,.sh-submission,.sh-contact-card,.sh-admin-review,.sh-case-detail,.sh-ai-report-card,.sh-recording-item,.sh-result-card,.sh-profile-photo-card,.sh-price-card,.sh-tuition-card){border-radius:15px!important}
  .sh-dash .sh-admin-filter{grid-template-columns:1fr!important;padding:11px!important}
  .sh-dash .sh-simple-row,.sh-dash .sh-admin-record{padding:11px 12px!important}
  .sh-dash .sh-simple-row:has([data-key]){grid-template-columns:1fr!important}
  .sh-dash .sh-choice-grid,.sh-dash .sh-check-grid{grid-template-columns:1fr!important}
  .sh-dash .sh-ops-detail{grid-template-columns:1fr!important;padding:10px!important}
  .sh-dash .sh-inline-action-form{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .sh-dash .sh-inline-action-form .sh-btn{width:100%!important}
  .sh-dash .sh-review-tabs{grid-template-columns:1fr!important}
  .sh-dash .sh-result-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sh-dash .sh-admin-doc-grid{grid-template-columns:1fr!important}
  .sh-dash .sh-payout-slip__grid{grid-template-columns:1fr!important}
}

/* Skill Hub LMS 4.4.33 — Teacher Classes & Bookings professional workspace */
.sh-dash .sh-classbook-intro{
  display:flex;align-items:center;gap:14px;padding:17px 18px!important;
  border:1px solid #d9e6f7!important;border-radius:18px!important;
  background:linear-gradient(135deg,#f7fbff 0%,#eef5ff 100%)!important;
  box-shadow:0 9px 24px rgba(24,71,138,.07)!important;
}
.sh-dash .sh-classbook-intro__icon{
  width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:15px;
  background:linear-gradient(135deg,#154eaa,#2e76ef);color:#fff;font-size:1.4rem;font-weight:900;
  box-shadow:0 9px 20px rgba(30,99,223,.22)
}
.sh-dash .sh-classbook-eyebrow{display:block;margin-bottom:2px;color:#2161b5;font-size:.69rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.sh-dash .sh-classbook-intro .sh-card__title{margin:0!important;color:#14233b!important;font-size:1.28rem!important}
.sh-dash .sh-classbook-intro .sh-muted{margin:4px 0 0!important;color:#66758a!important}
.sh-dash .sh-classbook-shell{padding:0!important;overflow:hidden!important;border:1px solid #dde6f1!important;border-radius:18px!important;box-shadow:0 10px 28px rgba(22,47,79,.06)!important}
.sh-dash .sh-classbook-table-wrap{border-radius:0!important}
.sh-dash .sh-classbook-table{margin:0!important;border:0!important;box-shadow:none!important}
.sh-dash .sh-classbook-table thead th{padding:13px 12px!important;background:#f4f8fd!important;color:#66758a!important;font-size:.69rem!important;font-weight:850!important;letter-spacing:.055em!important;text-transform:uppercase!important;border-bottom:1px solid #dfe8f2!important}
.sh-dash .sh-classbook-row td{padding:13px 12px!important;border-bottom:1px solid #edf1f6!important;color:#26374f!important}
.sh-dash .sh-classbook-row:hover td{background:#fbfdff!important}
.sh-dash .sh-classbook-row td:first-child strong{color:#18365f!important;font-weight:850!important}
.sh-dash .sh-booking-status{padding:6px 10px!important;border:1px solid #d8e3f2!important;background:#f2f6fc!important;color:#37516f!important}
.sh-dash .sh-booking-status--confirmed,.sh-dash .sh-booking-status--completed{border-color:#bde8cf!important;background:#ecfdf3!important;color:#087a43!important}
.sh-dash .sh-booking-status--requested,.sh-dash .sh-booking-status--pending{border-color:#f3ddb0!important;background:#fff8e8!important;color:#9a6500!important}
.sh-dash .sh-booking-status--cancelled_by_teacher,.sh-dash .sh-booking-status--cancelled_by_student,.sh-dash .sh-booking-status--cancelled{border-color:#f4c6c1!important;background:#fff1f0!important;color:#b42318!important}
.sh-dash .sh-booking-status--in_progress{border-color:#bad8ff!important;background:#edf5ff!important;color:#175fc7!important}
.sh-dash .sh-classbook-toggle-cell{text-align:center!important}
.sh-dash .sh-classbook-toggle-cell .sh-row-toggle{width:36px;height:36px;border-radius:11px!important;background:#f4f8ff!important;border-color:#d6e3f4!important;color:#225ca9!important;box-shadow:0 4px 10px rgba(26,74,139,.05)}
.sh-dash .sh-classbook-detail-row>td{background:#f7faff!important}
.sh-dash .sh-classbook-detail{margin:12px 14px 8px!important;padding:12px!important;border:1px solid #dce7f4!important;border-radius:15px!important;background:linear-gradient(180deg,#fbfdff,#f5f9ff)!important}
.sh-dash .sh-classbook-detail>div{min-height:74px;padding:12px 13px!important;border-radius:12px!important;box-shadow:0 3px 10px rgba(22,47,79,.035)}
.sh-dash .sh-classbook-detail strong{color:#6b7a8f!important;font-size:.68rem!important;letter-spacing:.07em!important}
.sh-dash .sh-classbook-detail p{font-size:.94rem!important;color:#172840!important}
.sh-dash .sh-classbook-actions{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;padding:6px 14px 16px!important;width:100%!important}
.sh-dash .sh-classbook-actions>a.sh-btn{justify-self:start;min-height:44px;padding:10px 18px!important;border-radius:12px!important;box-shadow:0 8px 18px rgba(31,99,223,.16)!important}
.sh-dash .sh-classbook-form{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important;align-items:end!important;padding:14px!important;border:1px solid #e0e8f2!important;border-radius:15px!important;background:#fff!important;box-shadow:0 6px 16px rgba(22,47,79,.045)!important}
.sh-dash .sh-classbook-form--cancel{border-left:4px solid #d92d20!important}
.sh-dash .sh-classbook-form--reschedule{border-left:4px solid #2563eb!important}
.sh-dash .sh-classbook-form .sh-field{margin:0!important}
.sh-dash .sh-classbook-form label{display:block;margin-bottom:7px!important;color:#283a53!important;font-weight:800!important}
.sh-dash .sh-classbook-form textarea{min-height:84px!important;max-height:150px!important;resize:vertical!important;border-radius:12px!important;background:#fbfdff!important}
.sh-dash .sh-classbook-form select{min-height:46px!important;border-radius:12px!important;background:#fbfdff!important}
.sh-dash .sh-classbook-form .sh-btn{min-width:150px;min-height:44px;border-radius:12px!important}
.sh-dash .sh-classbook-form--reschedule{grid-template-columns:minmax(190px,.7fr) minmax(260px,1.3fr) auto!important}

@media(max-width:700px){
  .sh-dash .sh-classbook-intro{padding:14px!important;gap:11px;border-radius:16px!important}
  .sh-dash .sh-classbook-intro__icon{width:42px;height:42px;flex-basis:42px;border-radius:13px;font-size:1.15rem}
  .sh-dash .sh-classbook-intro .sh-card__title{font-size:1.15rem!important}
  .sh-dash .sh-classbook-intro .sh-muted{font-size:.82rem!important;line-height:1.45!important}
  .sh-dash .sh-classbook-shell{padding:10px!important;background:#f7f9fc!important;border-radius:16px!important}
  .sh-dash .sh-classbook-table-wrap{overflow:visible!important;background:transparent!important}
  .sh-dash .sh-classbook-table{display:block!important;width:100%!important;min-width:0!important;background:transparent!important}
  .sh-dash .sh-classbook-table thead{display:none!important}
  .sh-dash .sh-classbook-table tbody{display:block!important;width:100%!important}
  .sh-dash .sh-classbook-table .sh-classbook-row{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;
    margin:0 0 12px!important;padding:13px!important;border:1px solid #dfe7f1!important;border-radius:16px!important;
    background:#fff!important;box-shadow:0 7px 20px rgba(21,45,76,.055)!important;overflow:hidden!important
  }
  .sh-dash .sh-classbook-table .sh-classbook-row>td{
    display:block!important;width:auto!important;min-width:0!important;padding:9px 10px!important;border:0!important;
    border-bottom:1px solid #eef2f6!important;background:transparent!important;text-align:left!important
  }
  .sh-dash .sh-classbook-table .sh-classbook-row>td::before{
    content:attr(data-label)!important;display:block!important;margin:0 0 4px!important;color:#748196!important;
    font-size:.65rem!important;font-weight:850!important;line-height:1.15!important;letter-spacing:.055em!important;text-transform:uppercase!important
  }
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(1),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(2){padding-top:4px!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(3),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(4),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(7){grid-column:1/-1!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(9),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(10){border-bottom:0!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(10){display:flex!important;align-items:flex-end!important;justify-content:flex-end!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(10)::before{margin-right:auto!important;align-self:center!important;margin-bottom:0!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(7){font-weight:800!important;color:#192d49!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(4){font-weight:750!important;color:#203554!important}
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(5),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(6),
  .sh-dash .sh-classbook-table .sh-classbook-row>td:nth-child(8){font-size:.88rem!important}
  .sh-dash .sh-classbook-table .sh-classbook-detail-row{display:block!important;width:100%!important;margin:-5px 0 14px!important;padding:0!important;border:0!important;background:transparent!important}
  .sh-dash .sh-classbook-table .sh-classbook-detail-row[hidden]{display:none!important}
  .sh-dash .sh-classbook-table .sh-classbook-detail-row>td{display:block!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important}
  .sh-dash .sh-classbook-detail{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin:0!important;padding:10px!important;border-radius:15px!important}
  .sh-dash .sh-classbook-detail>div{min-height:68px!important;padding:10px 11px!important}
  .sh-dash .sh-classbook-detail>div:last-child{grid-column:1/-1!important}
  .sh-dash .sh-classbook-detail p{font-size:.86rem!important;line-height:1.4!important}
  .sh-dash .sh-classbook-actions{padding:10px 0 0!important;gap:10px!important}
  .sh-dash .sh-classbook-actions>a.sh-btn{width:100%!important;justify-content:center!important;justify-self:stretch!important}
  .sh-dash .sh-classbook-form,.sh-dash .sh-classbook-form--reschedule{grid-template-columns:1fr!important;padding:12px!important;border-radius:14px!important}
  .sh-dash .sh-classbook-form textarea{min-height:86px!important;font-size:16px!important}
  .sh-dash .sh-classbook-form .sh-btn{width:100%!important;min-width:0!important}
}

/* =====================================================================
   4.4.34 — Notification overlay + collapsed class folders
   - Bell dropdown always layers above dashboard cards/widgets.
   - Delete action is clearly visible in the dropdown.
   - Teacher/student overview class folders start collapsed.
   ===================================================================== */
.sh-dash__head{
  z-index:1200!important;
  overflow:visible!important;
}
.sh-dash__head-actions{
  position:relative;
  z-index:1210!important;
  overflow:visible!important;
}
.sh-dash__head-actions .sh-notification-bell{
  position:relative!important;
  z-index:1220!important;
  overflow:visible!important;
}
.sh-dash__head-actions .sh-notification-bell[open]{z-index:1300!important}
.sh-dash__head-actions .sh-notification-panel{
  z-index:1310!important;
  isolation:isolate;
}
.sh-dash__main,
.sh-dash__content,
.sh-dash__outlet{overflow:visible}

/* Make the per-notification delete action unmistakable while keeping it compact. */
.sh-notification-x{
  width:auto!important;
  min-width:64px!important;
  height:32px!important;
  padding:0 10px!important;
  border-color:#fecaca!important;
  border-radius:9px!important;
  background:#fff7f7!important;
  color:#b42318!important;
  font-size:.72rem!important;
  font-weight:800!important;
  letter-spacing:.01em;
}
.sh-notification-x:hover,
.sh-notification-x:focus-visible{
  background:#fee4e2!important;
  border-color:#fda29b!important;
  color:#912018!important;
}
.sh-notification-item{
  grid-template-columns:minmax(0,1fr) auto!important;
}

/* A folder is a selector first: no class list is expanded on initial load. */
.sh-class-folder:not([open])>.sh-class-folder__body{display:none!important}

@media(max-width:700px){
  .sh-dash__head{z-index:1200!important}
  .sh-dash__head-actions .sh-notification-panel{
    z-index:1310!important;
    max-height:min(620px,74vh)!important;
  }
  .sh-notification-x{min-width:56px!important;padding:0 8px!important;font-size:.68rem!important}
}


/* =====================================================================
   Skill Hub LMS 4.4.44 — FOX Smart Designer dropdown true front layer
   IMPORTANT: theme.css loads after style.css, so the final stacking rules
   live here. Keep Selectron23's own open/close/overflow behaviour intact.
   ===================================================================== */
.sh-header{
  position:sticky!important;
  top:0!important;
  z-index:2147483000!important;
  overflow:visible!important;
  isolation:isolate!important;
}
.sh-header__inner,
.sh-header__actions,
.sh-currency-switcher{
  position:relative!important;
  overflow:visible!important;
}
.sh-header__inner{z-index:2147483010!important}
.sh-header__actions{z-index:2147483020!important}
.sh-currency-switcher{z-index:2147483030!important}

/* FOX Smart Designer uses Selectron23. Raise only its stacking layer;
   do not override max-height, overflow, transform or open animation. */
.sh-currency-switcher .selectron23{
  position:relative!important;
  z-index:2147483600!important;
}
.sh-currency-switcher .selectron23-container{
  z-index:2147483601!important;
}
.sh-currency-switcher .selectron23-container[data-opened="1"]{
  z-index:2147483640!important;
}

/* The dashboard hero must never establish a layer above the site header. */
.sh-dash__head,
.sh-dash__head-actions,
.sh-dash__head-actions .sh-notification-bell,
.sh-dash__head-actions .sh-notification-panel{
  z-index:100!important;
}

@media(max-width:1023px){
  .sh-drawer{z-index:2147483100!important}
  .sh-drawer__panel{overflow:visible!important}
  .sh-currency-switcher--mobile .selectron23{z-index:2147483600!important}
  .sh-currency-switcher--mobile .selectron23-container[data-opened="1"]{z-index:2147483640!important}
}

/* Attendance folders 4.4.47 */
.sh-folder-list{display:grid;gap:14px}.sh-folder-card{border:1px solid #e5eaf2;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05);overflow:hidden}.sh-folder-card>summary{cursor:pointer;list-style:none;padding:16px 18px}.sh-folder-card>summary::-webkit-details-marker{display:none}.sh-folder-card .sh-record-summary{display:flex;align-items:center;justify-content:space-between;gap:14px}.sh-folder-card .sh-profile-card{display:flex;align-items:center;gap:12px;min-width:0}.sh-folder-card .sh-profile-card img{width:48px;height:48px;border-radius:14px;object-fit:cover;object-position:center top}.sh-folder-card .sh-record-main{display:grid;gap:3px;min-width:0}.sh-folder-card .sh-record-main strong{font-size:16px;color:#14213d}.sh-folder-card .sh-record-main span{font-size:13px;color:#718096}.sh-folder-card .sh-record-detail{border-top:1px solid #edf1f6;padding:14px 18px}.sh-folder-card .sh-record-chevron{transition:transform .2s ease}.sh-folder-card[open] .sh-record-chevron{transform:rotate(180deg)}@media(max-width:640px){.sh-folder-card>summary{padding:13px}.sh-folder-card .sh-record-detail{padding:12px}.sh-folder-card .sh-profile-card img{width:42px;height:42px}.sh-folder-card .sh-record-main strong{font-size:15px}}


/* Attendance folders — standard dashboard folder style 4.4.48
   Matches Next Classes / Upcoming Classes folder sizing and spacing. */
.sh-dash .sh-folder-list{
  display:grid;
  gap:10px;
}
.sh-dash .sh-folder-card{
  margin:10px 0;
  width:100%;
  border:1px solid var(--sh-border,#e5e7eb)!important;
  border-radius:18px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 8px 24px rgba(15,23,42,.05)!important;
}
.sh-dash .sh-folder-card>summary{
  display:block!important;
  width:100%!important;
  padding:0!important;
  list-style:none!important;
  cursor:pointer!important;
}
.sh-dash .sh-folder-card>summary::-webkit-details-marker{display:none!important}
.sh-dash .sh-folder-card .sh-record-summary{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  gap:12px!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
  padding:14px 16px!important;
  background:linear-gradient(180deg,#fff,#fbfdff)!important;
}
.sh-dash .sh-folder-card .sh-record-summary:hover{
  background:#f6f9ff!important;
}
.sh-dash .sh-folder-card .sh-profile-card{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}
.sh-dash .sh-folder-card .sh-profile-card img,
.sh-dash .sh-folder-card .sh-profile-card .sh-avatar{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  border-radius:14px!important;
  object-fit:cover!important;
  object-position:center top!important;
}
.sh-dash .sh-folder-card .sh-record-main{
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  min-width:0!important;
  width:auto!important;
}
.sh-dash .sh-folder-card .sh-record-main strong{
  display:block!important;
  color:#17263e!important;
  font-size:1rem!important;
  line-height:1.3!important;
  font-weight:800!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
}
.sh-dash .sh-folder-card .sh-record-main span{
  display:block!important;
  color:var(--sh-muted,#64748b)!important;
  font-size:.86rem!important;
  line-height:1.35!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.sh-dash .sh-folder-card .sh-badge{
  min-width:34px!important;
  padding:6px 10px!important;
  text-align:center!important;
  background:#edf4ff!important;
  color:#2456a6!important;
  border-radius:999px!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.sh-dash .sh-folder-card .sh-record-chevron{
  margin-left:0!important;
  font-size:18px!important;
  color:#64748b!important;
}
.sh-dash .sh-folder-card[open] .sh-record-chevron{
  transform:rotate(180deg)!important;
}
.sh-dash .sh-folder-card .sh-record-detail{
  padding:14px 16px!important;
  border-top:1px solid #e7edf4!important;
  background:#fcfdff!important;
}
@media(max-width:640px){
  .sh-dash .sh-folder-card .sh-record-summary{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    padding:12px 13px!important;
  }
  .sh-dash .sh-folder-card .sh-profile-card{
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:10px!important;
  }
  .sh-dash .sh-folder-card .sh-profile-card img,
  .sh-dash .sh-folder-card .sh-profile-card .sh-avatar{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    border-radius:12px!important;
  }
  .sh-dash .sh-folder-card .sh-record-main strong{font-size:.95rem!important}
  .sh-dash .sh-folder-card .sh-record-main span{font-size:.78rem!important}
  .sh-dash .sh-folder-card .sh-record-chevron{display:none!important}
  .sh-dash .sh-folder-card .sh-record-detail{padding:12px 13px!important}
}



/* Reviews — professional unified UI 4.4.49 */
.sh-review-intro{margin-bottom:14px}
.sh-review-folders{display:grid;gap:12px}
.sh-review-folder{
  width:100%;
  background:#fff;
  border:1px solid #e4eaf2;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(15,23,42,.05);
}
.sh-review-folder>summary{list-style:none;cursor:pointer}
.sh-review-folder>summary::-webkit-details-marker{display:none}
.sh-review-folder__summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:15px 17px;
  background:linear-gradient(180deg,#fff,#fbfdff);
}
.sh-review-folder__summary:hover{background:#f7faff}
.sh-review-person{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-width:0;
}
.sh-review-person img,.sh-review-person .sh-avatar{
  width:52px!important;height:52px!important;min-width:52px!important;
  border-radius:14px!important;object-fit:cover!important;object-position:center top!important;
}
.sh-review-person>div{min-width:0;display:grid;gap:4px}
.sh-review-person strong{
  color:#14213d;font-size:1rem;line-height:1.25;font-weight:800;
  white-space:normal;overflow:visible;text-overflow:clip;
}
.sh-review-person span{font-size:.84rem;color:#718096;line-height:1.35}
.sh-review-folder__meta{display:flex;align-items:center;gap:10px}
.sh-review-status{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:32px;padding:6px 11px;border-radius:999px;
  background:#f1f5f9;color:#475569;font-size:.78rem;font-weight:800;white-space:nowrap;
}
.sh-review-status.is-reviewed{background:#eaf8f1;color:#13795b}
.sh-review-status.is-available{background:#edf4ff;color:#2456a6}
.sh-review-chevron{color:#64748b;font-size:18px;transition:transform .2s ease}
.sh-review-folder[open] .sh-review-chevron{transform:rotate(180deg)}
.sh-review-folder__body{
  padding:16px 17px 18px;
  border-top:1px solid #e8edf4;
  background:#fcfdff;
}
.sh-review-card{
  border:1px solid #e5eaf1;
  border-radius:16px;
  background:#fff;
  padding:16px;
  box-shadow:0 5px 16px rgba(15,23,42,.035);
}
.sh-review-card+.sh-review-card{margin-top:12px}
.sh-review-card__top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px;
}
.sh-review-card__top time{font-size:.78rem;color:#8491a3;white-space:nowrap}
.sh-review-stars{color:#f59e0b;letter-spacing:2px;font-size:1.02rem;line-height:1.2}
.sh-review-quote{
  position:relative;
  padding:14px 15px 14px 17px;
  border-left:4px solid #2f6fed;
  border-radius:10px;
  background:#f7faff;
  color:#26364d;
  line-height:1.65;
  overflow-wrap:anywhere;
}
.sh-review-reply{
  margin-top:14px;padding:13px 14px;border-radius:12px;
  background:#eef7ff;border:1px solid #d9ecff;
}
.sh-review-reply span{
  display:block;margin-bottom:5px;color:#2456a6;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
}
.sh-review-reply p{margin:0;color:#32445f;line-height:1.55}
.sh-review-awaiting{margin:13px 0 0;color:#718096;font-size:.87rem}
.sh-review-form-shell{margin-top:4px}
.sh-review-moderation{margin-top:14px;padding-top:14px;border-top:1px solid #edf1f5}
.sh-review-admin-actions{margin-top:14px}
@media(max-width:700px){
  .sh-review-folder__summary{grid-template-columns:minmax(0,1fr);gap:10px;padding:13px}
  .sh-review-person{grid-template-columns:44px minmax(0,1fr);gap:10px}
  .sh-review-person img,.sh-review-person .sh-avatar{width:44px!important;height:44px!important;min-width:44px!important;border-radius:12px!important}
  .sh-review-folder__meta{justify-content:space-between;padding-left:54px}
  .sh-review-folder__body{padding:12px 13px 14px}
  .sh-review-card{padding:13px}
  .sh-review-card__top{display:grid;gap:6px}
  .sh-review-card__top time{white-space:normal}
  .sh-review-quote{padding:12px 13px 12px 14px}
}



/* Skill Hub LMS 4.4.50 — global dashboard readability & spacing pass
   Applies to Student, Parent, Teacher and Admin dashboard workspaces. */

/* Never allow dashboard copy to collide or inherit compressed widths. */
.sh-dash,
.sh-dash *{
  min-width:0;
}
.sh-dash :is(p,span,strong,small,label,a,td,th){
  overflow-wrap:break-word;
  word-break:normal;
}
.sh-dash .sh-muted{
  line-height:1.55!important;
}
.sh-dash .sh-card__title{
  line-height:1.25!important;
}
.sh-dash .sh-card--pad{
  padding:20px!important;
}
.sh-dash .sh-block + .sh-block{
  margin-top:16px!important;
}

/* Generic rows used across notifications, admin queues, assignments, payments, etc. */
.sh-dash .sh-admin-record,
.sh-dash .sh-simple-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  padding:15px 16px!important;
  border:1px solid #e7edf4!important;
  border-radius:14px!important;
  background:#fff!important;
}
.sh-dash .sh-admin-record > :first-child,
.sh-dash .sh-simple-row > :first-child{
  min-width:0!important;
}
.sh-dash .sh-admin-record strong,
.sh-dash .sh-simple-row strong{
  display:block;
  line-height:1.35!important;
  color:#17263e!important;
}
.sh-dash .sh-admin-record .sh-muted,
.sh-dash .sh-simple-row .sh-muted{
  display:block;
  margin-top:4px!important;
  line-height:1.5!important;
  color:#69788e!important;
}
.sh-dash .sh-admin-record form,
.sh-dash .sh-simple-row form{
  margin:0!important;
  align-self:center!important;
}

/* Notifications: body gets the room; actions stay in a clean right rail. */
.sh-dash .sh-notification-row-link{
  display:block!important;
  min-width:0!important;
  color:inherit!important;
  text-decoration:none!important;
  padding-right:8px!important;
}
.sh-dash .sh-notification-row-link strong{
  color:#225aa8!important;
}
.sh-dash .sh-notification-row-link .sh-muted{
  max-width:78ch!important;
}
.sh-dash [data-sh-rest-form] .sh-btn--sm{
  white-space:nowrap!important;
}

/* Intro / explanatory text blocks */
.sh-dash :is(.sh-progress-intro,.sh-tuition-hero,.sh-review-intro){
  display:grid!important;
  gap:7px!important;
}
.sh-dash :is(.sh-progress-intro,.sh-tuition-hero,.sh-review-intro) p{
  margin:0!important;
  max-width:110ch!important;
}

/* Three-column explanatory cards such as Progress Reports.
   Explicit grid gap prevents the strong + body copy from visually merging. */
.sh-dash .sh-grid.sh-grid--3{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  margin-top:18px!important;
}
.sh-dash .sh-mini-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:8px!important;
  padding:17px!important;
  border:1px solid #e4ebf4!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,#fff,#f8fbff)!important;
  box-shadow:0 5px 14px rgba(22,47,79,.035)!important;
}
.sh-dash .sh-mini-card strong{
  display:block!important;
  line-height:1.35!important;
  color:#19385f!important;
}
.sh-dash .sh-mini-card span{
  display:block!important;
  line-height:1.55!important;
  color:#66758a!important;
}

/* Detail grids used throughout all four dashboards. */
.sh-dash .sh-admin-detail-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
.sh-dash .sh-admin-detail-grid > div{
  min-width:0!important;
  padding:13px 14px!important;
  border:1px solid #e7edf4!important;
  border-radius:13px!important;
  background:#fbfdff!important;
}
.sh-dash .sh-admin-detail-grid > div strong{
  display:block!important;
  margin-bottom:5px!important;
  color:#607087!important;
  font-size:.76rem!important;
  line-height:1.3!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
}
.sh-dash .sh-admin-detail-grid > div p{
  margin:0!important;
  color:#1c2f49!important;
  line-height:1.45!important;
}

/* Monthly tuition — facts have their own cells instead of one continuous text line. */
.sh-dash .sh-tuition-card{
  display:grid!important;
  gap:16px!important;
  padding:18px!important;
}
.sh-dash .sh-tuition-card__head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:14px!important;
}
.sh-dash .sh-tuition-card__title{
  display:grid!important;
  gap:4px!important;
}
.sh-dash .sh-tuition-card__title strong{
  color:#172b48!important;
  font-size:1.02rem!important;
  line-height:1.3!important;
}
.sh-dash .sh-tuition-card__title span{
  color:#758399!important;
  font-size:.8rem!important;
}
.sh-dash .sh-tuition-facts{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
.sh-dash .sh-tuition-facts > div{
  display:grid!important;
  gap:5px!important;
  padding:12px 13px!important;
  border:1px solid #e5ecf5!important;
  border-radius:13px!important;
  background:#fff!important;
}
.sh-dash .sh-tuition-facts span,
.sh-dash .sh-tuition-renewal span{
  color:#748297!important;
  font-size:.73rem!important;
  line-height:1.25!important;
  font-weight:750!important;
  text-transform:uppercase!important;
  letter-spacing:.035em!important;
}
.sh-dash .sh-tuition-facts strong,
.sh-dash .sh-tuition-renewal strong{
  color:#1c304d!important;
  font-size:.96rem!important;
  line-height:1.35!important;
}
.sh-dash .sh-tuition-renewal{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  padding:12px 14px!important;
  border:1px solid #e5ecf5!important;
  border-radius:13px!important;
  background:#f8fbff!important;
}

/* Meters should have breathing room and never sit against text. */
.sh-dash .sh-meter{
  margin:0!important;
}
.sh-dash .sh-meter__bar{
  min-height:9px!important;
}

/* Buttons / badges don't get squeezed into nearby copy. */
.sh-dash .sh-badge{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
.sh-dash .sh-flex.sh-between{
  gap:14px!important;
  flex-wrap:wrap!important;
}

/* Tables become readable instead of compressing columns over each other. */
.sh-dash .sh-table-wrap{
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
.sh-dash .sh-table{
  width:100%!important;
  min-width:680px;
}
.sh-dash .sh-table :is(th,td){
  padding:12px 14px!important;
  line-height:1.45!important;
  vertical-align:top!important;
}

/* Forms across all dashboard sections */
.sh-dash .sh-field{
  min-width:0!important;
}
.sh-dash .sh-field label{
  display:block!important;
  margin-bottom:6px!important;
  line-height:1.35!important;
}
.sh-dash :is(input,select,textarea){
  max-width:100%!important;
}
.sh-dash textarea{
  line-height:1.45!important;
}

/* Tablet */
@media(max-width:980px){
  .sh-dash .sh-grid.sh-grid--3{
    grid-template-columns:1fr!important;
  }
  .sh-dash .sh-tuition-facts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* Mobile */
@media(max-width:700px){
  .sh-dash .sh-card--pad{
    padding:14px!important;
  }
  .sh-dash .sh-admin-record,
  .sh-dash .sh-simple-row{
    grid-template-columns:1fr!important;
    align-items:stretch!important;
    gap:10px!important;
    padding:12px!important;
  }
  .sh-dash .sh-admin-record > form,
  .sh-dash .sh-simple-row > form{
    width:100%!important;
  }
  .sh-dash .sh-admin-record > form .sh-btn,
  .sh-dash .sh-simple-row > form .sh-btn{
    width:100%!important;
  }
  .sh-dash .sh-admin-detail-grid{
    grid-template-columns:1fr!important;
  }
  .sh-dash .sh-tuition-card{
    gap:13px!important;
    padding:14px!important;
  }
  .sh-dash .sh-tuition-card__head{
    grid-template-columns:1fr!important;
    gap:9px!important;
  }
  .sh-dash .sh-tuition-card__head .sh-badge{
    justify-self:start!important;
  }
  .sh-dash .sh-tuition-facts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .sh-dash .sh-tuition-facts > div{
    padding:10px!important;
  }
  .sh-dash .sh-tuition-renewal{
    grid-template-columns:1fr!important;
    gap:5px!important;
  }
  .sh-dash .sh-grid.sh-grid--3{
    gap:10px!important;
    margin-top:13px!important;
  }
  .sh-dash .sh-mini-card{
    padding:13px!important;
  }
  .sh-dash .sh-table{
    min-width:600px;
  }
}

/* Very small phones: tuition facts become one clean column rather than squeezing. */
@media(max-width:420px){
  .sh-dash .sh-tuition-facts{
    grid-template-columns:1fr!important;
  }
}



/* Dashboard section integrity / empty-state polish 4.4.52 */
.sh-dash .sh-empty-state{
  padding:18px;
  border:1px dashed #ced8e6;
  border-radius:14px;
  background:#f8fbff;
}
.sh-dash .sh-empty-state strong{
  display:block;
  color:#183354;
  font-size:1rem;
  margin-bottom:5px;
}
.sh-dash .sh-empty-state p{margin:0;line-height:1.55}
@media(max-width:700px){.sh-dash .sh-empty-state{padding:14px}}


/* Parent classes / progress polish 4.4.53 */
.sh-dash .sh-class-folder{margin:10px 0;border:1px solid #e3e9f2;border-radius:14px;background:#fff;overflow:hidden}
.sh-dash .sh-class-folder>summary{padding:14px 16px;background:#fbfdff}
.sh-dash .sh-class-folder[open]>summary{border-bottom:1px solid #e8edf4}
.sh-dash .sh-class-actions-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);gap:18px;align-items:start}
.sh-dash .sh-reschedule-panel{padding:14px;border-radius:12px;background:#f7faff;min-height:100%}
.sh-dash .sh-progress-widget-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.sh-dash .sh-tuition-progress-row{border:1px solid #e5ebf3;border-radius:12px;margin-top:10px}
@media(max-width:980px){.sh-dash .sh-progress-widget-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sh-dash .sh-class-actions-grid{grid-template-columns:1fr}}
@media(max-width:600px){.sh-dash .sh-record-summary{gap:10px}.sh-dash .sh-record-main{min-width:0}.sh-dash .sh-record-main strong,.sh-dash .sh-record-main span{white-space:normal;overflow-wrap:anywhere}.sh-dash .sh-class-folder>summary{padding:12px}.sh-dash .sh-record-detail{padding:12px}.sh-dash .sh-progress-widget-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Parent class folders — inline reschedule 4.4.54 */
.sh-dash .sh-folder-substats{display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:wrap!important;margin-top:3px!important;font-size:.76rem!important;color:#66758a!important}
.sh-dash .sh-folder-substats b{font-weight:750!important;color:#4b6382!important}
.sh-dash .sh-folder-substats i{font-style:normal!important;color:#a6b1bf!important}
.sh-dash .sh-reschedule-panel{display:grid!important;gap:12px!important;align-content:start!important}
.sh-dash .sh-reschedule-toggle{justify-self:start!important}
.sh-dash .sh-reschedule-toggle.is-open{background:#edf4ff!important;border-color:#b9d2fb!important;color:#174f9e!important}
.sh-dash .sh-reschedule-inline{margin-top:2px!important;padding-top:12px!important;border-top:1px solid #e2e9f2!important}
.sh-dash .sh-reschedule-inline[hidden]{display:none!important}
.sh-dash .sh-reschedule-inline .sh-field{margin-bottom:12px!important}
.sh-dash .sh-reschedule-inline .sh-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important}
@media(max-width:700px){
 .sh-dash .sh-reschedule-toggle{width:100%!important;justify-content:center!important}
 .sh-dash .sh-reschedule-inline .sh-actions>.sh-btn{flex:1 1 140px!important}
}


/* Attendance professional detail cards — 4.4.56 */
.sh-dash .sh-attendance-list{display:grid!important;gap:12px!important}
.sh-dash .sh-attendance-card{
  display:grid!important;
  gap:14px!important;
  padding:16px!important;
  margin:0 0 12px!important;
  border:1px solid #e4ebf3!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#ffffff,#fbfdff)!important;
  box-shadow:0 5px 16px rgba(15,23,42,.035)!important;
}
.sh-dash .sh-attendance-card:last-child{margin-bottom:0!important}
.sh-dash .sh-attendance-card__main{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:14px!important;
}
.sh-dash .sh-attendance-card__main>div{display:grid!important;gap:4px!important;min-width:0!important}
.sh-dash .sh-attendance-kicker{
  color:#6b7c93!important;
  font-size:.72rem!important;
  font-weight:800!important;
  text-transform:uppercase!important;
  letter-spacing:.06em!important;
}
.sh-dash .sh-attendance-card__main strong{
  color:#172b48!important;
  font-size:1rem!important;
  line-height:1.35!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.sh-dash .sh-attendance-status{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:32px!important;
  padding:6px 11px!important;
  border-radius:999px!important;
  font-size:.77rem!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.sh-dash .sh-attendance-status.is-attended{background:#e9f8f0!important;color:#147a57!important;border:1px solid #c8ecd9!important}
.sh-dash .sh-attendance-status.is-late{background:#fff7df!important;color:#9a6500!important;border:1px solid #f3dfa1!important}
.sh-dash .sh-attendance-status.is-noshow{background:#fff0f0!important;color:#b42318!important;border:1px solid #f4c7c4!important}
.sh-dash .sh-attendance-facts{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
.sh-dash .sh-attendance-facts>div{
  display:grid!important;
  gap:5px!important;
  min-width:0!important;
  padding:11px 12px!important;
  border:1px solid #e8edf4!important;
  border-radius:12px!important;
  background:#fff!important;
}
.sh-dash .sh-attendance-facts span{
  color:#7b8899!important;
  font-size:.7rem!important;
  font-weight:800!important;
  text-transform:uppercase!important;
  letter-spacing:.045em!important;
}
.sh-dash .sh-attendance-facts strong{
  color:#24364d!important;
  font-size:.88rem!important;
  line-height:1.4!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.sh-dash .sh-attendance-edit>summary{list-style:none!important;cursor:pointer!important}
.sh-dash .sh-attendance-edit>summary::-webkit-details-marker{display:none!important}
.sh-dash .sh-attendance-card--summary{margin-bottom:0!important}
.sh-dash .sh-attendance-edit__hint{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;color:#5d6f87!important;font-size:.78rem!important;font-weight:700!important}
@media(max-width:900px){
  .sh-dash .sh-attendance-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){
  .sh-dash .sh-attendance-card{padding:13px!important;gap:11px!important}
  .sh-dash .sh-attendance-card__main{grid-template-columns:1fr!important;gap:9px!important}
  .sh-dash .sh-attendance-status{justify-self:start!important}
  .sh-dash .sh-attendance-facts{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .sh-dash .sh-attendance-facts>div{padding:9px 10px!important}
  .sh-dash .sh-attendance-edit__hint{justify-content:flex-start!important}
}
@media(max-width:380px){
  .sh-dash .sh-attendance-facts{grid-template-columns:1fr!important}
}


/* Admin Teacher Management — professional collapsible sections 4.4.57 */
.sh-dash .sh-admin-management-folder{
  border:1px solid #e2e9f2;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,23,42,.045);
  overflow:hidden;
}
.sh-dash .sh-admin-management-folder>summary{list-style:none;cursor:pointer}
.sh-dash .sh-admin-management-folder>summary::-webkit-details-marker{display:none}
.sh-dash .sh-admin-management-folder__summary{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;
  padding:17px 18px;background:linear-gradient(180deg,#fff,#f9fbfe)
}
.sh-dash .sh-admin-management-folder__summary>div:first-child{display:grid;gap:4px;min-width:0}
.sh-dash .sh-admin-management-folder__summary strong{font-size:1.02rem;color:#182d49;line-height:1.3}
.sh-dash .sh-admin-management-folder__summary span:not(.sh-mini-pill):not(.sh-record-chevron){color:#718096;font-size:.84rem}
.sh-dash .sh-admin-management-folder__body{padding:16px 18px;border-top:1px solid #e7edf4;background:#fcfdff}
.sh-dash .sh-admin-summary-pills{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.sh-dash .sh-mini-pill{display:inline-flex;align-items:center;min-height:30px;padding:5px 9px;border-radius:999px;background:#edf3fb;color:#40536c;font-size:.74rem!important;font-weight:800;white-space:nowrap}
.sh-dash .sh-mini-pill.is-free,.sh-dash .sh-mini-pill.is-complete{background:#e9f8f0;color:#147a57}
.sh-dash .sh-mini-pill.is-booked{background:#fff4dc;color:#996300}
.sh-dash .sh-admin-management-folder[open]>.sh-admin-management-folder__summary .sh-record-chevron{transform:rotate(180deg)}
.sh-dash .sh-admin-day-folder{margin:10px 0;border:1px solid #e6ecf4;border-radius:14px;background:#fff;overflow:hidden}
.sh-dash .sh-admin-day-folder>summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
.sh-dash .sh-admin-day-folder>summary::-webkit-details-marker{display:none}
.sh-dash .sh-admin-day-folder>summary>span{color:#75849a;font-size:.8rem}
.sh-dash .sh-admin-day-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:12px 14px;border-top:1px solid #edf1f6;background:#fbfdff}
.sh-dash .sh-admin-slot-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid #e6ecf4;border-radius:12px;background:#fff}
.sh-dash .sh-admin-slot-card>div{display:grid;gap:3px;min-width:0}
.sh-dash .sh-admin-slot-card strong{color:#20354f;font-size:.9rem}
.sh-dash .sh-admin-slot-card span{color:#7a899b;font-size:.75rem}
.sh-dash .sh-admin-earnings-snapshot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 18px;border:1px solid #deeadf;border-radius:16px;background:linear-gradient(135deg,#f7fff9,#f8fbff)}
.sh-dash .sh-admin-earnings-snapshot>div{display:grid;gap:3px}
.sh-dash .sh-admin-earnings-snapshot>div>strong{font-size:1rem;color:#183a31}
.sh-dash .sh-admin-earnings-snapshot>div>span:last-child{font-size:.8rem;color:#6e7e76}
.sh-dash .sh-admin-earnings-snapshot>b{font-size:1.12rem;color:#13795b;white-space:nowrap}
.sh-dash .sh-admin-student-booking-folder{margin:10px 0;border:1px solid #e3eaf2;border-radius:14px;background:#fff;overflow:hidden}
.sh-dash .sh-admin-student-booking-folder>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 14px;cursor:pointer;list-style:none}
.sh-dash .sh-admin-student-booking-folder>summary::-webkit-details-marker{display:none}
.sh-dash .sh-admin-student-booking-folder .sh-profile-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center}
.sh-dash .sh-admin-student-booking-folder .sh-profile-card img{width:42px!important;height:42px!important;border-radius:12px!important;object-fit:cover!important}
.sh-dash .sh-admin-student-booking-folder .sh-profile-card>div{display:grid;gap:3px}
.sh-dash .sh-admin-student-booking-folder .sh-profile-card span{color:#718096;font-size:.8rem}
.sh-dash .sh-admin-student-booking-folder__body{padding:12px;border-top:1px solid #edf1f6;background:#fbfdff}
.sh-dash .sh-admin-booking-card{margin:8px 0!important;border:1px solid #e7edf4!important;border-radius:12px!important;background:#fff!important;overflow:hidden}
.sh-dash .sh-user-doc-row--pro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #edf1f5}
.sh-dash .sh-user-doc-row--pro:last-child{border-bottom:0}
.sh-dash .sh-user-doc-row--pro>div:first-child{display:grid;gap:3px}
.sh-dash .sh-account-controls-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:17px 18px;border:1px solid #f0d8d6;border-radius:16px;background:linear-gradient(135deg,#fffdfd,#fff8f7)}
.sh-dash .sh-account-controls-card>div:first-child{display:grid;gap:5px}
.sh-dash .sh-account-controls-card>div:first-child>strong{font-size:1rem;color:#4d2927}
.sh-dash .sh-account-controls-card p{margin:0!important;max-width:80ch}
@media(max-width:900px){
 .sh-dash .sh-admin-day-slots{grid-template-columns:1fr}
 .sh-dash .sh-account-controls-card{grid-template-columns:1fr}
}
@media(max-width:650px){
 .sh-dash .sh-admin-management-folder__summary{grid-template-columns:1fr;padding:14px}
 .sh-dash .sh-admin-summary-pills{justify-content:flex-start}
 .sh-dash .sh-admin-management-folder__body{padding:12px}
 .sh-dash .sh-admin-day-folder>summary{grid-template-columns:minmax(0,1fr) auto}
 .sh-dash .sh-admin-day-folder>summary>.sh-record-chevron{display:none}
 .sh-dash .sh-admin-earnings-snapshot{grid-template-columns:1fr}
 .sh-dash .sh-user-doc-row--pro{grid-template-columns:1fr}
}


/* Admin user integrity + student attendance 4.4.58 */
.sh-dash .sh-attendance-status.is-open{background:#eef4ff!important;color:#2456a6!important;border:1px solid #cbdcf8!important}
.sh-dash .sh-attendance-note{padding:9px 11px;border-radius:10px;background:#f7f9fc;color:#68788e;font-size:.78rem;font-weight:700}
.sh-dash .sh-admin-management-folder .sh-profile-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;min-width:0}
.sh-dash .sh-admin-management-folder .sh-profile-card img{width:42px!important;height:42px!important;border-radius:12px!important;object-fit:cover!important;object-position:center top!important}
.sh-dash .sh-admin-management-folder .sh-profile-card>div{display:grid;gap:3px;min-width:0}
@media(max-width:600px){
 .sh-dash .sh-admin-management-folder .sh-profile-card{grid-template-columns:38px minmax(0,1fr)}
 .sh-dash .sh-admin-management-folder .sh-profile-card img{width:38px!important;height:38px!important}
}


/* Admin Safety / Support / Message Reports restoration 4.4.60 */
.sh-dash .sh-admin-case-hero{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:18px!important;align-items:center!important}
.sh-dash .sh-admin-case-hero>div:first-child{display:grid!important;gap:6px!important}
.sh-dash .sh-admin-case-hero p{margin:0!important}
.sh-dash .sh-admin-case-list{display:grid!important;gap:12px!important}
.sh-dash .sh-admin-case-folder .sh-case-detail{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr)!important;gap:18px!important}
.sh-dash .sh-case-original{padding:14px!important;border:1px solid #e5ebf3!important;border-radius:13px!important;background:#f8fbff!important;margin-bottom:14px!important}
.sh-dash .sh-case-original p{margin:6px 0 0!important;line-height:1.65!important}
.sh-dash .sh-case-conversation h3,.sh-dash .sh-case-detail__manage h3{margin:0 0 10px!important;color:#1d3553!important}
.sh-dash .sh-thread__messages{display:grid!important;gap:10px!important;margin:10px 0 14px!important}
.sh-dash .sh-bubble{padding:12px 13px!important;border:1px solid #e5ebf3!important;border-radius:13px!important;background:#fff!important}
.sh-dash .sh-bubble.is-internal{background:#fff9e9!important;border-color:#f1dfaa!important}
.sh-dash .sh-bubble strong{display:block!important;margin-bottom:5px!important;color:#1f3859!important}
.sh-dash .sh-bubble small{display:block!important;margin-top:6px!important;color:#7c8999!important}
.sh-dash .sh-case-reply-box{margin-top:14px!important;padding-top:14px!important;border-top:1px solid #e8edf4!important}
.sh-dash .sh-case-detail__manage{padding:15px!important;border:1px solid #e4eaf2!important;border-radius:14px!important;background:#fbfdff!important}
.sh-dash .sh-message-report-context{display:grid!important;gap:14px!important}
.sh-dash .sh-message-report-context>div:first-child{padding:14px!important;border:1px solid #e6ebf2!important;border-radius:13px!important;background:#f8fbff!important}
.sh-dash .sh-message-report-context>div:first-child>span{display:block!important;font-size:.75rem!important;font-weight:800!important;text-transform:uppercase!important;color:#6d7c90!important;margin-bottom:6px!important}
.sh-dash .sh-message-report-context p{margin:0!important;line-height:1.6!important}
.sh-dash .sh-message-moderation-form{margin-top:16px!important;padding-top:16px!important;border-top:1px solid #e8edf4!important}
@media(max-width:900px){
 .sh-dash .sh-admin-case-hero{grid-template-columns:1fr!important}
 .sh-dash .sh-admin-case-hero .sh-admin-summary-pills{justify-content:flex-start!important}
 .sh-dash .sh-admin-case-folder .sh-case-detail{grid-template-columns:1fr!important}
}


/* Skill Hub LMS 4.4.61 — Become a Teacher availability picker */
.page-template-template-become-teacher .sh-hourly-availability{
  margin-top:22px!important;
  padding:22px!important;
  border:1px solid #dfe8f3!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
  box-shadow:0 12px 30px rgba(15,23,42,.055)!important;
}
.page-template-template-become-teacher .sh-hourly-availability>legend{
  padding:0 8px!important;
  color:#132b49!important;
  font-size:1.08rem!important;
  font-weight:850!important;
}
.page-template-template-become-teacher .sh-hourly-availability>.sh-help{
  margin:0 0 16px!important;
  max-width:78ch!important;
  color:#68788e!important;
  line-height:1.6!important;
}
.page-template-template-become-teacher .sh-hourly-availability>.sh-field{
  margin:0 0 16px!important;
  padding:14px!important;
  border:1px solid #e3eaf3!important;
  border-radius:14px!important;
  background:#fff!important;
}
.page-template-template-become-teacher .sh-hourly-availability>.sh-field label{
  display:block!important;
  margin-bottom:7px!important;
  color:#31445d!important;
  font-size:.82rem!important;
  font-weight:800!important;
}
.page-template-template-become-teacher .sh-hourly-availability>.sh-field input[type="date"]{
  width:100%!important;
  min-height:46px!important;
  border:1px solid #d7e0eb!important;
  border-radius:11px!important;
  background:#fbfdff!important;
}
.page-template-template-become-teacher .sh-hourly-week{
  display:grid!important;
  gap:10px!important;
}
.page-template-template-become-teacher .sh-hourly-day{
  margin:0!important;
  border:1px solid #e1e8f1!important;
  border-radius:15px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 4px 13px rgba(15,23,42,.025)!important;
}
.page-template-template-become-teacher .sh-hourly-day>summary{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto 22px!important;
  align-items:center!important;
  gap:12px!important;
  min-height:62px!important;
  padding:12px 15px!important;
  list-style:none!important;
  cursor:pointer!important;
  background:linear-gradient(180deg,#fff,#fbfdff)!important;
}
.page-template-template-become-teacher .sh-hourly-day>summary::-webkit-details-marker{display:none!important}
.page-template-template-become-teacher .sh-hourly-day>summary::after{
  content:"⌄"!important;
  display:grid!important;
  place-items:center!important;
  width:22px!important;
  height:22px!important;
  color:#527098!important;
  font-size:1rem!important;
  transition:transform .2s ease!important;
}
.page-template-template-become-teacher .sh-hourly-day[open]>summary::after{transform:rotate(180deg)!important}
.page-template-template-become-teacher .sh-hourly-day[open]>summary{
  border-bottom:1px solid #e7edf5!important;
  background:#f6faff!important;
}
.page-template-template-become-teacher .sh-hourly-day.has-selection{
  border-color:#c9dcf6!important;
}
.page-template-template-become-teacher .sh-hourly-day.has-selection>summary{
  background:linear-gradient(90deg,#f7fbff,#eef6ff)!important;
}
.page-template-template-become-teacher .sh-hourly-day__name{
  display:grid!important;
  gap:3px!important;
  min-width:0!important;
}
.page-template-template-become-teacher .sh-hourly-day__name strong{
  color:#182f4d!important;
  font-size:.97rem!important;
  line-height:1.2!important;
}
.page-template-template-become-teacher .sh-hourly-day__name small{
  color:#8290a2!important;
  font-size:.72rem!important;
  font-weight:600!important;
}
.page-template-template-become-teacher .sh-hourly-day__count{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:82px!important;
  min-height:29px!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  background:#eef3fa!important;
  color:#52667f!important;
  font-size:.7rem!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.page-template-template-become-teacher .sh-hourly-day.has-selection .sh-hourly-day__count{
  background:#e8f7ef!important;
  color:#177458!important;
}
.page-template-template-become-teacher .sh-hourly-day__tools{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 14px!important;
  border-bottom:1px solid #edf1f6!important;
  background:#fbfdff!important;
}
.page-template-template-become-teacher .sh-hourly-day__tools>span{
  color:#718096!important;
  font-size:.72rem!important;
  font-weight:800!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
}
.page-template-template-become-teacher .sh-hourly-day__tool-actions{
  display:flex!important;
  gap:7px!important;
}
.page-template-template-become-teacher .sh-hourly-tool{
  min-height:31px!important;
  padding:5px 10px!important;
  border:1px solid #d7e2ef!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#315a8e!important;
  font-size:.72rem!important;
  font-weight:800!important;
  cursor:pointer!important;
}
.page-template-template-become-teacher .sh-hourly-tool:hover{
  background:#eef6ff!important;
  border-color:#bfd4ee!important;
}
.page-template-template-become-teacher .sh-hourly-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:9px!important;
  padding:14px!important;
  background:#fff!important;
}
.page-template-template-become-teacher .sh-hour-slot{
  display:block!important;
  min-width:0!important;
  cursor:pointer!important;
}
.page-template-template-become-teacher .sh-hour-slot input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
}
.page-template-template-become-teacher .sh-hour-slot span{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  padding:7px 8px!important;
  border:1px solid #dfe7f1!important;
  border-radius:11px!important;
  background:#fbfdff!important;
  color:#3d516b!important;
  font-size:.76rem!important;
  font-weight:750!important;
  text-align:center!important;
  line-height:1.2!important;
  transition:.18s ease!important;
}
.page-template-template-become-teacher .sh-hour-slot span:hover{
  border-color:#b8cdeb!important;
  background:#f3f8ff!important;
  transform:translateY(-1px)!important;
}
.page-template-template-become-teacher .sh-hour-slot input:checked+span{
  padding-left:24px!important;
  border-color:#83b5ef!important;
  background:linear-gradient(135deg,#eaf4ff,#e7f8f1)!important;
  color:#125b89!important;
  box-shadow:inset 0 0 0 1px rgba(55,125,205,.08)!important;
}
.page-template-template-become-teacher .sh-hour-slot input:checked+span::before{
  content:"✓"!important;
  position:absolute!important;
  left:8px!important;
  display:grid!important;
  place-items:center!important;
  width:14px!important;
  height:14px!important;
  border-radius:50%!important;
  background:#1f8f69!important;
  color:#fff!important;
  font-size:.62rem!important;
  font-weight:900!important;
}
.page-template-template-become-teacher .sh-hour-slot input:focus-visible+span{
  outline:3px solid rgba(59,130,246,.22)!important;
  outline-offset:2px!important;
}
.page-template-template-become-teacher .sh-hourly-note{
  margin:14px 0 0!important;
  padding:12px 13px!important;
  border:1px solid #e2e9f2!important;
  border-radius:12px!important;
  background:#f8fbff!important;
  color:#68788e!important;
  font-size:.78rem!important;
  line-height:1.5!important;
}

@media(max-width:980px){
  .page-template-template-become-teacher .sh-hourly-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:700px){
  .page-template-template-become-teacher .sh-hourly-availability{
    padding:15px!important;
    border-radius:16px!important;
  }
  .page-template-template-become-teacher .sh-hourly-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    padding:11px!important;
  }
  .page-template-template-become-teacher .sh-hourly-day>summary{
    grid-template-columns:minmax(0,1fr) auto 18px!important;
    min-height:56px!important;
    padding:10px 11px!important;
    gap:8px!important;
  }
  .page-template-template-become-teacher .sh-hourly-day__name small{
    display:none!important;
  }
  .page-template-template-become-teacher .sh-hourly-day__count{
    min-width:70px!important;
    min-height:26px!important;
    padding:3px 7px!important;
    font-size:.65rem!important;
  }
  .page-template-template-become-teacher .sh-hourly-day__tools{
    padding:9px 11px!important;
  }
  .page-template-template-become-teacher .sh-hourly-day__tools>span{
    display:none!important;
  }
  .page-template-template-become-teacher .sh-hourly-day__tool-actions{
    width:100%!important;
  }
  .page-template-template-become-teacher .sh-hourly-tool{
    flex:1 1 0!important;
  }
  .page-template-template-become-teacher .sh-hour-slot span{
    min-height:39px!important;
    padding:6px!important;
    font-size:.72rem!important;
  }
}


/* Skill Hub LMS 4.4.62 — Homepage teacher cards: 4 desktop / 2 mobile + face-safe portraits.
   Find Teachers remains a richer two-column comparison layout. */

/* HOME / CATEGORY TEACHER CARDS */
html body.home .shp-teacher-grid,
html body .sh-home-teachers .shp-teacher-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}

html body.home .shp-teacher,
html body .sh-home-teachers .shp-teacher{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  height:100%!important;
  border-radius:18px!important;
  overflow:hidden!important;
}

html body.home .shp-teacher .shp-teacher__photo,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
  height:225px!important;
  padding:7px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#eef4fb,#f8fafc)!important;
}

html body.home .shp-teacher .shp-teacher__photo>a,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo>a{
  display:block!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  border-radius:13px!important;
  background:#f8fafc!important;
}

/* Preserve full width + top of portrait; if image is too tall only the lower part is clipped. */
html body.home .shp-teacher .shp-teacher__photo>a>img.shp-teacher__photo-main,
html body .sh-home-teachers .shp-teacher .shp-teacher__photo>a>img.shp-teacher__photo-main{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:100%!important;
  height:auto!important;
  min-height:0!important;
  object-fit:unset!important;
  object-position:unset!important;
  margin:0!important;
}

html body.home .shp-teacher__photo-bg,
html body .sh-home-teachers .shp-teacher__photo-bg{
  opacity:.13!important;
  filter:blur(16px)!important;
  transform:scale(1.08)!important;
}

html body.home .shp-teacher__body,
html body .sh-home-teachers .shp-teacher__body{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  padding:13px!important;
}

html body.home .shp-teacher__body h3,
html body .sh-home-teachers .shp-teacher__body h3{
  font-size:.96rem!important;
  line-height:1.25!important;
}

html body.home .shp-teacher__subjects,
html body .sh-home-teachers .shp-teacher__subjects{
  min-height:2.55em!important;
  white-space:normal!important;
  overflow:hidden!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  line-height:1.35!important;
}

html body.home .shp-teacher__qualification,
html body .sh-home-teachers .shp-teacher__qualification{
  min-height:2.7em!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  line-height:1.35!important;
}

html body.home .shp-teacher__facts,
html body .sh-home-teachers .shp-teacher__facts{
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  margin-top:2px!important;
}

html body.home .shp-teacher__price,
html body .sh-home-teachers .shp-teacher__price{
  margin-top:auto!important;
  min-height:43px!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:2px!important;
}

html body.home .shp-teacher__actions,
html body .sh-home-teachers .shp-teacher__actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:7px!important;
  margin-top:10px!important;
}

html body.home .shp-teacher__actions .sh-btn,
html body .sh-home-teachers .shp-teacher__actions .sh-btn{
  min-width:0!important;
  min-height:36px!important;
  padding:7px 6px!important;
  line-height:1.2!important;
  white-space:normal!important;
}

html body.home .shp-teacher__actions .sh-btn--primary:last-child,
html body .sh-home-teachers .shp-teacher__actions .sh-btn--primary:last-child{
  grid-column:1 / -1!important;
}

/* FIND A TEACHER: keep two detailed cards per row, but improve alignment and portrait presentation. */
html body .sh-results-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}

html body .sh-results-grid .sh-teacher-card{
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
}

html body .sh-results-grid .sh-teacher-card__top{
  align-items:flex-start!important;
}

html body .sh-results-grid .sh-teacher-card__avatar img{
  object-fit:cover!important;
  object-position:center top!important;
}

html body .sh-results-grid .sh-teacher-card__intro{
  min-height:4.2em!important;
}

html body .sh-results-grid .sh-teacher-card__pricing{
  margin-top:auto!important;
}

html body .sh-results-grid .sh-teacher-card__footer{
  align-items:stretch!important;
}

/* Tablet: 2 cards keeps content readable. */
@media (max-width:1050px){
  html body.home .shp-teacher-grid,
  html body .sh-home-teachers .shp-teacher-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body.home .shp-teacher .shp-teacher__photo,
  html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
    height:245px!important;
  }
}

/* Mobile: exactly 2 cards per row, as requested. */
@media (max-width:700px){
  html body.home .shp-teacher-grid,
  html body .sh-home-teachers .shp-teacher-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  html body.home .shp-teacher .shp-teacher__photo,
  html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
    height:190px!important;
    padding:5px!important;
  }

  html body.home .shp-teacher__body,
  html body .sh-home-teachers .shp-teacher__body{
    padding:9px!important;
  }

  html body.home .shp-teacher__body h3,
  html body .sh-home-teachers .shp-teacher__body h3{
    font-size:.86rem!important;
  }

  html body.home .shp-teacher__subjects,
  html body .sh-home-teachers .shp-teacher__subjects{
    font-size:.66rem!important;
    min-height:2.7em!important;
  }

  html body.home .shp-teacher__qualification,
  html body .sh-home-teachers .shp-teacher__qualification{
    font-size:.62rem!important;
    min-height:2.8em!important;
  }

  html body.home .shp-teacher__facts,
  html body .sh-home-teachers .shp-teacher__facts{
    font-size:.61rem!important;
    min-height:34px!important;
    padding:6px!important;
  }

  html body.home .shp-teacher__price,
  html body .sh-home-teachers .shp-teacher__price{
    font-size:.61rem!important;
    min-height:39px!important;
  }

  html body.home .shp-teacher__price strong,
  html body .sh-home-teachers .shp-teacher__price strong{
    font-size:.78rem!important;
  }

  html body.home .shp-teacher__actions,
  html body .sh-home-teachers .shp-teacher__actions{
    grid-template-columns:1fr!important;
    gap:5px!important;
  }

  html body.home .shp-teacher__actions .sh-btn,
  html body .sh-home-teachers .shp-teacher__actions .sh-btn{
    min-height:32px!important;
    padding:6px 4px!important;
    font-size:.61rem!important;
  }

  html body.home .shp-teacher__actions .sh-btn--primary:last-child,
  html body .sh-home-teachers .shp-teacher__actions .sh-btn--primary:last-child{
    grid-column:auto!important;
  }

  /* Search stays 2 per row on mobile; compact detailed comparison cards. */
  html body .sh-results-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html body .sh-results-grid .sh-teacher-card__avatar{
    height:125px!important;
  }
}

/* Very small phones: preserve two columns but avoid overflow. */
@media (max-width:390px){
  html body.home .shp-teacher-grid,
  html body .sh-home-teachers .shp-teacher-grid,
  html body .sh-results-grid{
    gap:7px!important;
  }
  html body.home .shp-teacher .shp-teacher__photo,
  html body .sh-home-teachers .shp-teacher .shp-teacher__photo{
    height:172px!important;
  }
}


/* 4.4.63 — Homepage per-card visibility + temporary showcase cards */
.shp-teacher.is-sample{border-style:dashed!important;border-color:#cbd5e1!important}
.shp-teacher__presence.is-sample{background:rgba(51,65,85,.92)!important;color:#fff!important}
.shp-teacher__presence.is-sample i{background:#fbbf24!important}
.sh-sample-card-note{
  grid-column:1/-1!important;
  cursor:default!important;
  background:#f8fafc!important;
  color:#64748b!important;
  border-color:#d8e0ea!important;
  text-align:center!important;
  justify-content:center!important;
}
.shp-course.is-sample{border-style:dashed!important;cursor:default!important}
.shp-sample-label{
  display:inline-flex!important;
  margin-bottom:7px!important;
  padding:4px 7px!important;
  border-radius:999px!important;
  background:#eef2ff!important;
  color:#4338ca!important;
  font-size:.62rem!important;
  font-weight:800!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
}

/* 4.6.5 — visible, accessible teacher/instructor application upload progress */
.sh-application-upload-progress{display:none;margin:0 0 16px;padding:16px;border:1px solid #c7d2fe;border-radius:14px;background:#eef2ff;color:#25305f}
.sh-application-upload-progress.is-visible{display:block}
.sh-application-upload-progress__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}
.sh-application-upload-progress__head span{font-weight:800;color:#4338ca;font-variant-numeric:tabular-nums}
.sh-application-upload-progress__track{height:12px;overflow:hidden;border-radius:999px;background:#dbe2ff;box-shadow:inset 0 1px 2px rgba(30,41,59,.12)}
.sh-application-upload-progress__track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4f46e5,#2563eb);transition:width .2s ease}
.sh-application-upload-progress p{margin:10px 0 0;font-size:.9rem;line-height:1.45}
.sh-application-upload-progress__warning{padding:10px 12px;border-radius:10px;background:#fff7ed;color:#9a3412}

/* 4.6.6 — prevent mobile native file-validation bubbles shifting the wizard */
.sh-wizard,.sh-wizard form[data-sh-wizard],.sh-step-panel,.sh-step-panel .sh-fieldset,.sh-dropzone{box-sizing:border-box;max-width:100%;min-width:0}
.sh-wizard,.sh-wizard form[data-sh-wizard]{overflow-x:clip}
.sh-dropzone.is-invalid{border-color:var(--sh-danger,#dc2626);background:var(--sh-danger-soft,#fef2f2)}
.sh-dropzone.is-invalid + [data-sh-video-validation],[data-sh-video-validation]:has(+ .sh-dropzone.is-invalid){color:var(--sh-danger,#b91c1c);font-weight:700}
@supports not (overflow:clip){.sh-wizard,.sh-wizard form[data-sh-wizard]{overflow-x:hidden}}

/* 4.6.8 — approved-teacher dashboard completion workflow */
.sh-profile-completion-prompt{position:relative;padding:22px;border:1px solid #c7d2fe;border-radius:18px;background:linear-gradient(135deg,#eef2ff,#f8fafc);box-shadow:0 14px 34px rgba(67,56,202,.12)}
.sh-profile-completion-prompt h2{margin:5px 38px 8px 0}.sh-profile-completion-prompt p{max-width:65ch;color:var(--sh-slate-600)}
.sh-profile-completion-prompt__close{position:absolute;top:12px;right:12px;width:34px;height:34px;border:0;border-radius:50%;background:#fff;color:#475569;font-size:22px;cursor:pointer}
.sh-dashboard-video-progress{margin:14px 0;padding:14px;border-radius:12px;background:#eef2ff}.sh-dashboard-video-progress>div{display:flex;justify-content:space-between;gap:12px;font-weight:800}
.sh-dashboard-video-progress__track{display:block;height:10px;margin-top:9px;overflow:hidden;border-radius:999px;background:#dbe2ff}.sh-dashboard-video-progress__track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4f46e5,#2563eb);transition:width .2s ease}
.sh-dashboard-video-progress p{margin:9px 0 0;color:#9a3412;font-size:.86rem;font-weight:700}