/* MK Customs - Liquid Glass Menu */

.site-header[class*="header-"],
.site-header[class*="header-"] .header-main-block {
    background: transparent !important;
    box-shadow: none !important;
}

.site-header[class*="header-"] .header-main-block > .container-fluid {
    position: relative;
    width: calc(100% - var(--mk-header-side-space)) !important;
    max-width: var(--mk-header-max-width) !important;
    margin: var(--mk-header-top-offset) auto 0 !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    background: transparent !important;
    border: 1px solid rgba(255,255,255,var(--mk-header-border-opacity)) !important;
    border-radius: var(--mk-header-radius) !important;
    box-shadow:
        0 6px 24px rgba(0,0,0,.08),
        inset 0 1px 0 rgba(255,255,255,.38);
    overflow: visible !important;
    transition:
        border-color .30s ease,
        box-shadow .30s ease,
        margin .30s ease,
        width .30s ease;
}

.site-header[class*="header-"] .header-main-block > .container-fluid::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: rgba(255,255,255,var(--mk-header-light-opacity));
    -webkit-backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation));
    backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
    z-index: 1;
}

body:not(.site-light) .site-header[class*="header-"] .header-main-block > .container-fluid::before {
    background: rgba(18,18,22,var(--mk-header-dark-opacity));

    /*
     * Dark Contrast Boost:
     * stlmí jas obsahu POD sklom bez toho,
     * aby sme museli spraviť header nepriehľadný.
     */
    -webkit-backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation))
        brightness(var(--mk-header-dark-brightness));

    backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation))
        brightness(var(--mk-header-dark-brightness));
}

.site-header[class*="header-"] .header-main-block > .container-fluid > .row {
    position: relative;
    z-index: 2;
    background: transparent !important;
}

.site-header[class*="header-"] .logo-block,
.site-header[class*="header-"] .navigation,
.site-header[class*="header-"] .header-search-button,
.site-header[class*="header-"] .sidebar-button,
.site-header[class*="header-"] .butter-button {
    position: relative;
    z-index: 3;
}

.site-header[class*="header-"] .navigation {
    position: relative !important;
    overflow: visible !important;
    z-index: 4;
}

.site-header[class*="header-"] .navigation > ul {
    position: relative;
    overflow: visible !important;
    z-index: 2;
}

.site-header[class*="header-"] .navigation > ul > li {
    position: relative;
    overflow: visible !important;
    z-index: 3;
    transition:
        transform var(--mk-bubble-duration)
        cubic-bezier(.22,1,.36,1);
}

.site-header[class*="header-"] .navigation > ul > li > a {
    position: relative;
    z-index: 4;
    background: transparent !important;
    border-radius: 16px;
    transform: none !important;
    font-family: var(--mk-main-font-family) !important;
    font-weight: var(--mk-main-font-weight) !important;
    transition: color .25s ease;
}

.site-header[class*="header-"] .navigation > ul > li > a:hover,
.site-header[class*="header-"] .navigation > ul > li:hover > a {
    background: transparent !important;
    color: var(--mk-main-hover-color) !important;
}

body:not(.site-light) .site-header[class*="header-"] .navigation > ul > li > a:hover,
body:not(.site-light) .site-header[class*="header-"] .navigation > ul > li:hover > a {
    color: var(--mk-main-hover-color-dark) !important;
}

.site-header[class*="header-"] .navigation > ul:has(> li:hover) > li:has(~ li:hover) {
    transform: translateX(calc(var(--mk-neighbor-shift) * -1));
}

.site-header[class*="header-"] .navigation > ul > li:hover {
    transform: translateX(0);
}

.site-header[class*="header-"] .navigation > ul:has(> li:hover) > li:hover ~ li {
    transform: translateX(var(--mk-neighbor-shift));
}

