/* filepath: static/css/utils/desktop-zoom-fix.css */
/*
Desktop Zoom Fix (aditivní override vrstva)
=========================================

ÚČEL:
- Přidat podporu pro browser zoom na DESKTOPU (50%–200%) bez rozbití baseline vzhledu.

KONTEXT:
- Projekt používá hodně `vw` pro font-size/padding/margins.
- Browser zoom mění efektivní viewport → čisté `vw` se chová opačně než uživatel čeká:
  - Zoom IN: text je menší
  - Zoom OUT: text je větší a může přetékat

JAK:
- Tento soubor je aditivní a načítá se jako úplně poslední stylesheet.
- Aktivuje se jen mimo baseline rozsah viewportu:
  - Zoom IN:  pod 1400px (efektivní viewport)
  - Zoom OUT: nad 2200px
- Nikdy nezasahuje do mobilních režimů: `:not(.mobile-interface):not(.mobile-base-mode)`
- Používá vysokou specificitu a `!important`.

BASELINE MUSÍ ZŮSTAT 100% STEJNÝ:
1) Desktop 1920×1080 @ 100% zoom
2) Desktop 1536×864 @ 100% zoom
3) Mobil 390×844
4) Jakýkoli .mobile-interface / .mobile-base-mode
*/

/* =========================================================
   ZOOM IN – MÍRNÝ (max-width: 1399px, min-width: 1000px)
   ========================================================= */
@media screen and (max-width: 1399px) and (min-width: 1000px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    font-size: clamp(1.75rem, 3.8vw, 3.5rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h2 {
    font-size: clamp(1.25rem, 2vw, 2.25rem) !important;
  }

  /* Home: dlouhý podnadpis v `.headline-container` má vlastní baseline (`--home-headline-font-size`).
     Při zoom-in ho nechceme zmenšovat → přidáme bezpečný min limit. */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .headline-container h2 {
    font-size: clamp(1.3rem, var(--home-headline-font-size), 2.25rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: clamp(1rem, 4vw, 4rem) !important;
    padding-right: clamp(1rem, 4vw, 4rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container .nav-button,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav .nav-button {
    font-size: clamp(1rem, 1.3vw, 1.4rem) !important;
    padding: clamp(0.35rem, 0.6vw, 0.6rem) clamp(0.4rem, 0.7vw, 0.7rem) !important;
  }

  /* #zebricky-page */
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .rankings-nav {
    /* Baseline v `pages/zebricky.css` je `flex-wrap: nowrap` + `overflow-x: auto`.
       Wrap nám dělá druhý řádek a „široký pás“ (poslední karta přes celou šířku). */
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: clamp(0.35rem, 0.8vw, 1rem) !important;
  }
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .rankings-nav a {
    /* Baseline: font-size 1.3vw; padding 0.8vw 1.5vw */
    font-size: clamp(0.9rem, 1.3vw, 1.1rem) !important;
    padding: clamp(0.45rem, 0.8vw, 0.8rem) clamp(0.7rem, 1.5vw, 1.2rem) !important;
  }

  /* POZOR: Na #zebricky-page má desktop layout vlastní řízení (`static/css/pages/zebricky.css`)
     včetně gridu pro `.rankings-filters` a absolutního panelu `.logos-sidebar`.
     V mírném zoom-in režimu nechceme měnit rozložení „hlavních karet“ (filtry + export/logo panel). */

  /* #discipliny-page */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper {
    flex-wrap: wrap !important;
  }
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-categories {
    flex: 1 1 100% !important;
  }
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper {
    flex: 1 1 100% !important;
    flex-direction: row !important;
    justify-content: center !important;
  }

  /* #odkazy-page */
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .odkazy-container {
    flex-wrap: wrap !important;
  }
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .odkazy-sloupec {
    flex: 1 1 280px !important;
  }
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .oddeleni-cary {
    display: none !important;
  }

  /* #zaci-page a #trida-page */
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .seznam-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .seznam-container {
    flex-wrap: wrap !important;
  }
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .sloupec,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .sloupec {
    flex: 1 1 300px !important;
  }
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .oddeleni,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .oddeleni {
    display: none !important;
  }

  /* #detail-zaka-page */
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper {
    flex-wrap: wrap !important;
  }

  /* #trida-detail-page */
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero {
    flex-wrap: wrap !important;
  }

  /* Tabulky */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .table-responsive {
    overflow-x: auto !important;
  }
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) table,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) table {
    font-size: clamp(0.75rem, 1vw, 0.95rem) !important;
  }
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) td,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) th,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) td {
    padding: clamp(0.3rem, 0.6vw, 0.6rem) !important;
  }

  /* Info boxy */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide),
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .info-box-style:not(.hk-explain-full),
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .rank-explain-full:not(.hk-allow-wide) {
    max-width: min(90vw, 500px) !important;
    max-height: 70vh !important;
    overflow: auto !important;
  }
}

