/*
 * DG-SITE-UI-THEME-01 — İstatistikler sayfasında sahibin onayladığı açık, sade görünümün sitenin tamamına yayılması (sahip kararı 11.10).
 * YALNIZ GÖRÜNÜM: işaretleme ve veri değişmez. Sitenin kendi renk değişkenleri içerik alanında (.app-content, .auth-shell) açık tonlarla
 * yeniden tanımlanır; üst menü, yan çekmece, alt çubuk ve site altlığı koyu kalır. app.css'ten SONRA yüklenir (layouts/app.php, auth.php).
 * Çalışma Odası (layouts/workroom.php) bu dosyayı YÜKLEMEZ. İstatistikler sayfasının kendi stats.css'i (.sx) bunun üzerine gelir.
 * Yazı tipi: CSP font-src içermediği için yalnız cihaz yazı tipleri (başlık: Bahnschrift → Roboto Condensed → Arial Narrow).
 */

.app-content,
.auth-shell {
    --color-bg: #eef2f0;
    --color-surface: #ffffff;
    --color-surface-2: #f5f7f6;
    --color-surface-3: #e8eeeb;
    --color-border: #dde3e0;
    --color-border-strong: #c7d0cb;
    --color-text: #14201a;
    --color-text-secondary: #46554d;
    --color-text-muted: #5b6a63;
    --color-text-tertiary: #5b6a63;   /* account.css bu adı kullanır (app.css tanımlamaz) */
    --color-accent: #0b7a45;
    --color-accent-fill: #0b7a45;
    --color-accent-fill-hover: #096a3c;
    --color-accent-contrast: #ffffff;
    --color-accent-soft: #e3f3ea;
    --color-gold: #8a6512;
    --color-gold-soft: #fbf3e0;
    --color-coming: #8a6512;
    --color-coming-soft: #fbf3e0;
    --color-success: #1f8a50;
    --color-success-soft: #e4f5ec;
    --color-warning: #9a5b07;
    --color-warning-soft: #fff6e5;
    --color-danger: #c9402f;
    --color-danger-soft: #fdecea;
    --color-info: #2c5f9e;
    --color-info-soft: #e8f0fa;
    --color-focus: #0b7a45;
    --shadow-1: 0 1px 2px rgba(20, 32, 26, .08);
    --dg-head: "Bahnschrift", "Roboto Condensed", "Arial Narrow", "Segoe UI", system-ui, sans-serif;

    color-scheme: light;
    color: var(--color-text);
}

/* İçerik zemini açık; site altlığı ve menüler koyu kalır */
.app-main { background: #eef2f0; }
.auth-shell { background: #eef2f0; }
.app-content ::selection, .auth-shell ::selection { background: rgba(11, 122, 69, .2); }
.app-content a { color: var(--color-accent); }
.app-content .num, .app-content td { font-variant-numeric: tabular-nums; }
.app-content :focus-visible, .auth-shell :focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }

/* --- Yazı: başlıklar dar, kalın başlık yazı tipiyle --- */
.app-content .page-title, .auth-shell .page-title { font-family: var(--dg-head); font-weight: 700; letter-spacing: .005em; color: var(--color-text); }
.app-content .section-title, .app-content .stats-sub { font: 700 1.25rem/1.15 var(--dg-head); letter-spacing: .01em; color: var(--color-text); }
.app-content .eyebrow, .auth-shell .eyebrow { color: var(--color-accent); }

/* --- Paneller / kartlar --- */
.app-content .panel, .auth-shell .panel, .auth-shell .auth-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: 0 1px 2px rgba(20, 32, 26, .05); }

