/* ============================================================
   hhs-enquiry-portal.css
   Happy Hours School — Online Enquiry Portal Design System
   Palette  : Emerald Green × Glass White × Amber
               Deep  #047857  |  Primary  #10B981  |  Mid  #34D399
               Amber #c9920d  |  Amber-dark  #a87608
   Style    : Soft glassmorphism — translucent frosted surfaces over a
              gentle emerald gradient canvas, light borders, airy shadows.
   Fonts    : Inter (body) · Poppins (headings)
   ============================================================ */

/* ── 0. CSS custom properties ───────────────────────────── */
:root {
    --hhs-deep:        #047857;
    --hhs-primary:     #10B981;
    --hhs-mid:         #34D399;
    --hhs-light:       #A7F3D0;
    --hhs-gold:        #c9920d;
    --hhs-gold-dark:   #a87608;
    --hhs-gold-pale:   #fdf4dc;
    --hhs-bg:          #ecfdf5;
    --hhs-card-bg:     rgba(255,255,255,0.86);
    --hhs-frame-bg:    rgba(255,255,255,0.16);
    --hhs-head-tint:   linear-gradient(90deg, rgba(16,185,129,0.12), rgba(167,243,208,0.05));
    --hhs-white:       #ffffff;
    --hhs-text:        #0b3b30;
    --hhs-text-muted:  #4b7c6b;
    --hhs-border:      #bbf0dd;
    --hhs-shadow:      rgba(4,120,87,0.13);
    --hhs-glass-border: rgba(255,255,255,0.65);
    --hhs-left-grad:   linear-gradient(155deg,#047857 0%,#10B981 52%,#5EE0A8 100%);
    --hhs-btn-grad:    linear-gradient(90deg,#047857 0%,#34D399 100%);
    --hhs-glass-blur:  16px;
    --hhs-radius-card: 24px;
    --hhs-radius-sm:   10px;
    --hhs-navbar-h:    62px;
}

/* ── 1. Global reset + typography ───────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: 'Inter', 'DM Sans', system-ui, sans-serif;
    color: var(--hhs-text);
    background:
        radial-gradient(circle at 8% 8%, rgba(167,243,208,0.45) 0%, rgba(167,243,208,0) 45%),
        radial-gradient(circle at 92% 18%, rgba(52,211,153,0.35) 0%, rgba(52,211,153,0) 50%),
        radial-gradient(circle at 50% 100%, rgba(236,253,245,0.9) 0%, rgba(236,253,245,0) 60%),
        var(--hhs-bg);
    background-attachment: fixed;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.mcl-school-name,
.mcl-form-title,
.edb-brand-name,
.edb-dash-title,
.edb-topbar-title,
.edb-enq-section-title,
.edb-sel-title,
.edb-form-header-title,
.edb-info-title,
.ep-header-title {
    font-family: 'Poppins', 'Sora', system-ui, sans-serif;
}

a { color: var(--hhs-primary); transition: color 0.16s; }
a:hover, a:focus { color: var(--hhs-mid); text-decoration: none; }

/* ── 2. AdminLTE / framework overrides ──────────────────── */
.lpsgs-page-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: transparent;
}

.lpsgs-content-area {
    flex: 1;
    margin-left: 0 !important;
    background: transparent !important;
    padding: 0 !important;
}

.content {
    padding: 0 !important;
    background: transparent !important;
}

.lpsgs-render-body { min-height: 1px; }

/* Kill default AdminLTE body bg */
body.hold-transition {
    background:
        radial-gradient(circle at 8% 8%, rgba(167,243,208,0.45) 0%, rgba(167,243,208,0) 45%),
        radial-gradient(circle at 92% 18%, rgba(52,211,153,0.35) 0%, rgba(52,211,153,0) 50%),
        radial-gradient(circle at 50% 100%, rgba(236,253,245,0.9) 0%, rgba(236,253,245,0) 60%),
        var(--hhs-bg) !important;
    background-attachment: fixed !important;
}

/* ── 3. Pre-login page shell ────────────────────────────── */
.mcl-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hhs-bg);
    padding: 28px 16px;
    position: relative;
    overflow: hidden;
}

/* Decorative radial bubbles */
.mcl-page::before {
    content: '';
    position: fixed;
    top: -180px;
    right: -150px;
    width: 540px;
    height: 540px;
    border-radius: 50% !important;
    background: radial-gradient(circle,rgba(16,185,129,0.20) 0%,rgba(16,185,129,0) 70%);
    pointer-events: none;
    z-index: 0;
}

.mcl-page::after {
    content: '';
    position: fixed;
    bottom: -200px;
    left: -130px;
    width: 500px;
    height: 500px;
    border-radius: 50% !important;
    background: radial-gradient(circle,rgba(167,243,208,0.28) 0%,rgba(167,243,208,0) 70%);
    pointer-events: none;
    z-index: 0;
}

/* ── 4. Login / Register card ───────────────────────────── */
.mcl-card {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    max-width: 760px;
    border-radius: var(--hhs-radius-card) !important;
    overflow: hidden;
    border: 1px solid var(--hhs-glass-border);
    background: var(--hhs-frame-bg);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    box-shadow:
        0 2px 0 rgba(255,255,255,0.5) inset,
        0 28px 80px rgba(4,120,87,0.22),
        0 2px 8px rgba(4,120,87,0.10);
}

/* Left brand panel */
.mcl-left {
    width: 38%;
    background: var(--hhs-left-grad);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 36px 24px;
    text-align: center;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.mcl-left::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 200px;
    height: 200px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.07);
    pointer-events: none;
}

.mcl-left::after {
    content: '';
    position: absolute;
    bottom: -70px;
    left: -40px;
    width: 220px;
    height: 220px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.05);
    pointer-events: none;
}