.mk-liquid-menu-hover {
    position: absolute;
    top: 50%;
    left: 0;
    width: 0;
    height: var(--mk-bubble-height);
    transform: translateY(-50%);
    border-radius: var(--mk-bubble-radius);
    pointer-events: none;
    opacity: 0;
    background: rgba(255,255,255,var(--mk-bubble-light-opacity));
    -webkit-backdrop-filter:
        blur(var(--mk-bubble-blur))
        saturate(var(--mk-bubble-saturation));
    backdrop-filter:
        blur(var(--mk-bubble-blur))
        saturate(var(--mk-bubble-saturation));
    border: 1px solid rgba(255,255,255,var(--mk-bubble-border-opacity));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.42),
        0 4px 14px rgba(0,0,0,.08);
    transition:
        left var(--mk-bubble-duration) cubic-bezier(.22,1,.36,1),
        width var(--mk-bubble-duration) cubic-bezier(.22,1,.36,1),
        opacity .20s ease;
    z-index: 1 !important;
}

.mk-liquid-menu-hover::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(255,255,255,.26) 0%,
        rgba(255,255,255,.08) 45%,
        rgba(255,255,255,.02) 100%
    );
}

body:not(.site-light) .mk-liquid-menu-hover {
    background: rgba(255,255,255,var(--mk-bubble-dark-opacity));
    border-color: rgba(255,255,255,.14);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 4px 16px rgba(0,0,0,.18);
}

/* Submenu */

.site-header[class*="header-"] .navigation ul ul {
    display: block !important;
    position: absolute;
    left: 50% !important;
    right: auto !important;
    top: 100%;
    width: max-content !important;
    min-width: var(--mk-submenu-min-width);
    max-width: none !important;
    padding: var(--mk-submenu-padding) !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform:
        translateX(-50%)
        translateY(-6px)
        scale(.98);
    transform-origin: top center;
    background: rgba(255,255,255,var(--mk-submenu-light-opacity)) !important;
    -webkit-backdrop-filter:
        blur(var(--mk-submenu-blur))
        saturate(var(--mk-submenu-saturation))
        brightness(var(--mk-submenu-light-brightness));
    backdrop-filter:
        blur(var(--mk-submenu-blur))
        saturate(var(--mk-submenu-saturation))
        brightness(var(--mk-submenu-light-brightness));
    border: 1px solid rgba(255,255,255,var(--mk-submenu-border-opacity)) !important;
    border-radius: var(--mk-submenu-radius) !important;
    box-shadow:
        0 18px 48px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.40),
        inset 0 -1px 0 rgba(255,255,255,.08);
    overflow: visible !important;
    transition:
        opacity .22s ease,
        transform .36s cubic-bezier(.22,1,.36,1),
        visibility 0s linear .36s;
    z-index: 9999 !important;
}

.site-header[class*="header-"] .navigation ul ul::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(255,255,255,.16) 0%,
        rgba(255,255,255,.09) 30%,
        rgba(255,255,255,.045) 65%,
        rgba(255,255,255,.07) 100%
    );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.18),
        inset 0 0 30px rgba(255,255,255,.035);
    z-index: 0;
}

.site-header[class*="header-"] .navigation ul ul::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 50%;
    width: 14px;
    height: 14px;
    transform: translateX(-50%) rotate(45deg);
    background: rgba(255,255,255,var(--mk-submenu-light-opacity));
    border-left: 1px solid rgba(255,255,255,var(--mk-submenu-border-opacity));
    border-top: 1px solid rgba(255,255,255,var(--mk-submenu-border-opacity));
    pointer-events: none;
    z-index: 1;
}

.site-header[class*="header-"] .navigation > ul > li:hover > ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform:
        translateX(-50%)
        translateY(var(--mk-submenu-offset))
        scale(1);
    transition:
        opacity .22s ease,
        transform .36s cubic-bezier(.22,1,.36,1),
        visibility 0s;
}

.site-header[class*="header-"] .navigation > ul > li.menu-item-has-children {
    position: relative;
}

.site-header[class*="header-"] .navigation > ul > li.menu-item-has-children::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    width: 130%;
    height: var(--mk-hover-bridge-height);
    transform: translateX(-50%);
    background: transparent;
    pointer-events: auto;
    z-index: 9998;
}

.site-header[class*="header-"] .navigation ul ul > li {
    position: relative;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0;
    transform: translateY(-6px);
    transition:
        opacity .28s ease,
        transform .38s cubic-bezier(.22,1,.36,1);
    z-index: 2;
}

.site-header[class*="header-"] .navigation > ul > li:hover > ul > li {
    opacity: 1;
    transform: translateY(0);
}

