/* ============================================================
   DX DATEBOX OVERRIDES
   DevExtreme dxDateBox (.dx-date-picker / .dx-date-time-picker)
   gorunumunu native <input type="date" class="new-input"> ile
   esitler.

   SPECIFICITY NOTU — neden her secicide `.dx-editor-outlined` var:
   Ozellestirilmis DevExtreme temasinda su kural mevcut:
       .dx-swatch-custom-scheme-purple-dark .dx-texteditor.dx-editor-outlined
       { border: none !important; }
   Specificity (0,3,0) + !important. Bizim kurallarimiz da en az
   (0,3,1) olmali; bu yuzden seciciler `body` ile baslayip element
   uzerinde `.dx-date-picker.dx-texteditor.dx-editor-outlined`
   (3 class) tasiyor -> (0,3,1), o kurali ezer. Descendant
   kurallar (input/icon) ayni sekilde DevExtreme'in (0,4,0)
   kurallarini (0,4,1)+ ile ezer.

   .new-input referans degerleri (birebir eslesme):
     dark : bg #2e2e2f, border #3b3b41, text #b0b5c3, radius 8px
     light: bg/border/text -> var(--logi-theme-*)

   BORDER NOTU: gercek `border` kullanilir (box-shadow inset child
   arkaplanlarinca orduluyordu). DevExtreme'in box-shadow cercevesi
   ve underlined/filled ::before/::after cizgileri kapatilir.

   !important: DevExtreme tema + logitera-form-theme global
   kurallarini ezmek icin zorunlu (.claude/rules/05-css.md
   DevExtreme istisnasi).

   KAPSAM: yalnizca .dx-date-picker / .dx-date-time-picker.
   ============================================================ */

/* ---- 1) Dis cerceve — .new-input govdesi (dark base) ---- */
body .dx-date-picker.dx-texteditor.dx-editor-outlined,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    border: 1px solid #3b3b41 !important;        /* new-input dark border = rgb(59,59,65) */
    border-radius: 8px !important;
    background-color: #2e2e2f !important;        /* new-input dark bg = rgb(46,46,47) */
    box-shadow: none !important;                 /* DevExtreme inset-shadow cercevesini kapat */
    font-size: 0.85rem !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

/* underlined / filled alt-cizgi pseudo'larini kapat */
body .dx-date-picker.dx-texteditor::before,
body .dx-date-picker.dx-texteditor::after,
body .dx-date-time-picker.dx-texteditor::before,
body .dx-date-time-picker.dx-texteditor::after {
    display: none !important;
}

/* Dark tema arkaplan — tema CSS'indeki
   `body.is-dark .dx-swatch-custom-scheme-purple-dark .dx-texteditor.dx-editor-outlined
    { background-color: #28282b !important }` kurali (0,4,1) bizim
   rule 1'deki (0,3,1) arkaplanimizi eziyordu. Ayni yapiyi (body.is-dark
   + swatch) aynalayip picker class'lariyla (0,5,1)'e cikip ezeriz —
   arkaplan .new-input dark bg (#2e2e2f) olur. */
body.is-dark .dx-swatch-custom-scheme-purple-dark .dx-date-picker.dx-texteditor.dx-editor-outlined,
body.is-dark .dx-swatch-custom-scheme-purple-dark .dx-date-time-picker.dx-texteditor.dx-editor-outlined {
    background-color: #2e2e2f !important;        /* new-input dark bg = rgb(46,46,47) */
}

/* ---- 2) Ic yapi — yukseklik 30px'e otursun, Material padding'i sifirla ---- */
body .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-container,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-container {
    height: 100% !important;
}

/* .dx-texteditor-input-container bir CHILD eleman; kendi arkaplani
   varsa kok texteditor arkaplanini (bizim .new-input rengimizi)
   ortuyor. Saydam yap -> kok arkaplan gorunur. Swatch'li secici
   (0,5,1) ile olasi yuksek-specificity tema kurallarini da ezer.
   `transparent` tema-bagimsiz: tek kural her iki temada calisir. */
body .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input-container,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input-container,
body .dx-swatch-custom-scheme-purple-dark .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input-container,
body .dx-swatch-custom-scheme-purple-dark .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input-container {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
}

body .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input {
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 10px !important;                  /* Material 15px 16px 14px -> new-input yatay padding */
    font-size: 0.85rem !important;
    background: transparent !important;
    color: #b0b5c3 !important;                   /* new-input dark text = rgb(176,181,195) */
}

