/* Student Portal 3.2.9 — student dashboard matched to the FAQ visual language. */
.sp-student-dashboard {
    --sp329-black: #151515;
    --sp329-emerald: #123b37;
    --sp329-mint: #b8dcd8;
    --sp329-beige: #fff6e7;
    --sp329-line: #d8d5cc;
    color: var(--sp329-black) !important;
}

/* 3.3.5 final non-overridable dashboard colour contract. */
body .sp-student-dashboard #sp-dashboard-lessons {
    background: #e8e0f2 !important;
}
body .sp-student-dashboard #sp-dashboard-lessons .sp-dashboard-lesson {
    background: #fff !important;
}
body .sp-student-dashboard #sp-dashboard-hours {
    background: #b8dcd8 !important;
}
body .sp-student-dashboard #sp-dashboard-hours :is(.sp-dashboard-details,.sp-dashboard-details>summary,.sp-dashboard-details[open]>summary,.sp-dashboard-details-state) {
    background: #fff !important;
}
body .sp-student-dashboard #sp-waitlist {
    background: #fff6e7 !important;
}
body .sp-student-dashboard #sp-dashboard-payment > .sp-month-payment > form > button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    margin: 22px auto 0 !important;
}
body .sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy),
body .sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy) * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* No purple copy: regular copy is black; emerald actions carry white copy. */
.sp-student-dashboard :is(h1,h2,h3,h4,h5,h6,p,span,strong,small,label,summary,a,li,dt,dd,em,b) {
    color: var(--sp329-black) !important;
    -webkit-text-fill-color: var(--sp329-black) !important;
}

.sp-student-dashboard :is(button,[type="submit"],.sp-dashboard-class-cta,.sp-calendar-sync-button--copy) {
    border-color: var(--sp329-emerald) !important;
    background: var(--sp329-emerald) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

.sp-student-dashboard :is(button,[type="submit"],.sp-dashboard-class-cta,.sp-calendar-sync-button--copy) * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* FAQ-style centred section navigation. */
.sp-student-dashboard .sp-dashboard-jump {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 auto 26px !important;
    padding: 10px !important;
    border: 0 !important;
    border-radius: 25px !important;
    background: var(--sp329-beige) !important;
    box-shadow: 0 10px 30px rgba(18,59,55,.06) !important;
    overflow: visible !important;
}

.sp-student-dashboard .sp-dashboard-jump > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    min-width: 0 !important;
    padding: 9px 16px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f1da89 !important;
    color: var(--sp329-black) !important;
    -webkit-text-fill-color: var(--sp329-black) !important;
    text-align: center !important;
    text-decoration: none !important;
}

