/**
 * Lightweight compatibility layer for the Elementor-based legacy Mobit header.
 * The root keeps a safe fallback gradient. Existing ParsKala dynamic CSS still
 * targets `.header-mobiter header` and therefore wins on the inner <header>.
 */
.header-mobiter.prk-header-template--legacy-mobit {
    width: 100%;
    margin: 0 0 24px;

    position: relative;
    z-index: var(--prk-legacy-mobit-header-z, 999);
    isolation: isolate;
    overflow: visible;

    color: #fff;
    background: linear-gradient(
        135deg,
        var(--prk-color-gradient-start, var(--prk-color-primary, #242424)),
        var(--prk-color-gradient-end, var(--prk-color-secondary, #343434))
    );
}
.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
    width: 100%;
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 10px 42px;
    color: inherit;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav,
.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions,
.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
    display: flex;
    align-items: center;
    min-width: 0;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
    flex: 1 1 58%;
    justify-content: flex-start;
    gap: 24px;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
    flex: 1 1 42%;
    justify-content: flex-end;
    gap: 16px;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search {
    flex: 1 1 auto;
    min-width: 220px;
    max-width: 560px;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
    width: auto !important;
    max-width: none;
    flex: 0 0 auto;
    justify-content: flex-end;
    gap: 12px;
    white-space: nowrap;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-header-logo,
.header-mobiter.prk-header-template--legacy-mobit .prk-header-logo a {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-header-logo img {
    width: auto;
    max-width: 132px;
    max-height: 48px;
    object-fit: contain;
}

.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu,
.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li,
.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li > a {
    display: flex;
    align-items: center;
}

.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
    gap: 25px;
    margin: 0;
    padding: 0;
}

.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li > a,
.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li > a .title,
.header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li > a i {
    color: inherit;
}

/* Keep the classic submenu anchored below its top-level trigger. */
.header-mobiter.prk-header-template--legacy-mobit
.prk_mega_menu > li.clasic_menu:not(.has-elementor-mega-menu) > ul.sub-menu {
    top: 100%;
}

.header-mobiter.prk-header-template--legacy-mobit .form_search,
.header-mobiter.prk-header-template--legacy-mobit .search-section {
    width: 100%;
}

.header-mobiter.prk-header-template--legacy-mobit .form_search.desktop,
.header-mobiter.prk-header-template--legacy-mobit .search-section {
    min-height: 45px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.09);
    box-shadow: none;
}

.header-mobiter.prk-header-template--legacy-mobit .prk_input_serach,
.header-mobiter.prk-header-template--legacy-mobit .form_search button,
.header-mobiter.prk-header-template--legacy-mobit .search-section button {
    color: #fff;
}

.header-mobiter.prk-header-template--legacy-mobit .prk_input_serach::placeholder {
    color: rgba(255, 255, 255, 0.92);
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-call--mobile,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-mobile {
    display: none !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-call--desktop,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
    color: inherit;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-call__link--desktop,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
    min-height: 42px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

/* Keep the Elementor account border controls authoritative over the
 * reusable default-header skin without hard-coding the editor values. */
.header-mobiter.prk-header-template--legacy-mobit
.prk-theme-header-action--account .prk-dh-account-button {
    min-height: 42px;
    border-style: var(--prk-theme-account-border-style, none) !important;
    border-width: var(--prk-theme-account-border-width, 0) !important;
    border-color: var(--prk-theme-account-border-color, transparent) !important;
    border-radius: var(--prk-theme-account-border-radius, 0) !important;
    background: transparent;
    box-shadow: none;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-call__icon,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__icon,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__text,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__arrow,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__icon {
    color: inherit;
}

/* Elementor account colors must win over the reusable default-header skin. */
.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button__icon,
.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button__icon i,
.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button__icon svg {
    color: var(--prk-theme-account-icon-color, inherit) !important;
    fill: var(--prk-theme-account-icon-color, inherit) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button__text {
    color: var(--prk-theme-account-text-color, inherit) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button__arrow {
    color: var(--prk-theme-account-arrow-color, inherit) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button:hover .prk-dh-account-button__icon,
.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button:hover .prk-dh-account-button__icon i,
.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button:hover .prk-dh-account-button__icon svg {
    color: var(--prk-theme-account-icon-color-hover, var(--prk-theme-account-icon-color, inherit)) !important;
    fill: var(--prk-theme-account-icon-color-hover, var(--prk-theme-account-icon-color, inherit)) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button:hover .prk-dh-account-button__text {
    color: var(--prk-theme-account-text-color-hover, var(--prk-theme-account-text-color, inherit)) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-theme-header-action--account .prk-dh-account-button:hover .prk-dh-account-button__arrow {
    color: var(--prk-theme-account-arrow-color-hover, var(--prk-theme-account-arrow-color, inherit)) !important;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__text,
.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__label {
    font-size: 12px;
    font-weight: 700;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
    gap: 6px;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__label {
    color: inherit;
}

.header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__count {
    background: #ef4056;
    color: #fff;
}

@media (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-call--desktop,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
        display: inline-flex !important;
    }
}

@media (max-width: 1540px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        gap: 18px;
        padding-inline: 24px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        gap: 18px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 15px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        gap: 13px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
        gap: 9px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search {
        min-width: 200px;
    }
}

@media (max-width: 1360px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        gap: 12px;
        padding-inline: 16px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        flex-basis: 60%;
        gap: 13px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        flex-basis: 40%;
        gap: 9px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 10px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
        gap: 6px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search {
        min-width: 170px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-header-logo img {
        max-width: 112px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__inner {
        gap: 4px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
        gap: 4px;
    }
}

@media (max-width: 1180px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        padding-inline: 12px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        gap: 10px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 8px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        gap: 7px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search {
        min-width: 150px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__text,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__arrow,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__label {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
        width: 42px !important;
        min-width: 42px !important;
        padding-inline: 0 !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__inner {
        gap: 0;
    }
}



/* --------------------------------------------------------------------------
 * Mobit desktop stability
 *
 * Elementor stores the two main rows as 58% + 42%. A flex gap is added on top
 * of those percentages, so the children can overflow and overlap at narrower
 * desktop widths. Zero-basis flex tracks let the gap participate in sizing.
 * -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        width: auto !important;
        flex: 1.45 1 0 !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        width: auto !important;
        flex: 1 1 0 !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk-legacy-mobit__brand-nav > .elementor-widget-prk-menu,
    .header-mobiter.prk-header-template--legacy-mobit
    .prk-legacy-mobit__search-actions > .elementor-widget-prk-header-searchbox {
        min-width: 0;
        flex: 1 1 auto;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .elementor-widget-prk-menu :where(.elementor-widget-container, .prk-header-menu, nav) {
        min-width: 0;
        width: 100%;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        flex-wrap: nowrap;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu > li {
        flex: 0 0 auto;
    }
}

/* The design-system rule colors SVG child shapes with !important. Keep the
 * account widget's Elementor color variables authoritative inside Mobit. */
.header-mobiter.prk-header-template--legacy-mobit
.prk-theme-header-action--account
:is(.prk-dh-account-button__icon, .prk-dh-account-mobile__trigger)
svg :is(path, circle, rect, ellipse, polygon, polyline) {
    fill: var(--prk-theme-account-icon-color, currentColor) !important;
    stroke: var(--prk-theme-account-icon-color, currentColor) !important;
}

.header-mobiter.prk-header-template--legacy-mobit
.prk-theme-header-action--account
.prk-dh-account-button:hover .prk-dh-account-button__icon
svg :is(path, circle, rect, ellipse, polygon, polyline) {
    fill: var(--prk-theme-account-icon-color-hover, var(--prk-theme-account-icon-color, currentColor)) !important;
    stroke: var(--prk-theme-account-icon-color-hover, var(--prk-theme-account-icon-color, currentColor)) !important;
}

/* Custom cart SVGs use currentColor so the Elementor normal/hover controls
 * continue to work even when a path carries an imported fill attribute. */
.header-mobiter.prk-header-template--legacy-mobit
.prk-theme-header-action--cart .prk-dh-cart-button__icon svg path {
    fill: currentColor !important;
}

@media (max-width: 1480px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        gap: 14px;
        padding-inline: 20px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        gap: 12px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 9px;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a .item-icon-title {
        gap: 4px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        gap: 9px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
        gap: 5px;
    }
}

@media (max-width: 1360px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        gap: 8px;
        padding-inline: 12px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        flex: 1.55 1 0 !important;
        gap: 8px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        flex: 1 1 0 !important;
        gap: 6px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 7px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__actions {
        gap: 4px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button__label {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-cart-button {
        width: 42px !important;
        min-width: 42px !important;
        padding-inline: 0 !important;
        gap: 0;
    }
}

@media (max-width: 1240px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        gap: 6px;
        padding-inline: 10px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        gap: 6px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 5px;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a .item-icon-title {
        gap: 3px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-header-logo img {
        max-width: 100px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__text,
    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__arrow {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button {
        width: 42px !important;
        min-width: 42px !important;
        padding-inline: 0 !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-dh-account-button__inner {
        gap: 0;
    }
}

@media (max-width: 1023px) {
    .header-mobiter.prk-header-template--legacy-mobit {
        display: none !important;
    }
}

/* --------------------------------------------------------------------------
 * Mobit compact desktop navigation
 *
 * Between the full desktop layout and the mobile breakpoint, preserve all
 * menu items while reclaiming width from decorative icons and action labels.
 * -------------------------------------------------------------------------- */
@media (max-width: 1360px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__brand-nav {
        flex: 1.72 1 0 !important;
        gap: 6px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search-actions {
        flex: .92 1 0 !important;
        gap: 5px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 4px;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a {
        padding-inline: 3px !important;
        white-space: nowrap;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a .item-icon-title {
        gap: 2px !important;
        white-space: nowrap;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a .title {
        font-size: 12px !important;
        white-space: nowrap;
    }

    /* Keep the category trigger icon; secondary top-level icons are decorative
     * and can disappear safely in compact desktop mode. */
    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li:not(.mega_menu_tree_level):not(.prk-side-tab)
    > a .item-icon-title > i {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__search {
        min-width: 140px;
        max-width: 430px;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk-theme-header-action--account .prk-dh-account-button__text,
    .header-mobiter.prk-header-template--legacy-mobit
    .prk-theme-header-action--account .prk-dh-account-button__arrow {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk-theme-header-action--account .prk-dh-account-button {
        width: 42px !important;
        min-width: 42px !important;
        padding-inline: 0 !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk-theme-header-action--account .prk-dh-account-button__inner {
        justify-content: center;
        gap: 0;
    }
}

/* Very narrow desktop: the call shortcut is the first non-essential action.
 * Account, cart, search and the complete navigation remain available. */
@media (max-width: 1120px) and (min-width: 1024px) {
    .header-mobiter.prk-header-template--legacy-mobit
    .prk-legacy-mobit__actions > .elementor-widget-prk-theme-call-button {
        display: none !important;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-legacy-mobit__inner {
        padding-inline: 8px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk-header-logo img {
        max-width: 90px;
    }

    .header-mobiter.prk-header-template--legacy-mobit .prk_mega_menu {
        gap: 2px;
    }

    .header-mobiter.prk-header-template--legacy-mobit
    .prk_mega_menu > li > a .title {
        font-size: 10.5px !important;
    }
}