/* Logo container */
.mcl-logo-wrap {
    width: 100px;
    height: 100px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    border: 2.5px solid rgba(255,255,255,0.28);
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.mcl-logo-wrap img {
    width: 84px;
    height: 84px;
    object-fit: contain;
    border-radius: 50% !important;
}

.mcl-logo-icon {
    font-size: 42px;
    color: rgba(255,255,255,0.90);
}

/* Gold star accent above logo */
.mcl-left-star {
    color: var(--hhs-gold);
    font-size: 22px;
    display: block;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

.mcl-school-name {
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 10px;
    text-shadow: 0 1px 4px rgba(0,0,0,0.25);
    position: relative;
    z-index: 1;
}

.mcl-tagline {
    color: rgba(255,255,255,0.72);
    font-size: 12px;
    line-height: 1.6;
    position: relative;
    z-index: 1;
}

/* Pill badges */
.mcl-left-pills {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
    width: 100%;
    position: relative;
    z-index: 1;
}

.mcl-left-pill {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.22);
    color: rgba(255,255,255,0.88);
    border-radius: 20px !important;
    padding: 5px 14px;
    font-size: 11px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.mcl-left-pill-gold {
    background: rgba(245,166,35,0.22);
    border-color: rgba(245,166,35,0.38);
    color: var(--hhs-gold);
}

/* Right form panel */
.mcl-right {
    flex: 1;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 40px 38px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.mcl-form-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0 0 4px;
}

.mcl-form-subtitle {
    font-size: 13px;
    color: var(--hhs-text-muted);
    margin: 0 0 28px;
}

/* Phone-row: country-code + number */
.mcl-phone-row {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 0;
}

.mcl-cc-wrap { flex-shrink: 0; width: 96px; }

.mcl-phone-input-wrap { flex: 1; min-width: 0; }

/* Input resets — fight AdminLTE */
.mcl-right .form-control,
.mcl-input {
    width: 100%;
    height: 46px;
    border: 2px solid var(--hhs-border);
    border-radius: var(--hhs-radius-sm) !important;
    background: #f7f9ff;
    font-size: 14px;
    padding: 0 14px;
    color: var(--hhs-text);
    outline: none;
    box-shadow: none !important;
    transition: border-color 0.22s, background 0.22s, box-shadow 0.22s;
    -webkit-appearance: none;
}

.mcl-right .form-control:focus,
.mcl-input:focus {
    border-color: var(--hhs-mid);
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(52,211,153,0.13) !important;
}

.mcl-form-group { margin-bottom: 18px; }

.mcl-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    margin-bottom: 6px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

/* Select inside mcl-right */
.mcl-right select.form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%234b5e8a' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 11px center;
    padding-right: 30px;
}

/* CTA button */
.mcl-btn-submit {
    width: 100%;
    height: 48px;
    background: var(--hhs-btn-grad);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    border: none;
    border-radius: var(--hhs-radius-sm) !important;
    cursor: pointer;
    letter-spacing: 0.4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    transition: opacity 0.2s, transform 0.15s;
    box-shadow: 0 4px 18px rgba(16,185,129,0.30);
    animation: hhs-pulse 2.6s ease-in-out infinite;
    margin-top: 8px;
    text-decoration: none;
}

.mcl-btn-submit:hover,
.mcl-btn-submit:focus {
    opacity: 0.91;
    transform: translateY(-1px);
    box-shadow: 0 8px 28px rgba(16,185,129,0.40);
    color: #ffffff;
    outline: none;
    text-decoration: none;
}

@keyframes hhs-pulse {
    0%,100% { box-shadow: 0 4px 18px rgba(16,185,129,0.30); }
    50%      { box-shadow: 0 6px 30px rgba(52,211,153,0.52); }
}

/* Secondary outlined button */
.mcl-btn-secondary {
    width: 100%;
    height: 46px;
    background: transparent;
    color: var(--hhs-primary);
    font-size: 14px;
    font-weight: 600;
    border: 2px solid var(--hhs-primary);
    border-radius: var(--hhs-radius-sm) !important;
    cursor: pointer;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background 0.2s, color 0.2s;
    text-decoration: none;
    margin-top: 8px;
}

.mcl-btn-secondary:hover {
    background: var(--hhs-primary);
    color: #ffffff;
    text-decoration: none;
}

/* Or-divider */
.mcl-or-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 14px 0;
    color: var(--hhs-text-muted);
    font-size: 12px;
    font-weight: 500;
}

.mcl-or-divider::before,
.mcl-or-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--hhs-border);
}

/* Footer link row */
.mcl-link-row {
    text-align: center;
    margin-top: 18px;
    font-size: 13px;
    color: var(--hhs-text-muted);
}

.mcl-link-row a {
    color: var(--hhs-primary);
    font-weight: 600;
    text-decoration: none;
}

.mcl-link-row a:hover { color: var(--hhs-mid); text-decoration: underline; }

/* Error box */
.mcl-error {
    background: #fff0f0;
    border: 1px solid #f5c0c0;
    color: #b71c1c;
    border-radius: var(--hhs-radius-sm) !important;
    padding: 10px 14px;
    font-size: 13px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Captcha */
.mcl-captcha-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.mcl-captcha-img {
    border-radius: 6px !important;
    border: 2px solid var(--hhs-border);
    height: 44px;
    flex-shrink: 0;
}

.mcl-captcha-refresh {
    width: 36px;
    height: 36px;
    background: var(--hhs-bg);
    border: 2px solid var(--hhs-border);
    border-radius: 50% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--hhs-primary);
    font-size: 14px;
    transition: background 0.2s, color 0.2s;
    flex-shrink: 0;
}

.mcl-captcha-refresh:hover { background: var(--hhs-primary); color: #ffffff; }

/* Info note */
.mcl-note {
    font-size: 12px;
    color: var(--hhs-text-muted);
    background: #eef3ff;
    border-radius: 8px !important;
    padding: 10px 12px;
    margin-top: 16px;
    line-height: 1.5;
}

/* Validation error text */
.editor-error,
.error-color {
    color: #c0392b;
    font-size: 11px;
    margin-top: 3px;
    display: block;
}

/* ── 5. Sticky navbar ───────────────────────────────────── */
.edb-navbar {
    position: sticky;
    top: 0;
    z-index: 1000;
    height: var(--hhs-navbar-h);
    background: rgba(255,255,255,0.80);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid rgba(16,185,129,0.16);
    box-shadow: 0 4px 20px rgba(4,120,87,0.10);
}

.edb-navbar-inner {
    max-width: 1280px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 24px;
    gap: 16px;
}

/* Brand */
.edb-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: var(--hhs-deep);
    flex-shrink: 0;
}

.edb-brand:hover,
.edb-brand:focus { text-decoration: none; color: var(--hhs-deep); }

.edb-brand-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px !important;
    background: var(--hhs-left-grad);
    border: none;
    box-shadow: 0 4px 14px rgba(4,120,87,0.28);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.edb-brand-icon i { font-size: 18px; color: #ffffff; }

.edb-brand-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px !important;
    display: block;
}

.edb-brand-logo-fallback { display: none !important; }

.edb-brand-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--hhs-deep);
    line-height: 1.2;
    display: block;
}

.edb-brand-sub {
    font-size: 10px;
    font-weight: 400;
    color: var(--hhs-text-muted);
    display: block;
}

/* Nav collapse */
.edb-nav-collapse {
    display: flex;
    align-items: center;
    margin-left: auto;
}

.edb-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}

.edb-nav li a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 15px;
    border-radius: 20px !important;
    color: var(--hhs-text-muted);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.18s, color 0.18s;
    white-space: nowrap;
}

.edb-nav li a:hover,
.edb-nav li a:focus {
    background: rgba(16,185,129,0.10);
    color: var(--hhs-deep);
    text-decoration: none;
}

.edb-nav-logout:hover,
.edb-nav-logout:focus {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

.edb-user-pill {
    background: rgba(16,185,129,0.12) !important;
    color: var(--hhs-deep) !important;
    border: 1px solid rgba(16,185,129,0.28);
    pointer-events: none;
    cursor: default;
}

/* Hamburger */
.edb-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    cursor: pointer;
    margin-left: auto;
    padding: 0;
}

.edb-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--hhs-deep);
    border-radius: 2px !important;
    transition: transform 0.24s, opacity 0.24s;
}

/* ── 6. Footer ──────────────────────────────────────────── */
.edb-footer {
    background: rgba(255,255,255,0.74);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border-top: 1px solid rgba(16,185,129,0.14);
    box-shadow: 0 -4px 20px rgba(4,120,87,0.06);
    margin-top: auto;
    flex-shrink: 0;
}

.edb-footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.edb-footer-copy,
.edb-footer-powered {
    margin: 0;
    font-size: 12px;
    color: var(--hhs-text-muted);
}