/* Progressive item delays */
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(1) { transition-delay: calc(var(--mk-submenu-item-delay) * 1); }
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(2) { transition-delay: calc(var(--mk-submenu-item-delay) * 2); }
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(3) { transition-delay: calc(var(--mk-submenu-item-delay) * 3); }
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(4) { transition-delay: calc(var(--mk-submenu-item-delay) * 4); }
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(5) { transition-delay: calc(var(--mk-submenu-item-delay) * 5); }
.site-header[class*="header-"] .navigation > ul > li:hover > ul > li:nth-child(6) { transition-delay: calc(var(--mk-submenu-item-delay) * 6); }

.site-header[class*="header-"] .navigation ul ul > li > a {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 11px 16px !important;
    white-space: nowrap !important;
    text-align: left !important;
    line-height: 1.25;
    font-family: var(--mk-submenu-font-family) !important;
    font-weight: var(--mk-submenu-font-weight) !important;
    border: 0 !important;
    border-radius: 14px;
    background: transparent !important;
    color: inherit !important;
    transform: none;
    transition:
        background .28s ease,
        color .24s ease,
        box-shadow .28s ease;
}

.site-header[class*="header-"] .navigation ul ul > li > a:hover {
    background: rgba(255,255,255,var(--mk-submenu-hover-opacity)) !important;
    color: var(--mk-submenu-hover-color) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
}

body:not(.site-light) .site-header[class*="header-"] .navigation ul ul {
    background: rgba(12,12,14,var(--mk-submenu-dark-opacity)) !important;
    -webkit-backdrop-filter:
        blur(var(--mk-submenu-blur))
        saturate(var(--mk-submenu-saturation))
        brightness(var(--mk-submenu-dark-brightness));
    backdrop-filter:
        blur(var(--mk-submenu-blur))
        saturate(var(--mk-submenu-saturation))
        brightness(var(--mk-submenu-dark-brightness));
    border-color: rgba(255,255,255,.16) !important;
    box-shadow:
        0 18px 48px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.12);
}

body:not(.site-light) .site-header[class*="header-"] .navigation ul ul::before {
    background: rgba(12,12,14,var(--mk-submenu-dark-opacity));
    border-left-color: rgba(255,255,255,.16);
    border-top-color: rgba(255,255,255,.16);
}

body:not(.site-light) .site-header[class*="header-"] .navigation ul ul > li > a:hover {
    background: rgba(255,255,255,.10) !important;
    color: var(--mk-submenu-hover-color-dark) !important;
}

/* Responsive */

@media (max-width: 1600px) {
    .site-header[class*="header-"] .header-main-block > .container-fluid {
        width: calc(100% - 120px) !important;
        max-width: 1400px !important;
    }
}

@media (max-width: 1366px) {
    .site-header[class*="header-"] .header-main-block > .container-fluid {
        width: calc(100% - 60px) !important;
        margin-top: 14px !important;
    }
}

@media (max-width: 1024px) {
    .site-header[class*="header-"] .header-main-block > .container-fluid {
        width: calc(100% - 30px) !important;
        margin-top: 10px !important;
        border-radius: 24px !important;
    }
}


/* ==========================================================
   MK CUSTOMS 1.05 — LIQUID OPTICS
   Optical depth inspired by modern translucent system UI.
   ========================================================== */

/* Main capsule: deeper edge definition and light transport. */
.site-header[class*="header-"] .header-main-block > .container-fluid {
    isolation: isolate;
    box-shadow:
        0 10px 30px rgba(0,0,0,var(--mk-liquid-shadow)),
        inset 0 1px 0 rgba(255,255,255,var(--mk-liquid-highlight)),
        inset 0 -1px 0 rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .45)) !important;
}

/* Optical highlight + edge caustic. */
.site-header[class*="header-"] .header-main-block > .container-fluid::before {
    background:
        radial-gradient(120% 90% at 50% -18%,
            rgba(255,255,255,var(--mk-liquid-highlight)) 0%,
            rgba(255,255,255,calc(var(--mk-liquid-highlight) * .32)) 35%,
            transparent 68%),
        linear-gradient(180deg,
            rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .75)) 0%,
            transparent 36%,
            transparent 72%,
            rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .28)) 100%) !important;
    box-shadow:
        inset 0 0 var(--mk-liquid-refraction)
        rgba(255,255,255,calc(var(--mk-liquid-lens-strength) * .45));
}

