/* ==========================================================================
   dm-forms.css — site geneli form standardı + açık/koyu mod kontrastı
   (Tasarım Dili v3 · Sürüm 1, 2026-09-22)

   Her düzende EN SON yüklenir: main → styles_page'den sonra, app →
   dm-menu-manager.css'ten sonra, auth → auth-app.css'ten sonra.

   Tek giriş standardı: 44px yükseklik, dikey ortalı metin, mobilde 16px
   yazı (iOS 16px altındaki kutuya dokununca sayfayı yakınlaştırır), en az
   3:1 kenarlık, görünür odak, select'lerde ok. Renkler WCAG oranı ölçülerek
   seçildi; oranlar yorumlarda.
   ========================================================================== */

/* 1. Token'lar ------------------------------------------------------------ */
:root {
    --dm-input-h: 44px;
    --dm-input-bg: #ffffff;
    --dm-input-text: #131316;
    --dm-input-border: #8F95A1;        /* beyaz üzerinde 3.0:1 */
    --dm-input-border-hover: #6B7079;  /* 5.0:1 */
    --dm-placeholder: #737987;         /* 4.4:1 (eski #ccc 1.6:1) */
    --dm-text-faint: #6B7079;          /* eski #8A8F9A 3.2:1 → 5.0:1 */
    --dm-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23646A76' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
}
html[data-theme="dark"] {
    --dm-input-bg: #1E1E1E;
    --dm-input-text: #F5F5F5;
    --dm-input-border: #63636B;        /* #161616 kart üzerinde 3.0:1 */
    --dm-input-border-hover: #83838C;
    --dm-placeholder: #83838C;         /* #1E1E1E üzerinde 4.4:1 */
    --dm-text-faint: #8E8E96;          /* eski #737373 3.8:1 → 5.6:1 */
    --dm-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23A3A3A3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
}

/* Panel metin tonları: --app-text-muted HİÇ tanımlı değildi, kullanıldığı 5
   yerde #9CA0AA (2.6:1) yedeğine düşüyordu. --app-muted-soft #8a8a8a 3.45:1. */
body.app-modern {
    --app-text-muted: #646A76;         /* 5.4:1 */
    --app-muted-soft: #6B7079;         /* 5.0:1 */
}
html[data-theme="dark"] body.app-modern {
    --app-text-muted: #A3A3A3;
    --app-muted-soft: #8E8E96;
}

/* İşletme formu: "(isteğe bağlı)" ve yer tutucular #94a3b8 (2.6:1) idi. */
body.app-modern .restaurant-form-page {
    --rf-muted-soft: #6B7079;
}
html[data-theme="dark"] body.app-modern .restaurant-form-page {
    --rf-muted-soft: #8E8E96;
}

/* 2. Eski global kurallar (style.css:5-15) -------------------------------
   Aynı seçicilerle, sonra yüklendiği için kazanır: gri (#808080) yazı ve
   #ccc yer tutucu yerine okunur renkler; otomatik doldurma gece modunda
   artık beyaz kutu basmaz. Bileşenlerin kendi daha özgül renkleri geçerli. */
/* Yalnız açık modda: eski gri (#808080) hem açık hem koyu zeminde okunuyordu;
   koyu modda başıboş beyaz bir kutuya açık renk yazı basmamak için orada
   dokunulmaz. :where() özgüllüğü sıfırlar → eski kuralla birebir aynı
   özgüllük, sonra yüklendiği için yalnız onu yener; bileşen renkleri kalır. */
:where(html:not([data-theme="dark"])) input,
:where(html:not([data-theme="dark"])) input[type=text],
:where(html:not([data-theme="dark"])) input[type=password],
:where(html:not([data-theme="dark"])) input[type=email],
:where(html:not([data-theme="dark"])) input[type=number],
:where(html:not([data-theme="dark"])) textarea,
:where(html:not([data-theme="dark"])) select {
    color: #131316;
}
:where(html:not([data-theme="dark"])) input:focus,
:where(html:not([data-theme="dark"])) input[type=text]:focus,
:where(html:not([data-theme="dark"])) input[type=password]:focus,
:where(html:not([data-theme="dark"])) input[type=email]:focus,
:where(html:not([data-theme="dark"])) input[type=number]:focus,
:where(html:not([data-theme="dark"])) textarea:focus {
    color: #131316;
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 40px var(--dm-input-bg) inset !important;
    -webkit-text-fill-color: var(--dm-input-text) !important;
    caret-color: var(--dm-input-text);
}
::placeholder { color: var(--dm-placeholder); opacity: 1; }

/* 3. Panel metin kutuları (.with-border, açılır pencere kutuları) ---------
   46px + 11px dolgu + 1.4 satır yerine 44px, sıfır dikey dolgu, ortalı metin.
   Saat/tarih kutuları (çalışma saatleri kompakt tasarımı) hariç tutulur. */
