/**
 * NECOX — Iletisim Sayfasi (CSS, v3.55.10)
 *
 * SU/ED pattern birebir uyarlandi. Tum stiller CSS degiskenlerinden gelir.
 * Admin dokunmadigi deger: K1 preset/global token'dan fallback.
 *
 * K-76: background: shorthand
 * K-77: background sonrasi background-image yazma
 * K-43: Efekt onceligi Glass > Transparent > Gradient > Solid
 *
 * @since 3.55.10
 */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   1. SAYFA ZEMINI
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact {
    min-height: var(--necox-page-contact-page-min-height, calc(100vh - 140px));
    display: flex;
    justify-content: center;

    padding-top:    var(--necox-page-contact-page-padding-top,    48px);
    padding-right:  var(--necox-page-contact-page-padding-right,  24px);
    padding-bottom: var(--necox-page-contact-page-padding-bottom, 48px);
    padding-left:   var(--necox-page-contact-page-padding-left,   24px);

    margin-top:    var(--necox-page-contact-page-margin-top,    0);
    margin-bottom: var(--necox-page-contact-page-margin-bottom, 0);

    background: var(--necox-page-contact-page-bg, var(--necox-muted-bg, #fafafa));

    backdrop-filter: var(--necox-page-contact-page-backdrop, none);
    -webkit-backdrop-filter: var(--necox-page-contact-page-backdrop, none);

    position: relative;
}

.necox-page-contact::before {
    content: '';
    display: var(--necox-page-contact-page-overlay-display, none);
    position: absolute;
    inset: 0;
    background-color: var(--necox-page-contact-page-overlay-color, rgba(0,0,0,0.3));
    opacity: var(--necox-page-contact-page-overlay-opacity, 1);
    pointer-events: none;
    z-index: 0;
}
.necox-page-contact > * {
    position: relative;
    z-index: 1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   2. DIS KART (outer — header + grid'i kapsar)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__outer {
    width: 100%;
    max-width: var(--necox-page-contact-outer-max-width, 1100px);

    padding-top:    var(--necox-page-contact-outer-padding-top,    20px);
    padding-right:  var(--necox-page-contact-outer-padding-right,  20px);
    padding-bottom: var(--necox-page-contact-outer-padding-bottom, 20px);
    padding-left:   var(--necox-page-contact-outer-padding-left,   20px);

    border-width: var(--necox-page-contact-outer-border-w, 0.5px);
    border-style: var(--necox-page-contact-outer-border-style, solid);
    border-color: var(--necox-page-contact-outer-border-color, var(--necox-border, #e5e7eb));

    border-top-left-radius:     var(--necox-page-contact-outer-radius-tl, var(--border-radius-lg, 12px));
    border-top-right-radius:    var(--necox-page-contact-outer-radius-tr, var(--border-radius-lg, 12px));
    border-bottom-right-radius: var(--necox-page-contact-outer-radius-br, var(--border-radius-lg, 12px));
    border-bottom-left-radius:  var(--necox-page-contact-outer-radius-bl, var(--border-radius-lg, 12px));

    background: var(--necox-page-contact-outer-bg, var(--necox-white, #fff));
    backdrop-filter: var(--necox-page-contact-outer-backdrop, none);
    -webkit-backdrop-filter: var(--necox-page-contact-outer-backdrop, none);
    box-shadow: var(--necox-page-contact-outer-shadow, 0 1px 2px 0 rgba(0,0,0,.05));

    display: flex;
    flex-direction: column;
    gap: var(--necox-page-contact-outer-gap, 20px);
    margin-left: auto;
    margin-right: auto;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   3. BOX (ortak stil: Header, Form, Info, Map)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__box {
    background: var(--necox-page-contact-box-bg, var(--necox-white, #fff));
    border-width: var(--necox-page-contact-box-border-w, 0.5px);
    border-style: var(--necox-page-contact-box-border-style, solid);
    border-color: var(--necox-page-contact-box-border-color, var(--necox-border, #e5e7eb));

    border-top-left-radius:     var(--necox-page-contact-box-radius-tl, var(--border-radius-lg, 12px));
    border-top-right-radius:    var(--necox-page-contact-box-radius-tr, var(--border-radius-lg, 12px));
    border-bottom-right-radius: var(--necox-page-contact-box-radius-br, var(--border-radius-lg, 12px));
    border-bottom-left-radius:  var(--necox-page-contact-box-radius-bl, var(--border-radius-lg, 12px));

    box-shadow: var(--necox-page-contact-box-shadow, none);
}

/* Header box */
.necox-page-contact__header {
    padding-top:    var(--necox-page-contact-header-padding-top,    36px);
    padding-right:  var(--necox-page-contact-header-padding-right,  40px);
    padding-bottom: var(--necox-page-contact-header-padding-bottom, 32px);
    padding-left:   var(--necox-page-contact-header-padding-left,   40px);
    text-align: var(--necox-page-contact-title-text-align, center);
}

/* Form box */
.necox-page-contact__form-box {
    padding-top:    var(--necox-page-contact-form-padding-top,    36px);
    padding-right:  var(--necox-page-contact-form-padding-right,  36px);
    padding-bottom: var(--necox-page-contact-form-padding-bottom, 36px);
    padding-left:   var(--necox-page-contact-form-padding-left,   36px);
}

/* Info box */
.necox-page-contact__info {
    padding-top:    var(--necox-page-contact-info-padding-top,    24px);
    padding-right:  var(--necox-page-contact-info-padding-right,  28px);
    padding-bottom: var(--necox-page-contact-info-padding-bottom, 24px);
    padding-left:   var(--necox-page-contact-info-padding-left,   28px);
}

/* Map box */
.necox-page-contact__map-box {
    padding: 0;
    overflow: hidden;
    min-height: var(--necox-page-contact-map-min-height, 260px);
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.necox-page-contact__map-box iframe {
    width: 100%;
    height: 100%;
    min-height: var(--necox-page-contact-map-min-height, 260px);
    border: 0;
    display: block;
}
.necox-page-contact__map-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 24px;
    color: var(--necox-muted, #6b7280);
    font-size: 12px;
    text-align: center;
}
.necox-page-contact__map-placeholder svg {
    width: 32px;
    height: 32px;
    opacity: 0.6;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   4. GRID (form + right column)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__grid {
    display: grid;
    grid-template-columns: var(--necox-page-contact-grid-cols, 1.2fr 1fr);
    gap: var(--necox-page-contact-grid-gap, 20px);
}
.necox-page-contact__right {
    display: flex;
    flex-direction: column;
    gap: var(--necox-page-contact-right-gap, 20px);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   5. TIPOGRAFI: title, subtitle, form-title, form-desc, info-title
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__title {
    font-family: var(--necox-page-contact-title-font, inherit);
    font-size: var(--necox-page-contact-title-size, 28px);
    font-weight: var(--necox-page-contact-title-weight, 500);
    line-height: var(--necox-page-contact-title-line-height, 1.25);
    letter-spacing: var(--necox-page-contact-title-letter-spacing, -0.02em);
    text-transform: var(--necox-page-contact-title-text-transform, none);
    text-align: var(--necox-page-contact-title-text-align, center);
    color: var(--necox-page-contact-title-color, var(--necox-text, #111));

    margin-top:    var(--necox-page-contact-title-margin-top,    0);
    margin-bottom: var(--necox-page-contact-title-margin-bottom, 10px);
}

.necox-page-contact__subtitle {
    font-family: var(--necox-page-contact-subtitle-font, inherit);
    font-size: var(--necox-page-contact-subtitle-size, 14px);
    font-weight: var(--necox-page-contact-subtitle-weight, 400);
    line-height: var(--necox-page-contact-subtitle-line-height, 1.6);
    text-align: var(--necox-page-contact-subtitle-text-align, center);
    color: var(--necox-page-contact-subtitle-color, var(--necox-muted, #6b7280));

    margin-top:    var(--necox-page-contact-subtitle-margin-top,    0);
    margin-bottom: var(--necox-page-contact-subtitle-margin-bottom, 0);
}

.necox-page-contact__form-title {
    font-family: var(--necox-page-contact-form-title-font, inherit);
    font-size: var(--necox-page-contact-form-title-size, 18px);
    font-weight: var(--necox-page-contact-form-title-weight, 500);
    color: var(--necox-page-contact-form-title-color, var(--necox-text, #111));
    margin-top:    var(--necox-page-contact-form-title-margin-top,    0);
    margin-bottom: var(--necox-page-contact-form-title-margin-bottom, 6px);
}

.necox-page-contact__form-desc {
    font-family: var(--necox-page-contact-form-desc-font, inherit);
    font-size: var(--necox-page-contact-form-desc-size, 13px);
    line-height: var(--necox-page-contact-form-desc-line-height, 1.6);
    color: var(--necox-page-contact-form-desc-color, var(--necox-muted, #6b7280));
    margin-top:    var(--necox-page-contact-form-desc-margin-top,    0);
    margin-bottom: var(--necox-page-contact-form-desc-margin-bottom, 24px);
}

.necox-page-contact__info-title {
    font-family: var(--necox-page-contact-info-title-font, inherit);
    font-size: var(--necox-page-contact-info-title-size, 16px);
    font-weight: var(--necox-page-contact-info-title-weight, 500);
    color: var(--necox-page-contact-info-title-color, var(--necox-text, #111));
    margin-top:    var(--necox-page-contact-info-title-margin-top,    0);
    margin-bottom: var(--necox-page-contact-info-title-margin-bottom, 12px);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   6. FORM ALANLARI (input + textarea)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__form {
    display: flex;
    flex-direction: column;
    gap: var(--necox-page-contact-field-gap, 16px);
}

.necox-page-contact__field {
    display: block;
}

.necox-page-contact__field label {
    display: block;
    font-family: var(--necox-page-contact-label-font, inherit);
    font-size: var(--necox-page-contact-label-size, 11px);
    font-weight: var(--necox-page-contact-label-weight, 500);
    color: var(--necox-page-contact-label-color, var(--necox-muted, #6b7280));
    text-transform: var(--necox-page-contact-label-text-transform, uppercase);
    letter-spacing: var(--necox-page-contact-label-letter-spacing, 0.06em);
    margin-bottom: var(--necox-page-contact-label-margin-bottom, 6px);
}

.necox-page-contact__field input,
.necox-page-contact__field textarea {
    box-sizing: border-box;
    width: 100%;
    padding: var(--necox-page-contact-field-padding, 11px 14px);

    border-width: var(--necox-page-contact-field-border-w, 0.5px);
    border-style: var(--necox-page-contact-field-border-style, solid);
    border-color: var(--necox-page-contact-field-border-color, var(--necox-input-border, #d1d5db));

    border-top-left-radius:     var(--necox-page-contact-field-radius-tl, var(--border-radius-md, 8px));
    border-top-right-radius:    var(--necox-page-contact-field-radius-tr, var(--border-radius-md, 8px));
    border-bottom-right-radius: var(--necox-page-contact-field-radius-br, var(--border-radius-md, 8px));
    border-bottom-left-radius:  var(--necox-page-contact-field-radius-bl, var(--border-radius-md, 8px));

    background: var(--necox-page-contact-field-bg, var(--necox-input-bg, #fff));
    color: var(--necox-page-contact-field-color, var(--necox-text, #111));
    font-family: var(--necox-page-contact-field-font, inherit);
    font-size: var(--necox-page-contact-field-size, 13px);
    outline: none;
    transition: border-color .15s ease;
}

.necox-page-contact__field input:focus,
.necox-page-contact__field textarea:focus {
    border-color: var(--necox-page-contact-field-focus-color, var(--necox-text, #111));
}

.necox-page-contact__field textarea {
    min-height: var(--necox-page-contact-textarea-min-height, 120px);
    resize: vertical;
    line-height: 1.6;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   7. SUBMIT BUTONU
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__submit {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;

    min-height: var(--necox-page-contact-submit-height, auto);
    padding: var(--necox-page-contact-submit-padding, 13px);

    border-width: var(--necox-page-contact-submit-border-w, 0);
    border-style: var(--necox-page-contact-submit-border-style, solid);
    border-color: var(--necox-page-contact-submit-border-color, transparent);

    border-top-left-radius:     var(--necox-page-contact-submit-radius-tl, var(--border-radius-md, 8px));
    border-top-right-radius:    var(--necox-page-contact-submit-radius-tr, var(--border-radius-md, 8px));
    border-bottom-right-radius: var(--necox-page-contact-submit-radius-br, var(--border-radius-md, 8px));
    border-bottom-left-radius:  var(--necox-page-contact-submit-radius-bl, var(--border-radius-md, 8px));

    background: var(--necox-page-contact-submit-bg, var(--necox-primary, #111));
    box-shadow: var(--necox-page-contact-submit-shadow, none);

    font-family: var(--necox-page-contact-submit-font, inherit);
    font-size: var(--necox-page-contact-submit-size, 13px);
    font-weight: var(--necox-page-contact-submit-weight, 500);
    letter-spacing: var(--necox-page-contact-submit-letter-spacing, 0);
    text-transform: var(--necox-page-contact-submit-text-transform, none);
    color: var(--necox-page-contact-submit-color, var(--necox-primary-fg, #fff));

    margin-top: var(--necox-page-contact-submit-margin-top, 4px);

    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.necox-page-contact__submit:hover,
.necox-page-contact__submit:focus-visible {
    background: var(--necox-page-contact-submit-hover-bg, var(--necox-page-contact-submit-bg, var(--necox-primary, #111)));
    color: var(--necox-page-contact-submit-hover-color, var(--necox-page-contact-submit-color, var(--necox-primary-fg, #fff)));
    border-color: var(--necox-page-contact-submit-hover-border-color, var(--necox-page-contact-submit-border-color, transparent));
    box-shadow: var(--necox-page-contact-submit-hover-shadow, var(--necox-page-contact-submit-shadow, none));
    opacity: .92;
}

.necox-page-contact__submit:disabled {
    opacity: .6;
    cursor: wait;
}

.necox-page-contact__msg {
    margin-top: 12px;
    font-size: 12px;
    line-height: 1.5;
    min-height: 18px;
}
.necox-page-contact__msg--success { color: var(--necox-success, #059669); }
.necox-page-contact__msg--error   { color: var(--necox-danger, #dc2626); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   8. INFO ITEMS (telefon, email, adres, saatler)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-page-contact__info-item {
    display: flex;
    gap: var(--necox-page-contact-info-item-gap, 14px);
    padding-top:    var(--necox-page-contact-info-item-padding-y, 14px);
    padding-bottom: var(--necox-page-contact-info-item-padding-y, 14px);
    border-bottom: 0.5px solid var(--necox-page-contact-info-item-border-color, var(--necox-border, #e5e7eb));
}
.necox-page-contact__info-item:first-child { padding-top: 0; }
.necox-page-contact__info-item:last-child  { padding-bottom: 0; border-bottom: none; }

.necox-page-contact__info-icon {
    width:  var(--necox-page-contact-icon-size, 36px);
    height: var(--necox-page-contact-icon-size, 36px);

    border-radius: var(--necox-page-contact-icon-radius, 8px);
    border-width: var(--necox-page-contact-icon-border-w, 0.5px);
    border-style: var(--necox-page-contact-icon-border-style, solid);
    border-color: var(--necox-page-contact-icon-border-color, var(--necox-border, #e5e7eb));

    background: var(--necox-page-contact-icon-bg, var(--necox-muted-bg, #fafafa));
    color: var(--necox-page-contact-icon-color, var(--necox-muted, #6b7280));

    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.necox-page-contact__info-icon svg {
    width:  var(--necox-page-contact-icon-svg-size, 16px);
    height: var(--necox-page-contact-icon-svg-size, 16px);
    stroke: currentColor;
    fill: none;
    stroke-width: var(--necox-page-contact-icon-stroke-width, 2);
    stroke-linecap: round;
    stroke-linejoin: round;
}

.necox-page-contact__info-body {
    flex: 1;
    min-width: 0;
}

.necox-page-contact__info-label {
    font-family: var(--necox-page-contact-info-label-font, inherit);
    font-size: var(--necox-page-contact-info-label-size, 11px);
    font-weight: var(--necox-page-contact-info-label-weight, 500);
    color: var(--necox-page-contact-info-label-color, var(--necox-muted, #6b7280));
    text-transform: var(--necox-page-contact-info-label-text-transform, uppercase);
    letter-spacing: var(--necox-page-contact-info-label-letter-spacing, 0.08em);
    margin-bottom: var(--necox-page-contact-info-label-margin-bottom, 3px);
}

.necox-page-contact__info-value {
    font-family: var(--necox-page-contact-info-value-font, inherit);
    font-size: var(--necox-page-contact-info-value-size, 13px);
    font-weight: var(--necox-page-contact-info-value-weight, 400);
    line-height: var(--necox-page-contact-info-value-line-height, 1.5);
    color: var(--necox-page-contact-info-value-color, var(--necox-text, #111));
    word-break: break-word;
}

.necox-page-contact__info-value a {
    color: var(--necox-page-contact-info-value-link-color, inherit);
    text-decoration: none;
    transition: color .15s ease;
}
.necox-page-contact__info-value a:hover {
    color: var(--necox-page-contact-info-value-link-hover-color, var(--necox-primary, #111));
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   9. RESPONSIVE
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 1024px) {
    .necox-page-contact__outer { max-width: var(--necox-page-contact-outer-max-width-t, 100%); }
    .necox-page-contact__title { font-size: var(--necox-page-contact-title-size-t, var(--necox-page-contact-title-size, 26px)); }
    .necox-page-contact__subtitle { font-size: var(--necox-page-contact-subtitle-size-t, var(--necox-page-contact-subtitle-size, 14px)); }
}

@media (max-width: 820px) {
    .necox-page-contact {
        padding-top:    var(--necox-page-contact-page-padding-top-m,    32px);
        padding-right:  var(--necox-page-contact-page-padding-right-m,  16px);
        padding-bottom: var(--necox-page-contact-page-padding-bottom-m, 32px);
        padding-left:   var(--necox-page-contact-page-padding-left-m,   16px);
    }
    .necox-page-contact__outer {
        max-width: var(--necox-page-contact-outer-max-width-m, 100%);
        padding: 16px;
        gap: 16px;
    }
    .necox-page-contact__grid { grid-template-columns: 1fr; gap: 16px; }
    .necox-page-contact__right { gap: 16px; }
    .necox-page-contact__header { padding: 28px 24px 24px; }
    .necox-page-contact__form-box { padding: 28px 24px; }
    .necox-page-contact__info { padding: 20px 22px; }
    .necox-page-contact__title { font-size: var(--necox-page-contact-title-size-m, var(--necox-page-contact-title-size, 24px)); }
    .necox-page-contact__subtitle { font-size: var(--necox-page-contact-subtitle-size-m, var(--necox-page-contact-subtitle-size, 13px)); }
}