/* Gemeinsame Layout-Korrekturen. Nach den bisherigen Seitenstilen laden.
   Farben, Komponenten und Seiteninhalte bleiben in ihren jeweiligen Dateien. */
html {
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: 88px;
}
body.oscar-page {
    min-height: 100vh;
    min-height: 100svh;
    /* Auf Mobilgeraeten folgt das Motiv der ganzen Seite. */
    background-attachment: scroll;
    background-position: center top;
    background-size: cover;
}
@media (min-width: 1101px) {
    /* Desktop: Motiv am Fenster ausrichten, damit lange Seiten es nicht vergroessern.
       Der Body-Hintergrund bleibt beim Scrollen bis zum Footer sichtbar. */
    body.oscar-page {
        background-attachment: fixed;
        background-position: center center;
    }
}
body.oscar-page table.mainTab {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
    table-layout: fixed;
    border-spacing: 0;
}
body.oscar-page table.mainTab > tbody > tr > td[width="200"] { width: 305px; }
body.oscar-page table.mainTab > tbody > tr > td[width="50"] { width: 16px; }
body.oscar-page table.mainTab > tbody > tr > td[valign="top"]:last-child {
    min-width: 0;
    padding-right: clamp(20px, 2.5vw, 40px);
}
.oscar-page :is(.dashboard-wrapper, .frosted-glass-card, .form-col, .info-col,
    .form-group, .flex-half, .toolbar-left, .toolbar-center, .toolbar-right,
    .sim-content, .drivebase-copy, .modal-title-box) { min-width: 0; }