.edb-footer-powered a {
    background: var(--hhs-btn-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration: none;
    font-weight: 700;
}

.edb-footer-powered a:hover { opacity: 0.78; }

/* ── 7. Dashboard page ──────────────────────────────────── */
.edb-page {
    margin: 0 auto;
    padding: 28px 24px 56px;
}

/* Top bar (quick header, no sidebar) */
.edb-topbar {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 14px !important;
    border: 1px solid var(--hhs-border);
    padding: 18px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    box-shadow: 0 2px 12px var(--hhs-shadow);
    margin-bottom: 24px;
}

.edb-topbar-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.edb-topbar-title > i:first-child {
    width: 38px;
    height: 38px;
    border-radius: 50% !important;
    background: rgba(16,185,129,0.10);
    color: var(--hhs-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.edb-topbar-btn {
    height: 38px;
    padding: 0 20px;
    background: var(--hhs-primary);
    color: #ffffff;
    border: none;
    border-radius: 20px !important;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    transition: background 0.18s;
}

.edb-topbar-btn:hover { background: var(--hhs-mid); color: #ffffff; text-decoration: none; }

.edb-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 24px;
}

/* Dash header */
.edb-dash-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
    flex-wrap: wrap;
    gap: 12px;
}

.edb-dash-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0;
}

.edb-dash-subtitle {
    font-size: 13px;
    color: var(--hhs-text-muted);
    margin-top: 3px;
}

/* Small chip row above a page title (mirrors CNS's edb-enq-badge-row) */
.edb-enq-badge-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }

.edb-enq-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    color: var(--hhs-primary);
    background: rgba(16,185,129,0.10);
    border: 1px solid rgba(16,185,129,0.22);
    border-radius: 20px !important;
    padding: 4px 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.edb-enq-badge-class {
    color: #ffffff;
    background: var(--hhs-left-grad);
    border-color: transparent;
}

/* Enquiry grid */
.edb-enq-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

/* ── 8. Enquiry cards ───────────────────────────────────── */
.edb-enq-card {
    width: 280px;
    min-height: 240px;
    border-radius: 16px !important;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1px solid var(--hhs-border);
    box-shadow: 0 2px 12px var(--hhs-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 0.18s, box-shadow 0.18s;
}

.edb-enq-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 32px rgba(4,120,87,0.18);
}

.edb-enq-head {
    background: var(--hhs-left-grad);
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.edb-enq-num {
    position: absolute;
    top: 10px;
    right: 12px;
    background: rgba(255,255,255,0.18);
    color: rgba(255,255,255,0.85);
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px !important;
    line-height: 1.4;
}

.edb-enq-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.18);
    border: 2.5px solid rgba(255,255,255,0.30);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.edb-enq-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50% !important;
}

.edb-enq-avatar i {
    font-size: 22px;
    color: rgba(255,255,255,0.85);
}

.edb-enq-name { flex: 1; min-width: 0; }