/* =========================================================
   ZOOM IN – BĚŽNÝ (detekce přes DPI / devicePixelRatio)
   =========================================================

  Problém: při 110–150% zoomu je efektivní šířka často stále ~1500–1900px,
  takže se nespustí naše „zoom-in“ breakpointy (≤ 1399px).
  Na stránce Disciplíny pak levé barevné karty (selecty) působí zbytečně úzce.

  Řešení: cílit jen na skutečný zoom (vyšší DPI), aby se NIKDY neměnil baseline
  vzhled na 1920×1080 a 1536×864 při 100% zoomu.
*/
/* Pozn.: prohlížeče (Chrome/Brave) typicky mění `devicePixelRatio` při browser zoomu.
   `dppx` je spolehlivější než `dpi` (které se na některých konfiguracích nechová očekávaně). */
@media screen and (min-width: 900px) and (min-resolution: 1.02dppx),
  screen and (min-width: 900px) and (-webkit-min-device-pixel-ratio: 1.02) {
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) {
    /* Baseline v `pages/discipliny.css`: 55% / 38%.
       Při zoom-in přidáme šířku levému sloupci a ubereme pravému. */
    /* 1) Víc reálné šířky stránky (jinak ji "sežere" max-width + left margin). */
    --discipline-wrapper-max-width: 96vw !important;
    --discipline-wrapper-margin-left: 2vw !important;

    /* 2) Levé barevné karty (selecty) – výrazně širší. */
    --discipline-categories-width: 82% !important;
    --discipline-categories-margin-left: -2vw !important;

    /* 3) Pravé logo/side prvky – uvolnit místo (loga se mohou víc "stlačit"). */
    --discipline-side-logos-width: 18% !important;
  }

  /* Export/Metodika boxy nahoře vpravo - plná šířka pravého sloupce. */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-intro.discipline-export-highlight {
    width: 100% !important;
    max-width: none !important;
  }

  /* Menší mezera mezi sloupci (pomůže dorazit levé karty k "hraně"). */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper {
    gap: 1vw !important;
  }
}

/* =========================================================
   ZOOM IN – STŘEDNÍ (max-width: 999px, min-width: 768px)
   ========================================================= */