body.app-modern input.with-border:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=time]):not([type=date]),
body.app-modern select.with-border:not([multiple]),
body.app-modern .popup-tab-content input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=time]):not([type=date]),
body.app-modern .popup-tab-content select:not([multiple]) {
    height: var(--dm-input-h);
    min-height: var(--dm-input-h);
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1.25;
}
body.app-modern input.with-border,
body.app-modern select.with-border,
body.app-modern textarea.with-border,
body.app-modern .popup-tab-content input:not([type=checkbox]):not([type=radio]):not([type=file]),
body.app-modern .popup-tab-content textarea,
body.app-modern .popup-tab-content select,
body.app-modern .dm-mm-search input {
    border-color: var(--dm-input-border) !important;
}
body.app-modern input.with-border:hover,
body.app-modern select.with-border:hover,
body.app-modern textarea.with-border:hover,
body.app-modern .dm-mm-search input:hover {
    border-color: var(--dm-input-border-hover) !important;
}
body.app-modern input.with-border:focus,
body.app-modern select.with-border:focus,
body.app-modern textarea.with-border:focus,
body.app-modern .popup-tab-content input:focus,
body.app-modern .popup-tab-content textarea:focus,
body.app-modern .popup-tab-content select:focus,
body.app-modern .dm-mm-search input:focus {
    border-color: var(--app-primary) !important;
}
/* Simgeli kutularda simge de 44px'e hizalı */
body.app-modern .input-with-icon-left i {
    height: var(--dm-input-h);
    line-height: var(--dm-input-h);
}

/* 4. Select okları --------------------------------------------------------
   `appearance:none` + zorla `background:` kısaltması oku yok ediyordu
   (Ayarlar → fatura il/ilçe, ödeme sayfası). */
body.app-modern select.with-border:not([multiple]),
body.app-modern .popup-tab-content select:not([multiple]),
.checkout-page .ck-field select.with-border {
    background-image: var(--dm-select-arrow) !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 12px 8px !important;
    padding-right: 38px !important;
}
html[dir="rtl"] body.app-modern select.with-border:not([multiple]),
html[dir="rtl"] .checkout-page .ck-field select.with-border {
    background-position: left 14px center !important;
    padding-right: 14px !important;
    padding-left: 38px !important;
}

/* 5. bootstrap-select ------------------------------------------------------
   Etiket (`.filter-option`) 44px satır yüksekliğiyle float ediliyordu; 46px
   kutuda 1px, 42px kutuda taşıyordu. Düğme esnek kutu olur, etiket ortalanır.
   Yalnız panel içeriği ve açılır pencerelerde (başlıktaki dil seçici hariç). */
body.app-modern .dashboard-content-inner .bootstrap-select.btn-group .dropdown-toggle,
body.app-modern .mfp-content .bootstrap-select.btn-group .dropdown-toggle,
.checkout-page .bootstrap-select.btn-group .dropdown-toggle {
    display: flex !important;
    align-items: center;
    line-height: 1.25 !important;
}
body.app-modern .dashboard-content-inner .bootstrap-select.btn-group .dropdown-toggle .filter-option,
body.app-modern .mfp-content .bootstrap-select.btn-group .dropdown-toggle .filter-option,
.checkout-page .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    float: none;
    height: auto;
    line-height: 1.25;
    flex: 1 1 auto;
    min-width: 0;
}
body.app-modern .dashboard-content-inner .with-border.bootstrap-select .dropdown-toggle,
body.app-modern .dashboard-content-inner .bootstrap-select.with-border .dropdown-toggle {
    height: calc(var(--dm-input-h) - 2px);
}

/* 6. Hesap ayarları ≤768px: 42px kutuya 11px dolgu + 20px satır sığmıyordu */
@media (max-width: 768px) {
    body.app-modern .settings-account-box input.with-border,
    body.app-modern .settings-billing-box input.with-border,
    body.app-modern .settings-account-box .input-with-icon-left input,
    body.app-modern .settings-billing-box .input-with-icon-left input {
        height: var(--dm-input-h);
        min-height: var(--dm-input-h);
        padding-top: 0;
        padding-bottom: 0;
    }
    body.app-modern .settings-account-box .input-with-icon-left i,
    body.app-modern .settings-billing-box .input-with-icon-left i {
        height: var(--dm-input-h);
        line-height: var(--dm-input-h);
    }
    body.app-modern .settings-account-box .with-border.bootstrap-select .dropdown-toggle,
    body.app-modern .settings-billing-box .with-border.bootstrap-select .dropdown-toggle,
    body.app-modern .settings-account-box .bootstrap-select.with-border .dropdown-toggle,
    body.app-modern .settings-billing-box .bootstrap-select.with-border .dropdown-toggle {
        height: calc(var(--dm-input-h) - 2px);
    }
}