.edb-enq-name-text {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

/* Status badges */
.edb-enq-badge,
.edb-eq-badge-progress,
.edb-eq-badge-confirmed,
.edb-eq-badge-closed,
.edb-eq-badge-shortlist,
.edb-eq-badge-submitted {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 4px;
}

.edb-eq-badge-progress  { background: rgba(245,166,35,0.22);  color: var(--hhs-gold-dark); }
.edb-eq-badge-confirmed { background: rgba(39,174,96,0.20);   color: #1e8a4c; }
.edb-eq-badge-closed    { background: rgba(192,57,43,0.18);   color: #b71c1c; }
.edb-eq-badge-shortlist { background: rgba(142,68,173,0.18);  color: #7b1fa2; }
.edb-eq-badge-submitted { background: rgba(41,128,185,0.18);  color: #1565c0; }

/* Card body */
.edb-enq-body {
    padding: 14px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.edb-enq-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--hhs-text-muted);
}

.edb-enq-row i {
    width: 14px;
    color: var(--hhs-primary);
    font-size: 12px;
    flex-shrink: 0;
}

/* Card actions */
.edb-enq-actions {
    padding: 12px 16px;
    border-top: 1px solid var(--hhs-border);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.edb-action-btn {
    flex: 1;
    min-width: 0;
    height: 32px;
    border: none;
    border-radius: 8px !important;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    transition: background 0.18s, transform 0.12s, opacity 0.15s;
    white-space: nowrap;
}

.edb-action-btn:hover { transform: scale(1.03); text-decoration: none; }

.edb-action-btn-primary { background: var(--hhs-primary); color: #ffffff; }
.edb-action-btn-primary:hover { background: var(--hhs-mid); color: #ffffff; }

.edb-action-btn-gold { background: var(--hhs-gold); color: #1a1a1a; }
.edb-action-btn-gold:hover { background: var(--hhs-gold-dark); color: #ffffff; }

.edb-action-btn-outline {
    background: transparent;
    border: 1.5px solid var(--hhs-border);
    color: var(--hhs-text-muted);
}

.edb-action-btn-outline:hover {
    background: var(--hhs-bg);
    border-color: var(--hhs-primary);
    color: var(--hhs-primary);
}

.edb-action-btn-danger {
    background: transparent;
    border: 1.5px solid #fbb;
    color: #c0392b;
}

.edb-action-btn-danger:hover { background: #fff0f0; }

/* Add / New tile */
.edb-enq-add-tile {
    width: calc(33.333% - 14px);
    min-width: 260px;
    min-height: 240px;
    border-radius: 16px !important;
    border: 2px dashed var(--hhs-border);
    background: transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
    text-decoration: none;
    color: var(--hhs-text-muted);
    transition: background 0.18s, border-color 0.18s, transform 0.18s, color 0.18s;
    padding: 24px;
    text-align: center;
}

.edb-enq-add-tile:hover {
    background: #edf2ff;
    border-color: var(--hhs-primary);
    border-style: solid;
    transform: translateY(-2px);
    text-decoration: none;
    color: var(--hhs-primary);
}

.edb-add-icon {
    width: 52px;
    height: 52px;
    border-radius: 50% !important;
    background: var(--hhs-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: var(--hhs-primary);
    border: 2px solid var(--hhs-border);
    transition: background 0.18s, border-color 0.18s, color 0.18s;
}

.edb-enq-add-tile:hover .edb-add-icon {
    background: var(--hhs-primary);
    color: #ffffff;
    border-color: var(--hhs-primary);
}

.edb-add-label {
    font-size: 13px;
    font-weight: 700;
}

.edb-add-sub {
    font-size: 11px;
    opacity: 0.7;
    margin-top: -6px;
}

/* ── 9. Multi-step tab bar — glass pill bar (JNS reference) ── */
.edb-tab-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 0 -1px;
    padding: 8px;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1px solid var(--hhs-border);
    border-bottom: none;
    border-radius: 16px 16px 0 0 !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.edb-tab-bar::-webkit-scrollbar { display: none; }

.edb-tab-item {
    flex-shrink: 0;
    padding: 9px 16px;
    border-radius: 10px !important;
    font-size: 13px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    background: transparent;
    border: none;
    cursor: default;
    pointer-events: none; /* frozen — JS .trigger('click') still works */
    white-space: nowrap;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 0.18s, color 0.18s;
}

.edb-tab-item .fa { opacity: 0.85; }

.edb-tab-item.active,
.edb-tab-item[aria-selected="true"] {
    background: var(--hhs-left-grad);
    color: #ffffff;
    box-shadow: 0 3px 10px rgba(4,120,87,0.30);
}

.edb-tab-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50% !important;
    background: rgba(16,185,129,0.14);
    color: var(--hhs-primary);
    font-size: 10px;
    font-weight: 700;
}

.edb-tab-item.active .edb-tab-num {
    background: rgba(255,255,255,0.24);
    color: #ffffff;
}

/* Tab content panel */
.edb-tab-content-wrap {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1.5px solid var(--hhs-border);
    border-top: none;
    border-radius: 0 0 16px 16px !important;
    padding: 28px 24px;
}

/* ── 10. Application form page ──────────────────────────── */
.edb-enq-page,
.edb-enquiry-wrap {
    margin: 0 auto;
    padding: 28px 24px 56px;
}

.edb-enq-layout {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    align-items: stretch;
}

.edb-enq-layout > .edb-enq-section { display: flex; flex-direction: column; height: 100%; }
.edb-enq-layout > .edb-enq-section .edb-enq-section-body { flex: 1; }

.edb-enq-section-full { grid-column: 1 / -1; }

/* Section card */
.edb-enq-section {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1.5px solid var(--hhs-border);
    border-radius: 14px !important;
    overflow: hidden;
    box-shadow: 0 2px 10px var(--hhs-shadow);
}

.edb-enq-section-head {
    background: var(--hhs-head-tint);
    border-bottom: 1px solid rgba(16,185,129,0.14);
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.edb-enq-section-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--hhs-deep);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.edb-enq-section-icon,
.edb-enq-section-num {
    width: 28px;
    height: 28px;
    border-radius: 8px !important;
    background: var(--hhs-left-grad);
    box-shadow: 0 3px 10px rgba(4,120,87,0.28);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 700;
    color: #ffffff;
}

.edb-enq-section-sub {
    font-size: 11px;
    font-weight: 400;
    color: var(--hhs-text-muted);
    text-transform: none;
    letter-spacing: normal;
    margin-top: 2px;
}

.edb-enq-section-body { padding: 22px 20px; }

/* Alias: some pages were seeded from the CNS/JNS reference markup, which uses
   "-header" instead of "-head". Keep both working from one definition. */
.edb-enq-section-header { background: var(--hhs-head-tint); border-bottom: 1px solid rgba(16,185,129,0.14); padding: 12px 20px; display: flex; align-items: center; gap: 10px; }

/* Aliases for the CNS/JNS "ebi-grid" field-grid vocabulary, mapped onto the
   HHS field-label/box conventions so pages built from either reference render consistently. */
.ebi-grid { display: grid; gap: 16px; margin-bottom: 16px; }
.ebi-grid:last-child { margin-bottom: 0; }
.ebi-grid-1 { grid-template-columns: 1fr; }
.ebi-grid-2 { grid-template-columns: repeat(2, 1fr); }
.ebi-grid-3 { grid-template-columns: repeat(3, 1fr); }
.ebi-grid-4 { grid-template-columns: repeat(4, 1fr); }

.edb-enq-field { display: flex; flex-direction: column; gap: 4px; }
.edb-form-group { margin-bottom: 16px; }

.edb-enq-label,
.edb-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}

.req { color: #c0392b; margin-left: 2px; }

/* ── File uploader (shared ET_FileUploader partial) — consistent HHS styling ──
   Layout: the button/dropzone starts full width. Once a file exists (either a
   freshly uploaded row in .files, or a pre-existing file shown via
   .jsUseFilePreview), the widget splits into two equal halves — uploader on
   the left, file preview on the right. Pure CSS via :has(), no JS hook needed. */
.mcampusfileupload {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 14px;
}

.mcampusfileupload .fileupload-buttonbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    flex: 1 1 100%;
    margin-bottom: 0;
}

.mcampusfileupload .fileupload-content,
.mcampusfileupload .jsUseFilePreview {
    flex: 1 1 100%;
    margin-top: 0;
}

.mcampusfileupload .fileupload-content:not(:has(.files tr)) { display: none; }
.mcampusfileupload .jsUseFilePreview:not(:has(.file-row)) { display: none; }

.mcampusfileupload:has(.files tr) .fileupload-buttonbar,
.mcampusfileupload:has(.jsUseFilePreview .file-row) .fileupload-buttonbar {
    flex: 1 1 calc(50% - 7px);
}

.mcampusfileupload:has(.files tr) .fileupload-content,
.mcampusfileupload:has(.jsUseFilePreview .file-row) .jsUseFilePreview {
    flex: 1 1 calc(50% - 7px);
}

.mcampusfileupload .fileinput-button,
.mcampusfileupload .fileinput-button.ui-widget,
.mcampusfileupload .fileinput-button.ui-state-default,
.mcampusfileupload .fileinput-button.ui-corner-all {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
    border: 1.5px dashed var(--hhs-border) !important;
    border-radius: 10px !important;
    background: var(--hhs-bg) !important;
    background-image: none !important;
    text-shadow: none !important;
    padding: 8px 14px;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
    margin: 0;
}

.mcampusfileupload .fileinput-button:hover,
.mcampusfileupload .fileinput-button.ui-state-hover,
.mcampusfileupload .fileinput-button.ui-state-focus {
    border-color: var(--hhs-primary) !important;
    background: rgba(16,185,129,0.05) !important;
    background-image: none !important;
}

.mcampusfileupload .fileinput-button > span {
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-primary) !important;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    white-space: nowrap;
}

.mcampusfileupload .fileinput-button > span::before {
    font-family: 'FontAwesome';
    content: '\f0ee';
    font-size: 15px;
}

.mcampusfileupload .fileinput-button input[type="file"] {
    font-size: 12px;
    color: var(--hhs-text-muted);
    flex: 1;
    min-width: 160px;
    max-width: 100%;
}

.mcampusfileupload .fileinput-button input[type="file"]::-webkit-file-upload-button {
    -webkit-appearance: none;
    appearance: none;
    background: var(--hhs-btn-grad) !important;
    background-color: var(--hhs-primary) !important;
    color: #ffffff !important;
    text-shadow: none !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    margin-right: 10px;
}

.mcampusfileupload .fileinput-button input[type="file"]::file-selector-button {
    appearance: none;
    background: var(--hhs-btn-grad) !important;
    background-color: var(--hhs-primary) !important;
    color: #ffffff !important;
    text-shadow: none !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    margin-right: 10px;
}

.mcampusfileupload .file-row {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    background: var(--hhs-bg) !important;
    border: 1px solid var(--hhs-border);
    border-radius: 8px !important;
    padding: 8px 12px !important;
    margin-top: 6px;
}

.mcampusfileupload .file-left { display: flex; align-items: center; gap: 8px; }
.mcampusfileupload .file-name { color: var(--hhs-text) !important; font-weight: 600; font-size: 12.5px; }
.mcampusfileupload .file-name img { border-radius: 6px !important; border: 1px solid var(--hhs-border); }
.mcampusfileupload .file-actions { display: flex; gap: 10px; }
.mcampusfileupload .file-actions .action { cursor: pointer; font-size: 14px; transition: opacity 0.15s; }
.mcampusfileupload .file-actions .action:hover { opacity: 0.7; }
.mcampusfileupload .file-actions .view { color: var(--hhs-primary) !important; }
.mcampusfileupload .file-actions .download { color: var(--hhs-gold-dark) !important; }
.mcampusfileupload .file-actions .delete { color: #c0392b !important; }

.mcampusfileupload table.files { width: 100%; border-collapse: collapse; }

/* Outline button (download links) */
.edb-btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    padding: 0 16px;
    border: 1.5px solid var(--hhs-primary);
    border-radius: var(--hhs-radius-sm) !important;
    background: transparent;
    color: var(--hhs-deep);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.18s, color 0.18s;
}

.edb-btn-outline:hover,
.edb-btn-outline:focus {
    background: var(--hhs-primary);
    color: #ffffff;
    text-decoration: none;
}

/* Document upload card (per-document tile in the Documents step) */
.edb-doc-card {
    border: 1px solid var(--hhs-border);
    border-radius: var(--hhs-radius-card);
    overflow: hidden;
    height: 100%;
    background: var(--hhs-white);
    box-shadow: 0 2px 10px var(--hhs-shadow);
}

.edb-doc-card-head {
    background: var(--hhs-left-grad);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.edb-doc-num {
    background: var(--hhs-gold);
    color: #ffffff;
    width: 24px;
    height: 24px;
    border-radius: 50% !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
}

.edb-doc-name {
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    flex: 1;
    min-width: 0;
}

.edb-doc-required {
    color: var(--hhs-gold);
    font-size: 18px;
    vertical-align: middle;
    margin-left: 2px;
}

.edb-doc-card-body { padding: 14px; }

/* Additional-info question row — bordered box per question (mirrors CNS's edb-ai-row) */
.edb-ai-row.row {
    background: var(--hhs-white);
    border: 1.5px solid var(--hhs-border);
    border-radius: 12px !important;
    margin: 0 0 12px !important;
    padding: 12px 8px 12px 0;
}

/* Field grid */
.edb-enq-fields-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 18px;
}

.edb-enq-field-full { grid-column: 1 / -1; }

.edb-field-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.edb-field-label .required-star { color: #c0392b; margin-left: 2px; }

.edb-field-input,
.edb-enq-section .form-control {
    width: 100%;
    height: 44px;
    border: 2px solid var(--hhs-border);
    border-radius: 8px !important;
    background: #f7f9ff;
    font-size: 14px;
    padding: 0 12px;
    color: var(--hhs-text);
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
    box-shadow: none !important;
    -webkit-appearance: none;
}

.edb-field-input:focus,
.edb-enq-section .form-control:focus {
    border-color: var(--hhs-mid);
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(52,211,153,0.11) !important;
}

.edb-field-textarea {
    height: auto !important;
    min-height: 80px;
    resize: vertical;
    padding: 10px 12px !important;
}

/* Checkbox row */
.edb-check-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--hhs-text-muted);
    cursor: pointer;
    user-select: none;
}

.edb-check-row input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: var(--hhs-primary);
    cursor: pointer;
}

/* Action row */
.edb-enq-action-row {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 8px;
    flex-wrap: wrap;
}

.edb-btn-prev,
.edb-btn-next,
.edb-btn-save,
.edb-btn-submit-final {
    height: 42px;
    padding: 0 24px;
    border-radius: 8px !important;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background 0.18s, transform 0.12s;
    letter-spacing: 0.2px;
}

.edb-btn-prev {
    background: var(--hhs-bg);
    border: 2px solid var(--hhs-border);
    color: var(--hhs-text-muted);
}

.edb-btn-prev:hover {
    background: #dde8ff;
    border-color: var(--hhs-primary);
    color: var(--hhs-primary);
}

.edb-btn-next,
.edb-btn-save { background: var(--hhs-primary); color: #ffffff; }

.edb-btn-next:hover,
.edb-btn-save:hover { background: var(--hhs-mid); transform: translateY(-1px); color: #ffffff; }

.edb-btn-submit-final { background: var(--hhs-gold); color: #1a1a1a; }
.edb-btn-submit-final:hover { background: var(--hhs-gold-dark); color: #ffffff; transform: translateY(-1px); }

/* Photo upload */
.edb-photo-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}

.edb-photo-circle {
    width: 100px;
    height: 100px;
    border-radius: 50% !important;
    background: var(--hhs-bg);
    border: 3px dashed var(--hhs-border);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.2s;
}

.edb-photo-circle:hover { border-color: var(--hhs-primary); }
.edb-photo-circle img { width: 100%; height: 100%; object-fit: cover; }
.edb-photo-circle i { font-size: 32px; color: var(--hhs-text-muted); }

/* ── 11. School / Year / Class selection ────────────────── */
.edb-sel-outer {
    min-height: calc(100vh - var(--hhs-navbar-h) - 56px);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hhs-bg);
    padding: 28px 16px;
}

/* When used as standalone page (pre-login) */
.mcl-page .edb-sel-outer {
    min-height: unset;
    padding: 0;
}

.edb-sel-page {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edb-sel-card {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 20px !important;
    box-shadow: 0 20px 64px rgba(4,120,87,0.18);
    overflow: hidden;
    max-width: 820px;
    width: 100%;
    display: flex;
}

/* Reuse .mcl-left inside .edb-sel-card */
.edb-sel-card .mcl-left { width: 34%; }

/* Right selection area */
.edb-sel-right {
    flex: 1;
    padding: 40px 36px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.edb-sel-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0 0 4px;
}

.edb-sel-subtitle {
    font-size: 13px;
    color: var(--hhs-text-muted);
    margin: 0 0 26px;
}

.edb-sel-fields { display: flex; flex-direction: column; gap: 16px; }

.edb-sel-fields-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.edb-sel-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}

.edb-sel-select,
.edb-sel-right .form-control {
    width: 100%;
    height: 46px;
    border: 2px solid var(--hhs-border);
    border-radius: 8px !important;
    background: #f7f9ff;
    font-size: 14px;
    padding: 0 36px 0 12px;
    color: var(--hhs-text);
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%234b5e8a' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    box-shadow: none !important;
}

.edb-sel-select:focus,
.edb-sel-right .form-control:focus {
    border-color: var(--hhs-mid);
    background-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(52,211,153,0.12) !important;
}

.edb-sel-next-btn {
    width: 100%;
    height: 48px;
    background: var(--hhs-btn-grad);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    border: none;
    border-radius: 10px !important;
    cursor: pointer;
    margin-top: 10px;
    letter-spacing: 0.4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: opacity 0.2s, transform 0.15s;
}

.edb-sel-next-btn:hover { opacity: 0.90; transform: translateY(-1px); }

/* Progress stepper (Quick Enquiry) */
.edb-sel-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
}

.edb-sel-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.edb-sel-step-circle {
    width: 34px;
    height: 34px;
    border-radius: 50% !important;
    background: var(--hhs-bg);
    border: 2px solid var(--hhs-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--hhs-text-muted);
    transition: background 0.2s, border-color 0.2s, color 0.2s;
    z-index: 1;
    position: relative;
}

.edb-sel-step.active .edb-sel-step-circle {
    background: var(--hhs-primary);
    border-color: var(--hhs-primary);
    color: #ffffff;
    box-shadow: 0 0 0 4px rgba(16,185,129,0.15);
}

.edb-sel-step.done .edb-sel-step-circle {
    background: var(--hhs-gold);
    border-color: var(--hhs-gold);
    color: #1a1a1a;
}

.edb-sel-step-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    text-align: center;
    white-space: nowrap;
}

.edb-sel-step.active .edb-sel-step-label { color: var(--hhs-primary); }
.edb-sel-step.done .edb-sel-step-label { color: var(--hhs-gold-dark); }

.edb-sel-connector {
    width: 52px;
    height: 2px;
    background: var(--hhs-border);
    margin: 0 4px;
    margin-bottom: 20px;
    transition: background 0.2s;
}

.edb-sel-connector.done { background: var(--hhs-gold); }

/* Quick enquiry shell */
.edb-sel-shell {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 20px !important;
    box-shadow: 0 20px 64px rgba(4,120,87,0.18);
    overflow: hidden;
    max-width: 680px;
    width: 100%;
    padding: 40px 36px;
}

/* ── 12. General form card (post-login single-page forms) ── */
.edb-form-card {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 16px !important;
    box-shadow: 0 4px 24px var(--hhs-shadow);
    border: 1.5px solid var(--hhs-border);
    overflow: hidden;
    max-width: 1040px;
    margin: 24px auto;
}

.edb-form-header {
    background: var(--hhs-head-tint);
    border-bottom: 1px solid rgba(16,185,129,0.14);
    padding: 18px 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.edb-form-header-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0;
}

.edb-form-body { padding: 24px; }

/* ── 13. Payment / fees page ────────────────────────────── */
.ep-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hhs-bg);
    padding: 24px 16px;
}

.ep-card {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 20px !important;
    box-shadow: 0 20px 64px rgba(4,120,87,0.15);
    overflow: hidden;
    max-width: 560px;
    width: 100%;
}

.ep-header {
    background: var(--hhs-left-grad);
    padding: 24px 28px;
    text-align: center;
}

.ep-header-title {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 4px;
}

.ep-header-sub {
    font-size: 13px;
    color: rgba(255,255,255,0.72);
    margin: 0;
}

.ep-header-icon {
    width: 54px;
    height: 54px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 24px;
    color: var(--hhs-gold);
    border: 2px solid rgba(255,255,255,0.25);
}

.ep-body { padding: 28px; }

.ep-amount-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--hhs-border);
    font-size: 14px;
    gap: 12px;
}

.ep-amount-row:last-of-type { border-bottom: none; }

.ep-label { color: var(--hhs-text-muted); font-weight: 500; }

.ep-value { font-weight: 700; color: var(--hhs-deep); }

.ep-total-row .ep-label { font-weight: 700; color: var(--hhs-text); font-size: 16px; }
.ep-total-row .ep-value { font-size: 22px; color: var(--hhs-primary); }

.ep-pay-btn {
    width: 100%;
    height: 50px;
    background: var(--hhs-btn-grad);
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    border: none;
    border-radius: 10px !important;
    cursor: pointer;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: opacity 0.2s, transform 0.15s;
}

.ep-pay-btn:hover { opacity: 0.90; transform: translateY(-1px); }

/* Gold highlight strip */
.ep-gold-strip {
    background: var(--hhs-gold-pale);
    border: 1px solid rgba(245,166,35,0.30);
    border-radius: 10px !important;
    padding: 12px 16px;
    font-size: 13px;
    color: #6a4200;
    margin-bottom: 16px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* ── 14. Read-only info / confirmation views ────────────── */
.edb-info-card {
    max-width: 740px;
    margin: 28px auto;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 16px !important;
    box-shadow: 0 4px 24px var(--hhs-shadow);
    border: 1.5px solid var(--hhs-border);
    overflow: hidden;
}

.edb-info-header {
    background: var(--hhs-head-tint);
    border-bottom: 1px solid rgba(16,185,129,0.14);
    padding: 18px 24px;
}

.edb-info-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0;
}

.edb-info-body { padding: 24px; }

.edb-info-row {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f0f4fd;
    font-size: 14px;
}

.edb-info-row:last-child { border-bottom: none; }

.edb-info-key {
    width: 180px;
    flex-shrink: 0;
    color: var(--hhs-text-muted);
    font-weight: 600;
    font-size: 13px;
}

.edb-info-val { flex: 1; color: var(--hhs-text); font-weight: 500; }

/* Alert banners */
.edb-alert-info {
    background: rgba(16,185,129,0.07);
    border: 1px solid rgba(16,185,129,0.22);
    border-radius: 10px !important;
    padding: 12px 16px;
    color: var(--hhs-primary);
    font-size: 13px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
}

/* Reading pane for raw/rich HTML instruction content */
.edb-content-box {
    background: rgba(255,255,255,0.55);
    border: 1px solid var(--hhs-border);
    border-radius: 12px !important;
    padding: 18px 20px;
    margin-bottom: 20px;
}

/* Declaration / acknowledgement checkbox panel */
.edb-declare-box {
    background: rgba(16,185,129,0.06);
    border: 1.5px solid rgba(16,185,129,0.18);
    border-left: 4px solid var(--hhs-primary);
    border-radius: 0 12px 12px 0 !important;
    padding: 14px 16px;
    margin-bottom: 18px;
}

.edb-alert-warning {
    background: var(--hhs-gold-pale);
    border: 1px solid rgba(245,166,35,0.32);
    border-radius: 10px !important;
    padding: 12px 16px;
    color: #6a4200;
    font-size: 13px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
}

.edb-alert-success {
    background: #e8f7ef;
    border: 1px solid #a8d8bd;
    border-radius: 10px !important;
    padding: 12px 16px;
    color: #1a5c38;
    font-size: 13px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
}

/* ── 15. Document upload ─────────────────────────────────── */
.edb-doc-upload-area {
    border: 2px dashed var(--hhs-border);
    border-radius: 10px !important;
    padding: 20px;
    text-align: center;
    background: #f7f9ff;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
}

.edb-doc-upload-area:hover {
    border-color: var(--hhs-primary);
    background: #eef3ff;
}

/* ── 16. Re-admission search card ───────────────────────── */
.edb-readm-card {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-radius: 16px !important;
    box-shadow: 0 4px 24px var(--hhs-shadow);
    border: 1.5px solid var(--hhs-border);
    overflow: hidden;
    max-width: 560px;
    margin: 24px auto;
}

.edb-readm-header {
    background: var(--hhs-head-tint);
    border-bottom: 1px solid rgba(16,185,129,0.14);
    padding: 16px 20px;
}

.edb-readm-title {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: var(--hhs-deep);
    margin: 0;
}

.edb-readm-body { padding: 24px 20px; }

/* ── 17. Loader ─────────────────────────────────────────── */
.EdusprintPageLoader {
    position: fixed;
    inset: 0;
    background: rgba(4,120,87,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

/* ── 18. Responsive ─────────────────────────────────────── */

/* ≤ 900px */
@media (max-width: 900px) {
    .edb-enq-card, .edb-enq-add-tile { width: calc(50% - 10px); }
    .edb-grid .edb-enq-card,
    .edb-grid .edb-enq-add-tile { width: calc(50% - 10px); }
}

/* ≤ 768px: tablet */
@media (max-width: 768px) {
    /* Card collapses to vertical */
    .mcl-card { flex-direction: column; max-width: 420px; }
    .mcl-left { width: 100%; min-height: 180px; border-radius: 0 !important; padding: 24px 20px; }
    .mcl-right { padding: 28px 22px; }
    .mcl-left-pills { flex-direction: row; justify-content: center; flex-wrap: wrap; }
    .mcl-logo-wrap { width: 72px; height: 72px; }
    .mcl-logo-wrap img { width: 60px; height: 60px; }

    /* Navbar */
    .edb-navbar-inner { padding: 0 16px; }
    .edb-toggle { display: flex; }
    .edb-nav-collapse {
        display: none;
        position: absolute;
        top: var(--hhs-navbar-h);
        left: 0;
        right: 0;
        background: rgba(255,255,255,0.96);
        backdrop-filter: blur(16px) saturate(160%);
        -webkit-backdrop-filter: blur(16px) saturate(160%);
        border-top: 1px solid rgba(16,185,129,0.14);
        padding: 12px 16px 16px;
        flex-direction: column;
        z-index: 999;
        box-shadow: 0 8px 24px rgba(4,120,87,0.14);
    }
    .edb-nav-collapse.open { display: flex; }
    .edb-nav { flex-direction: column; align-items: stretch; width: 100%; gap: 4px; }
    .edb-nav li a { border-radius: 8px !important; padding: 11px 14px; }

    /* Footer */
    .edb-footer-inner { flex-direction: column; text-align: center; gap: 8px; }

    /* Dashboard */
    .edb-page { padding: 18px 14px 40px; }
    .edb-enq-grid, .edb-grid { justify-content: center; }
    .edb-enq-card, .edb-enq-add-tile { width: 100%; max-width: 360px; }

    /* Selection card */
    .edb-sel-card { flex-direction: column; }
    .edb-sel-card .mcl-left { width: 100%; }
    .edb-sel-right { padding: 28px 20px; }
    .edb-sel-fields-row { grid-template-columns: 1fr; }
    .edb-sel-shell { padding: 28px 20px; }

    /* Form */
    .edb-enq-fields-grid { grid-template-columns: 1fr 1fr; }
    .edb-tab-content-wrap { padding: 18px 14px; }
    .edb-enq-page { padding: 18px 14px 40px; }
    .edb-enq-layout { grid-template-columns: 1fr; }
}

/* ≤ 560px: phone */
@media (max-width: 560px) {
    .mcl-right { padding: 22px 18px; }
    .mcl-form-title { font-size: 18px; }
    .mcl-phone-row { flex-direction: column; }
    .mcl-cc-wrap { width: 100%; }
    .edb-enq-fields-grid { grid-template-columns: 1fr; }
    .edb-enq-action-row { flex-direction: column-reverse; }
    .edb-btn-prev,
    .edb-btn-next,
    .edb-btn-save,
    .edb-btn-submit-final { width: 100%; justify-content: center; }
    .edb-tab-bar { gap: 2px; padding: 12px 12px 0; }
    .edb-tab-item { padding: 7px 12px; font-size: 12px; }
    .edb-tab-content-wrap { padding: 14px 12px; border-radius: 0 0 12px 12px !important; }
    .ep-body { padding: 20px 16px; }
    .edb-info-key { width: 130px; }
}

/* ── 19. Utility helpers ─────────────────────────────────── */
.hhs-text-primary { color: var(--hhs-primary) !important; }
.hhs-text-gold    { color: var(--hhs-gold) !important; }
.hhs-text-muted   { color: var(--hhs-text-muted) !important; }
.hhs-bg-primary   { background: var(--hhs-primary) !important; color: #fff !important; }
.hhs-bg-gold      { background: var(--hhs-gold) !important; color: #1a1a1a !important; }

.edb-divider {
    border: none;
    border-top: 1px solid var(--hhs-border);
    margin: 16px 0;
}

/* Validation helpers from AdminLTE */
.ui-state-error { border: none !important; background: none !important; }
.editor-error   { color: #c0392b; font-size: 11px; margin-top: 3px; display: block; }

/* AdminLTE skin overrides */
.skin-blue .main-header .logo { display: none; }
.main-header { display: none !important; }
.main-sidebar { display: none !important; }

/* ── 8b. edb-eq-* card system (CNS-pattern dashboard) ─── */
.edb-legend {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    background: rgba(16,185,129,0.14);
    color: var(--hhs-primary);
    border-radius: 20px !important;
    padding: 3px 10px;
    margin-left: 8px;
    vertical-align: middle;
}

.edb-empty { width: 100%; text-align: center; padding: 48px 24px; color: var(--hhs-text-muted); }
.edb-empty h3 { font-size: 20px; font-weight: 700; color: var(--hhs-deep); margin-bottom: 8px; }
.edb-empty p  { font-size: 14px; margin-bottom: 20px; }
.edb-empty-tiles { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

.edb-eq-card {
    width: calc(33.333% - 14px);
    min-width: 260px;
    min-height: 240px;
    border-radius: 16px !important;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1px solid var(--hhs-border);
    box-shadow: 0 2px 12px var(--hhs-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 0.18s, box-shadow 0.18s;
}
.edb-eq-card:hover { transform: translateY(-3px); box-shadow: 0 10px 32px rgba(4,120,87,0.18) !important; }
.edb-eq-card.is-existing { border-color: var(--hhs-gold); border-width: 2px; }

.edb-eq-head {
    background: var(--hhs-head-tint);
    border-bottom: 1px solid rgba(16,185,129,0.14);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
}

.edb-eq-num {
    position: absolute;
    top: 9px; right: 10px;
    background: rgba(16,185,129,0.14);
    color: var(--hhs-deep);
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 20px !important;
    line-height: 1.4;
}

.edb-eq-avatar-wrap {
    width: 50px; height: 50px;
    border-radius: 50% !important;
    background: var(--hhs-left-grad);
    border: 2.5px solid rgba(255,255,255,0.80);
    box-shadow: 0 3px 10px rgba(4,120,87,0.22);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; overflow: hidden;
}

.edb-eq-avatar { width: 100%; height: 100%; object-fit: cover; border-radius: 50% !important; }

.edb-eq-identity { flex: 1; min-width: 0; }

.edb-eq-name {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 13px; font-weight: 700; color: var(--hhs-deep);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    margin: 0; display: block;
}

.edb-eq-status { flex-shrink: 0; }

.edb-eq-badge {
    display: inline-block;
    font-size: 10px; font-weight: 700;
    padding: 3px 9px;
    border-radius: 12px !important;
    text-transform: uppercase; letter-spacing: 0.5px;
    white-space: nowrap;
}

.edb-eq-badge-progress  { background: rgba(201,146,13,0.22); color: var(--hhs-gold-dark); }
.edb-eq-badge-confirmed { background: rgba(52,211,153,0.22);  color: #0f5c35; }
.edb-eq-badge-closed    { background: rgba(192,57,43,0.18);  color: #b71c1c; }
.edb-eq-badge-shortlist { background: rgba(142,68,173,0.18); color: #7b1fa2; }
.edb-eq-badge-submitted { background: rgba(16,185,129,0.18);  color: var(--hhs-primary); }

.edb-eq-body {
    padding: 14px 16px; flex: 1;
    display: flex; flex-direction: column; gap: 6px;
}

.edb-eq-info-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--hhs-text-muted); }
.edb-eq-info-row i { width: 14px; color: var(--hhs-primary); font-size: 12px; flex-shrink: 0; }

.edb-eq-info-key {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    font-weight: 600;
    color: var(--hhs-text-muted);
    white-space: nowrap;
}

.edb-eq-info-val {
    flex: 1;
    min-width: 0;
    text-align: right;
    color: var(--hhs-text);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.edb-eq-actions {
    padding: 10px 12px;
    border-top: 1px solid var(--hhs-border);
    display: flex; gap: 6px; flex-wrap: wrap;
}

.edb-eq-btn {
    flex: 1; min-width: 0; height: 30px;
    border: none; border-radius: 7px !important;
    font-size: 11px; font-weight: 600; cursor: pointer;
    text-decoration: none;
    display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    transition: background 0.16s, opacity 0.14s;
    white-space: nowrap; padding: 0 8px;
}
.edb-eq-btn:hover  { opacity: 0.88; text-decoration: none; }
.edb-eq-btn:focus  { outline: none; }

.edb-eq-btn-fill    { background: var(--hhs-primary); color: #fff; }
.edb-eq-btn-fill:hover    { background: var(--hhs-mid); color: #fff; }
.edb-eq-btn-submit  { background: var(--hhs-gold); color: #1a1a1a; }
.edb-eq-btn-submit:hover  { background: var(--hhs-gold-dark); color: #fff; }
.edb-eq-btn-fees    { background: var(--hhs-gold); color: #1a1a1a; }
.edb-eq-btn-fees:hover    { background: var(--hhs-gold-dark); color: #fff; }
.edb-eq-btn-print   { background: transparent; border: 1.5px solid var(--hhs-border); color: var(--hhs-text-muted); }
.edb-eq-btn-print:hover   { border-color: var(--hhs-primary); color: var(--hhs-primary); }
.edb-eq-btn-creds   { background: var(--hhs-deep); color: #fff; }
.edb-eq-btn-creds:hover   { background: var(--hhs-primary); color: #fff; }
.edb-eq-btn-payment { background: transparent; border: 1.5px solid var(--hhs-border); color: var(--hhs-text-muted); }
.edb-eq-btn-payment:hover { border-color: var(--hhs-primary); color: var(--hhs-primary); }
.edb-eq-btn-del     { background: transparent; border: 1.5px solid #fbb; color: #c0392b; }
.edb-eq-btn-del:hover     { background: #fff0f0; }

.edb-eq-note {
    font-size: 11px; color: var(--hhs-text-muted);
    background: rgba(4,120,87,0.06);
    border-radius: 6px !important; padding: 6px 10px; line-height: 1.45;
    display: flex; align-items: flex-start; gap: 5px;
}
.edb-eq-note i { color: var(--hhs-primary); margin-top: 1px; flex-shrink: 0; }

.edb-eq-remark {
    font-size: 11px; color: #c0392b;
    background: #fff0f0;
    border-radius: 6px !important; padding: 6px 10px;
    display: flex; align-items: flex-start; gap: 5px;
}

@media (max-width: 900px) { .edb-eq-card { width: calc(50% - 10px); } }
@media (max-width: 768px) { .edb-eq-card { width: 100%; max-width: 360px; } }

/* ── 9. Internal Tabs & Forms ───────────────────────────── */
.nav-tabs { border-bottom: 2px solid var(--hhs-border); margin: 0; }
.nav-tabs > li { margin-bottom: -2px; }
.nav-tabs > li > a { 
    color: var(--hhs-text-muted) !important; 
    font-weight: 600; 
    border: none !important;
    border-bottom: 2px solid transparent !important;
    padding: 12px 18px;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
}
.nav-tabs > li > a:hover { color: var(--hhs-primary) !important; background: transparent !important; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover { 
    color: var(--hhs-primary) !important; 
    border-bottom: 2px solid var(--hhs-primary) !important;
    background: transparent !important;
}
.tab-content { padding: 20px; }
.edb-edit-header { margin-bottom: 20px; }
.hhs-edit-card { background: #fff; border-radius: var(--hhs-radius-card); box-shadow: 0 10px 40px rgba(4,120,87,0.08); padding: 24px 32px; }

.hhs-edit-card .btn-warning {
    background: var(--hhs-btn-grad);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    border: none;
    border-radius: var(--hhs-radius-sm) !important;
    padding: 10px 28px;
    box-shadow: 0 4px 18px rgba(16,185,129,0.30);
    transition: opacity 0.2s, transform 0.15s;
}
.hhs-edit-card .btn-warning:hover {
    opacity: 0.91;
    transform: translateY(-1px);
    box-shadow: 0 8px 28px rgba(16,185,129,0.40);
}
.hhs-edit-card .form-control {
    border: 2px solid var(--hhs-border);
    border-radius: var(--hhs-radius-sm) !important;
    background: #f7f9ff;
    height: 46px;
    font-size: 14px;
    box-shadow: none !important;
    color: var(--hhs-text) !important;
}
.hhs-edit-card .form-control:focus {
    border-color: var(--hhs-mid);
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(52,211,153,0.13) !important;
}
.hhs-edit-card label {
    font-size: 12px;
    font-weight: 600;
    color: var(--hhs-text-muted);
    margin-bottom: 6px;
    text-transform: uppercase;
}
.hhs-edit-card h3, .hhs-edit-card legend, .hhs-edit-card .legend {
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    color: var(--hhs-deep);
    font-weight: 700;
    border: none;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ── 19b. Multi-step edit page — student header + tab footer (JNS reference) ── */
.edb-student-header {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--hhs-left-grad);
    border-radius: 14px !important;
    padding: 16px 22px;
    margin-bottom: 18px;
    box-shadow: 0 4px 18px rgba(4,120,87,0.24);
}

.edb-student-header-icon {
    width: 46px;
    height: 46px;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.18);
    border: 1.5px solid rgba(255,255,255,0.30);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 20px;
    flex-shrink: 0;
}

.edb-student-header-name {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.3;
    margin: 0;
}

.edb-student-header-class {
    font-size: 13px;
    color: rgba(255,255,255,0.75);
    margin-top: 2px;
    display: block;
}

.edb-tab-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--hhs-border);
}

.edb-tab-footer .edb-btn-prev { margin-right: auto; }

@media (max-width: 520px) {
    .edb-tab-footer { flex-direction: column-reverse; }
    .edb-tab-footer .edb-btn-next,
    .edb-tab-footer .edb-btn-prev,
    .edb-tab-footer .edb-btn-save { width: 100%; justify-content: center; margin-right: 0; }
}

/* ── 20. Dashboard popup modals (FollowUp / Duplicate / Credentials / Book Slot) ── */
.edb-modal .modal-dialog { margin: 60px auto; }

.edb-modal .modal-content {
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border: 1px solid var(--hhs-glass-border);
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: 0 24px 64px rgba(4,120,87,0.24);
}

.edb-modal .modal-header {
    background: var(--hhs-left-grad);
    border-bottom: none;
    padding: 16px 22px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.edb-modal .modal-title {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px !important;
    font-weight: 700;
    color: #ffffff !important;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.edb-modal .modal-header .close {
    color: #ffffff;
    opacity: 0.75;
    text-shadow: none;
    font-size: 22px;
    margin-top: -2px;
    transition: opacity 0.15s;
}

.edb-modal .modal-header .close:hover,
.edb-modal .modal-header .close:focus { color: #ffffff; opacity: 1; }

.edb-modal .modal-body {
    padding: 22px;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    color: var(--hhs-text);
}

.edb-modal .modal-footer {
    padding: 14px 22px;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    border-top: 1px solid var(--hhs-border);
}

@media (max-width: 560px) {
    .edb-modal .modal-dialog { margin: 20px 12px; }
}

/* ── Previous Academic Details — per-entry card ── */
.edb-prevacad-card {
    border: 1px solid var(--hhs-border);
    border-radius: var(--hhs-radius-card) !important;
    margin-bottom: 20px;
    overflow: hidden;
    background: var(--hhs-card-bg);
    backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    -webkit-backdrop-filter: blur(var(--hhs-glass-blur)) saturate(160%);
    box-shadow: 0 6px 20px rgba(4,120,87,0.06);
    transition: box-shadow 0.2s;
}

.edb-prevacad-card:hover { box-shadow: 0 10px 28px rgba(4,120,87,0.12); }

.edb-prevacad-head {
    background: var(--hhs-left-grad);
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.edb-prevacad-num {
    background: var(--hhs-gold);
    color: #ffffff;
    width: 30px;
    height: 30px;
    border-radius: 50% !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.edb-prevacad-title {
    color: #ffffff;
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    letter-spacing: 0.2px;
}

.edb-prevacad-required {
    background: rgba(192,57,43,0.88);
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 12px;
    border-radius: 20px !important;
    letter-spacing: 0.3px;
}

.edb-prevacad-body { padding: 20px; }

.edb-prevacad-subjects { margin-top: 16px; overflow-x: auto; }

.edb-prevacad-table {
    margin-bottom: 0;
    background: var(--hhs-card-bg);
    border-radius: 12px !important;
    overflow: hidden;
    border: 1px solid var(--hhs-border);
}

.edb-prevacad-table thead tr { background: var(--hhs-left-grad); color: #ffffff; }
.edb-prevacad-table thead th { border-color: rgba(255,255,255,0.3) !important; font-weight: 600; font-size: 12.5px; text-transform: uppercase; letter-spacing: 0.3px; }
.edb-prevacad-table thead th.edb-prevacad-col-num { width: 160px; }
.edb-prevacad-table tbody td { vertical-align: middle; border-color: var(--hhs-border); }
.edb-prevacad-table tbody tr:hover { background: rgba(16,185,129,0.05); }
.edb-prevacad-subject-name { color: var(--hhs-deep); font-weight: 700; }