/* ════════════════════════════════════════════════════════════════════
   İDx QuantLabs — Tema Sistemi  (Koyu / Açık / Otomatik)
   ════════════════════════════════════════════════════════════════════ */

/* ── Özel değişkenler: Koyu tema (varsayılan / CYBORG uyumlu) ────── */
:root {
    --idx-bg-0:         #060606;
    --idx-bg-1:         #0d0d0d;
    --idx-bg-2:         #1a1a2e;
    --idx-border:       #2a2a2a;
    --idx-txt-1:        #adafae;
    --idx-txt-2:        #6c757d;
    --idx-accent:       #2196f3;
    --idx-mark-clr:     #f5c049;

    /* Config-row bileşenleri */
    --idx-input-bg:     #1e2a38;
    --idx-input-color:  #eceff1;
    --idx-input-border: #37474f;
    --idx-label-color:  #cfd8dc;
    --idx-desc-color:   #607d8b;

    /* Card header */
    --idx-ch-bg:        #1e2538;
    --idx-ch-color:     #cfd8dc;
    --idx-ch-border:    #37474f;
    --idx-hr-color:     #37474f;
}

/* ── Açık tema değişkenleri ──────────────────────────────────────── */
html[data-theme="light"] {
    --idx-bg-0:         #f4f7fb;
    --idx-bg-1:         #ffffff;
    --idx-bg-2:         #eef2f8;
    --idx-border:       #d0d7e2;
    --idx-txt-1:        #212529;
    --idx-txt-2:        #4f5f76;
    --idx-accent:       #1565c0;
    --idx-mark-clr:     #b87000;

    --idx-input-bg:     #ffffff;
    --idx-input-color:  #212529;
    --idx-input-border: #adb5bd;
    --idx-label-color:  #343a40;
    --idx-desc-color:   #6c757d;

    --idx-ch-bg:        #e8eef7;
    --idx-ch-color:     #343a40;
    --idx-ch-border:    #d0d7e2;
    --idx-hr-color:     #dee2e6;

    /* Bootstrap 5 ana değişkenleri */
    --bs-body-bg:                  #f4f7fb;
    --bs-body-bg-rgb:              244, 247, 251;
    --bs-body-color:               #212529;
    --bs-body-color-rgb:           33, 37, 41;
    --bs-secondary-color:          rgba(33,37,41,0.75);
    --bs-border-color:             #d0d7e2;
    --bs-border-color-translucent: rgba(0,0,0,0.15);

    --bs-card-bg:                  #ffffff;
    --bs-card-cap-bg:              rgba(0,0,0,0.03);
    --bs-card-border-color:        rgba(0,0,0,0.12);

    --bs-nav-tabs-border-color:                  #d0d7e2;
    --bs-nav-tabs-link-active-bg:                #ffffff;
    --bs-nav-tabs-link-active-color:             #212529;
    --bs-nav-tabs-link-active-border-color:      #d0d7e2 #d0d7e2 #ffffff;
    --bs-nav-link-color:                         #495057;
    --bs-nav-link-hover-color:                   #212529;

    --bs-modal-bg:                 #ffffff;
    --bs-modal-color:              #212529;
    --bs-modal-header-border-color:#dee2e6;

    --bs-table-color:              #212529;
    --bs-table-bg:                 transparent;
    --bs-table-border-color:       #dee2e6;
}