.oscar-page .dashboard-wrapper { padding-right: 0; }
.oscar-page :is(.split-grid, .form-columns, .info-columns, .cars-grid, .main-grid) > * { min-width: 0; }
.oscar-page :is(.card-header-flex, .cockpit-header, .dashboard-heading) { flex-wrap: wrap; gap: 12px; }
.oscar-page :is(.card-title, .welcome-hero, .panel-title) {
    max-width: 100%;
    overflow-wrap: anywhere;
}
.oscar-page :is(.news-board, .info-value, .drivebase-copy, .sim-desc) { overflow-wrap: anywhere; }
.oscar-page :is(input, select, textarea) { max-width: 100%; }
.oscar-page :is(button, a, label, select) { touch-action: manipulation; }
.oscar-page :is(button, a, input, select, textarea):focus-visible {
    outline: 3px solid #93c5fd;
    outline-offset: 3px;
}
.oscar-page :is(.table-container, .cal-wrapper) {
    max-width: 100%;
    min-width: 0;
    overscroll-behavior-x: contain;
}
.oscar-page .table-container { overflow-x: auto; }
.oscar-page .table-container table { table-layout: auto; }
.oscar-page[data-page="students"] .footer-area { margin-left: 0; }
.oscar-page :is(.modal-box, .preview-modal, #waitlistBox) {
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
}
.oscar-page :is(.modal-header, .preview-header) { min-width: 0; }
.oscar-page :is(.modal-avatar, .preview-close) { flex-shrink: 0; }
.oscar-page :is(.modal-title, .preview-header h3) { white-space: normal; overflow-wrap: anywhere; }
.oscar-page .modal-footer { flex-wrap: wrap; gap: 10px; }
.oscar-page .drivebase-card { margin-bottom: 0; }
.oscar-page .student-theory-session { min-width: 0 !important; }
.oscar-page .student-theory-content { min-width: 0; }
.oscar-page .student-theory-row { flex-wrap: wrap; gap: 6px 12px; }
.oscar-page :is(.calendar-scroll-hint, .table-scroll-hint) { display: none; }
.oscar-page .cal-body { min-height: 720px; }
.oscar-page .cal-time-labels { position: sticky; left: 0; z-index: 8; background-color: #0c1727; }
.oscar-page .cal-time-col { position: sticky; left: 0; z-index: 8; background-color: #121e32; }

/* Bei geringer Fensterhoehe muss die ganze Seite erreichbar bleiben. */
@media (min-width: 1101px) and (max-height: 700px) {
    body.oscar-page { height: auto; overflow-y: auto; }
    .oscar-page .frosted-glass-card { height: auto; max-height: none; }
    .oscar-page :is(.form-scroll-area, .info-scroll-area, .theme-scroll-area,
        .cars-scroll-area, .teacher-list-container, .table-container) {
        height: auto;
        max-height: none;
        overflow-y: auto;
    }
}

/* Einheitlicher Wechsel zur seitlichen Navigation, auch fuer Tablets. */
@media (max-width: 1100px) {
    body.oscar-page {
        position: static;
        height: auto;
        overflow-y: auto;
    }
    body.oscar-page table.mainTab,
    body.oscar-page table.mainTab > tbody,
    body.oscar-page table.mainTab > tbody > tr {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
    }
    body.oscar-page table.mainTab > tbody > tr > td[width="200"] {
        display: block !important;
        width: 100% !important;
        height: 0 !important;
        padding: 0 !important;
        overflow: visible;
    }
    body.oscar-page table.mainTab > tbody > tr > td[width="50"] { display: none !important; }
    body.oscar-page table.mainTab > tbody > tr > td[valign="top"]:last-child {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        padding: 90px max(20px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)) !important;
    }
    .oscar-page .frosted-glass-card {
        width: 100%;
        height: auto !important;
        min-height: 0;
        max-height: none !important;
        padding: clamp(18px, 3vw, 28px) !important;
    }
    .oscar-page :is(.form-scroll-area, .info-scroll-area, .theme-scroll-area,
        .cars-scroll-area, .teacher-list-container, .table-container) {
        height: auto;
        max-height: none;
        overflow-y: visible;
        padding-right: 0;
    }
    .oscar-page .table-container { overflow-x: auto !important; overflow-y: auto; }
    .oscar-page #calForm { min-height: 0; height: auto; }
    .oscar-page .card-title { font-size: clamp(1.5rem, 3.5vw, 2.1rem); gap: 10px; }
    .oscar-page .card-title i { font-size: 1em; flex-shrink: 0; }
    .oscar-page .welcome-hero { font-size: clamp(2rem, 5vw, 3rem); }
    .oscar-page :is(.calendar-scroll-hint, .table-scroll-hint) { display: block; color: #cbd5e1; font-size: .85rem; margin: 0 0 10px; }
    body.oscar-page .mobile-menu-toggle {
        top: max(20px, env(safe-area-inset-top));
        left: max(20px, env(safe-area-inset-left));
    }
    body.oscar-page .autobahn-menu {
        width: min(290px, calc(100vw - 32px));
        height: 100dvh;
        padding-top: max(90px, calc(env(safe-area-inset-top) + 75px));
        padding-bottom: max(24px, env(safe-area-inset-bottom));
        overscroll-behavior-y: contain;
    }
}
@media (min-width: 701px) and (max-width: 1100px) {
    .oscar-page .split-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .oscar-page :is(.form-columns, .info-columns) { flex-direction: row; gap: 24px; }
    .oscar-page :is(.form-col, .info-col) { flex: 1 1 0; }
}
@media (max-width: 700px) {
    .oscar-page :is(.form-columns, .info-columns) { flex-direction: column; gap: 24px; }
    .oscar-page :is(.split-grid, .main-grid, .cars-grid) { grid-template-columns: minmax(0, 1fr); }
    .oscar-page :is(.search-box, .sort-box) { width: 100%; min-width: 0; }
    .oscar-page :is(.search-box input, .sort-box select) { width: 100%; min-width: 0; }
    .oscar-page .student-theory-session { flex-direction: column; align-items: stretch !important; gap: 14px !important; padding: 16px !important; }
    .oscar-page .student-theory-flag { width: auto !important; height: auto !important; flex-direction: row !important; gap: 8px; padding: 8px 12px !important; align-self: flex-start; }
    .oscar-page .student-theory-flag > span { margin: 0 !important; }
    .oscar-page .student-theory-row { padding: 10px 12px !important; }
    .oscar-page .student-theory-row > span { white-space: nowrap; }
    .oscar-page .drivebase-card { padding: 20px; }
    .oscar-page :is(.modal-header, .modal-body, .preview-header, .preview-body) { padding: 18px; }
    .oscar-page .modal-title { font-size: 1.2rem; }
    .oscar-page .modal-avatar { width: 48px; height: 48px; }
    .oscar-page :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) { font-size: 16px; }
}
@media (max-width: 380px) {
    body.oscar-page table.mainTab > tbody > tr > td[valign="top"]:last-child { padding-right: 12px !important; padding-left: 12px !important; }
    .oscar-page .frosted-glass-card { padding: 16px !important; }
    .oscar-page :is(.glass-panel, .ticket-card) { padding: 18px; }
    .oscar-page .toolbar-right { flex-wrap: wrap; }
    .oscar-page .toolbar-right > div { flex: 1 1 180px; min-width: 0; }
    .oscar-page .toolbar-right select { flex: 1; }
}
@media (pointer: coarse), (max-width: 700px) {
    .oscar-page :is(.btn-action, .btn-primary, .btn-add, .btn-scan, .action-btn,
        .master-btn, .ticket-plan-btn, .pill-btn, .theme-actions button,
        .preview-close, .magnet-btn, .calendar-trigger-box, .date-nav > a) { min-height: 44px; }
    .oscar-page :is(.preview-close, .magnet-btn, .calendar-trigger-box, .date-nav > a) { min-width: 44px; }
}
@media (hover: none) {
    .oscar-page :is(.teacher-item-link, .appt-block, .btn-action, .btn-primary, .action-btn):hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .oscar-page *, .oscar-page *::before, .oscar-page *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}