/* Soubor: style.css */

.mt-20 {
    margin-top: 6rem; /* 96px */
}

    .nav-link[aria-haspopup="true"] {
        cursor: pointer;
    }

    /* ===== NOVÝ KÓD PRO MOBILNÍ MENU ===== */
    /* Zajištění kurzoru pro hamburgerové tlačítko a mobilní dropdown */
    #mobile-menu-button,
    .mobile-nav-link-button {
        cursor: pointer;
    }

@layer components {
    body {
        font-family: 'Inter', sans-serif;
    }

    /* --- Active Link Styles --- */
    .nav-link.active {
        color: #2563eb !important; /* tmavší modrá */
        font-weight: 600 !important;
    }

    .mobile-nav-link.active {
        color: #2563eb !important;
        background-color: #eff6ff !important;
    }

    #mobile-menu {
        max-height: 60vh;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    /* --- Mobile Dropdown Menu Scroll --- */
    .mobile-dropdown-menu {
        max-height: 60vh;
        overflow-y: auto;
    }

    /* ===== NOVÉ STYLY PRO SLIDER NA ÚVODNÍ STRÁNCE ===== */
    .hero-slider {
        position: relative;
        width: 100%;
        height: 100%;
    }

    .slider-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0;
        transition: opacity 1s ease-in-out;
    }

    .slider-image.active {
        opacity: 1;
    }

    #nase-sluzby {
        scroll-margin-top: 80px;
    }

    /* ===== STYLY PRO OVLÁDÁNÍ SLIDERU ===== */
    .slider-controls {
        position: absolute;
        bottom: 1rem;
        right: 1rem;
        z-index: 10;
        display: flex;
        gap: 0.5rem;
    }

    .slider-controls button {
        background-color: rgba(0, 0, 0, 0);
        color: white;
        border: none;
        border-radius: 9999px;
        width: 2.25rem;
        height: 2.25rem;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: background-color 0.2s ease-in-out;
    }

    .slider-controls button:hover {
        background-color: rgba(0, 0, 0, 0.6);
    }
}

@layer utilities {
    @media (width >= 48rem) { /* Breakpoint pro "md" (768px) */
        .md\:block {
            display: block;
        }
    }
    @media (width >= 64rem) { /* Breakpoint pro "lg" (1024px) */
        .lg\:block {
            display: block;
        }
    }
}
