/*
 * EnFavori Design System — Contact Standard
 * ------------------------------------------
 * İletişim sayfasını ortak EnFavori görsel diline bağlayan son uyumluluk katmanı.
 * Sadece .ef-contact-page altında çalışır; form davranışına müdahale etmez.
 */

body .ef-contact-page {
    --ef-contact-navy: var(--ef-color-navy);
    --ef-contact-navy-dark: var(--ef-color-navy-dark);
    --ef-contact-navy-soft: #1a3150;
    --ef-contact-turquoise: var(--ef-color-turquoise);
    --ef-contact-turquoise-dark: var(--ef-color-turquoise-dark);
    --ef-contact-blue: var(--ef-color-blue);
    --ef-contact-blue-dark: var(--ef-color-blue-dark);
    --ef-contact-white: var(--ef-color-white);
    --ef-contact-page: var(--ef-color-page);
    --ef-contact-text: var(--ef-color-text);
    --ef-contact-muted: var(--ef-color-muted);
    --ef-contact-light: var(--ef-color-light);
    --ef-contact-border: var(--ef-color-border);
    --ef-contact-soft-green: var(--ef-color-success-soft);
    --ef-contact-soft-blue: var(--ef-color-info-soft);
    --ef-contact-danger: var(--ef-color-danger);
    --ef-contact-success: var(--ef-color-success);

    margin-top: -9px !important;
    padding: 0 0 32px !important;
    color: var(--ef-color-text) !important;
    background: var(--ef-color-page) !important;
    font-family: var(--ef-font-sans) !important;
}

/* Breadcrumb */
body .ef-contact-page .ef-contact-breadcrumbs {
    gap: 6px !important;
    margin-bottom: 12px !important;
    color: var(--ef-color-muted) !important;
    font-size: var(--ef-font-size-xs) !important;
    line-height: 1.4 !important;
}

body .ef-contact-page .ef-contact-breadcrumbs a {
    color: var(--ef-color-muted) !important;
}

body .ef-contact-page .ef-contact-breadcrumbs .current {
    color: var(--ef-color-navy) !important;
    font-weight: 700 !important;
}

/* Hero — kategori/kanal sayfalarıyla aynı görsel aile */
body .ef-contact-page .ef-contact-hero {
    margin-bottom: 14px !important;
    padding: 24px 26px !important;
    color: var(--ef-color-white) !important;
    background:
        linear-gradient(
            105deg,
            var(--ef-color-navy-dark) 0%,
            var(--ef-color-navy) 58%,
            #1c536c 100%
        ) !important;
    border: 1px solid rgba(20, 40, 68, 0.10) !important;
    border-left: 4px solid var(--ef-color-turquoise) !important;
    border-bottom-width: 1px !important;
    border-radius: var(--ef-radius-md) !important;
    box-shadow: var(--ef-shadow-md) !important;
}

body .ef-contact-page .ef-contact-hero::after {
    top: -72px !important;
    right: -48px !important;
    width: 220px !important;
    height: 220px !important;
    border-color: rgba(24, 199, 187, 0.08) !important;
}

