/*
 * EnFavori Design System — Public Shell Bridge
 * --------------------------------------------
 * Legacy hm-* kabuklari icin uyumluluk katmani.
 * Canonical .ef-header burada YONETILMEZ.
 */

:root {
    --hm-navy: var(--ef-color-navy) !important;
    --hm-navy-dark: var(--ef-color-navy-dark) !important;
    --hm-navy-soft: #1a3150 !important;
    --hm-blue: var(--ef-color-blue) !important;
    --hm-blue-hover: var(--ef-color-blue-dark) !important;
    --hm-turquoise: var(--ef-color-turquoise) !important;
    --hm-turquoise-hover: var(--ef-color-turquoise-dark) !important;
    --hm-white: var(--ef-color-white) !important;
    --hm-page: var(--ef-color-page) !important;
    --hm-border: var(--ef-color-border) !important;
    --hm-text: var(--ef-color-text) !important;
    --hm-muted: var(--ef-color-muted) !important;
    --hm-danger: var(--ef-color-danger) !important;

    --hm-footer-navy: var(--ef-color-navy) !important;
    --hm-footer-navy-dark: var(--ef-color-navy-dark) !important;
    --hm-footer-blue: var(--ef-color-blue) !important;
    --hm-footer-blue-hover: var(--ef-color-blue-dark) !important;
    --hm-footer-turquoise: var(--ef-color-turquoise) !important;
    --hm-footer-turquoise-hover: var(--ef-color-turquoise-dark) !important;
    --hm-footer-white: var(--ef-color-white) !important;
}

.hm-sticky-wrapper,
.hm-footer-container {
    font-family: var(--ef-font-sans);
}

/* Legacy header bridge: yalniz hm-* eski kabuklari. */
.hm-sticky-wrapper {
    margin-bottom: var(--ef-space-4) !important;
}

.hm-header-container {
    background-color: var(--ef-color-navy) !important;
    border-bottom-color: var(--ef-color-turquoise) !important;
    box-shadow: 0 4px 14px rgba(13, 27, 45, 0.13) !important;
}

.hm-site-header,
.hm-header-row {
    min-height: 62px !important;
}

.hm-site-logo {
    max-width: 214px !important;
    max-height: 34px !important;
}

.hm-header-actions {
    gap: var(--ef-space-2) !important;
}

.hm-action-button,
.hm-mobile-menu-button,
.hm-close-button {
    border-radius: var(--ef-radius-sm) !important;
}

.hm-action-button,
.hm-mobile-menu-button {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
}

.hm-action-button:hover,
.hm-action-button:focus,
.hm-mobile-menu-button:hover,
.hm-mobile-menu-button:focus {
    background-color: var(--ef-color-turquoise-dark) !important;
    border-color: var(--ef-color-turquoise-dark) !important;
}

.hm-account-action-button {
    position: relative !important;
}

.hm-account-action-button > i.fa-user {
    display: none !important;
}