@media screen and (max-width: 999px) and (min-width: 768px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    font-size: clamp(1.5rem, 4vw, 2.5rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h2 {
    font-size: clamp(1.1rem, 2.8vw, 1.75rem) !important;
  }

  /* Home: dlouhý podnadpis v `.headline-container` – při silnějším zoom-in (efektivně <1000px)
     držet čitelnost a nepouštět font příliš nízko. */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .headline-container h2 {
    font-size: clamp(1.25rem, var(--home-headline-font-size), 1.75rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav {
    flex-wrap: wrap !important;
    gap: 0.25rem !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container a,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a {
    font-size: clamp(0.7rem, 1.3vw, 0.9rem) !important;
    padding: 0.35rem 0.5rem !important;
  }

  /* Vyhledávací tlačítko (<form>) – STEJNÉ rozměry jako <a> nav buttons */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav form.nav-button.search-nav-button {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 77px !important;
    min-height: 77px !important;
    max-height: 77px !important;
    padding: 0.35rem 0.5rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border-radius: 0 0 8px 8px !important;
  }

  /* Nav nesmí zalamovat – na tabletu chceme jeden řádek */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav {
    flex-wrap: nowrap !important;
    gap: 2px !important;
    align-items: stretch !important;
  }

  /* <a> nav buttons – stejná výška a flex jako search */
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav a.nav-button {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 77px !important;
    min-height: 77px !important;
    max-height: 77px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border-radius: 0 0 8px 8px !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .content-with-sidebar,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .student-detail-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .class-hero {
    flex-direction: column !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .student-logo,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .class-logo {
    order: 99 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  /* Výjimka pro #trida-detail-page (iPad/tablet):
     horní layout musí zůstat jako 3 sloupce (tabulka | logo | tabulka),
     bez odsunu loga do levého/dolního toku. */
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-hero {
    display: grid !important;
    grid-template-columns:
      minmax(200px, 320px)
      minmax(180px, 280px)
      minmax(250px, 380px) !important;
    column-gap: 1rem !important;
    row-gap: 1.25rem !important;
    align-items: start !important;
    justify-content: space-between !important;
    flex-direction: initial !important;
    width: 100% !important;
  }

  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-info-wrapper {
    grid-column: 1 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
  }

  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-logo,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-logo.student-logo {
    grid-column: 2 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
    display: block !important;
    justify-content: initial !important;
    position: relative !important;
    top: 0 !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto !important;
    min-width: 180px !important;
    max-width: 280px !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: start !important;
    justify-self: center !important;
  }

  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-logo img {
    display: block !important;
    max-width: 100% !important;
    max-height: 200px !important;
    visibility: visible !important;
    opacity: 0.95 !important;
  }

  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-grade-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) #class-detail-root .class-grade-box > .grading-table-container {
    margin: 0 !important;
    width: auto !important;
    align-self: start !important;
    justify-self: end !important;
  }

  /* Dodatečná výjimka pro #trida-detail-page BEZ podmínky :not(.mobile-interface) 
     - zajistí, že tablet layout funguje i když body má třídu mobile-base-mode
     - upraveno: širší první sloupec, logo posunuto níže a zvětšeno */
  html body#trida-detail-page #class-detail-root .class-hero {
    display: grid !important;
    grid-template-columns:
      minmax(220px, 340px)
      minmax(200px, 300px)
      minmax(250px, 380px) !important;
    column-gap: 0.8rem !important;
    row-gap: 1.25rem !important;
    align-items: start !important;
    justify-content: space-between !important;
    flex-direction: initial !important;
    width: 100% !important;
  }

  html body#trida-detail-page #class-detail-root .class-info-wrapper {
    grid-column: 1 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
  }

  html body#trida-detail-page #class-detail-root .class-logo,
  html body#trida-detail-page #class-detail-root .class-logo.student-logo {
    grid-column: 2 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
    display: block !important;
    justify-content: initial !important;
    position: relative !important;
    top: 0 !important;
    left: auto !important;
    transform: none !important;
    margin: 2rem auto 0 auto !important;
    min-width: 200px !important;
    max-width: 320px !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: start !important;
    justify-self: center !important;
  }

  html body#trida-detail-page #class-detail-root .class-logo img {
    display: block !important;
    max-width: 100% !important;
    max-height: 230px !important;
    visibility: visible !important;
    opacity: 0.95 !important;
  }

  html body#trida-detail-page #class-detail-root .class-grade-box {
    grid-column: 3 !important;
    grid-row: 1 !important;
    order: initial !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body#trida-detail-page #class-detail-root .class-grade-box > .grading-table-container {
    margin: 0 !important;
    width: auto !important;
    align-self: start !important;
    justify-self: end !important;
  }
}

/* =========================================================
   ZOOM IN – SILNÝ (max-width: 767px)
   ========================================================= */