body .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-placeholder::before,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-placeholder::before {
    padding: 0 10px !important;
    font-size: 0.85rem !important;
    color: #9ca3af !important;                   /* new-input placeholder */
}

/* ---- 3) Hover / Focus — new-input ile ayni ---- */
body .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-hover,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-hover {
    border-color: #4a4a52 !important;
}

body .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-focused,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-focused {
    border-color: #797bf2 !important;            /* protected primary */
    box-shadow: 0 0 0 3px rgba(121, 123, 242, 0.2) !important;
}

/* ---- 4) Takvim ikonu — arkaplan YOK, kucuk ikon ---- */
body .dx-date-picker.dx-editor-outlined .dx-texteditor-buttons-container,
body .dx-date-time-picker.dx-editor-outlined .dx-texteditor-buttons-container,
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button,
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button .dx-button-content,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button .dx-button-content,
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-hover,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-hover,
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-active,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-active,
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-focused,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button.dx-state-focused {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* ikon boyutu — native type=date gostergesi gibi kucuk (24px -> 16px) */
body .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-icon,
body .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-icon {
    color: #9ca3af !important;
    background-color: transparent !important;
    font-size: 16px !important;
}

body .dx-date-picker.dx-editor-outlined.dx-state-focused .dx-dropdowneditor-icon,
body .dx-date-time-picker.dx-editor-outlined.dx-state-focused .dx-dropdowneditor-icon {
    color: #797bf2 !important;
}

body .dx-date-picker.dx-editor-outlined .dx-clear-button-area,
body .dx-date-time-picker.dx-editor-outlined .dx-clear-button-area {
    background: transparent !important;
}

/* ---- 5) Readonly / Disabled ---- */
body .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-readonly,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-readonly,
body .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-disabled,
body .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-disabled {
    background-color: #262629 !important;
    border-color: #3b3b41 !important;
    opacity: 1 !important;
}

/* ============================================================
   6) LIGHT TEMA — body:not(.is-dark)
   new-input light override'lari ile birebir (--logi-theme-*).
   body:not(.is-dark) -> (0,3,1)+, DevExtreme + form-theme'i ezer.
   ============================================================ */
body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined {
    background-color: var(--logi-theme-bg-card) !important;
    border-color: var(--logi-theme-border) !important;
}

body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-texteditor-input {
    color: var(--logi-theme-text-primary) !important;
}

body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined .dx-placeholder::before,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined .dx-placeholder::before {
    color: var(--logi-theme-text-muted) !important;
}

body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-hover,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-hover {
    border-color: var(--logi-theme-border-strong) !important;
}

body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-focused,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-focused {
    border-color: var(--logi-theme-primary) !important;
    box-shadow: 0 0 0 3px rgba(121, 123, 242, 0.15) !important;
}

/* Light tema ikon arkaplanini sil — logitera-form-theme.css:2444'teki
   `body:not(.is-dark) .dx-dropdowneditor-button { background ... }`
   (0,2,1) kuralini (0,3,1) ile ez */
body:not(.is-dark) .dx-date-picker.dx-editor-outlined .dx-texteditor-buttons-container,
body:not(.is-dark) .dx-date-time-picker.dx-editor-outlined .dx-texteditor-buttons-container,
body:not(.is-dark) .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-button,
body:not(.is-dark) .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-button {
    background: transparent !important;
    background-color: transparent !important;
}

body:not(.is-dark) .dx-date-picker.dx-editor-outlined .dx-dropdowneditor-icon,
body:not(.is-dark) .dx-date-time-picker.dx-editor-outlined .dx-dropdowneditor-icon {
    color: var(--logi-theme-text-muted) !important;
}

body:not(.is-dark) .dx-date-picker.dx-editor-outlined.dx-state-focused .dx-dropdowneditor-icon,
body:not(.is-dark) .dx-date-time-picker.dx-editor-outlined.dx-state-focused .dx-dropdowneditor-icon {
    color: var(--logi-theme-primary) !important;
}

body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-readonly,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-readonly,
body:not(.is-dark) .dx-date-picker.dx-texteditor.dx-editor-outlined.dx-state-disabled,
body:not(.is-dark) .dx-date-time-picker.dx-texteditor.dx-editor-outlined.dx-state-disabled {
    background-color: var(--logi-theme-bg-muted) !important;
    border-color: var(--logi-theme-border) !important;
}