/* =========================
   00 - Debug helper (originální)
   ========================= */
/* Pouze pro potřeby zvýraznění a ladění kontejnerů objektů 
 * { outline: 1px solid rgba(255,0,0,0.25); } */

/* =========================
   01 - Základní nastavení a reset
   (původní blok "Základní nastavení" a první body)
   ========================= */
/* Základní nastavení */
body {
    margin: 0;
    font-family: sans-serif;
}

/* Skrytí checkboxu */
.menu-toggle {
    display: none;
}

/* Výchozí stav: menu a ikonka skryté na desktopu */
.menu-icon,
.menu {
    display: none;
}

/* =========================
   02 - Mobilní menu (hamburger) - media query @max-width:1280px
   (původní rozsáhlý blok s .menu-icon a .menu)
   ========================= */
@media (max-width: 1280px) {

    /* Ikonka hamburgeru */
    .menu-icon {
        display: block;
        position: fixed;
        top: 15px;
        left: 15px;
        width: 30px;
        height: 35px;
        cursor: pointer;
        z-index: 1001;
        transform: translateZ(0);
        will-change: transform;
        touch-action: manipulation;
    }

    .menu-icon span {
        display: block;
        height: 5px;
        width: 100%;
        background: #333;
        margin: 4px 0;
        transition: 0.4s;
        border-radius: 5px; /* volitelné pro zaoblení */
        background-color: #F96706; /* oranžová barva */
    }

    /* Animace ikonky při aktivaci */
    .menu-toggle:checked + .menu-icon span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 7.75px);
        background-color: #F96706;
    }

    .menu-toggle:checked + .menu-icon span:nth-child(2) {
        opacity: 0;
    }

    .menu-toggle:checked + .menu-icon span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -7.75px);
        background-color: #F96706;
    }

    /* Menu */
    .menu {
        display: block;
        position: fixed;
        top: 0px;
        left: 0;
        width: 50%;
        background: #444;
        transform: translateY(-100%);
        transition: transform 0.3s ease;
        z-index: 1000;
        /* Vizuální efekty */
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
        background-color: rgba(51, 51, 51, 0.60); /* mírná průhlednost */
        backdrop-filter: blur(4px); /* jemné rozmazání pozadí */
    }

    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu li {
        padding: 15px;
        border-bottom: 1px solid #555;
    }

    .menu a {
        color: white;
        text-decoration: none;
    }

    /* Zobrazení menu při aktivaci */
    .menu-toggle:checked ~ .menu {
        transform: translateY(0);
    }
}

/* =========================
   03 - Animace
   ========================= */
/* Animace načtení stránky */
@keyframes revealPage {
    0% {
        opacity: 0;
        transform: scale(1);
        filter: blur(8px);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        filter: blur(0);
    }
}

/* =========================
   04 - Thumbs / galerie (náhledy)
   ========================= */
/* kontejner pro každý náhled */
.thumb {
    display: inline-block;
    margin: 0px;
    text-decoration: none;
    vertical-align: top;
}

/* obrázek: pevná šířka 154px, zachování poměru stran (bez ořezu) */
.thumbL img {
    width: 154px;
    margin: 0px 0px 4px 0px; /* odsazení spodní okraj */
    height: auto;
    display: block;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: transparent;
}

/* obrázek: pevná šířka 255px, zachování poměru stran (bez ořezu) */
.thumb img {
    width: 255px;
    height: auto;
    display: block;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: transparent;
}

/* u vybraných náhledů omezíme výšku, šířka se upraví automaticky */
.thumb.limit-height img {
    max-height: 155px; /* požadovaná maximální výška */
    width: auto; /* zabrání deformaci */
    display: block;
}

/* volitelné: menší náhledy na úzkých obrazovkách 
@media (max-width: 480px) {
    .thumb img {
        width: 100px;
    }
}
*/

/* =========================
   05 - CSS proměnné a základní typografie (původní :root a druhé body)
   ========================= */
