@charset "utf-8";

/* =========================================================
   BiblePang Common Subpage UI
   앞으로 reading / quiz / typing / memory 등 모든 서브페이지 공용
   ========================================================= */

:root {
    --bps-bg: #F7FAFE;
    --bps-surface: #FFFFFF;
    --bps-surface-soft: #F3F7FC;
    --bps-surface-blue: #EEF5FF;

    --bps-blue: #155EEF;
    --bps-blue-dark: #0B4BD4;
    --bps-blue-soft: #EAF2FF;
    --bps-blue-line: #B5CBED;

    --bps-title: #0B2348;
    --bps-text: #314967;
    --bps-muted: #71839B;

    /* 메인보다 한 단계 선명한 라인 */
    --bps-line: #C8D6E8;
    --bps-line-strong: #AFC2DB;

    --bps-radius-lg: 20px;
    --bps-radius-md: 13px;
    --bps-shadow: 0 10px 28px rgba(28, 65, 117, .07);
}

.bp-subpage {
    width: min(1360px, calc(100% - 40px));
    margin: 0 auto;
    color: var(--bps-text);
}

.bp-subpage-card {
    background: var(--bps-surface);
    border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius-lg);
    box-shadow: var(--bps-shadow);
}

.bp-subpage-kicker {
    color: var(--bps-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.bp-subpage-title {
    color: var(--bps-title);
    font-weight: 900;
}

.bp-subpage-desc {
    color: var(--bps-muted);
}

.bp-subpage button,
.bp-subpage a,
.bp-subpage input,
.bp-subpage select,
.bp-subpage textarea {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

/* Dark mode */
html.bp-dark {
    --bps-bg: #0B1220;
    --bps-surface: #151F2E;
    --bps-surface-soft: #111A29;
    --bps-surface-blue: #162A46;

    --bps-blue: #8FB8FF;
    --bps-blue-dark: #B4CEFF;
    --bps-blue-soft: #182B47;
    --bps-blue-line: #3C5E8F;

    --bps-title: #F1F5FC;
    --bps-text: #D7E1EF;
    --bps-muted: #97A6B9;

    --bps-line: #314156;
    --bps-line-strong: #40536D;

    --bps-shadow: 0 12px 32px rgba(0,0,0,.22);
}

html.bp-dark body {
    background: var(--bps-bg);
}