/* CM Klara navigation v11 — semantic chevrons, premium desktop motion and refined mobile search. */

@media (min-width: 1025px) {
    /* Direct links in the mega rail must not imply another level. */
    .cmk-nav .cmk-nav__mega-category-link {
        grid-template-columns: 28px minmax(0, 1fr) !important;
    }

    .cmk-nav .cmk-nav__mega-category-link .cmk-nav__mega-arrow {
        display: none !important;
    }

    /* Only real submenu tabs carry a chevron; active tab rotates it into an opened state. */
    .cmk-nav .cmk-nav__mega-tab .cmk-nav__mega-arrow {
        display: inline-block !important;
        transform: translateX(0) rotate(0deg) !important;
        transform-origin: center !important;
        opacity: .72 !important;
        transition:
            transform .18s cubic-bezier(.22,.61,.36,1),
            opacity .16s ease,
            color .16s ease !important;
        will-change: transform;
    }

    .cmk-nav .cmk-nav__mega-tab:hover .cmk-nav__mega-arrow,
    .cmk-nav .cmk-nav__mega-tab:focus-visible .cmk-nav__mega-arrow {
        transform: translateX(2px) rotate(0deg) !important;
        opacity: 1 !important;
        color: #d71920 !important;
    }

    .cmk-nav .cmk-nav__mega-tab.is-active .cmk-nav__mega-arrow {
        transform: translateX(0) rotate(90deg) !important;
        opacity: 1 !important;
        color: #d71920 !important;
    }

    /* Premium micro-interaction on top-level desktop navigation. */
    .cmk-nav .cmk-nav__root-item:not(.is-search) > .cmk-nav__root-link:not(.is-home) {
        position: relative !important;
        overflow: hidden !important;
    }

    .cmk-nav .cmk-nav__root-item:not(.is-search) > .cmk-nav__root-link:not(.is-home)::after {
        content: "" !important;
        position: absolute !important;
        left: 50% !important;
        bottom: 6px !important;
        width: 26px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: rgba(255,255,255,.92) !important;
        opacity: 0 !important;
        transform: translateX(-50%) scaleX(.24) !important;
        transform-origin: center !important;
        transition: opacity .14s ease, transform .18s cubic-bezier(.22,.61,.36,1) !important;
        pointer-events: none !important;
    }

    .cmk-nav .cmk-nav__root-item:not(.is-search) > .cmk-nav__root-link:not(.is-home) > span:first-child {
        transition: transform .18s cubic-bezier(.22,.61,.36,1) !important;
    }

    .cmk-nav .cmk-nav__root-item:not(.is-search):hover > .cmk-nav__root-link:not(.is-home)::after,
    .cmk-nav .cmk-nav__root-item:not(.is-search):focus-within > .cmk-nav__root-link:not(.is-home)::after,
    .cmk-nav .cmk-nav__root-item:not(.is-search).is-open > .cmk-nav__root-link:not(.is-home)::after,
    .cmk-nav .cmk-nav__root-item:not(.is-search).is-current > .cmk-nav__root-link:not(.is-home)::after {
        opacity: .92 !important;
        transform: translateX(-50%) scaleX(1) !important;
    }

    .cmk-nav .cmk-nav__root-item:not(.is-search):hover > .cmk-nav__root-link:not(.is-home) > span:first-child,
    .cmk-nav .cmk-nav__root-item:not(.is-search):focus-within > .cmk-nav__root-link:not(.is-home) > span:first-child {
        transform: translateY(-1px) !important;
    }
}

@media (max-width: 1024px) {
    /* Slightly faster than v10, still visibly animated. */
    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-form {
        transition:
            width .34s cubic-bezier(.22,.61,.36,1),
            min-width .34s cubic-bezier(.22,.61,.36,1),
            background-color .21s ease,
            border-radius .32s cubic-bezier(.22,.61,.36,1),
            border-color .21s ease,
            box-shadow .21s ease,
            padding .32s cubic-bezier(.22,.61,.36,1) !important;
    }

    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-form button[type="submit"] {
        transition:
            border-radius .32s cubic-bezier(.22,.61,.36,1),
            width .32s cubic-bezier(.22,.61,.36,1),
            height .32s cubic-bezier(.22,.61,.36,1),
            flex-basis .32s cubic-bezier(.22,.61,.36,1),
            box-shadow .20s ease !important;
    }

    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-icon {
        transition: width .24s ease .04s, flex-basis .24s ease .04s, opacity .19s ease .04s !important;
    }

    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-form input[type="search"] {
        transition: opacity .22s ease .05s, width .28s cubic-bezier(.22,.61,.36,1) .02s !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cmk-nav .cmk-nav__mega-tab .cmk-nav__mega-arrow,
    .cmk-nav .cmk-nav__root-link::after,
    .cmk-nav .cmk-nav__root-link > span,
    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-form,
    body > .cmk-nav-mobile__panel .cmk-nav-mobile__search-form button[type="submit"] {
        transition-duration: .01ms !important;
    }
}