/* ── Açık tema: Bootstrap bileşen geçersiz kılmaları ────────────── */
html[data-theme="light"] body {
    background-color: #f4f7fb !important;
    color: #212529 !important;
}
html[data-theme="light"] .card {
    background-color: #ffffff !important;
    border-color: #d0d7e2 !important;
    color: #212529 !important;
}
html[data-theme="light"] .card-header {
    background-color: #e8eef7 !important;
    border-bottom-color: #d0d7e2 !important;
    color: #343a40 !important;
}
html[data-theme="light"] .card-body {
    background-color: #ffffff;
}
html[data-theme="light"] .nav-tabs {
    border-bottom-color: #d0d7e2;
}
html[data-theme="light"] .nav-tabs .nav-link {
    color: #495057;
}
html[data-theme="light"] .nav-tabs .nav-link.active {
    background-color: #ffffff;
    border-color: #d0d7e2 #d0d7e2 #ffffff;
    color: #212529;
}
html[data-theme="light"] .nav-tabs .nav-link:hover {
    border-color: #e9ecef #e9ecef #dee2e6;
    color: #212529;
}
html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select,
html[data-theme="light"] input[type="date"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="text"] {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #ced4da !important;
}
html[data-theme="light"] .form-check-input {
    background-color: #ffffff;
    border-color: #adb5bd;
}
html[data-theme="light"] .form-label,
html[data-theme="light"] label {
    color: #343a40;
}
html[data-theme="light"] .text-muted {
    color: #6c757d !important;
}
html[data-theme="light"] hr {
    border-color: #dee2e6 !important;
    opacity: 0.5;
}
html[data-theme="light"] .modal-content {
    background-color: #ffffff;
    color: #212529;
}
html[data-theme="light"] .modal-header,
html[data-theme="light"] .modal-footer {
    border-color: #dee2e6;
    background-color: #f8f9fa;
}
html[data-theme="light"] .btn-outline-secondary {
    color: #495057;
    border-color: #6c757d;
}
html[data-theme="light"] .btn-outline-secondary:hover {
    background-color: #6c757d;
    color: #fff;
}
html[data-theme="light"] .btn-close {
    filter: none;
}
html[data-theme="light"] .badge.bg-secondary {
    background-color: #6c757d !important;
    color: #fff;
}

