/*
 * 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; }

/* DG-MATCH-DG-TAB-01: maç sayfası DG Tercihi / kupon bloğu */
.app-content .dgp__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.app-content .dgp__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 12px 14px; border-radius: 12px; background: var(--color-surface-2); border: 1px solid var(--color-border); }
.app-content .dgp__label { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--color-accent); min-width: 7.5rem; }
.app-content .dgp__pick { flex: 1 1 14rem; min-width: 0; }
.app-content .dgp__market { color: var(--color-text-secondary); }
.app-content .dgp__pick strong { font-size: 1.05rem; color: var(--color-text); }
.app-content .dgp__odds { font-weight: 700; color: var(--color-text); }
.app-content .dgp__res { font-size: 12.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.app-content .dgp__res--hit { background: #e4f5ec; color: #1f8a50; }
.app-content .dgp__res--miss { background: #fdecea; color: #c9402f; }
.app-content .dgp__lock { flex-basis: 100%; font-size: 12.5px; color: var(--color-text-muted); }
.app-content .dgp__note, .app-content .dgp__msg { margin: 10px 0 0; font-size: 13px; color: var(--color-text-muted); }
.app-content .dgp__msg--lock { padding: 12px 14px; border-radius: 12px; background: #fff7e3; border: 1px solid #f0dca7; color: #6d5013; font-size: 14px; }

/* LOGO-02: üst menü ve çekmecedeki küçük logo (koyu zeminde) */
.wordmark { display: inline-flex; align-items: center; }
.wordmark__logo { display: block; flex: 0 0 auto; width: 34px; height: auto; margin-right: 8px; }
.wordmark__logo img { display: block; width: 100%; height: auto; }

/* DG-PREMIUM-WEB-01: üst menüde Premium işareti (koyu zeminde altın) */
.premium-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; background: linear-gradient(135deg, #f3cf72, #d59f2b); color: #3a2905 !important; font-size: 12.5px; font-weight: 800; letter-spacing: .04em; text-decoration: none !important; box-shadow: 0 2px 10px rgba(213, 159, 43, .35); white-space: nowrap; }
.premium-chip:hover { filter: brightness(1.06); }
/* DG-AUTH-UI-01 — giriş / kayıt (açık görünüm, site renkleri) */
.auth-shell .auth-card { padding: 28px 28px 24px; border-radius: 16px; box-shadow: 0 10px 30px rgba(20, 32, 26, .08); }
.auth-card__kicker { margin: 0; font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-accent, #0b7a45); }
.auth-shell .auth-card__head .page-title { font-size: 1.85rem; }
.auth-shell .auth-card__lead { font-size: 15px; line-height: 1.55; }
.auth-shell .field__label, .auth-shell .field label { font-size: 14px; font-weight: 700; color: var(--color-text); }
.auth-shell .input { min-height: 48px; font-size: 16px; border-radius: 10px; }
.auth-consent { display: grid; gap: 10px; margin: 6px 0 4px; padding: 14px 14px 12px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface-2, #f5f7f6); }
.auth-consent__t { padding: 0 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); }
.auth-shell .check__text { font-size: 14.5px; line-height: 1.45; color: var(--color-text-secondary); }
.auth-shell .check input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--color-accent, #0b7a45); }
.auth-submit { min-height: 52px; font-size: 16.5px; font-weight: 800; border-radius: 12px; }
.auth-forgot { margin: -4px 0 0; text-align: right; font-size: 14px; }
.auth-card__switch { text-align: center; }
.auth-card__switch--box { display: grid; gap: 10px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--color-border); text-align: center; }
.auth-card__switch--box p { margin: 0; font-size: 14.5px; color: var(--color-text-secondary); }
/* Sol marka paneli (≥ 1024 px) */
.auth-rail .ar { display: grid; gap: 14px; align-content: center; }
/* DG-AUTH-RAIL-FIX-01 (15.10): panel metinleri sabit beyazdı → açık zeminde görünmüyordu. Renkler tema değişkenlerinden (açık + koyu ikisinde okunur);
   logo saydam PNG, ağır siyah gölge "yapıştırılmış kare" gibi duruyordu → hafif gölge. */
.ar__logo { width: 112px; height: auto; filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .14)); }
.ar__slogan { margin: 4px 0 6px; font: 800 30px/1.15 var(--dg-head, "Bahnschrift", "Segoe UI", sans-serif); color: var(--color-text); }
.ar__slogan span { color: var(--ar-gold, #A8781F); }
.ar__lead { margin: 6px 0 0; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-muted); }
.ar__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ar__list li { display: flex; gap: 10px; align-items: baseline; font-size: 15.5px; line-height: 1.4; color: var(--color-text-secondary); }
.ar__list li span { color: var(--ar-check, #1F8A4C); font-weight: 800; }
.ar__list b { color: var(--color-text); }
.ar__prem { display: block; margin-top: 8px; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(201, 150, 46, .45); background: rgba(227, 179, 74, .10);
  font-size: 14px; color: var(--color-text); text-decoration: none; }
.ar__prem b { color: var(--ar-gold-strong, #8A6214); }
.ar__prem:hover { background: rgba(227, 179, 74, .16); text-decoration: none; }
:root[data-theme="dark"] { --ar-gold: #E3B34A; --ar-gold-strong: #E3B34A; --ar-check: #3ECF7F; }
:root[data-theme="dark"] .ar__logo { filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .35)); }
.ar__list li i { font-style: normal; }