.sp-student-dashboard .sp-dashboard-jump > a:is(:hover,:focus-visible) {
    border-color: transparent !important;
    background: #f1da89 !important;
    color: var(--sp329-black) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Nearest lessons: mint section, white lesson cards. */
.sp-student-dashboard .sp-dashboard-overview {
    background: #e8e0f2 !important;
}

.sp-student-dashboard .sp-dashboard-overview .sp-dashboard-lesson {
    border-color: rgba(18,59,55,.15) !important;
    background: #fff !important;
    color: var(--sp329-black) !important;
}

/* Subscription: beige shell and visibly different open/closed states. */
.sp-student-dashboard .sp-dashboard-subscription {
    background: var(--sp329-mint) !important;
}

.sp-student-dashboard .sp-dashboard-details {
    border: 1px solid rgba(18,59,55,.13) !important;
    border-radius: 19px !important;
    background: rgba(255,255,255,.62) !important;
    overflow: hidden !important;
}

.sp-student-dashboard .sp-dashboard-details > summary {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto 38px !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 64px !important;
    margin: 0 !important;
    padding: 13px 15px 13px 18px !important;
    border: 0 !important;
    border-radius: 19px !important;
    background: #fff !important;
    list-style: none !important;
}

.sp-student-dashboard .sp-dashboard-details[open] > summary {
    margin: 0 0 18px !important;
    border-bottom: 1px solid rgba(18,59,55,.13) !important;
    border-radius: 19px 19px 0 0 !important;
    background: #fff !important;
}

.sp-student-dashboard .sp-dashboard-details > summary::-webkit-details-marker,
.sp-student-dashboard .sp-freeze-request-details > summary::-webkit-details-marker {
    display: none !important;
}

.sp-student-dashboard .sp-dashboard-details-state {
    padding: 6px 10px !important;
    border-radius: 999px !important;
    background: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

/* Useful links: exact brand sequence, with black primary and secondary copy. */
.sp-student-dashboard .sp-dashboard-navigation-grid > a,
.sp-student-dashboard .sp-dashboard-navigation-grid > a.sp-dashboard-class-cta {
    border: 0 !important;
    background: #e8e0f2 !important;
    color: var(--sp329-black) !important;
    -webkit-text-fill-color: var(--sp329-black) !important;
    box-shadow: none !important;
}

.sp-student-dashboard .sp-dashboard-navigation-grid > a *,
.sp-student-dashboard .sp-dashboard-navigation-grid > a.sp-dashboard-class-cta * {
    color: var(--sp329-black) !important;
    -webkit-text-fill-color: var(--sp329-black) !important;
}

.sp-student-dashboard .sp-dashboard-navigation-grid > a:is(:hover,:focus-visible) {
    border: 0 !important;
    background: #e8e0f2 !important;
    color: var(--sp329-black) !important;
    transform: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(1),
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(1):is(:hover,:focus-visible) { background:#e8e0f2 !important; }
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(2),
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(2):is(:hover,:focus-visible) { background:#f1da89 !important; }
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(3),
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(3):is(:hover,:focus-visible) { background:#fff6e7 !important; }
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(4),
.sp-student-dashboard .sp-dashboard-navigation-grid > a:nth-child(4):is(:hover,:focus-visible) { background:#b8dcd8 !important; }

.sp-student-dashboard .sp-dashboard-details,
.sp-student-dashboard .sp-dashboard-details > summary,
.sp-student-dashboard .sp-dashboard-details[open] > summary {
    background: #fff !important;
}

.sp-student-dashboard .sp-dashboard-details-state--open {
    display: none !important;
}

.sp-student-dashboard .sp-dashboard-details[open] .sp-dashboard-details-state--closed {
    display: none !important;
}

.sp-student-dashboard .sp-dashboard-details[open] .sp-dashboard-details-state--open {
    display: inline-flex !important;
}

/* Draw a clean centred chevron: no glyph dot and no font-metric drift. */
.sp-student-dashboard .sp-dashboard-details > summary::after,
.sp-student-dashboard .sp-freeze-request-details > summary::after {
    content: "" !important;
    position: static !important;
    display: block !important;
    place-self: center !important;
    width: 10px !important;
    height: 10px !important;
    margin: 0 !important;
    border: 0 !important;
    border-right: 2px solid var(--sp329-black) !important;
    border-bottom: 2px solid var(--sp329-black) !important;
    border-radius: 0 !important;
    background: transparent !important;
    transform: translateY(-2px) rotate(45deg) !important;
    transform-origin: center !important;
}

.sp-student-dashboard .sp-dashboard-details[open] > summary::after,
.sp-student-dashboard .sp-freeze-request-details[open] > summary::after {
    transform: translateY(2px) rotate(225deg) !important;
}

.sp-student-dashboard .sp-freeze-request-details > summary {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 38px !important;
    align-items: center !important;
    min-height: 58px !important;
    padding: 12px 12px 12px 17px !important;
    color: var(--sp329-black) !important;
}

.sp-student-dashboard .sp-dashboard-freeze,
.sp-student-dashboard .sp-dashboard-freeze > .student-dashboard-card {
    background: var(--sp329-mint) !important;
}

.sp-student-dashboard .sp-calendar-sync-reset {
    display: flex !important;
    justify-content: center !important;
    margin: 18px auto 0 !important;
}

.sp-student-dashboard .sp-calendar-sync-reset > button {
    margin: 0 auto !important;
}

.sp-student-dashboard .sp-waitlist {
    background: var(--sp329-beige) !important;
}

/* Keep the white disclosure content visibly separate from the important notice. */
.sp-student-dashboard #sp-dashboard-hours .sp-dashboard-payment-notice {
    display: block !important;
    clear: both !important;
    margin-top: 32px !important;
}

/* Dark buttons always use white labels; no flashing or hover movement. */
.sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy),
.sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy) * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    animation: none !important;
    transition: none !important;
}

.sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy):is(:hover,:focus,:active) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
}

/* Final colour lock: every genuinely dark dashboard action uses pure white type. */
body .sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy,.sp-pair-class-link),
body .sp-student-dashboard :is(button,[type="submit"],.sp-calendar-sync-button--copy,.sp-pair-class-link) :is(span,strong,small,b,em),
body .sp-student-dashboard [style*="background:#123b37"],
body .sp-student-dashboard [style*="background:#123b37"] *,
body .sp-student-dashboard [style*="background: #123b37"],
body .sp-student-dashboard [style*="background: #123b37"] * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