/* 7. İşletme formu (.rf-input) --------------------------------------------
   style.css'in 16px alt boşluğu sıfırlanmamıştı: her alanın altında fazladan
   boşluk, "Genel URL" kutusunda önek 30px'te, yazı 22px'te duruyordu. */
body.app-modern .restaurant-form-page .rf-input {
    margin: 0;
}
body.app-modern .restaurant-form-page .rf-input:not(textarea) {
    height: var(--dm-input-h);
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1.25;
}
/* Kart/ayraç kenarları açık kalır; yalnız kutular güçlü kenarlık alır. */
body.app-modern .restaurant-form-page .rf-input,
body.app-modern .restaurant-form-page .rf-textarea,
body.app-modern .restaurant-form-page .rf-slug-wrap {
    border-color: var(--dm-input-border);
}
body.app-modern .restaurant-form-page .rf-slug-wrap .rf-input { border-color: transparent; }
@media (min-width: 601px) {
    body.app-modern .restaurant-form-page .rf-slug-wrap { align-items: center; }
}
body.app-modern .restaurant-form-page .rf-slug-wrap .rf-input {
    height: calc(var(--dm-input-h) - 2px);
}
body.app-modern .restaurant-form-page .rf-input:hover { border-color: var(--dm-input-border-hover); }
body.app-modern .restaurant-form-page .rf-slug-wrap .rf-input:hover { border-color: transparent; }

/* 8. Ödeme sayfası (.ck-field) ---------------------------------------------
   Eski kural 46px/10px dolgu/#e2e8f0 kenarlık/beyaz zemin'i !important ile
   sabitliyordu (gece modunda beyaz kutu, 1.3:1 kenarlık). */
.checkout-page .ck-field input.with-border,
.checkout-page .ck-field select.with-border {
    height: var(--dm-input-h) !important;
    min-height: var(--dm-input-h);
    margin: 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.25;
    border-color: var(--dm-input-border) !important;
    background-color: var(--dm-input-bg) !important;
    color: var(--dm-input-text) !important;
}
.checkout-page .ck-field input.with-border:focus,
.checkout-page .ck-field select.with-border:focus {
    border-color: var(--dm-primary, #d7193f) !important;
}
.checkout-page .ck-field label,
.checkout-page .ck-field .form-label {
    color: var(--dm-text, #131316);
}

/* 9. Mobil: 16px yazı (iOS odak yakınlaştırmasını önler) -------------------
   Daha özgül bileşen kuralları 14–15px'te tutuyordu: işletme formu, ödeme,
   menü araması, menü diyalogları, açılır pencereler. */
@media (max-width: 992px) {
    body.app-modern .restaurant-form-page .rf-input,
    body.app-modern .restaurant-form-page .rf-textarea,
    body.app-modern .restaurant-edit-page input.with-border,
    body.app-modern .restaurant-edit-page textarea.with-border,
    body.app-modern .popup-tab-content input:not([type=checkbox]):not([type=radio]):not([type=file]),
    body.app-modern .popup-tab-content textarea,
    body.app-modern .popup-tab-content select,
    body.app-modern .dm-mm-search input,
    body.app-modern .dm-modal-v4 input:not([type=checkbox]):not([type=radio]):not([type=file]),
    body.app-modern .dm-modal-v4 textarea,
    .checkout-page .ck-field input.with-border,
    .checkout-page .ck-field select.with-border {
        font-size: 16px !important;
    }
}

/* 10. Ölçüm sonrası kalan sapmalar ------------------------------------------
   Kupon kutusu: 46px + style.css'ten 48px satır yüksekliği + 16px alt boşluk
   + soluk kenarlık. Yanındaki düğmeyle birlikte 44px'e hizalanır. */
.checkout-page .ck-coupon-form { align-items: stretch; }
.checkout-page .ck-coupon-form input {
    height: var(--dm-input-h);
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1.25;
    border-color: var(--dm-input-border);
    color: var(--dm-input-text);
    background: var(--dm-input-bg);
}
.checkout-page .ck-coupon-form input:focus {
    outline: none;
    border-color: var(--dm-primary, #d7193f);
    box-shadow: 0 0 0 3px var(--dm-primary-soft, rgba(215, 25, 63, .12));
}
.checkout-page .ck-coupon-form .button,
.checkout-page .ck-coupon-form button {
    height: var(--dm-input-h);
    min-height: var(--dm-input-h);
    margin: 0;
}
@media (max-width: 992px) {
    .checkout-page .ck-coupon-form input { font-size: 16px; }
}

/* Çalışma saati kutuları: `input.with-border`'ın 46px min-height'ı kompakt
   satırı büyütüyordu; standart 44px'e hizalanır. */
body.app-modern .business-hours-time input,
body.app-modern .restaurant-form-page .business-hours-time input.with-border {
    height: var(--dm-input-h);
    min-height: var(--dm-input-h);
    padding-top: 0;
    padding-bottom: 0;
}