/* --- ----------------------------------------------------------------------------- Styly pro textový obsah kontaktů --- */
.contact-info-wrapper { 
    flex: 1; /* Textový blok zabere 1 díl místa */
    min-width: 250px; /* Minimální šířka textu, než se mapa začne neúměrně zmenšovat */
    max-width: 900px;
    padding: 0;
    margin-left: 0px; /* Odsazení pro textový blok, aby začal za obrázkem ladderu a nepřebral margin z rodiče */
}


.container {
    flex: 1; /* Textový blok zabere 1 díl místa */
    min-width: 250px; /* Minimální šířka textu, než se mapa začne neúměrně zmenšovat */
    max-width: 900px;
    padding: 0;
    margin-left: 0px; /* Odsazení pro textový blok, aby začal za obrázkem ladderu a nepřebral margin z rodiče */
    margin: 0 auto; /* Centruje obsah uvnitř .full-width-section, pokud je užší než max-width */
    padding: 40px 0; /* Vertikální odsazení textu uvnitř kontejneru */
    color: black;
}
 /* Obrázky se symboly telefonu a mailu v sekci kontakty */
.nadpis-s-ikonou img {
            vertical-align: middle; /* Toto zarovná obrázek na střed s textem */
            margin-right: 10px;    /* Přidá trochu mezery napravo od obrázku */
            width: 40px;
            height: 40px;
        }

        /* Mezera pod nadpisem  */
.container h2 {
    margin-bottom: 1.5em; /* mezera pod H2 */
}

/* Mezery kolem nadpisů s ikonami pro sekce "Adresa" a "Provozovna" */
.nadpis-s-ikonou:has(+ p) {
    margin-top: 1.5em;    /* Mezera nad H3 pro oddělení od předchozího bloku */
    margin-bottom: 0.5em; /* Mezera pod H3 před textem adresy/provozovny */
}

/* Styly pro odstavce */
.container p {
    margin-top: 0;        /* Odstraní výchozí horní mezeru P, protože ji má už H3 */
    margin-bottom: 1.5em; /* Mezera pod odstavcem, aby se oddělil od dalšího bloku (H3) */
    line-height: 1.4;     /* Vylepšuje čitelnost textu */
}


/* Styly pro seznam kontaktních položek (telefony, email) */
.contact-items-list {
    list-style: none; /* TOTO ODSTRANÍ ODRÁŽKY */
    padding-left: 0;      /* Odstraní výchozí odsazení seznamu */
    margin-top: 1.5em;    /* Mezera nad seznamem, oddělení od předchozího bloku */
    margin-bottom: 1.5em; /* Mezera pod seznamem */
}

.contact-items-list li {
    margin-bottom: 0.5em; /* Mezera mezi jednotlivými položkami seznamu (telefon, email) */
}

/* Styly pro samotné H3 uvnitř LI, aby neměly vlastní margin-bottom, pokud už ho má LI */
.contact-items-list li .nadpis-s-ikonou {
    margin: 0; /* Nuluje výchozí margin H3, který je nyní uvnitř LI */
}

/* --- ----------------------------------------------------------------------------- Styly pro řádek s info o společnosti (spodní text) --- */
.company-registration-info-bottom {
   
    margin-top: 40px;
    margin-bottom: 15px;

    margin-left: 230px; /* Zarovná s levým okrajem textu nahoře */
    max-width: calc(100% - 230px - 60px); /* Omezí šířku tak, aby končil podobně jako mapa/text */
    
    background-color: transparent;
    color: #555;
    font-size: 0.9em;
    line-height: 1.4;
    text-align: left;
    padding-left: 0; 
    padding-right: 0;
}

/* --- ----------------------------------------------------------------------------- Styl pro responzivní iframe pro zobrazení mapy --- */
.map-container {
    position: relative;
    flex: 1; /* Mapa zabere 1 díl místa z Flexboxu */
    min-width: 100px; /* Mapa se nezmenší pod 100px */
    max-width: 450px; /* Omezení maximální šířky mapy */
    height: 550px; /* Pevná výška */
    padding-bottom: 0; 
    overflow: hidden; /* Zajišťuje, že obsah uvnitř .map-container nepřeteče */
    margin-left: 20px; /* Mezera mezi textovou sekcí a mapou */
    margin-top: 40px; /* Zarovnání mapy s vrškem textového obsahu */
}