/* Minimální CSS pro zaoblení a poloprůhledné pozadí s vrženým stínem */
:root {
    --panel-bg: rgba(57,80,112,0.82);
    --panel-radius: 14px;
    --panel-shadow: 0 18px 40px rgba(0,0,0,0.7);
    --muted: #C7C8CB;
    --accent: #F96706;
}

body {
    margin: 0;
    font-family: Tahoma, Verdana, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* =========================
   06 - Site wrapper a tabulky
   ========================= */
.site-wrap {
    max-width: 804px;
    margin: 8px auto;
    padding: 12px;
    background: var(--panel-bg);
    border-radius: var(--panel-radius);
    box-shadow: var(--panel-shadow);
    border: 1px solid rgba(255,255,255,0.03);
}

.site-wrap table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
}

.site-wrap td[bgcolor] {
    background-clip: padding-box;
}

/* =========================
   07 - Odkazy, muted třída
   ========================= */
a { color: inherit; }
.muted { color: var(--muted); }

/* =========================
   08 - Navigační řádek (první výskyt .nav-row td)
   ========================= */
/* NAV hover (pokud jste použili předchozí úpravu) */
.nav-row td {
    background-color: #006699;
    transition: background-color 0.15s ease, color 0.15s ease;
    cursor: pointer;
    height: 40px;
    vertical-align: middle;
}

/* Výchozí: všechny odkazy v navigaci mají šedé písmo */
.nav-row td a span {
    color: var(--muted);
    transition: color 0.12s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    line-height: 40px;
    text-decoration: none;
}

/* Hover pro běžné položky: šedé -> černé */
.nav-row td:hover {
    background-color: var(--accent); /* pokud chcete hover měnit i pozadí */
}
.nav-row td:hover a span {
    color: black;
}

/* Aktivní položka: výchozí černé písmo */
.nav-row td.active,
.nav-row td[bgcolor="#F96706" i] {
    background-color: var(--accent);
}
.nav-row td.active a span,
.nav-row td[bgcolor="#F96706" i] a span {
    color: black;
}

/* Aktivní položka při hoveru: černé -> šedé (přepis hoveru) */
.nav-row td.active:hover a span,
.nav-row td[bgcolor="#F96706" i]:hover a span {
    color: var(--muted);
}

/* =========================
   09 - Nadpisy a titulky
   ========================= */
/* část určující styl nadpisů */
/* H1 + hover */
/* Fluidní, ale omezená velikost: clamp(min, preferred, max) */
.site-title {
    color: var(--accent);
    font-weight: 700;
    line-height: 1.05;
    margin: 0 0 0.0rem 0;
    font-size: clamp(1.25rem, 2.5vw + 0.5rem, 1.75rem); /* 20px–28px přibližně */
    transition: color .18s ease;
}

/* hover a focus pro přístupnost */
.site-title:hover,
.site-title:focus {
    color: #000;
    outline: none;
}

/* H1 + bez hover */
.site-title2 {
    color: var(--accent);
    font-weight: 700;
    line-height: 1.05;
    margin: 0 0 0.0rem 0;
    font-size: clamp(1.25rem, 2.5vw + 0.5rem, 1.75rem); /* 20px–28px přibližně */
    transition: color .18s ease;
}

/* H2 */
.section-title {
    color: #ffffff; /* nebo var(--accent) pokud chcete oranžovou */
    font-weight: 700;
    line-height: 1.05;
    margin: 0 0 0.0rem 0;
    font-size: clamp(1.125rem, 2.2vw + 0.4rem, 1.50rem); /* ~18px–24px */
    transition: color .18s ease;
}

/* H3 */
.site-title3 {
    color: var(--accent);
    font-weight: 700;
    line-height: 1.05;
    margin: 0 0 0.0rem 0;
    font-size: clamp(1.125rem, 2.2vw + 0.4rem, 1.25rem); /* 16px–20px přibližně */
    transition: color .18s ease;
}

/* =========================
   10 - Info bloky (info-cell, info-text, info-kontakty, info-cenik)
   ========================= */
