/* ============================================================ */
                /* LOGO SWITCHER LOGIC (OPRAVENÉ)                               */
                /* ============================================================ */

                /* 1. ZÁKLADNÝ STAV (LIGHT THEME) */
                /* Zobrazíme tmavé logo, skryjeme svetlé */

                .theme-logo.logo-dark {
                    display: inline-block;
                }

                .theme-logo.logo-light {
                    display: none;
                }

                /* 2. TMAVÁ TÉMA (DARK THEME) */
                /* Zobrazíme svetlé logo, skryjeme tmavé */
                body.dark-theme .theme-logo.logo-dark {
                    display: none;
                }

                body.dark-theme .theme-logo.logo-light {
                    display: inline-block;
                }

                /* 3. SCROLLED STAV (MODRÉ POZADIE) - IBA PRE HLAVNÝ NAVBAR */
                /* Keď rolujeme, horná lišta je modrá -> chceme biele logo. */
                /* DÔLEŽITÉ: Aplikujeme to len na .navbar-brand, aby to nepokazilo mobilné menu */
                body.scrolled .navbar-brand .theme-logo.logo-dark {
                    display: none !important;
                }

                body.scrolled .navbar-brand .theme-logo.logo-light {
                    display: inline-block !important;
                }

                :root {

                    /* FARBA UKAZOVATEĽA (Žltá/Zlatá podľa obrázku) */
                        --progress-bar-color: linear-gradient(90deg, #ffc107 0%, #dc3545 100%);
                        --progress-bar-height: 5px;

                    /* ============================================================ */
                    /* 1. VARIABILNÉ FARBY (Definované pre Svetlú tému)             */
                    /* ============================================================ */

                    /* --- Farba menu (ZÁKLADNÝ STAV - ŽLTÁ) --- */
                    --navbar-bg-color: transparent;

                    /* Farba textu */
                    --nav-link-color: rgba(0, 0, 0, 0.85);
                    --nav-link-hover-color: #000000;
                    --navbar-brand-color: #000000;
                    --search-icon-color: #000000;

                    /* Hamburger */
                    --toggler-color: rgba(0, 0, 0, 0.65);
                    --toggler-border-color: rgba(0, 0, 0, 0.2);
                    --toggler-color-scrolled: #ffffffff;
                    --toggler-border-color-scrolled: rgba(255, 255, 255, 0.95);

                    /* --- SCROLLED STAV (MODRÁ) --- */
                    --navbar-bg-color-scrolled: #c8a97e;
                    --navbar-text-color-scrolled: #ffffff;
                    --navbar-text-hover-color-scrolled: #e0e0e0;

                    /* Rozmery a animácie */
                    --navbar-padding-y: 1.2rem;
                    /* Výška pred scrollom */
                    --navbar-scrolled-padding-y: 0.2rem;
                    /* Výška po scrolle */
                    --nav-gap: 60px;
                    --link-glow-color: #ca7a09;

                    /* Ostatné farby */
                    --topbar-bg-color: #2c2f33;
                    --topbar-text-color: rgba(255, 255, 255, 0.6);
                    --topbar-text-hover-color: #fff;
                    --topbar-height: 42px;

                    /* Dropdown & Šípky */
                    --dropdown-bg: #fcfcff;
                    --dropdown-border-color: 2px solid rgba(80, 80, 80, 0.9);
                    --dropdown-item-color: #000000;
                    --dropdown-item-hover-color: #949494;
                    --dropdown-divider-color: rgba(0, 0, 0, 0.1);

                    --arrow-border-color: rgba(90, 90, 90, 0.911);
                    --arrow-size: 15px;
                    --arrow-border-width: 2px;

                    --submenu-duration-show: 0.95s;
                    --submenu-duration-hide: 0.95s;
                    --submenu-ease: cubic-bezier(.2, .7, .3, 1);

                    /* Mobile */
                    --mobile-menu-width: 90%;
                    --mobile-menu-bg-color: rgb(226, 226, 226);
                    --mobile-menu-text-color: #000000;
                    --mobile-menu-submenu-bg-color: rgba(97, 97, 97, 0.25);
                    --mobile-menu-close-icon-color: #a0a0a0;
                    --mobile-menu-border-color: rgba(255, 255, 255, 0.1);
                    --mobile-menu-font-size-main: 1.50rem;
                    --mobile-menu-font-size-submenu: 0.95rem;
                    --mobile-submenu-animation-speed: 0.4s;
                    --mobile-item-color: rgba(0, 0, 0, 0.75);
                    --mobile-item-hover-color: #000000;
                    --navbar-text-color-scrolled-mobile: rgb(0, 0, 0);

                    /* Switcher & Search */
                    --search-panel-bg: #212529;
                    --search-icon-hover-color: #fff;
                    --switcher-bg: #444;
                    --switcher-thumb-bg: #fff;
                    --switcher-icon-color: #444;

                    --body-bg-color: #ffffff;
                    --body-text-color: #000000;
                }

                body.dark-theme {
                    /* ============================================================ */
                    /* 2. TMAVÁ TÉMA (DARK THEME)                                   */
                    /* ============================================================ */
                    --navbar-bg-color: #transparent;
                    /* Zelená */
                    --nav-link-color: rgba(255, 255, 255, 0.85);
                    --nav-link-hover-color: #ffffff;
                    --navbar-brand-color: #ffffff;
                    --search-icon-color: #ffffff;
                    --toggler-color: rgba(255, 255, 255, 0.75);
                    --toggler-border-color: rgba(255, 255, 255, 0.2);

                    

                    

                        /* Mobile */
                            --mobile-menu-width: 90%;
                            --mobile-menu-bg-color: rgb(68, 68, 68);
                            --mobile-menu-text-color: #d6d6d6;
                            --mobile-menu-submenu-bg-color: rgba(182, 182, 182, 0.25);
                            --mobile-menu-close-icon-color: #a0a0a0;
                            --mobile-menu-border-color: rgba(255, 255, 255, 0.1);
                            --mobile-menu-font-size-main: 1.50rem;
                            --mobile-menu-font-size-submenu: 0.95rem;
                            --mobile-submenu-animation-speed: 0.4s;
                            --mobile-item-color: rgba(214, 214, 214, 0.75);
                            --mobile-item-hover-color: #000000;
                            --navbar-text-color-scrolled-mobile: rgb(255, 255, 255);

                    --switcher-bg: #ffffff;
                    --switcher-thumb-bg: #353535;
                    --switcher-icon-color: #cccccc;

                    --body-bg-color: #2c2f33;
                    --body-text-color: #ffffff;

                    /* Dropdown & Šípky */
                        --dropdown-bg: #5c5c5c;
                        --dropdown-border-color: 2px solid rgba(80, 80, 80, 0.9);
                        --dropdown-item-color: #ffffff;
                        --dropdown-item-hover-color: #949494;
                        --dropdown-divider-color: rgba(0, 0, 0, 0.1);
}

                body {
                    background: var(--body-bg-color);
                    color: var(--body-text-color);
                    transition: background 0.3s ease, color 0.3s ease;
                }

                /* --- STICKY HEADER --- */
                #main-header {
                    position: -webkit-sticky;
                    position: sticky;
                    top: calc(var(--topbar-height) * -1);
                    /* -42px (alebo viac na mobile) */
                    z-index: 1030;
                }

                .top-bar {
                    background-color: var(--topbar-bg-color);
                    color: var(--topbar-text-color);
                    padding: 0.5rem 0;
                    font-size: 0.85rem;
                    height: var(--topbar-height);
                    display: flex;
                    align-items: center;
                }

                .top-bar a {
                    color: var(--topbar-text-color);
                    text-decoration: none;
                    transition: color .2s;
                }

                .top-bar a:hover {
                    color: var(--topbar-text-hover-color);
                }

                .top-bar .info-item {
                    margin-right: 1.5rem;
                }

                /* --- NAVBAR --- */
                .nav-custom-bg {
                    background-color: var(--navbar-bg-color);
                    padding-top: var(--navbar-padding-y);
                    padding-bottom: var(--navbar-padding-y);
                    transition: all 0.5s ease-in-out;
                }

                /* Scrolled Stav */
                body.scrolled .nav-custom-bg {
                    background-color: var(--navbar-bg-color-scrolled) !important;
                    padding-top: var(--navbar-scrolled-padding-y) !important;
                    padding-bottom: var(--navbar-scrolled-padding-y) !important;
                    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
                }

                .navbar-nav>.nav-item>.nav-link {
                    color: var(--nav-link-color);
                    transition: color 0.3s ease;
                }

                .navbar-nav>.nav-item:hover>.nav-link,
                .navbar-nav>.nav-item>.nav-link.active {
                    color: var(--nav-link-hover-color);
                }

                .navbar-brand {
                    color: var(--navbar-brand-color);
                    transition: color 0.3s ease;
                }

                .search-icon-toggle {
                    color: var(--search-icon-color);
                    transition: color 0.3s ease;
                }

                body.scrolled .navbar-nav>.nav-item>.nav-link {
                    color: var(--navbar-text-color-scrolled);
                }

                body.scrolled .navbar-nav>.nav-item:hover>.nav-link,
                body.scrolled .navbar-nav>.nav-item>.nav-link.active {
                    color: var(--navbar-text-hover-color-scrolled);
                }

                body.scrolled .navbar-brand {
                    color: var(--navbar-text-color-scrolled);
                }

                body.scrolled .search-icon-toggle {
                    color: var(--navbar-text-color-scrolled);
                }

                @media (max-width: 991px) {
                    body.scrolled .navbar-nav>.nav-item>.nav-link {
                        color: var(--navbar-text-color-scrolled-mobile);
                    }
                }

                /* Hamburger */
                .navbar-toggler.custom-toggler {
                    border-color: var(--toggler-border-color);
                    border: 3px solid;
                    color: var(--toggler-color);
                    font-size: 1.5rem;
                    padding: 0.5rem 0.75rem;
                    transition: color 0.3s ease, border-color 0.3s ease;
                }

                .navbar-toggler.custom-toggler:focus {
                    box-shadow: none;
                    outline: none;
                }

                body.scrolled .navbar-toggler.custom-toggler {
                    color: var(--toggler-color-scrolled);
                    border-color: var(--toggler-border-color-scrolled);
                }

                /* --- PREPÍNAČ TÉMY --- */
                .theme-switcher {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    cursor: pointer;
                    background: var(--switcher-bg);
                    border-radius: 50px;
                    width: 50px;
                    height: 26px;
                    position: relative;
                    overflow: hidden;
                }

                .theme-switcher .switcher-thumb {
                    position: absolute;
                    top: 2px;
                    left: 2px;
                    width: 22px;
                    height: 22px;
                    background-color: var(--switcher-thumb-bg);
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    transition: transform 0.3s ease;
                }

                .theme-switcher .switcher-thumb i {
                    font-size: 14px;
                    color: var(--switcher-icon-color);
                    position: absolute;
                    transition: opacity 0.3s ease, transform 0.3s ease;
                }

                .theme-switcher .fa-sun {
                    opacity: 1;
                    transform: rotate(0deg);
                }

                .theme-switcher .fa-moon {
                    opacity: 0;
                    transform: rotate(-90deg);
                }

                body.dark-theme .theme-switcher .switcher-thumb {
                    transform: translateX(24px);
                }

                body.dark-theme .theme-switcher .fa-sun {
                    opacity: 0;
                    transform: rotate(90deg);
                }

                body.dark-theme .theme-switcher .fa-moon {
                    opacity: 1;
                    transform: rotate(0deg);
                }

                /* --- DESKTOP DROPDOWN A ŠÍPKY --- */
                @media (min-width: 992px) {
                    .navbar-expand-lg .offcanvas-body {
                        display: flex;
                        flex-grow: 1;
                        align-items: center;
                    }

                    .user-nav {
                        margin-left: var(--nav-gap);
                    }

                    /* Zarovnanie dropdownu pre užívateľa doprava */
                    .user-nav>.nav-item>.dropdown-menu {
                        left: auto;
                        right: calc(0px - (var(--bs-gutter-x) * 0.5));
                    }

                    .dropdown-menu {
                        display: block !important;
                        visibility: hidden;
                        opacity: 0;
                        transform: translateY(8px) scale(.985);
                        transition: opacity var(--submenu-duration-hide) var(--submenu-ease), transform var(--submenu-duration-hide) var(--submenu-ease), margin var(--submenu-duration-hide) var(--submenu-ease), visibility 0s linear var(--submenu-duration-hide);
                        background: var(--dropdown-bg);
                        border: var(--dropdown-border-color);
                        border-radius: .5rem;
                        padding: .4rem;
                        min-width: 14rem;
                        margin-top: var(--arrow-size);
                    }

                    .dropdown-menu.is-open {
                        visibility: visible;
                        opacity: 1;
                        transform: translateY(0) scale(1);
                        transition: opacity var(--submenu-duration-show) var(--submenu-ease), transform var(--submenu-duration-show) var(--submenu-ease), margin var(--submenu-duration-show) var(--submenu-ease);
                    }

                    .dropdown-submenu {
                        position: relative;
                    }

                    .dropdown-submenu>.dropdown-menu {
                        top: -.4rem;
                        left: 100%;
                        margin-left: var(--arrow-size);
                        margin-top: 0;
                    }

                    .dropdown-menu.open-left {
                        left: auto;
                        right: 100%;
                        margin-left: 0;
                        margin-right: var(--arrow-size);
                    }

                    /* --- ŠÍPKY (BUBLINOVÉ TROJUHOLNÍKY) --- */
                    .dropdown-menu::before,
                    .dropdown-menu::after {
                        content: '';
                        position: absolute;
                        width: 0;
                        height: 0;
                        border-style: solid;
                        border-color: transparent;
                    }

                    /* Hlavné menu - šípka hore (VŠEOBECNÁ - VĽAVO) */
                    .navbar-nav>.nav-item>.dropdown-menu::before {
                        top: calc(var(--arrow-size) * -1);
                        left: 1.25rem;
                        border-width: 0 var(--arrow-size) var(--arrow-size) var(--arrow-size);
                        border-bottom-color: var(--arrow-border-color);
                    }

                    .navbar-nav>.nav-item>.dropdown-menu::after {
                        top: calc(var(--arrow-size) * -1 + var(--arrow-border-width));
                        left: 1.25rem;
                        border-width: 0 var(--arrow-size) var(--arrow-size) var(--arrow-size);
                        border-bottom-color: var(--dropdown-bg);
                    }

                    /* --- OPRAVA: Šípka pre User Nav (LOGIN) - VPRAVO --- */
                    .user-nav>.nav-item>.dropdown-menu::before,
                    .user-nav>.nav-item>.dropdown-menu::after {
                        left: auto;
                        right: 25px;
                        /* Posunutie viac do stredu nápisu Login */
                        transform: translateX(50%);
                        /* Centrovanie */
                    }

                    /* Submenu - šípka doľava (štandard) */
                    .dropdown-submenu>.dropdown-menu:not(.open-left)::before {
                        left: calc(var(--arrow-size) * -1);
                        top: 0.75rem;
                        border-width: var(--arrow-size) var(--arrow-size) var(--arrow-size) 0;
                        border-right-color: var(--arrow-border-color);
                    }

                    .dropdown-submenu>.dropdown-menu:not(.open-left)::after {
                        left: calc(var(--arrow-size) * -1 + var(--arrow-border-width));
                        top: 0.75rem;
                        border-width: var(--arrow-size) var(--arrow-size) var(--arrow-size) 0;
                        border-right-color: var(--dropdown-bg);
                    }

                    /* Submenu - šípka doprava (ak sa otvára vľavo) */
                    .dropdown-submenu>.dropdown-menu.open-left::before {
                        right: calc(var(--arrow-size) * -1);
                        left: auto;
                        top: 0.75rem;
                        border-width: var(--arrow-size) 0 var(--arrow-size) var(--arrow-size);
                        border-left-color: var(--arrow-border-color);
                    }

                    .dropdown-submenu>.dropdown-menu.open-left::after {
                        right: calc(var(--arrow-size) * -1 + var(--arrow-border-width));
                        left: auto;
                        top: 0.75rem;
                        border-width: var(--arrow-size) 0 var(--arrow-size) var(--arrow-size);
                        border-left-color: var(--dropdown-bg);
                    }

                    /* --- ANIMÁCIA ŠÍPKY V TEXTE (CARET) --- */
                    .dropdown-toggle::after {
                        display: inline-block;
                        transition: transform 0.3s ease;
                    }

                    .nav-item.dropdown:hover>.dropdown-toggle::after {
                        transform: rotate(180deg);
                    }

                    .dropdown-submenu>.dropdown-toggle::after {
                        transform: rotate(-90deg);
                    }

                    .dropdown-submenu:hover>.dropdown-toggle::after {
                        transform: rotate(0deg);
                    }

                    /* Glow efekty */
                    .navbar-nav>.nav-item>.nav-link span,
                    .navbar-nav>.nav-item>.nav-link>i {
                        position: relative;
                        display: inline-block;
                        padding-bottom: 0.5rem;
                    }

                    .navbar-nav>.nav-item>.nav-link span::after,
                    .navbar-nav>.nav-item>.nav-link>i::after {
                        content: '';
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        width: 100%;
                        height: 5px;
                        background-color: var(--link-glow-color);
                        box-shadow: 0 0 10px var(--link-glow-color), 0 0 20px var(--link-glow-color);
                        border-radius: 25px;  /* jemné zaoblenie */
                        transform: scaleX(0);
                        transform-origin: center;
                        transition: transform 0.95s cubic-bezier(0.19, 1, 0.22, 1);
                    }

                    .navbar-nav>.nav-item:hover>.nav-link span::after,
                    .navbar-nav>.nav-item>.nav-link.active span::after,
                    .navbar-nav>.nav-item:hover>.nav-link>i::after,
                    .navbar-nav>.nav-item>.nav-link.active>i::after {
                        transform: scaleX(1);
                    }

                    .dropdown-item {
                        color: var(--dropdown-item-color);
                        opacity: 0;
                        transform: translateY(6px);
                        transition: opacity var(--submenu-duration) var(--submenu-ease), transform var(--submenu-duration) var(--submenu-ease), color .3s ease;
                    }

                    .dropdown-menu.is-open .dropdown-item {
                        opacity: 1;
                        transform: none;
                    }

                    .dropdown-item:hover,
                    .dropdown-item:focus {
                        color: var(--dropdown-item-hover-color);
                        background-color: transparent;
                    }

                    .dropdown-item span {
                        position: relative;
                        display: inline-block;
                        padding-bottom: 0.2rem;
                    }

                    .dropdown-item span::after {
                        content: '';
                        position: absolute;
                        bottom: -2px;
                        left: 0;
                        width: 100%;
                        height: 2px;
                        background-color: var(--link-glow-color);
                        box-shadow: 0 0 8px var(--link-glow-color);
                        transform: scaleX(0);
                        transform-origin: center;
                        transition: transform 0.3s ease;
                    }

                    .dropdown-item:hover>span::after {
                        transform: scaleX(1);
                    }

                    .search-icon-toggle:hover {
                        opacity: 1;
                    }

                    .search-panel {
                        background-color: var(--search-panel-bg);
                        padding: 0 1rem;
                        overflow: hidden;
                        max-height: 0;
                        transition: max-height 0.35s ease-out, padding 0.35s ease-out;
                    }

                    .search-panel.is-open {
                        max-height: 100px;
                        padding-top: 1.25rem;
                        padding-bottom: 1.25rem;
                    }

                    .navbar.search-active .search-icon-toggle {
                        visibility: hidden;
                        opacity: 0;
                        transition: all .2s ease;
                    }

                    .navbar.search-active .navbar-brand {
                        visibility: visible;
                        opacity: 1;
                    }

                    .dropdown-divider {
                        border-color: var(--dropdown-divider-color);
                    }
                }

                /* Mobile styles */
                @media (max-width: 991.98px) {

                    /* --- OPRAVA: Výška top baru pre mobil --- */
                    :root {
                        --topbar-height: 85px;
                        /* Vyšší sticky offset pre mobil, aby sa schoval celý */
                    }

                    body.scrolled {
                        padding-top: 0;
                    }

                    /* --- OPRAVA: Top Bar zobrazenie --- */
                    .top-bar {
                        height: auto;
                        /* Povoliť roztiahnutie */
                        min-height: 42px;
                        padding-bottom: 10px;
                        /* Priestor pre druhý riadok */
                    }

                    .offcanvas.offcanvas-end {
                        --bs-offcanvas-width: var(--mobile-menu-width);
                        background-color: var(--mobile-menu-bg-color);
                        color: var(--mobile-menu-text-color);
                    }

                    .offcanvas .btn-close {
                        --bs-btn-close-color: var(--mobile-menu-close-icon-color);
                        --bs-btn-close-opacity: 1;
                        --bs-btn-close-hover-opacity: 0.85;
                    }

                    .offcanvas-body {
                        display: flex;
                        flex-direction: column;
                    }

                    .offcanvas-header .border-top,
                    .offcanvas-body .border-top {
                        border-color: var(--mobile-menu-border-color) !important;
                    }

                    .offcanvas-body .dropdown-divider {
                        border-color: var(--mobile-menu-border-color);
                    }

                    .dropdown-toggle:after,
                    .dropdown-submenu>a::after {
                        font-weight: 700;
                        opacity: .7;
                        margin-left: .1rem;
                        margin-top: .7rem;
                        float: right;
                    }

                    .offcanvas-body .dropdown-menu {
                        position: static;
                        max-height: 0;
                        transition: max-height var(--mobile-submenu-animation-speed) ease-in-out;
                        width: 100%;
                        background-color: transparent;
                        border: none;
                        padding: 0;
                        margin: 0;
                        overflow: hidden;
                    }

                    .offcanvas-body .dropdown-menu .submenu-inner {
                        background-color: var(--mobile-menu-submenu-bg-color);
                        border-radius: .375rem;
                        padding: 0 0 0 1.5rem;
                        transition: padding var(--mobile-submenu-animation-speed) ease-in-out;
                        overflow: hidden;
                    }

                    .offcanvas-body .dropdown-menu.show {
                        max-height: 500px;
                    }

                    .offcanvas-body .dropdown-menu.show .submenu-inner {
                        padding-top: .5rem;
                        padding-bottom: .5rem;
                    }

                    .offcanvas-body .nav-item>.dropdown-menu.show {
                        margin-top: .5rem;
                        transition: max-height var(--mobile-submenu-animation-speed) ease-in-out, margin-top var(--mobile-submenu-animation-speed) ease-in-out;
                    }

                    .offcanvas-body .navbar-nav>.nav-item>.nav-link {
                        font-size: var(--mobile-menu-font-size-main);
                        color: var(--mobile-menu-text-color);
                    }

                    .offcanvas-body .dropdown-item {
                        color: var(--mobile-item-color);
                        padding-top: .5rem;
                        padding-bottom: .5rem;
                        font-size: var(--mobile-menu-font-size-submenu);
                    }

                    .offcanvas-body .dropdown-item:hover,
                    .offcanvas-body .dropdown-item:focus {
                        background-color: transparent;
                        color: var(--mobile-item-hover-color);
                    }

                    .offcanvas-body .navbar-nav {
                        width: 100%;
                    }

                    .offcanvas-body .dropdown-toggle::after {
                        display: inline-block;
                        transition: transform 0.3s ease;
                    }

                    .offcanvas-body .dropdown-toggle[aria-expanded="true"]::after {
                        transform: rotate(180deg);
                    }

                    /* Footer styles */
                    .mobile-menu-footer {
                        width: 100%;
                    }

                    .mobile-footer-socials .social-icon {
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;
                        width: 40px;
                        height: 40px;
                        margin: 0 5px;
                        border-radius: 50%;
                        background-color: rgba(0, 0, 0, 0.05);
                        color: var(--mobile-menu-text-color);
                        text-decoration: none;
                        font-size: 1.2rem;
                        transition: all 0.3s ease;
                    }

                    .mobile-footer-socials .social-icon:hover {
                        background-color: var(--mobile-item-hover-color);
                        color: #ffffff;
                        transform: translateY(-3px);
                    }

                    .mobile-footer-copyright p {
                        font-size: 0.85rem;
                        color: var(--mobile-menu-text-color);
                        opacity: 0.7;
                        line-height: 1.4;
                    }
                }

                .search-icon-btn {
                    position: absolute;
                    right: 15px;
                    top: 50%;
                    transform: translateY(-50%);
                    background: none;
                    border: none;
                    color: rgba(0, 0, 0, 0.7);
                    cursor: pointer;
                    font-size: 1rem;
                    padding: 0;
                }

                .search-icon-btn:hover {
                    color: var(--bs-primary, #ffcc00);
                }
        
                /* --- READING PROGRESS BAR (S GRADIENTOM) --- */
                .reading-progress-container {
                    position: absolute;
                    top: 0;
                    /* Pripnuté na úplný vrch navbaru */
                    left: 0;
                    width: 100%;
                    height: var(--progress-bar-height);  /* Hrúbka pásika */
                    background: transparent;
                    z-index: 9999;
                        /* Zvýšené, aby bol vždy na vrchu */
                        pointer-events: none;
                        /* Aby sa cez neho dalo klikať na menu */
                }
        
                .reading-progress-bar {
                    height: 100%;
                    width: 0%;
                    /* TOTO ROBÍ FAREBNÝ PRECHOD: */
                    /* Zmení sa zo Žltej (#ffc107) na Červenú (#dc3545) smerom ku koncu */
                    /* Môžeš si farby zmeniť, napr. na #1158db (modrú) na konci */
                    background: var(--progress-bar-color);
        
                    /* Jemný tieň pre lepší efekt */
                    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
                    transition: width 0.1s ease-out;
                    border-radius: 0 4px 4px 0;
                }