body .ef-contact-page .ef-contact-hero-label {
    min-height: 28px !important;
    margin-bottom: 10px !important;
    padding: 5px 10px !important;
    color: #d9fffb !important;
    background: rgba(24, 199, 187, 0.12) !important;
    border-color: rgba(24, 199, 187, 0.30) !important;
    border-radius: var(--ef-radius-sm) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

body .ef-contact-page .ef-contact-hero-title {
    margin-bottom: 7px !important;
    color: var(--ef-color-white) !important;
    font-family: var(--ef-font-sans) !important;
    font-size: 30px !important;
    font-weight: 850 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;
}

body .ef-contact-page .ef-contact-hero-description {
    max-width: 760px !important;
    color: rgba(255, 255, 255, 0.80) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* Ana düzen */
body .ef-contact-page .ef-contact-layout {
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 18px !important;
}

/* Bilgi bandı */
body .ef-contact-page .ef-contact-notice {
    gap: 11px !important;
    margin-bottom: 14px !important;
    padding: 13px 15px !important;
    color: #176f65 !important;
    background: var(--ef-color-success-soft) !important;
    border-color: #c9f1eb !important;
    border-radius: var(--ef-radius-sm) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

body .ef-contact-page .ef-contact-notice-icon {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
    color: var(--ef-color-turquoise-dark) !important;
    border-radius: var(--ef-radius-sm) !important;
}

/* Ortak yüzey */
body .ef-contact-page .ef-contact-form-card,
body .ef-contact-page .ef-contact-info-card,
body .ef-contact-page .ef-contact-ad-card {
    background: var(--ef-color-surface) !important;
    border-color: var(--ef-color-border) !important;
    border-radius: var(--ef-radius-md) !important;
    box-shadow: var(--ef-shadow-sm) !important;
}

body .ef-contact-page .ef-contact-form-card {
    padding: 20px !important;
}

body .ef-contact-page .ef-contact-card-header {
    margin-bottom: 18px !important;
    padding-bottom: 14px !important;
    border-color: var(--ef-color-border) !important;
}

body .ef-contact-page .ef-contact-card-title {
    margin-bottom: 6px !important;
    padding-left: 14px !important;
    color: var(--ef-color-navy) !important;
    font-size: var(--ef-font-size-xl) !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}

body .ef-contact-page .ef-contact-card-title::before {
    width: 3px !important;
    background: var(--ef-color-turquoise) !important;
}

body .ef-contact-page .ef-contact-card-description {
    color: var(--ef-color-muted) !important;
    font-size: var(--ef-font-size-sm) !important;
    line-height: 1.5 !important;
}

/* Form */
body .ef-contact-page .ef-contact-form-group {
    margin-bottom: 16px !important;
}

body .ef-contact-page .ef-contact-form-label {
    margin-bottom: 7px !important;
    color: var(--ef-color-text-soft) !important;
    font-size: var(--ef-font-size-sm) !important;
    font-weight: 700 !important;
}

body .ef-contact-page .ef-contact-form-control {
    min-height: var(--ef-control-height) !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    color: var(--ef-color-text) !important;
    background: var(--ef-color-white) !important;
    border-color: #cbd5e1 !important;
    border-radius: var(--ef-radius-sm) !important;
    font-family: var(--ef-font-sans) !important;
    font-size: 14px !important;
    box-shadow: none !important;
}

body .ef-contact-page .ef-contact-form-control:focus {
    border-color: var(--ef-color-blue) !important;
    box-shadow: 0 0 0 3px rgba(28, 156, 240, 0.12) !important;
}

body .ef-contact-page textarea.ef-contact-form-control {
    min-height: 140px !important;
    padding: 11px 12px !important;
    line-height: 1.55 !important;
}

body .ef-contact-page .ef-contact-submit {
    min-height: var(--ef-control-height) !important;
    padding: 0 16px !important;
    color: var(--ef-color-white) !important;
    background: var(--ef-color-navy) !important;
    border-color: var(--ef-color-navy) !important;
    border-radius: var(--ef-radius-sm) !important;
    font-size: var(--ef-font-size-sm) !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

body .ef-contact-page .ef-contact-submit:hover,
body .ef-contact-page .ef-contact-submit:focus {
    color: var(--ef-color-white) !important;
    background: var(--ef-color-turquoise-dark) !important;
    border-color: var(--ef-color-turquoise-dark) !important;
    box-shadow: var(--ef-shadow-sm) !important;
}

/* Sağ yardım alanı */
body .ef-contact-page .ef-contact-info-card {
    padding: 18px !important;
    border-top: 1px solid var(--ef-color-border) !important;
}

body .ef-contact-page .ef-contact-info-title {
    color: var(--ef-color-navy) !important;
    font-size: var(--ef-font-size-lg) !important;
    font-weight: 800 !important;
}

body .ef-contact-page .ef-contact-info-description {
    margin-bottom: 16px !important;
    color: var(--ef-color-muted) !important;
    font-size: var(--ef-font-size-sm) !important;
    line-height: 1.5 !important;
}

body .ef-contact-page .ef-contact-info-list {
    gap: 10px !important;
}

body .ef-contact-page .ef-contact-info-item {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 11px !important;
    background: var(--ef-color-surface-soft) !important;
    border-color: var(--ef-color-border) !important;
    border-radius: var(--ef-radius-sm) !important;
}

body .ef-contact-page .ef-contact-info-icon {
    width: 38px !important;
    height: 38px !important;
    color: var(--ef-color-turquoise-dark) !important;
    background: var(--ef-color-success-soft) !important;
    border-color: #c9f1eb !important;
    border-radius: var(--ef-radius-sm) !important;
}

body .ef-contact-page .ef-contact-info-heading {
    color: var(--ef-color-navy) !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
}

body .ef-contact-page .ef-contact-info-text {
    color: var(--ef-color-muted) !important;
    font-size: 11.5px !important;
    line-height: 1.4 !important;
}

body .ef-contact-page .ef-contact-ad-card {
    margin-top: 14px !important;
    padding: 8px !important;
}

/* Focus standardı */
body .ef-contact-page a:focus-visible,
body .ef-contact-page button:focus-visible,
body .ef-contact-page input:focus-visible,
body .ef-contact-page textarea:focus-visible {
    outline: 3px solid rgba(28, 156, 240, 0.24) !important;
    outline-offset: 2px !important;
}

@media (max-width: 991.98px) {
    body .ef-contact-page .ef-contact-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
    }

    body .ef-contact-page .ef-contact-sidebar-sticky {
        position: static !important;
    }
}

@media (max-width: 767.98px) {
    body .ef-contact-page {
        margin-top: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 24px !important;
    }

    body .ef-contact-page .container {
        width: 100% !important;
        max-width: none !important;
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    body .ef-contact-page .ef-contact-breadcrumbs {
        margin-bottom: 10px !important;
    }

    body .ef-contact-page .ef-contact-hero {
        margin-bottom: 12px !important;
        padding: 18px 16px !important;
        border-left-width: 3px !important;
        border-radius: var(--ef-radius-md) !important;
    }

    body .ef-contact-page .ef-contact-hero-title {
        font-size: 24px !important;
    }

    body .ef-contact-page .ef-contact-hero-description {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }

    body .ef-contact-page .ef-contact-form-card,
    body .ef-contact-page .ef-contact-info-card {
        padding: 14px !important;
    }

    body .ef-contact-page .ef-contact-card-title {
        font-size: 18px !important;
    }

    body .ef-contact-page .ef-contact-form-control,
    body .ef-contact-page textarea.ef-contact-form-control {
        font-size: 16px !important;
    }
}

@media (max-width: 390px) {
    body .ef-contact-page .container {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    body .ef-contact-page .ef-contact-hero {
        padding: 16px 14px !important;
    }

    body .ef-contact-page .ef-contact-hero-title {
        font-size: 22px !important;
    }
}
