/* Global auto-scale (connected everywhere except root index.php) */

:root {
    --ui-font-size: 16px;
    --ui-control-scale: 1;
    --ui-gap-scale: 1;
    --ui-card-minh: 240px;
    --ob2-sidebar-scale: 1;
    --ob2-sidebar-font-scale: 1;
}

html {
    font-size: var(--ui-font-size);
}

/* Core controls */
.btn,
.form-control,
.form-select,
.input-group-text,
.badge,
.nav-link,
.dropdown-item,
table th,
table td {
    font-size: calc(1rem * var(--ui-control-scale));
}

/* Common vertical rhythm */
.container,
.container-fluid {
    padding-left: calc(0.75rem * var(--ui-gap-scale));
    padding-right: calc(0.75rem * var(--ui-gap-scale));
}

.row {
    --bs-gutter-x: calc(1.5rem * var(--ui-gap-scale));
}

/* Cards/grids used in dashboard, students, grades, schedule, library */
.homework-grid,
.games-grid,
.pattern-grid {
    gap: calc(1.5rem * var(--ui-gap-scale));
    padding: calc(1.5rem * var(--ui-gap-scale));
}

.homework-card,
.add-card,
.game-card {
    min-height: var(--ui-card-minh);
}

/* Top navigation chips and toolbars */
.program-subtabs .nav-link,
.homework-toolbar .btn,
.homework-toolbar .form-control,
.homework-toolbar .form-select {
    transform-origin: left center;
}

/* Medium desktop */
@media (max-width: 1536px) {
    :root {
        --ui-font-size: 15px;
        --ui-control-scale: 0.98;
        --ui-gap-scale: 0.96;
        --ui-card-minh: 228px;
        --ob2-sidebar-scale: 0.96;
        --ob2-sidebar-font-scale: 0.96;
    }
}

/* 1366x768 baseline */
@media (max-width: 1366px) {
    :root {
        --ui-font-size: 14px;
        --ui-control-scale: 0.95;
        --ui-gap-scale: 0.9;
        --ui-card-minh: 212px;
        --ob2-sidebar-scale: 0.9;
        --ob2-sidebar-font-scale: 0.92;
    }
}

/* 1280x720 */
@media (max-width: 1280px) {
    :root {
        --ui-font-size: 13.5px;
        --ui-control-scale: 0.93;
        --ui-gap-scale: 0.86;
        --ui-card-minh: 198px;
        --ob2-sidebar-scale: 0.84;
        --ob2-sidebar-font-scale: 0.88;
    }
}

/* Narrow laptop / tablet */
@media (max-width: 1024px) {
    :root {
        --ui-font-size: 13px;
        --ui-control-scale: 0.9;
        --ui-gap-scale: 0.8;
        --ui-card-minh: 182px;
        --ob2-sidebar-scale: 0.76;
        --ob2-sidebar-font-scale: 0.84;
    }
}

/* Low-height screens (important for 1366x768 with browser chrome) */
@media (max-height: 820px) {
    :root {
        --ui-font-size: 14px;
        --ui-control-scale: 0.94;
        --ui-gap-scale: 0.88;
        --ui-card-minh: 200px;
        --ob2-sidebar-scale: 0.88;
        --ob2-sidebar-font-scale: 0.9;
    }
}

@media (max-height: 740px) {
    :root {
        --ui-font-size: 13px;
        --ui-control-scale: 0.9;
        --ui-gap-scale: 0.8;
        --ui-card-minh: 184px;
        --ob2-sidebar-scale: 0.78;
        --ob2-sidebar-font-scale: 0.84;
    }
}