/* Obecné */
body {
    font-family: 'Inter', sans-serif;
    color: #343a40;
    background: linear-gradient(#008080, #40E0D0, #008080);
}

.emerald-text {
    color: #008080;
}

/* Layout */

.section-card {
    border-radius: 0.75rem;
    /* More rounded corners */
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.08);
    /* Softer, more prominent shadow */
    padding: 2.5rem;
    /* More padding */
    margin-bottom: 3rem;
    /* More space between sections */
}

@media (max-width: 767.98px) {
    .section-card {
        padding: 1.5rem;
    }
}

/* Header */

.text-header-large {
    font-size: 3.5rem;
    line-height: 1.1;
    font-weight: normal;
}

/* Služby */

.icon-fixed {
    width: 2rem;
    /* Ensures consistent column width */
    flex-shrink: 0;
    /* Prevents icon from collapsing */
    text-align: center;
    /* Aligns icon to the middle inside its box */
    margin-right: 1rem;
    /* Adds spacing between icon and text */
}

/* Contact */

.contact-flex-container {
    display: flex;
    justify-content: space-between;
    /* Roztáhne text a obrázek od sebe */
    align-items: stretch;
    /* stretch zajistí, že oba sloupce budou stejně vysoké */
    gap: 0;
    /* Mezera mezi sloupci */
    flex-wrap: wrap;
    /* Pro responzivitu */
}

.contact-text-wrapper {
    flex-basis: 50%;
    /* Dává textovému sloupci preferovanou šířku */
    flex-grow: 1;
    /* Umožňuje textovému sloupci roztáhnout se a vyplnit dostupné místo */
}

.contact-image-wrapper {
    flex-basis: 50%;
    /* flex-basis pro určení preferované šířky obrázkového sloupce */
    flex-grow: 1;
    /* Umožňuje obrázkovému sloupci roztáhnout se */
    display: flex;
    /* Využíváme flexbox i uvnitř tohoto wrapperu k centrování obrázku */
    justify-content: center;
    /* klíčové pro horizontální centrování obrázku uvnitř wrapperu */
    align-items: center;
    /* Pro vertikální centrování obrázku uvnitř wrapperu */
    overflow: hidden;
    /* Aby se obrázek ořízl, pokud přesáhne rozměry tohoto kontejneru */
}

.contact-image-wrapper img {
    max-width: 100%;
    /* Ujistí se, že obrázek nepřesáhne šířku wrapperu */
    max-height: 100%;
    /* Ujistí se, že obrázek nepřesáhne výšku wrapperu (která je dána textem) */

    /* Pokud chcete, aby se obrázek zmenšil a byl vycentrovaný,
       a ne roztahoval se na 100% šířky/výšky, použijte width/height: auto
       a object-fit: contain. */
    width: auto;
    /* Umožní obrázku zachovat svou původní šířku, pokud se vejde */
    height: auto;
    /* Umožní obrázku zachovat svou původní výšku, pokud se vejde */

    /* 'contain' zmenší celý obrázek, aby se vešel do wrapperu,
       a zanechá prázdné místo, pokud poměr stran neodpovídá.
       To umožní `justify-content: center` a `align-items: center` na `.contact-image-wrapper`
       skutečně vycentrovat obrázek! */
    object-fit: contain;
}

.icon-link {
    text-decoration: underline;
    text-underline-offset: 5px;
}

/* Fotky */

.hover-scale-105 {
    transition: transform 0.3s ease-in-out;
}

.hover-scale-105:hover {
    transform: scale(1.05);
}

.modal-body-image {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}

.modal-body-image img {
    max-width: 100%;
    max-height: 85vh;
    /* Maximální výška obrázku */
    object-fit: contain;
    display: block;
    /* Odstraní případné mezery pod obrázkem */
}

/* --- Potřeba aby modal byl jen pod fotkou a dal se snadno zavřít. --- */

/* Přeskočíme výchozí Bootstrapové max-width pro modal-dialog a nastavíme ho dynamicky */
#imageModal .modal-dialog {
    /* Cílíme specificky na tento modal */
    max-width: fit-content !important;
    /* Klíčové: Šířka modalu se přizpůsobí obsahu */
    margin: 2rem auto;
    /* Dostatečné okraje pro kliknutí na pozadí */
    min-width: 300px;
    /* Minimální šířka, aby modal nebyl příliš malý u malých obrázků */
}

/* Nastavíme obsah modalu, aby neměl žádné extra paddingy a roztáhl se podle obrázku */
#imageModal .modal-content {
    background-color: rgba(255, 255, 255, 0.95);
    /* Poloprůhledné bílé pozadí */
    border-radius: 0.5rem;
    /* Zaoblené rohy */
    border: none;
    padding: 0;
    /* Důležité: Odstraní vnitřní odsazení modal-content */
}

/* Styl pro hlavičku modalu (kde je tlačítko zavřít) */
#imageModal .modal-header {
    border-bottom: none;
    padding: 0 0 0.5rem 0.5rem;
    /* Upravené odsazení hlavičky */
    margin-bottom: 0.5rem;
}

@media (max-width: 767.98px) {

    #imageModal .modal-header {
        border-bottom: none;
        padding: 0 0.8rem 0.5rem 0.5rem;
        margin-bottom: 0;
    }

    #imageModal .modal-dialog {
        margin: 0;
        /* Menší okraje pro malé displeje */
        min-width: unset;
        /* Nebudeme mít min-width na mobilech */
        max-width: 100vw;
        width: 100vw;
        /* Chceme mít fotku přes celou obrazovku */
    }

    #imageModal .modal-content {
        width: 100vw;
        max-width: 100vw;
    }

    .modal-body-image img {
        width: calc(100vw - 1rem);
        margin: 0.5rem;
        border-radius: 0.5rem;
    }
}

/* Transport */
.transport-list li {
    font-size: 1.25rem;
    margin-bottom: 0.7rem;
}

.transport-icon {
    font-size: 1.5rem;
}

.transport-list strong {
    font-weight: 550;
}