/* --- Form öğeleri --- */
.app-content .input, .auth-shell .input { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.app-content .input:hover, .auth-shell .input:hover { border-color: var(--color-border-strong); }
.app-content .input:disabled { background: var(--color-surface-2); color: var(--color-text-muted); }
.app-content .btn--primary, .auth-shell .btn--primary { background: var(--color-accent-fill); border-color: var(--color-accent-fill); color: #fff; }
.app-content .btn--primary:hover, .auth-shell .btn--primary:hover { background: var(--color-accent-fill-hover); }
.app-content .btn--secondary, .app-content .btn--ghost, .auth-shell .btn--secondary, .auth-shell .btn--ghost { background: var(--color-surface); border-color: var(--color-border); color: var(--color-accent); }
.app-content .btn--secondary:hover, .app-content .btn--ghost:hover, .auth-shell .btn--secondary:hover, .auth-shell .btn--ghost:hover { background: var(--color-accent-soft); }

/* --- Tablolar --- */
.app-content .table thead th { background: var(--color-surface-2); color: var(--color-text-muted); font-weight: 600; border-bottom: 1px solid var(--color-border); }
.app-content .table tbody tr:hover { background: var(--color-surface-2); }

/* --- Etiketler: koyu temanın yarı saydam çerçeve renkleri açık zeminde --- */
.app-content .tag--warning, .app-content .st-badge--warn, .app-content .state-badge--unavailable, .app-content .state--unavailable .state__badge { border-color: #ecc98f; }
.app-content .tag--accent, .app-content .day-chip--live { border-color: #9fd3b7; }
.app-content .tag--gold, .app-content .pending-module--gold .pending-module__tag, .app-content .dgc-card__premium-cta { border-color: #e2c98c; }
.app-content .st-badge--ok, .app-content .state--available .state__badge, .app-content .state-badge--available { border-color: #9fd3b7; }
.app-content .state--not-connected .state__badge, .app-content .state-badge--not-connected { border-color: #a9c3e2; }
.app-content .state--unavailable { border-color: #ecc98f; }
.app-content .pending-module, .app-content .pending-module__tile { background: var(--color-surface-2); }

/* --- Sayfa başlığı bandı (Maçlar, Analizler, DG Tercihleri / Önerileri): İstatistikler başlığıyla aynı --- */
.app-content .mc-head {
    position: relative; overflow: hidden; align-items: center; gap: 14px 24px; padding: 24px 26px 22px; margin-bottom: 18px; border-radius: 16px; color: #fff;
    background: radial-gradient(circle at 88% 50%, transparent 0 46px, rgba(255, 255, 255, .09) 47px 48px, transparent 49px),
        linear-gradient(90deg, transparent calc(88% - 1px), rgba(255, 255, 255, .09) calc(88% - 1px) calc(88% + 1px), transparent calc(88% + 1px)),
        linear-gradient(135deg, #0a3a27 0%, #0b5e37 55%, #0b7a45 100%);
    box-shadow: 0 6px 20px rgba(10, 58, 39, .18);
}
.app-content .mc-head .eyebrow { margin: 0 0 4px; color: #9fe0bd; font-size: 12px; font-weight: 700; letter-spacing: .1em; }
.app-content .mc-head .mc-head__h1 { margin: 0; font: 700 40px/1.05 var(--dg-head); letter-spacing: .005em; color: #fff; text-wrap: balance; }
.app-content .mc-head .ac-head__lead { margin: 8px 0 0; max-width: 62ch; font-size: 15.5px; line-height: 1.45; color: rgba(255, 255, 255, .88); }
.app-content .mc-head .mc-head__date { margin: 8px 0 0; font-size: 14px; color: rgba(255, 255, 255, .8); }
.app-content .mc-head .tag--accent { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .3); color: #fff; }
.app-content .mc-head .mc-stat { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .2); border-radius: 12px; }
.app-content .mc-head .mc-stat dt { color: #9fe0bd; }
.app-content .mc-head .mc-stat strong, .app-content .mc-head .mc-stat .dash { font: 700 1.7rem/1.1 var(--dg-head); color: #fff; }
.app-content .mc-head .mc-stat small { color: rgba(255, 255, 255, .75); }
.app-content .mc-head a { color: #fff; }

/* --- Ana sayfa üst kartı: aynı yeşil bant --- */
.app-content .home-top {
    position: relative; overflow: hidden; padding: 22px 26px; border: 0; border-radius: 16px; color: #fff;
    background: radial-gradient(circle at 92% 50%, transparent 0 46px, rgba(255, 255, 255, .08) 47px 48px, transparent 49px),
        linear-gradient(135deg, #0a3a27 0%, #0b5e37 55%, #0b7a45 100%);
    box-shadow: 0 6px 20px rgba(10, 58, 39, .18);
}
.app-content .home-top .eyebrow, .app-content .home-top__eyebrow { color: #9fe0bd; }
.app-content .home-top .home-hero__pulse { background: #9fe0bd; box-shadow: 0 0 0 4px rgba(159, 224, 189, .25); }
.app-content .home-top__title { font: 700 1.6rem/1.2 var(--dg-head); letter-spacing: .005em; color: #fff; text-wrap: balance; }
.app-content .home-top__accent { color: #b8ecd0; }
.app-content .home-top__stat dt { color: #9fe0bd; }
.app-content .home-top__stat dd, .app-content .home-top__stat strong { color: #fff; }
.app-content .home-top__stat strong { font: 700 1.35rem/1.1 var(--dg-head); }
.app-content .home-top a { color: #fff; }

/* --- Hesap sayfası başlığı --- */
.app-content .page-header .page-title { font-size: 1.9rem; }

/* --- Maç detayı başlık kartı: yalnız yazı (maç tasarımı ayrıca ele alınacak) --- */
.app-content .me-card__title { font-family: var(--dg-head); letter-spacing: .005em; }

/* --- Sekmeli seçiciler (segmented): alt çizgili sekme görünümü --- */
.app-content .segmented { background: var(--color-surface); border-color: var(--color-border); }
.app-content .segmented__item.is-active, .app-content .segmented__item[aria-current="page"] { background: var(--color-accent-soft); color: var(--color-accent); }

/* --- Yardım balonu (koyu zemin varsayımı) --- */
.app-content .st-help[open] > p { background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border); box-shadow: 0 8px 22px rgba(20, 32, 26, .14); }

@media (max-width: 640px) {
    .app-content .mc-head { padding: 18px 18px 16px; border-radius: 14px; }
    .app-content .mc-head .mc-head__h1 { font-size: 30px; }
    .app-content .mc-head .ac-head__lead { font-size: 14.5px; }
    .app-content .home-top { padding: 18px; border-radius: 14px; }
    .app-content .home-top__title { font-size: 1.3rem; }
}

/* HOTFIX 11.10: DG Tercihleri / Önerileri — bitmemiş maçlar yalnız sayı (kilit kutusu); biten maçlarda sonuç rozeti */
.app-content .mp-locked { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; padding: 14px 16px; border-radius: 12px; background: #fff7e3; border: 1px solid #f0dca7; color: #6d5013; }
.app-content .mp-locked strong { color: #3a2905; }
.app-content .mp-locked span { flex-basis: 100%; font-size: 13px; color: #7a6230; }
.app-content .mp-res { font-weight: 700; border: 0; }
.app-content .mp-res--hit { background: #e4f5ec; color: #1f8a50; }
.app-content .mp-res--miss { background: #fdecea; color: #c9402f; }