/* Moving hover bubble: rounded lens / raised liquid surface. */
.mk-liquid-menu-hover {
    box-shadow:
        0 7px 18px rgba(0,0,0,calc(var(--mk-liquid-shadow) * .75)),
        inset 0 1px 0 rgba(255,255,255,var(--mk-liquid-highlight)),
        inset 0 -1px 0 rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .45)),
        inset 0 0 var(--mk-liquid-refraction)
        rgba(255,255,255,calc(var(--mk-liquid-lens-strength) * .55)) !important;
}

.mk-liquid-menu-hover::before {
    background:
        radial-gradient(100% 95% at 50% -12%,
            rgba(255,255,255,calc(var(--mk-liquid-highlight) * 1.15)) 0%,
            rgba(255,255,255,calc(var(--mk-liquid-highlight) * .28)) 42%,
            transparent 70%),
        linear-gradient(180deg,
            rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .85)),
            transparent 48%,
            rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .18))) !important;
}

/* Submenu: stronger optical separation from content behind it. */
.site-header[class*="header-"] .navigation ul ul {
    isolation: isolate;
    box-shadow:
        0 18px 46px rgba(0,0,0,var(--mk-liquid-shadow)),
        inset 0 1px 0 rgba(255,255,255,var(--mk-liquid-highlight)),
        inset 0 -1px 0 rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .38)),
        inset 0 0 var(--mk-liquid-refraction)
        rgba(255,255,255,calc(var(--mk-liquid-lens-strength) * .42)) !important;
}

/* A soft optical sheen inside submenu without blocking clicks. */
.site-header[class*="header-"] .navigation ul ul::after {
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    z-index:-1;
    background:
        radial-gradient(120% 75% at 50% -8%,
            rgba(255,255,255,calc(var(--mk-liquid-highlight) * .62)),
            transparent 62%),
        linear-gradient(110deg,
            transparent 0%,
            rgba(255,255,255,calc(var(--mk-liquid-lens-strength) * .18)) 46%,
            transparent 68%);
}

/* Dark mode keeps the same optics with restrained highlights. */
body:not(.site-light) .site-header[class*="header-"] .header-main-block > .container-fluid,
body:not(.site-light) .mk-liquid-menu-hover,
body:not(.site-light) .site-header[class*="header-"] .navigation ul ul {
    box-shadow:
        0 14px 34px rgba(0,0,0,calc(var(--mk-liquid-shadow) * 1.65)),
        inset 0 1px 0 rgba(255,255,255,calc(var(--mk-liquid-highlight) * .55)),
        inset 0 -1px 0 rgba(255,255,255,calc(var(--mk-liquid-edge-glow) * .22)),
        inset 0 0 var(--mk-liquid-refraction)
        rgba(255,255,255,calc(var(--mk-liquid-lens-strength) * .24)) !important;
}



/* MK Customs 1.09 — Light Mode Background Brightness
 * Jemne zosvetlí obsah pod Liquid Glass kapsulou.
 * 100% = bez zmeny; odporúčané cca 108–115%.
 */
body.site-light .site-header[class*="header-"] .header-main-block > .container-fluid::before {
    -webkit-backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation))
        brightness(var(--mk-header-light-brightness));

    backdrop-filter:
        blur(var(--mk-header-blur))
        saturate(var(--mk-header-saturation))
        brightness(var(--mk-header-light-brightness));
}

/* MK Customs 1.07 — selectable horizontal hover animation */
.mk-liquid-menu-hover {
    transition:
        left var(--mk-bubble-duration) var(--mk-bubble-easing),
        width var(--mk-bubble-duration) var(--mk-bubble-easing),
        opacity .20s ease !important;
}


/* MK Customs 1.10 — configurable Light Glass Tint
 * Toto je reálna farebná vrstva skla, nie iba brightness podkladu.
 */
body.site-light .site-header[class*="header-"] .header-main-block > .container-fluid::before {
    background: rgba(var(--mk-header-light-tint-rgb), var(--mk-header-light-opacity)) !important;
}

/* Samotný container necháva farebnú vrstvu pseudo-elementu viditeľnú. */
body.site-light .site-header[class*="header-"] .header-main-block > .container-fluid {
    background: transparent !important;
}