@media screen and (max-width: 767px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) {
    padding: 0.5rem !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    font-size: 1.5rem !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

/* =========================================================
   ZOOM OUT – MÍRNÉ (min-width: 2200px)
   ========================================================= */
@media screen and (min-width: 2200px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    font-size: clamp(2rem, 3vw, 3.5rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h2 {
    font-size: clamp(1.5rem, 2vw, 2.5rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode),
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) {
    padding-left: clamp(1rem, 2vw, 2.5rem) !important;
    padding-right: clamp(1rem, 2vw, 2.5rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-container {
    max-width: 1800px !important;
    margin: 0 auto !important;
  }
}

/* =========================================================
   ZOOM OUT – STŘEDNÍ (min-width: 2600px)
   ========================================================= */
@media screen and (min-width: 2600px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    font-size: clamp(2rem, 2.6vw, 3.1rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h2,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h2 {
    font-size: clamp(1.4rem, 1.8vw, 2.1rem) !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-container {
    max-width: 1700px !important;
    margin: 0 auto !important;
  }
}

/* =========================================================
   ZOOM OUT – SILNÉ (min-width: 3000px)
   ========================================================= */
@media screen and (min-width: 3000px) {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .page-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .content-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .page-container {
    max-width: 1600px !important;
    margin: 0 auto !important;
  }
}

/* =========================================================
   TISK
   ========================================================= */
@media print {
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) h1,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) h1 {
    position: static !important;
  }

  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .top-nav-container,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .main-nav,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .logos-sidebar,
  html body#home-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#zebricky-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#detail-discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#zaci-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#trida-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#trida-detail-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#detail-zaka-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#odkazy-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#vyhledani-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#admin-section-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#sprava-skol-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper,
  html body#login-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper {
    display: none !important;
  }
}

/* =========================================================
   DISCIPLINY PAGE - SIROKE BAREVNE KARTY NA DESKTOPU
   =========================================================
   Primy override - aplikuje se vzdy na desktopu (min-width: 900px).
   Pouzivame primo width misto CSS promennych.
*/
@media screen and (min-width: 900px) {
  /* Info box nahore - zarovnani */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-intro.odkazy-intro {
    width: 50vw !important;
    max-width: 50vw !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  /* Content wrapper - zrusit negativni margin, aby karty byly hned pod info boxem */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-content-wrapper {
    margin-top: 1vw !important;
    gap: 2vw !important;
  }

  /* Leve barevne karty (Atletika, Olympijsky viceboj, ...) - zarovnane s info boxem */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-categories {
    width: 50vw !important;
    max-width: 50vw !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
  }

  /* Jednotlive radky kategorii - rozsirit na plnou sirku */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-category-row {
    width: 100% !important;
    min-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Prave boxy (Export, Metodika) - plna sirka praveho sloupce */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-intro.discipline-export-highlight {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /* Side loga - plna sirka praveho sloupce, vetsi horizontalni mezera */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-side-wrapper {
    width: 100% !important;
    max-width: none !important;
  }

  /* Logo row - vetsi horizontalni mezera mezi mini logy */
  html body#discipliny-page:not(.mobile-interface):not(.mobile-base-mode) .discipline-right-column .logo-row {
    gap: 4vw !important;
    justify-content: space-between !important;
  }
}

/* =========================================================
   TABLET - ODKAZY PAGE HORIZONTAL SCROLL OVERRIDE
   ========================================================= */
@media (min-width: 769px) and (max-width: 1366px) and (pointer: coarse) {
  /* Body and wrapper must allow overflow */
  html body#odkazy-page {
    overflow-x: visible !important;
    width: 100vw !important;
    max-width: 100vw !important;
  }

  /* PAGE WRAPPER - remove max-width restriction */
  html body#odkazy-page .page-wrapper {
    width: 100vw !important;
    max-width: 100vw !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: visible !important;
  }

  html body#odkazy-page .odkazy-page-wrapper,
  html body#odkazy-page .container,
  html body#odkazy-page .content-odkazy {
    overflow-x: visible !important;
    overflow-y: visible !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 0 !important;
  }

  /* Reset flex properties and force grid layout for tablet horizontal scroll */
  html body#odkazy-page .odkazy-container {
    display: grid !important;
    flex-wrap: unset !important;
    grid-auto-flow: column !important;
    grid-auto-columns: clamp(309px, 23.9vw, 461px) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;
    margin-top: 7rem !important;
    padding: 8px !important;
    gap: 32px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    box-sizing: border-box;
  }

  html body#odkazy-page .odkazy-sloupec {
    flex: none !important;
    width: clamp(309px, 23.9vw, 461px) !important;
    min-width: clamp(309px, 23.9vw, 461px) !important;
    max-width: clamp(309px, 23.9vw, 461px) !important;
    scroll-snap-align: start;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
}

/* =========================================================
   TABLET - GLOBAL FILE INPUT BUTTON FONT FIX
   ========================================================= */
@media (min-width: 769px) and (max-width: 1366px) and (pointer: coarse) {
  /* File input "Vybrat soubor" button - Poppins font pro všechny stránky */
  input[type="file"]::file-selector-button,
  input[type="file"]::-webkit-file-upload-button {
    font-family: 'Poppins', sans-serif !important;
  }
}
