/* sc — ortak koyu tema. Bootstrap 5.3 dark üstüne panel görünümü, kart/istatistik/kasa bileşenleri.
   Amaç: sade, okunaklı, kâr=yeşil / zarar=kırmızı net vurgular; açıklamalar katlanabilir (göz önünde değil). */

:root {
    --sc-bg: #0b0e14;
    --sc-surface: #141922;
    --sc-surface-2: #1b2130;
    --sc-border: #262e3d;
    --sc-text: #e7ebf3;
    --sc-muted: #8b95a7;
    --sc-primary: #6366f1;
    --sc-primary-2: #818cf8;
    --sc-profit: #22c55e;
    --sc-loss: #f2555a;
    --sc-warn: #f59e0b;
    --sc-crash: #fb923c;
    --sc-dice: #38bdf8;
    --sc-keno: #a78bfa;
}

/* Bootstrap dark değişken incelikleri */
[data-bs-theme="dark"] {
    --bs-body-bg: var(--sc-bg);
    --bs-body-color: var(--sc-text);
    --bs-border-color: var(--sc-border);
    --bs-primary: var(--sc-primary);
    --bs-primary-rgb: 99, 102, 241;
    --bs-link-color: var(--sc-primary-2);
    --bs-link-hover-color: #a5b4fc;
    --bs-emphasis-color: #fff;
}

body {
    background:
        radial-gradient(1200px 600px at 100% -10%, rgba(99,102,241,.10), transparent 60%),
        radial-gradient(1000px 500px at -10% 0%, rgba(56,189,248,.06), transparent 55%),
        var(--sc-bg);
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
}