/* --- Nové styly pro zaoblení tabulky s logem a textem --- */
/* 1) cílová buňka (td) dostane třídu .info-cell; použijeme border-radius a overflow:hidden */
.info-cell {
    background-color: #395070; /* stejná barva jako původní bgcolor */
    border-radius: calc(var(--panel-radius) - 2px);
    overflow: hidden; /* zajistí ořezání obsahu do zaobleného rohu */
    padding: 0; /* odstraníme vnitřní odsazení, vnitřní table má vlastní cellpadding */
}

/* formátování buňky, border-radius, bílý výplň pro tmavý text - obch. partneři */
.info-cell2 {
    background-color: white;
    border-radius: calc(var(--panel-radius) - 2px);
    overflow: hidden; /* zajistí ořezání obsahu do zaobleného rohu */
    padding: 0; /* odstraníme vnitřní odsazení, vnitřní table má vlastní cellpadding */
}

/* formátování textu, světle šedá pro tmavé pozadí */
.info-text {
    padding: 10px;
    font-size: 11.0pt;
    font-family: Tahoma, sans-serif;
    letter-spacing: 1pt;
    color: var(--muted);
    text-align: left;
}

/* formátování textu, tmavě modrá pro světlé pozadí - obch. partneři */
.info-text2 {
    padding: 10px;
    font-size: 11.0pt;
    font-family: Tahoma, sans-serif;
    letter-spacing: 1pt;
    color: #395070;
    text-align: left;
}

/* formátování textu, kde je class="info-kontakty" */
.info-kontakty {
    font-size: 11.0pt;
    font-family: Tahoma, sans-serif;
    letter-spacing: 1pt;
    color: var(--muted);
    text-align: left;
    /* přidat řádkování */
    line-height: 1.3;        /* relativní (doporučeno) */
    /* nebo pevně: line-height: 18px; */
}

/* drobné úpravy textu uvnitř info bloku */
.info-cell .info-text {
    padding: 10px;
    font-size: 11.0pt;
    font-family: Tahoma, sans-serif;
    letter-spacing: 1pt;
    color: var(--muted);
    text-align: left;
}

/* formátování textu ceníku dopravy, kde je class="info-cenik" */
.info-cenik {
    font-size: 11.0pt;
    font-family: Tahoma, sans-serif;
    letter-spacing: 1pt;
    color: #395070;
    text-align: left;
}

/* =========================
   11 - Responsivita pro obrázky a tabulky (media queries)
   ========================= */
/* zajišťuje responsivitu pro img a iframe */
@media (max-width: 840px) {
    .site-wrap { margin: 8px; padding: 10px; }
    .site-wrap img { max-width: 100%; height: auto; margin: 0px 0px 4px 0px; box-sizing: border-box; }
    .site-wrap iframe { max-width: 100%; }
    table[width] { width: 100% !important; }
}

/* rozdělí navigační řádek na 6 stejných sloupců, škáluje se s rodičem */
.nav-row td {
    width: 16.666666%; /* 100% / 6 */
    min-width: 0;      /* dovolí elementům se smrštit bez overflow */
    padding: 0;        /* upravte podle potřeby */
    box-sizing: border-box;
    white-space: nowrap; /* volitelné: zabrání zalomení textu v tlačítku */
    overflow: hidden;
    text-overflow: ellipsis; /* zkrátí dlouhý text */
}

/* na velmi úzkých obrazovkách přepnout navigační řádek na sloupcové menu (stack) */
@media (max-width: 435px) {
    .nav-row td {
        display: block;
        width: 100%;
    }
    .nav-row { display: block; }
}

/* skryje navigační řádek na velmi úzkých obrazovkách 
@media (max-width: 435px) {
  .nav-row { display: none !important; }
  /* pokud chcete místo toho zobrazit alternativu, např. tlačítko */
  .mobile-nav-toggle { display: block; } /* vytvořte si element .mobile-nav-toggle */
}*/