.hm-account-action-button:has(> i.fa-user)::before {
    content: "" !important;
    position: absolute !important;
    top: 8px !important;
    left: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border: 2px solid currentColor !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

.hm-account-action-button:has(> i.fa-user)::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 7px !important;
    width: 17px !important;
    height: 9px !important;
    border: 2px solid currentColor !important;
    border-bottom: 0 !important;
    border-radius: 10px 10px 0 0 !important;
    box-sizing: border-box !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

.hm-nav-container {
    border-bottom-color: var(--ef-color-border) !important;
    box-shadow: var(--ef-shadow-sm) !important;
}

.hm-main-nav {
    min-height: 52px !important;
}

.hm-main-nav a {
    min-height: 52px !important;
    padding-inline: var(--ef-space-4) !important;
    color: var(--ef-color-text) !important;
    font-size: var(--ef-font-size-md) !important;
    font-weight: 700 !important;
}

.hm-main-nav a:hover,
.hm-main-nav a:focus {
    color: var(--ef-color-turquoise-dark) !important;
    background-color: var(--ef-color-surface-soft) !important;
}

.hm-main-nav a::after {
    right: var(--ef-space-4) !important;
    left: var(--ef-space-4) !important;
    background-color: transparent !important;
}

.hm-main-nav a:hover::after,
.hm-main-nav a:focus::after {
    background-color: var(--ef-color-turquoise) !important;
}

@media (min-width: 768px) {
    .hm-nav-container > .container {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .hm-nav-scroller {
        width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    .hm-main-nav {
        min-width: 100% !important;
        width: max-content !important;
    }

    .hm-main-nav a {
        flex: 0 0 auto !important;
        padding-right: 8px !important;
        padding-left: 8px !important;
        font-size: 14px !important;
        white-space: nowrap !important;
    }

    .hm-main-nav a:first-child { padding-left: 0 !important; }
    .hm-main-nav a:last-child { padding-right: 0 !important; }
    .hm-main-nav a::after { right: 8px !important; left: 8px !important; }
    .hm-main-nav a:first-child::after { left: 0 !important; }
    .hm-main-nav a:last-child::after { right: 0 !important; }
}

@media (min-width: 1200px) {
    .hm-nav-scroller { overflow-x: hidden !important; }
    .hm-main-nav { width: 100% !important; min-width: 0 !important; justify-content: space-between !important; }
    .hm-main-nav a {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        padding-right: clamp(4px, 0.35vw, 7px) !important;
        padding-left: clamp(4px, 0.35vw, 7px) !important;
        font-size: clamp(13px, 0.9vw, 14px) !important;
    }
    .hm-main-nav a:first-child { padding-left: 0 !important; }
    .hm-main-nav a:last-child { padding-right: 0 !important; }
    .hm-main-nav a::after { right: clamp(4px, 0.35vw, 7px) !important; left: clamp(4px, 0.35vw, 7px) !important; }
}

.hm-sidenav {
    box-shadow: -12px 0 36px rgba(15, 23, 42, 0.18) !important;
}

.hm-sidenav-header {
    background-color: var(--ef-color-navy) !important;
    border-bottom-color: var(--ef-color-turquoise) !important;
}

.hm-sidenav-content {
    padding: var(--ef-space-3) !important;
}

.hm-mobile-nav-item {
    min-height: var(--ef-control-height) !important;
    margin-bottom: var(--ef-space-1) !important;
    padding: 10px var(--ef-space-3) !important;
    color: var(--ef-color-text-soft) !important;
    border-radius: var(--ef-radius-sm) !important;
}

.hm-mobile-nav-icon {
    border-radius: var(--ef-radius-sm) !important;
}

.hm-search-panel {
    border-top-color: var(--ef-color-turquoise) !important;
    border-radius: var(--ef-radius-lg) !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28) !important;
}

.hm-search-heading-icon,
.hm-search-close,
.hm-search-input,
.hm-search-submit,
.hm-search-section,
.hm-search-chip,
.hm-live-search-results,
.hm-live-search-item,
.hm-live-search-all {
    border-radius: var(--ef-radius-md) !important;
}

/* Footer */
.hm-footer-container {
    margin-top: var(--ef-space-6) !important;
    color: #d8e3ef !important;
    background: linear-gradient(180deg, var(--ef-color-navy) 0%, var(--ef-color-navy-dark) 100%) !important;
    border-top-color: var(--ef-color-turquoise) !important;
}

.hm-footer-main {
    padding-top: var(--ef-space-7) !important;
    padding-bottom: var(--ef-space-6) !important;
}

.hm-footer-row { row-gap: var(--ef-space-6) !important; }
.hm-footer-brand-box { padding-right: var(--ef-space-6) !important; }
.hm-footer-logo-link { margin-bottom: var(--ef-space-4) !important; }
.hm-footer-description { max-width: 360px !important; font-size: 14px !important; line-height: var(--ef-line-height-relaxed) !important; }
.hm-footer-socials { gap: var(--ef-space-2) !important; margin-top: var(--ef-space-4) !important; }
.hm-footer-social-link,
.hm-footer-share-button { border-radius: var(--ef-radius-sm) !important; }
.hm-footer-social-link:hover,
.hm-footer-social-link:focus { background-color: var(--ef-color-turquoise-dark) !important; border-color: var(--ef-color-turquoise-dark) !important; }
.hm-footer-share-area { margin-top: var(--ef-space-4) !important; }
.hm-footer-card-box { border-radius: var(--ef-radius-lg) !important; }
.hm-footer-list a,
.hm-footer-link-button { border-radius: var(--ef-radius-sm) !important; }
.hm-footer-copyright { line-height: var(--ef-line-height-relaxed) !important; }

@media (max-width: 767.98px) {
    .hm-sticky-wrapper { margin-bottom: var(--ef-space-3) !important; }
    .hm-site-header,
    .hm-header-row { min-height: 52px !important; }
    .hm-header-actions { gap: 6px !important; }
    .hm-action-button,
    .hm-mobile-menu-button { width: 36px !important; height: 36px !important; flex-basis: 36px !important; }
    .hm-footer-container { margin-top: var(--ef-space-5) !important; }
    .hm-footer-main { padding-top: var(--ef-space-5) !important; padding-bottom: var(--ef-space-5) !important; }
    .hm-footer-row { row-gap: var(--ef-space-4) !important; }
    .hm-footer-brand-box { padding-right: var(--ef-space-4) !important; }
    .hm-footer-card-box { border-radius: var(--ef-radius-md) !important; }
}

@media (max-width: 390px) {
    .hm-action-button,
    .hm-mobile-menu-button { width: 34px !important; height: 34px !important; flex-basis: 34px !important; }
    .hm-footer-main { padding-right: var(--ef-space-2) !important; padding-left: var(--ef-space-2) !important; }
}

html body .hm-header-actions .hm-account-action-button {
    position: relative !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    animation: none !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 18px 18px !important;
}

html body .hm-header-actions .hm-account-action-button:not(:has(.hm-header-profile-image)) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0%200%2024%2024'%3E%3Cpath fill='%23ffffff' d='M12%2012c2.21%200%204-1.79%204-4s-1.79-4-4-4-4%201.79-4%204%201.79%204%204%204zm0%202c-2.67%200-8%201.34-8%204v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E") !important;
}

html body .hm-header-actions .hm-account-action-button > i,
html body .hm-header-actions .hm-account-action-button > i::before,
html body .hm-header-actions .hm-account-action-button > i::after,
html body .hm-header-actions .hm-account-action-button::before,
html body .hm-header-actions .hm-account-action-button::after,
html body .hm-header-actions .hm-account-action-button .ef-account-svg {
    content: none !important;
    display: none !important;
}

html body .hm-header-actions .hm-account-action-button:hover,
html body .hm-header-actions .hm-account-action-button:focus,
html body .hm-header-actions .hm-account-action-button:active,
html body .hm-header-actions .hm-account-action-button:focus-visible {
    background-size: 18px 18px !important;
    background-position: center !important;
    transform: none !important;
    animation: none !important;
}

@media (max-width: 767.98px) {
    html body .hm-header-actions .hm-account-action-button,
    html body .hm-header-actions .hm-account-action-button:hover,
    html body .hm-header-actions .hm-account-action-button:focus,
    html body .hm-header-actions .hm-account-action-button:active,
    html body .hm-header-actions .hm-account-action-button:focus-visible {
        flex: 0 0 36px !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        background-size: 18px 18px !important;
    }
}

@media (max-width: 390px) {
    html body .hm-header-actions .hm-account-action-button,
    html body .hm-header-actions .hm-account-action-button:hover,
    html body .hm-header-actions .hm-account-action-button:focus,
    html body .hm-header-actions .hm-account-action-button:active,
    html body .hm-header-actions .hm-account-action-button:focus-visible {
        flex: 0 0 34px !important;
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        background-size: 17px 17px !important;
    }
}