.sp-student-dashboard :is(.sp-calendar-sync-button--apple,.sp-calendar-sync-button--google) {
    color: var(--sp329-black) !important;
    -webkit-text-fill-color: var(--sp329-black) !important;
}

.sp-student-dashboard #sp-dashboard-payment .sp-pair-payments > h3,
.sp-student-dashboard #sp-dashboard-payment .sp-pair-payments form > button {
    display: none !important;
}

.sp-student-dashboard .sp-pair-payment-choices {
    display: grid !important;
    gap: 12px !important;
    margin-top: 22px !important;
    padding-top: 20px !important;
    border-top: 1px solid rgba(18,59,55,.16) !important;
}

.sp-student-dashboard .sp-pair-payment-choices article {
    display: grid !important;
    grid-template-columns: minmax(150px,.7fr) minmax(220px,1fr) auto auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 15px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.78) !important;
}

.sp-student-dashboard .sp-pair-payment-choices article > div {
    display: grid !important;
    gap: 4px !important;
}

/* Nothing sticks to a neighbouring control or card. */
.sp-student-dashboard :is(form,details,section,article) > button,
.sp-student-dashboard form > :is(button,[type="submit"]),
.sp-student-dashboard .sp-calendar-sync-actions,
.sp-student-dashboard .sp-pair-choice,
.sp-student-dashboard .sp-subscription-pair-tools {
    margin-top: 12px !important;
}

.sp-student-dashboard :is(.sp-calendar-sync-actions,.sp-dashboard-navigation-grid,.sp-dashboard-lessons,.sp-dashboard-subscription-stats) {
    gap: 12px !important;
}

.sp-student-dashboard :is(button,[type="submit"],a.sp-calendar-sync-button) {
    min-height: 44px !important;
    padding-inline: 16px !important;
}

@media (max-width: 700px) {
    .sp-student-dashboard .sp-dashboard-jump {
        justify-content: stretch !important;
    }

    .sp-student-dashboard .sp-dashboard-jump > a {
        flex: 1 1 calc(50% - 5px) !important;
    }

    .sp-student-dashboard .sp-dashboard-details > summary {
        grid-template-columns: minmax(0,1fr) 34px !important;
    }

    .sp-student-dashboard .sp-dashboard-details-state {
        grid-column: 1 !important;
        width: max-content !important;
    }

    .sp-student-dashboard .sp-dashboard-details > summary::after {
        grid-column: 2 !important;
        grid-row: 1 / span 2 !important;
    }

    .sp-student-dashboard .sp-pair-payment-choices article {
        grid-template-columns: 1fr auto !important;
    }

    .sp-student-dashboard .sp-pair-payment-choices article > label,
    .sp-student-dashboard .sp-pair-payment-choices article > div {
        grid-column: 1 / -1 !important;
    }
}