/* ---- Navbar ---- */
.sc-nav {
    background: rgba(17, 21, 30, .85) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--sc-border);
    position: sticky;
    top: 0;
    z-index: 1030;
}
.sc-brand {
    font-weight: 800;
    letter-spacing: .5px;
    background: linear-gradient(90deg, var(--sc-primary-2), var(--sc-dice));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sc-nav .nav-link {
    color: var(--sc-muted);
    font-weight: 600;
    border-radius: 8px;
    padding: .35rem .8rem;
    transition: color .15s, background .15s;
}
.sc-nav .nav-link:hover { color: var(--sc-text); background: rgba(255,255,255,.04); }
.sc-nav .nav-link.active { color: #fff; background: rgba(99,102,241,.18); }

/* Kasa pill (navbar) */
.kasa-pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .3rem .7rem;
    border-radius: 999px;
    border: 1px solid var(--sc-border);
    background: var(--sc-surface-2);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.kasa-pill .k-label { color: var(--sc-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .5px; }
.kasa-pill .k-val { font-weight: 700; }

.status-dot {
    width: 9px; height: 9px; border-radius: 50%;
    display: inline-block; background: var(--sc-muted);
    box-shadow: 0 0 0 3px rgba(255,255,255,.04);
}
.status-dot.on { background: var(--sc-profit); box-shadow: 0 0 0 3px rgba(34,197,94,.15); }
.status-dot.off { background: var(--sc-loss); box-shadow: 0 0 0 3px rgba(242,85,90,.15); }

/* ---- Kartlar ---- */
.card {
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: 14px;
}
.card-header {
    background: transparent;
    border-bottom: 1px solid var(--sc-border);
    font-weight: 600;
}
.section-title { font-size: .78rem; text-transform: uppercase; letter-spacing: .6px; color: var(--sc-muted); font-weight: 700; }

/* İstatistik kutusu */
.stat { padding: .1rem 0; }
.stat-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .5px; color: var(--sc-muted); font-weight: 600; }
.stat-value { font-size: 1.35rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.stat-value.sm { font-size: 1.05rem; }
.stat-sub { font-size: .75rem; color: var(--sc-muted); }

.text-profit { color: var(--sc-profit) !important; }
.text-loss { color: var(--sc-loss) !important; }
.mono { font-variant-numeric: tabular-nums; }

/* Hero kasa kartı */
.hero-kasa {
    background:
        linear-gradient(135deg, rgba(99,102,241,.18), rgba(56,189,248,.06)),
        var(--sc-surface);
    border: 1px solid rgba(99,102,241,.35);
}
.hero-kasa .big { font-size: 2.4rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }

/* Oyun rozetleri */
.game-badge { font-weight: 700; text-transform: capitalize; }
.game-crash { color: var(--sc-crash); }
.game-dice { color: var(--sc-dice); }
.game-keno { color: var(--sc-keno); }

.pill {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .15rem .55rem; border-radius: 999px;
    border: 1px solid var(--sc-border); background: var(--sc-surface-2);
    font-size: .78rem; font-weight: 600;
}

/* Katlanabilir yardım/açıklama */
details.help {
    border: 1px dashed var(--sc-border);
    border-radius: 10px;
    padding: .4rem .7rem;
    background: rgba(255,255,255,.015);
}
details.help > summary {
    cursor: pointer; color: var(--sc-muted); font-size: .82rem; font-weight: 600;
    list-style: none;
}
details.help > summary::-webkit-details-marker { display: none; }
details.help > summary::before { content: "ⓘ "; color: var(--sc-primary-2); }
details.help[open] > summary { margin-bottom: .5rem; color: var(--sc-text); }
details.help .help-body { font-size: .82rem; color: var(--sc-muted); }

/* Formlar */
.form-control, .form-select {
    background: var(--sc-surface-2);
    border-color: var(--sc-border);
    color: var(--sc-text);
}
.form-control:focus, .form-select:focus {
    background: var(--sc-surface-2);
    color: var(--sc-text);
    border-color: var(--sc-primary);
    box-shadow: 0 0 0 .2rem rgba(99,102,241,.2);
}
.form-control::placeholder { color: #5c6577; }
.input-tag { font-size: .72rem; color: var(--sc-muted); text-transform: uppercase; letter-spacing: .5px; font-weight: 600; margin-bottom: .1rem; display:block; }

/* Tablolar */
.table { --bs-table-bg: transparent; --bs-table-color: var(--sc-text); margin-bottom: 0; }
.table > thead th {
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: .5px;
    border-color: var(--sc-border);
    position: sticky; top: 0; z-index: 1;
}
.table > tbody td { border-color: var(--sc-border); vertical-align: middle; }
.table-hover > tbody > tr:hover > * { background: rgba(255,255,255,.03); }
.scroll-box { max-height: 44vh; overflow: auto; }
.scroll-box::-webkit-scrollbar, .events-box::-webkit-scrollbar { width: 8px; height: 8px; }
.scroll-box::-webkit-scrollbar-thumb, .events-box::-webkit-scrollbar-thumb { background: var(--sc-border); border-radius: 4px; }

/* Olay akışı */
.events-box { max-height: 24vh; overflow: auto; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; }
.events-box > div { padding: .08rem 0; border-bottom: 1px solid rgba(255,255,255,.03); }

/* Butonlar */
.btn-primary { --bs-btn-bg: var(--sc-primary); --bs-btn-border-color: var(--sc-primary); --bs-btn-hover-bg: #4f52e0; --bs-btn-hover-border-color: #4f52e0; }
.btn { border-radius: 9px; font-weight: 600; }
.btn-sm { border-radius: 8px; }

/* Durum şeridi (bot faz) */
.phase {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .25rem .7rem; border-radius: 999px; font-weight: 700; font-size: .8rem;
}
.phase-idle { background: rgba(139,149,167,.15); color: var(--sc-muted); }
.phase-running { background: rgba(34,197,94,.15); color: var(--sc-profit); }
.phase-running-live { background: rgba(242,85,90,.15); color: var(--sc-loss); }
.phase-stopped { background: rgba(242,85,90,.2); color: var(--sc-loss); }

/* Küçük başlık üstü etiket */
.eyebrow { font-size: .72rem; letter-spacing: .6px; text-transform: uppercase; color: var(--sc-muted); font-weight: 700; }

.divider { height: 1px; background: var(--sc-border); border: 0; margin: 1rem 0; }

/* Katlanabilir kart başlığı */
.collapse-toggle { cursor: pointer; user-select: none; }
.collapse-toggle:hover { background: rgba(255,255,255,.02); }
.collapse-chevron { font-style: normal; color: var(--sc-muted); transition: transform .2s ease; display: inline-block; }
.collapse-toggle.collapsed .collapse-chevron { transform: rotate(-90deg); }

@media (max-width: 575.98px) {
    .hero-kasa .big { font-size: 1.9rem; }
    .stat-value { font-size: 1.15rem; }
}