.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* --- ----------------------------------------------------------------------------- Styl pro obrázek vedle textu v hlavním bloku --- */
.obr-container_r {
    position: relative;
    flex: 1; /* obr zabere 1 díl místa z Flexboxu */
    min-width: 200px; /* obr se nezmenší pod 200px */
    max-width: 450px; /* Omezení maximální šířky mapy */
    height: 100%; /* Pevná výška */
    padding-bottom: 0; 
    overflow: hidden; /* Zajišťuje, že obsah uvnitř .obr-container_r nepřeteče */
    margin-left: 20px; /* Mezera mezi textovou sekcí a obr */
    margin-top: 40px; /* Zarovnání obr s vrškem textového obsahu */
}

.obr-container img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.obr-container_l {
    position: relative;
    flex: 1; /* obr zabere 1 díl místa z Flexboxu */
    min-width: 200px; /* obr se nezmenší pod 200px */
    max-width: 450px; /* Omezení maximální šířky mapy */
    height: 100%; /* Pevná výška */
    padding-bottom: 0; 
    overflow: hidden; /* Zajišťuje, že obsah uvnitř .obr-container_r nepřeteče */
    margin-left: 230px; /* Odsazení od ladderu */
    margin-top: 40px; /* Zarovnání obr s vrškem textového obsahu */
}

/* --- ----------------------------------------------------------------------------- Media Queries pro mobilní zařízení --- */

@media (max-width: 768px) {
    /* Styly menu na mobilu */
    .nav-list {
        flex-direction: column;
        width: 100%;
        background-color: #444;
        position: absolute;
        top: 70px;
        left: 0;
        transform: translateY(-100%);
        transition: transform 0.3s ease-in-out;
        overflow: hidden;
        height: 0;
        z-index: 1000;
    }

    .nav-list.active {
        transform: translateY(0);
        height: auto;
    }

    .nav-list li {
        text-align: center;
        margin: 10px 0;
    }

    .menu-toggle {
        display: block;
    }

   
    /* Skryjeme seznam na mobilu, pokud není aktivní */
    .main-nav .nav-list:not(.active) {
        display: none;
    }

    /* Rozložení obsahu a mapy na mobilu */
    main {
       
        padding: 15px; /* Menší padding na okrajích pro mobil */
        background-image: none;  /* Skrytí vodoznaku na mobilu */
    }

    .contact-info-wrapper { /* Změna názvu z .full-width-section */
        margin-left: 0; /* Zrušíme desktopový margin-left */
        width: 100%; /* Roztáhne se na celou šířku */
        min-width: unset; /* Zruší min-width */
        flex: unset; /* Zruší flex */
        padding: 0;
    }

    .container {
        padding: 20px 0; /* Vertikální padding pro textový obsah */
    }

    .map-container {
        margin-left: 0; /* Odstraní mezeru zleva */
        margin-top: 20px; /* Mezera mezi textem a mapou na mobilu */
        width: 100%; /* Mapa se roztáhne na celou šířku */
        max-width: none; /* Odstraní max-width z desktopu */
        padding-bottom: 75%; /* Možná jiný poměr stran pro mobilní mapu (např. 4:3) */
        min-width: unset; /* Zruší min-width z desktopu */
        flex: unset; /* Zruší flex z desktopu */
    }

    .company-registration-info-bottom {
        margin-top: 20px;
        /* Paddingy už jsou v main řízeny */
        padding-left: 0; /* Zrušíme, protože main má padding 15px */
        padding-right: 0;
        margin-left: 0; /* Na mobilu se zarovná k levému okraji main */
        max-width: none; /* Umožní textu roztáhnout se na celou šířku */
        text-align: center;
    }
}