/* ── Dash DataTable açık tema ─────────────────────────────────────── */
html[data-theme="light"] .dash-spreadsheet-container .dash-header,
html[data-theme="light"] .dash-spreadsheet-container th {
    background-color: #e8eef7 !important;
    color: #343a40 !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .dash-spreadsheet-container td,
html[data-theme="light"] .dash-spreadsheet-container .dash-cell {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .dash-spreadsheet-container .dash-cell:hover {
    background-color: #f0f4fa !important;
}
html[data-theme="light"] .dash-spreadsheet .dash-filter input {
    background-color: #f8f9fa !important;
    color: #212529 !important;
    border-color: #ced4da !important;
}
html[data-theme="light"] .previous-page, html[data-theme="light"] .next-page,
html[data-theme="light"] .last-page,     html[data-theme="light"] .first-page {
    fill: #495057;
}
html[data-theme="light"] .page-number {
    color: #495057;
}

/* ── İDx marka stili — t.idx.cx global.css .logo-i ile aynı ────── */
.idx-mark {
    color: #ffd166;                   /* altın sarısı — koyu+açık temada sabit */
    font-style: italic;
    font-weight: 900;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 1.12em;
    letter-spacing: -0.05em;
    text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}
.idx-title-main {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 0.92rem;
    font-weight: 700;
    color: #c8d8e8;
    letter-spacing: 0.01em;
    white-space: nowrap;
    line-height: 1;
}
.idx-title-sub {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 0.80rem;
    font-weight: 400;
    color: #7a8fa8;
    letter-spacing: 0.01em;
    white-space: nowrap;
}
html[data-theme='light'] .idx-title-main { color: #1e3a5a; }
html[data-theme='light'] .idx-title-sub  { color: #4f6a82; }

/* ── Logo ikonu ──────────────────────────────────────────────────── */
.idx-logo-icon {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid rgba(79,195,247,0.18);
    margin-right: 10px;
    flex-shrink: 0;
    vertical-align: middle;
    display: block;
}

/* ── Tema geçiş butonu grubu ─────────────────────────────────────── */
.idx-theme-switcher {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    background: rgba(128,128,128,0.12);
    border-radius: 8px;
    padding: 3px;
}
.idx-theme-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 5px;
    border: none;
    background: transparent;
    color: var(--idx-txt-2);
    font-size: 0.72rem;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
    line-height: 1.4;
}
.idx-theme-btn:hover {
    background: rgba(128,128,128,0.2);
    color: var(--idx-txt-1);
}
.idx-theme-btn.active {
    background: var(--idx-accent);
    color: #fff !important;
}
html[data-theme="light"] .idx-theme-switcher {
    background: rgba(0,0,0,0.07);
}
html[data-theme="light"] .idx-theme-btn {
    color: #495057;
}
html[data-theme="light"] .idx-theme-btn:hover {
    background: rgba(0,0,0,0.09);
    color: #212529;
}

/* ── Copyright footer ────────────────────────────────────────────── */
.idx-footer-text {
    color: var(--idx-txt-2);
    font-size: 0.72rem;
    letter-spacing: 0.04em;
}

/* ── Collapse toggle düğmesi açık temada ─────────────────────────── */
html[data-theme="light"] .btn-link {
    color: #495057;
}

/* ── Açık tema: Plotly grafik arka planları ──────────────────────── */
/* paper_bgcolor → .svg-container div inline style override */
html[data-theme="light"] .svg-container {
    background: #f4f7fb !important;
}
/* plot_bgcolor → SVG rect.bg fill override */
html[data-theme="light"] .js-plotly-plot .bg {
    fill: #eef2f8 !important;
}
/* Legend arka planı ayrıca */
html[data-theme="light"] .js-plotly-plot .legend .bg {
    fill: rgba(255,255,255,0.92) !important;
    stroke: #d0d7e2 !important;
}
/* Tüm metin öğeleri (eksen etiketleri, tick yazıları, başlıklar) */
html[data-theme="light"] .js-plotly-plot text {
    fill: #344563 !important;
}
/* Kılavuz çizgileri */
html[data-theme="light"] .js-plotly-plot .gridlayer .xgrid,
html[data-theme="light"] .js-plotly-plot .gridlayer .ygrid {
    stroke: #d0d7e2 !important;
    stroke-opacity: 0.8 !important;
}
/* Sıfır çizgileri */
html[data-theme="light"] .js-plotly-plot .zerolinelayer .xzl,
html[data-theme="light"] .js-plotly-plot .zerolinelayer .yzl {
    stroke: #adb5bd !important;
}
/* Eksen çizgileri */
html[data-theme="light"] .js-plotly-plot .xlines-above path,
html[data-theme="light"] .js-plotly-plot .ylines-above path {
    stroke: #ced4da !important;
}
/* Range slider */
html[data-theme="light"] .js-plotly-plot .rangeslider-mask-min,
html[data-theme="light"] .js-plotly-plot .rangeslider-mask-max {
    fill: rgba(0,0,0,0.08) !important;
}
html[data-theme="light"] .js-plotly-plot .rangeslider-slidebox {
    stroke: #adb5bd !important;
}

/* ── Açık tema: card-body !important (inline stil geçersiz kılma) ── */
html[data-theme="light"] .card-body {
    background-color: #ffffff !important;
    color: #212529 !important;
}

/* ── Açık tema: Modal body ─────────────────────────────────────── */
html[data-theme="light"] .modal-body {
    background-color: #ffffff !important;
    color: #212529 !important;
}
html[data-theme="light"] .modal-content {
    background-color: #ffffff !important;
}

/* ── Açık tema: Toast bildirimi ──────────────────────────────────── */
html[data-theme="light"] .toast {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .toast-header {
    background-color: #f8f9fa !important;
    color: #343a40 !important;
    border-bottom-color: #dee2e6 !important;
}
html[data-theme="light"] .toast-body {
    color: #212529 !important;
}

/* ── Açık tema: Card header metin renkleri ────────────────────────── */
html[data-theme="light"] .card-header strong,
html[data-theme="light"] .card-header h5,
html[data-theme="light"] .card-header h6 {
    color: #343a40 !important;
}
html[data-theme="light"] .card-header small,
html[data-theme="light"] .card-header .text-muted {
    color: #6c757d !important;
}

/* ── Açık tema: Hardcoded açık gri metinler ──────────────────────── */
/* h4 stat değerleri hariç diğer muted spanlar */
html[data-theme="light"] small[style*="#90a4ae"],
html[data-theme="light"] small[style*="#78909c"],
html[data-theme="light"] small[style*="#b0bec5"],
html[data-theme="light"] div[style*="color: #b0bec5"],
html[data-theme="light"] div[style*="color: #90a4ae"],
html[data-theme="light"] span[style*="color: #607d8b"],
html[data-theme="light"] span[style*="color: #546e7a"],
html[data-theme="light"] span[style*="color: #455a64"] {
    color: #495057 !important;
}
html[data-theme="light"] span[style*="color: #cfd8dc"],
html[data-theme="light"] div[style*="color: #cfd8dc"],
html[data-theme="light"] strong[style*="color: #cfd8dc"] {
    color: #343a40 !important;
}

/* ── Açık tema: İndikatör bölümü çizgisi ────────────────────────── */
html[data-theme="light"] [style*="border-bottom"][style*="#37474f"],
html[data-theme="light"] [style*="borderBottom"][style*="#37474f"] {
    border-bottom-color: #dee2e6 !important;
    border-color: #dee2e6 !important;
}

/* ── Açık tema: Progress bar ─────────────────────────────────────── */
html[data-theme="light"] .progress {
    background-color: #e9ecef !important;
}

/* ── Açık tema: Dropdown menü ────────────────────────────────────── */
html[data-theme="light"] .dropdown-menu {
    background-color: #ffffff !important;
    border-color: #d0d7e2 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
html[data-theme="light"] .dropdown-item {
    color: #212529 !important;
}
html[data-theme="light"] .dropdown-item:hover {
    background-color: #e8eef7 !important;
}

/* ── Açık tema: Badge renk düzeltmesi ────────────────────────────── */
html[data-theme="light"] .badge {
    color: #fff !important;
}

/* ── Açık tema: Scrollbar ─────────────────────────────────────────── */
html[data-theme="light"] ::-webkit-scrollbar { width: 7px; height: 7px; }
html[data-theme="light"] ::-webkit-scrollbar-track { background: #f4f7fb; }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #c0c8d8; border-radius: 4px; }
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #8a96a8; }

/* ── Açık tema: DatePicker / React Dates ─────────────────────────── */
html[data-theme="light"] .DateInput,
html[data-theme="light"] .DateInput_input {
    background-color: #ffffff !important;
    color: #212529 !important;
}
html[data-theme="light"] .DateRangePickerInput,
html[data-theme="light"] .SingleDatePickerInput {
    background-color: #ffffff !important;
    border-color: #ced4da !important;
}
html[data-theme="light"] .DayPicker_transitionContainer {
    background-color: #ffffff;
}
html[data-theme="light"] .CalendarDay__default {
    background: #ffffff;
    color: #212529;
    border-color: #f0f0f0;
}
html[data-theme="light"] .CalendarDay__default:hover {
    background: #e8eef7;
}
html[data-theme="light"] .CalendarDay__selected {
    background: #1565c0 !important;
    color: #ffffff !important;
}
html[data-theme="light"] .DayPickerNavigation_button {
    border-color: #d0d7e2;
}

/* ── Giriş sayfası stilleri ──────────────────────────────────────── */
.login-page-body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0d0d0d 0%, #1a1a2e 60%, #0d0d0d 100%);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 1rem;
}
.login-card {
    background: #111827;
    border: 1px solid #2a2a3a;
    border-radius: 14px;
    padding: 2.2rem 2.4rem;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 16px 48px rgba(0,0,0,0.5);
}
.login-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 1.8rem;
}
.login-brand img { width: 44px; height: 44px; border-radius: 10px; }
.login-brand-main {
    font-size: 1.05rem;
    font-weight: 700;
    color: #c8d8e8;
    line-height: 1.2;
}
.login-brand-sub {
    font-size: 0.76rem;
    color: #7a8fa8;
}
.login-mark {
    color: #ffd166;
    font-style: italic;
    font-weight: 900;
}
.login-form label {
    font-size: 0.78rem;
    color: #90a4ae;
    margin-bottom: 4px;
    display: block;
}
.login-form input {
    width: 100%;
    padding: 0.55rem 0.85rem;
    background: #1e2a38;
    border: 1px solid #37474f;
    border-radius: 7px;
    color: #eceff1;
    font-size: 0.9rem;
    margin-bottom: 1rem;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.2s;
}
.login-form input:focus {
    border-color: #2196f3;
    box-shadow: 0 0 0 3px rgba(33,150,243,0.18);
}
.login-form button {
    width: 100%;
    padding: 0.6rem;
    background: #1565c0;
    border: none;
    border-radius: 7px;
    color: #fff;
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    margin-top: 0.25rem;
}
.login-form button:hover { background: #1976d2; }
.login-error {
    background: rgba(239,83,80,0.12);
    border: 1px solid rgba(239,83,80,0.35);
    border-radius: 6px;
    color: #ef5350;
    font-size: 0.82rem;
    padding: 0.5rem 0.8rem;
    margin-bottom: 1rem;
}
.login-footer {
    text-align: center;
    margin-top: 1.5rem;
    font-size: 0.72rem;
    color: #455a64;
}

/* ── Açık tema: Kullanıcı menü widget ─────────────────────────────── */
.idx-user-widget {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--idx-txt-2);
    cursor: default;
}
.idx-user-widget .idx-user-name {
    font-weight: 600;
    color: var(--idx-txt-1);
}
html[data-theme="light"] .idx-user-widget .idx-user-name { color: #343a40; }

/* ── Mobil uyumluluk: Arkaplan sekmesi ──────────────────────────── */
@media (max-width: 576px) {
    .task-card-row .col-7 { width: 100% !important; max-width: 100%; flex: 0 0 100%; }
    .task-card-row .col-3,
    .task-card-row .col-2 { display: none; }
    .task-card-row .task-action-col { width: 100%; max-width: 100%; flex: 0 0 100%; text-align: left !important; margin-top: 4px; }
    /* Toast: ekran genişliği - 48px (24px her yan) */
    .idx-bg-toast { min-width: calc(100vw - 48px) !important; right: 24px !important; left: 24px !important; }
}
@media (max-width: 767px) {
    /* Header */
    .idx-theme-switcher { transform: scale(0.85); transform-origin: right center; }
    .idx-logo-icon { width: 36px; height: 36px; }
    .idx-title-main { font-size: 0.82rem; }
    .idx-title-sub { font-size: 0.70rem; }
    /* Sinyal Paneli: quick date butonları daha büyük (parmakla tıklanabilir) */
    .idx-quick-btn { font-size: 0.78rem !important; padding: 5px 10px !important; }
    /* Formasyon analizi: grafik yükseklikleri küçülür */
    .idx-pattern-chart { height: 200px !important; }
    .idx-pattern-chart .js-plotly-plot,
    .idx-pattern-chart .plotly { height: 200px !important; }
    /* Formasyon listesi: daha kısa max-yükseklik */
    .idx-pattern-list { max-height: 300px !important; }
    /* İndikatör Testi: equity chart küçülür */
    .idx-si-equity-chart { height: 260px !important; }
    .idx-si-equity-chart .js-plotly-plot,
    .idx-si-equity-chart .plotly { height: 260px !important; }
}

/* ════════════════════════════════════════════════════════════════════
   Açık Tema Derinlemesine Yamalar
   Python layout'taki hardcoded koyu tema renkleri için override'lar.
   ════════════════════════════════════════════════════════════════════ */

/* ── Açık tema: DataTable — daha spesifik header/cell seçicileri ─── */
/* Dash 4.x yapı: .dash-spreadsheet > table > thead/tbody > th/td    */
html[data-theme="light"] .dash-spreadsheet th.dash-header,
html[data-theme="light"] .dash-spreadsheet-inner th.dash-header {
    background-color: #e8eef7 !important;
    color: #343a40 !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .dash-spreadsheet td.dash-cell,
html[data-theme="light"] .dash-spreadsheet-inner td.dash-cell {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #d0d7e2 !important;
}
/* style_data_conditional koyu satır arka planları */
html[data-theme="light"] .dash-spreadsheet td.dash-cell[style*="#2c3e4a"],
html[data-theme="light"] .dash-spreadsheet td.dash-cell[style*="#1a2e2b"],
html[data-theme="light"] .dash-spreadsheet td.dash-cell[style*="#263238"],
html[data-theme="light"] .dash-spreadsheet td.dash-cell[style*="#1e2a38"] {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}
/* Seçili / aktif satır hover rengi */
html[data-theme="light"] .dash-spreadsheet td.dash-cell.cell--selected,
html[data-theme="light"] .dash-spreadsheet td.dash-cell[data-active="true"] {
    background-color: #dce8fa !important;
}

/* ── Açık tema: Koyu arka planlı div/container inline style'ları ─── */
/* BG_COLOR (#1e2a38), CARD_BG (#263238), #2c3e4a, #1e2538, #1a2e2b  */
html[data-theme="light"] [style*="background-color:#1e2a38"],
html[data-theme="light"] [style*="background-color: #1e2a38"],
html[data-theme="light"] [style*="backgroundColor: #1e2a38"] {
    background-color: #f4f7fb !important;
    border-color: var(--idx-border) !important;
}
html[data-theme="light"] [style*="background-color:#263238"],
html[data-theme="light"] [style*="background-color: #263238"],
html[data-theme="light"] [style*="backgroundColor: #263238"] {
    background-color: #ffffff !important;
    border-color: var(--idx-border) !important;
}
html[data-theme="light"] [style*="background-color:#1e2538"],
html[data-theme="light"] [style*="background-color: #1e2538"] {
    background-color: #e8eef7 !important;
}

/* ── Açık tema: Çok açık (görünmez) metin renkleri ─────────────────  */
/* Koyu temada iyi görünen #cfd8dc, #eceff1, #b0bec5 açık temada solar */
html[data-theme="light"] [style*="color:#cfd8dc"],
html[data-theme="light"] [style*="color: #cfd8dc"],
html[data-theme="light"] [style*="color:#eceff1"],
html[data-theme="light"] [style*="color: #eceff1"],
html[data-theme="light"] [style*="color:#c8d8e8"],
html[data-theme="light"] [style*="color: #c8d8e8"],
html[data-theme="light"] [style*="color:#adafae"],
html[data-theme="light"] [style*="color: #adafae"] {
    color: #343a40 !important;
}
html[data-theme="light"] [style*="color:#b0bec5"],
html[data-theme="light"] [style*="color: #b0bec5"],
html[data-theme="light"] [style*="color:#90a4ae"],
html[data-theme="light"] [style*="color: #90a4ae"],
html[data-theme="light"] [style*="color:#78909c"],
html[data-theme="light"] [style*="color: #78909c"] {
    color: #495057 !important;
}

/* ── Açık tema: dcc.Dropdown (Dash Select bileşeni) ─────────────── */
html[data-theme="light"] .Select-control {
    background-color: #ffffff !important;
    border-color: #ced4da !important;
}
html[data-theme="light"] .Select-placeholder,
html[data-theme="light"] .Select-value-label,
html[data-theme="light"] .Select--single > .Select-control .Select-value {
    color: #212529 !important;
}
html[data-theme="light"] .Select-menu-outer {
    background-color: #ffffff !important;
    border-color: #ced4da !important;
}
html[data-theme="light"] .Select-option {
    background-color: #ffffff !important;
    color: #212529 !important;
}
html[data-theme="light"] .Select-option.is-focused {
    background-color: #e8eef7 !important;
}
html[data-theme="light"] .Select-option.is-selected {
    background-color: #dce8fa !important;
    color: #1565c0 !important;
}
html[data-theme="light"] .Select-arrow { border-top-color: #495057 !important; }

/* ── Açık tema: dcc.Upload kutusu ───────────────────────────────── */
html[data-theme="light"] .dash-upload,
html[data-theme="light"] .dash-upload-container {
    border-color: #adb5bd !important;
    background-color: #f8f9fa !important;
    color: #495057 !important;
}

/* ── Açık tema: dcc.Loading overlay ─────────────────────────────── */
html[data-theme="light"] ._dash-loading-overlay,
html[data-theme="light"] ._dash-loading {
    background-color: rgba(255,255,255,0.7) !important;
}

/* ── Açık tema: Bootstrap Checklist & RadioItems form-check-label ── */
html[data-theme="light"] .form-check-label {
    color: #343a40 !important;
}

/* ── Açık tema: Bootstrap Alerts ──────────────────────────────────── */
html[data-theme="light"] .alert-warning { background-color: #fff3cd !important; color: #664d03 !important; border-color: #ffecb5 !important; }
html[data-theme="light"] .alert-info    { background-color: #cff4fc !important; color: #0a4d5e !important; border-color: #b6effb !important; }
html[data-theme="light"] .alert-danger  { background-color: #f8d7da !important; color: #842029 !important; border-color: #f5c2c7 !important; }
html[data-theme="light"] .alert-success { background-color: #d1e7dd !important; color: #0a3622 !important; border-color: #a3cfbb !important; }

/* ── Açık tema: dbc.Badge ───────────────────────────────────────── */
html[data-theme="light"] .badge.bg-dark   { background-color: #495057 !important; color: #fff !important; }
html[data-theme="light"] .badge.bg-light  { background-color: #e9ecef !important; color: #212529 !important; }

/* ── Açık tema: Scrollbar ─────────────────────────────────────── */
html[data-theme="light"] ::-webkit-scrollbar-track { background: #f1f1f1; }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #adb5bd; border-radius: 4px; }
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #868e96; }

/* ── Açık tema: Arkaplan Görev Kartları (idx-task-card) ──────────── */
html[data-theme="light"] .idx-task-card {
    background-color: #f8fafc !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .idx-bg-section-card {
    background-color: #ffffff !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .idx-bg-card-header {
    background-color: #eef2f8 !important;
    border-bottom-color: #d0d7e2 !important;
    color: #343a40 !important;
}
html[data-theme="light"] .idx-bg-card-header strong {
    color: #343a40 !important;
}
html[data-theme="light"] .idx-bg-toast {
    background-color: #ffffff !important;
    border-color: #d0d7e2 !important;
    color: #212529 !important;
}

/* ── Açık tema: İndikatör Testi Sekmesi (idx-si-*) ──────────────── */
html[data-theme="light"] .idx-si-ctrl-card {
    background-color: #ffffff !important;
    border-color: #d0d7e2 !important;
}
html[data-theme="light"] .idx-si-card-header {
    background-color: #eef2f8 !important;
    border-bottom-color: #d0d7e2 !important;
    color: #343a40 !important;
}
html[data-theme="light"] .idx-si-card-header strong {
    color: #343a40 !important;
}

/* ── Mobil: İndikatör Testi Sekmesi ─────────────────────────────── */
@media (max-width: 767px) {
    /* Sol panel (kontroller) tam genişlik — Bootstrap xs=12 ile üstte gösterilir */
    .idx-si-ctrl-card { margin-bottom: 12px; }
    /* Equity chart daha kısa */
    .idx-si-equity-chart { height: 280px !important; }
    .idx-si-equity-chart .js-plotly-plot,
    .idx-si-equity-chart .plotly { height: 280px !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   AÇIK TEMA — Callback Üretimi HTML Tabloları
   (Python inline style override — !important zorunlu)
   ═══════════════════════════════════════════════════════════════════ */

/* ── Session analiz tablosu (#session-analysis-table içi) ──────── */
html[data-theme="light"] #session-analysis-table table th {
    background-color: #e8eef7 !important;
    color: #343a40 !important;
    border-bottom-color: #d0d7e2 !important;
}
html[data-theme="light"] #session-analysis-table table td {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-bottom-color: #e9ecef !important;
}
html[data-theme="light"] #session-analysis-table table tr:nth-child(even) td {
    background-color: #f8fafc !important;
}
/* TOPLAM satırı (is_total → #1e2a38 bg) */
html[data-theme="light"] #session-analysis-table table tr:last-child td {
    background-color: #eef2f8 !important;
    font-weight: 700;
}

/* ── Calibration config metrik tablosu ─────────────────────────── */
html[data-theme="light"] #div-calibration-result table td,
html[data-theme="light"] #calibration-stats-table table td {
    background-color: transparent !important;
    color: #212529 !important;
}

/* ── Reason/nedenler badge'leri (signal_chart callback üretimi) ── */
html[data-theme="light"] #modal-chart-badges span[style*="263238"],
html[data-theme="light"] #modal-chart-badges span[style*="1e2a38"],
html[data-theme="light"] .idx-reason-badge {
    background-color: #e8eef7 !important;
    border-color: #d0d7e2 !important;
    color: #343a40 !important;
}

/* ── Sinyal paneli — genel metin rengi override ─────────────────── */
html[data-theme="light"] #tab-signals .text-muted,
html[data-theme="light"] #tab-signals small {
    color: #6c757d !important;
}

/* ── Dash DataTable — filter satırı ───────────────────────────────── */
html[data-theme="light"] .dash-spreadsheet input.dash-filter {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #ced4da !important;
}

/* ── Dash DataTable — seçili satır global override ────────────────── */
html[data-theme="light"] .dash-spreadsheet td.cell--selected,
html[data-theme="light"] .dash-spreadsheet td.focused {
    background-color: rgba(21,101,192,0.12) !important;
}

/* ── dbc.Checklist açık tema etiket rengi ──────────────────────── */
html[data-theme="light"] .form-check-label {
    color: var(--idx-label-color) !important;
}

/* ── Açık tema nav-tabs backgroundı — CYBORG override ─────────── */
html[data-theme="light"] .nav-tabs {
    background-color: transparent !important;
}
html[data-theme="light"] .tab-content {
    background-color: transparent !important;
}

/* ── Canlı fiyat badge ────────────────────────────────────────────── */
.idx-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    font-size: 0.76rem;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

html[data-theme="light"] .idx-live-badge {
    border-color: rgba(0,0,0,0.1);
    background: rgba(0,0,0,0.04);
}
