/* CSS Variables for Classic Light Theme */
:root {
    --bg-base: #eeeeee;
    --bg-panel: #ffffff;
    --bg-panel-hover: #f5f5f5;
    --border-color: #cccccc;
    --text-primary: #333333;
    --text-secondary: #666666;
    --accent-color: #508200; 
    --accent-glow: rgba(80, 130, 0, 0.2);
    --success: #508200;
    --danger: #e50b01;
    --score-win-bg: rgba(46, 125, 50, 0.6);
    --score-win-border: rgba(46, 125, 50, 0.4);
    --score-loss-bg: rgba(198, 40, 40, 0.6);
    --score-loss-border: rgba(198, 40, 40, 0.4);
    --score-draw-bg: rgba(0, 0, 0, 0.6);
    --score-draw-border: rgba(255, 255, 255, 0.05);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    scrollbar-width: auto;
    scrollbar-color: rgba(80, 130, 0, 0.5) rgba(80, 130, 0, 0.05);
}

/* Custom WebKit Scrollbar (Theme Synchronized) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #1a1a1a;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%);
    border-radius: 0;
    border: 1px solid #1a1a1a;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(to bottom, #6aab00 0%, #5a9100 40%, #5a9100 60%, #467300 100%);
}

html {
    font-size: clamp(12.5px, 2.8vw + 3px, 16px); /* Central fluid scaling — telefon aralığında da akışkan (2026-06-01, eski eğri 458px altında 11.5px'e kilitleniyordu) */
}

body {
    font-family: 'Inter', arial, helvetica, sans-serif;
    line-height: 1.35;
    background-color: var(--bg-base);
    color: var(--text-primary);
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Panel utility */
.glass-panel {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

/* Top Navbar */
.top-navbar {
    width: 100%;
    background: #1c1c1c;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    z-index: 100;
}

.top-navbar-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
    height: 70px;
}

.nav-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-brand .brand-name {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 1px;
    color: #ffffff;
    margin: 0;
    line-height: 1;
}

.nav-brand .mc-brand-link {
    display: block;
    text-decoration: none;
    line-height: 0;
}

.nav-brand .mc-brand-logo {
    height: 34px;
    width: auto;
    display: block;
}

/* SEO Faz 1.2 — Visually hidden h1 (semantic markup, screen reader/Google için, görsel etkisi yok) */
.mc-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* SEO Faz 1.3 — "<Entity> Hakkında" descriptive paragraf bloğu (sayfa altı, içerik zenginleştirme) */
.mc-seo-about-block {
    margin-top: 28px;
    margin-bottom: 20px;
}
.mc-seo-about-card {
    background: var(--bg-card, #ffffff);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    padding: 24px 28px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.mc-seo-about-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    margin: 0 0 14px 0;
    line-height: 1.3;
}
.mc-seo-about-subtitle {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #0f172a);
    margin: 18px 0 10px 0;
}
.mc-seo-about-text {
    font-size: 0.92rem;
    line-height: 1.65;
    color: var(--text-secondary, #475569);
    margin: 0 0 12px 0;
}
.mc-seo-about-text strong {
    color: var(--text-primary, #0f172a);
    font-weight: 600;
}
@media (max-width: 768px) {
    .mc-seo-about-card { padding: 18px 20px; }
    .mc-seo-about-title { font-size: 1.1rem; }
    .mc-seo-about-text { font-size: 0.88rem; }
}

/* SEO Faz 2 — Tarihsel sinyaller bloğu (match path SSR inject, og_meta.js) */
.mc-seo-signals-block {
    margin: 28px 0 20px 0;
    background: var(--bg-card, #ffffff);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    padding: 24px 28px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.mc-seo-signals-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding-bottom: 14px;
    margin-bottom: 18px;
}
.mc-seo-signals-block h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    margin: 0 0 8px 0;
    line-height: 1.3;
}
.mc-seo-signals-intro {
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--text-secondary, #475569);
    margin: 0;
}
.mc-seo-signals-group {
    margin: 18px 0 14px 0;
}
.mc-seo-signals-group h3 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #0f172a);
    margin: 0 0 8px 0;
    line-height: 1.35;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
}
.mc-seo-signals-group ul {
    margin: 0;
    padding-left: 22px;
    list-style: disc;
}
.mc-seo-signals-group li {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--text-secondary, #475569);
    margin-bottom: 6px;
}
@media (max-width: 768px) {
    .mc-seo-signals-block { padding: 18px 20px; }
    .mc-seo-signals-block h2 { font-size: 1.1rem; }
    .mc-seo-signals-group h3 { font-size: 0.95rem; }
    .mc-seo-signals-group li { font-size: 0.85rem; }
}

.nav-brand .subtitle {
    font-size: 0.65rem;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 2px;
    text-align: center;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.nav-horizontal-list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
}

.nav-horizontal-list li {
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    color: #dddddd;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
}

.nav-horizontal-list li:hover {
    background: rgba(80, 130, 0, 0.25);
    color: #ffffff;
}

.nav-horizontal-list li.active {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-weight: 600;
    border-color: rgba(255, 255, 255, 0.18);
}

.nav-divider {
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, 0.15);
}

.menu-flag {
    width: 24px;
    height: auto;
    border-radius: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   SEO Ana Menü (2026-05-18) — Ana Sayfa + Lig İncele dropdown
   ═══════════════════════════════════════════════════════════════ */

.mc-main-nav {
    display: inline-flex !important;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mc-main-nav li {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    display: flex;
    margin-right: -1px; /* border overlap — stats-tabs ile birebir */
}
.mc-main-nav li:hover {
    background: transparent !important;
}

/* Lig dashboard .tab-btn ile BIREBIR — keskin köşeler, ovallik YOK */
.mc-nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: linear-gradient(to bottom, #3a3a3a 0%, #2b2b2b 40%, #2b2b2b 60%, #1a1a1a 100%);
    border: 1px solid #444444;
    color: #dddddd;
    padding: 0.6rem 1.75rem;
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    border-radius: 0 !important;
    text-decoration: none;
    line-height: 1.2;
    white-space: nowrap;
    text-transform: none;
    letter-spacing: normal;
}
.mc-nav-btn:hover {
    background: rgba(80, 130, 0, 0.25);
    border-color: rgba(80, 130, 0, 0.6);
    color: #ffffff;
    z-index: 3;
}
.mc-main-nav li:hover {
    z-index: 3 !important;
    background: transparent !important;
}
/* Aktif (Ana Sayfa primary, li.active, dropdown açık) — yeşil gradient */
.mc-nav-btn-primary,
.mc-main-nav li.active .mc-nav-btn,
.mc-dropdown-parent.open .mc-nav-btn {
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%);
    border-color: #416900;
    color: #ffffff;
    font-weight: bold;
    z-index: 2;
}
.mc-nav-btn-primary:hover,
.mc-main-nav li.active .mc-nav-btn:hover,
.mc-dropdown-parent.open .mc-nav-btn:hover {
    background: linear-gradient(to bottom, #6aa50a 0%, #5a9100 40%, #5a9100 60%, #416900 100%);
    border-color: #416900;
    color: #ffffff;
    z-index: 4;
}
.mc-nav-btn-outline {
    /* Tab strip stilinden farklı yok — HTML semantik etiket */
}

.mc-dropdown-parent {
    position: relative;
}
.mc-dropdown-arrow {
    font-size: 0.7rem;
    margin-left: 0.2rem;
    opacity: 0.85;
    transition: transform 0.18s ease;
}
.mc-dropdown-parent.open .mc-dropdown-arrow {
    transform: rotate(180deg);
}

/* Dropdown menu — kurumsal beyaz panel */
.mc-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 280px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.08);
    list-style: none;
    padding: 8px;
    margin: 0;
    z-index: 1000;
    display: none;
}
.mc-dropdown-parent.open .mc-dropdown-menu {
    display: block;
    animation: mcDropdownFade 0.14s ease-out;
}
@keyframes mcDropdownFade {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.mc-dropdown-menu li {
    padding: 0 !important;
    margin: 0;
    border: none !important;
    background: transparent !important;
    display: block;
}
.mc-dropdown-menu li:hover {
    background: transparent !important;
}

/* Lig satırı — grid: bayrak sabit kolon + lig adı */
.mc-dropdown-menu li > a {
    display: grid;
    grid-template-columns: 22px 1fr;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    color: #0f172a;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 6px;
    transition: background 0.12s ease, color 0.12s ease;
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
}
.mc-dropdown-menu li > a:hover {
    background: rgba(80, 130, 0, 0.08);
    color: var(--success);
}

/* Bayrak SVG — desktop sabit boyut 22x15, kurumsal gölge */
.mc-lig-flag {
    width: 22px;
    height: 15px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    display: block;
}
.mc-lig-text {
    white-space: nowrap;
    color: inherit;
}

/* ─── MOBİL — drawer içinde dikey blok, dropdown position:static ─── */
@media (max-width: 900px) {
    .mc-main-nav {
        flex-direction: column !important;
        align-items: stretch;
        gap: 0.4rem;
        width: 100%;
    }
    .mc-main-nav li {
        width: 100%;
        display: block !important;
    }
    .mc-nav-btn {
        width: 100%;
        justify-content: flex-start;
        padding: 8px 14px;
        font-size: 0.78rem;
    }
    .mc-nav-btn-outline {
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.20);
        background: rgba(255, 255, 255, 0.04);
    }
    /* Bayrak küçültme — mobilde 32px yer israfı */
    .mc-lig-flag {
        width: 22px;
        height: 16px;
    }
    .mc-dropdown-menu {
        position: static;
        box-shadow: none;
        border: 1px solid rgba(255, 255, 255, 0.10);
        background: rgba(255, 255, 255, 0.04);
        border-radius: 8px;
        margin: 4px 0 0 0;
        padding: 4px;
        min-width: auto;
        width: 100%;
    }
    .mc-dropdown-menu li > a {
        grid-template-columns: 22px 1fr !important;
        gap: 10px;
        color: #ffffff;
        font-size: 0.88rem;
        padding: 10px 12px;
    }
    .mc-dropdown-menu li > a:hover {
        background: rgba(255, 255, 255, 0.10);
        color: #ffffff;
    }
    .mc-dropdown-arrow {
        margin-left: auto;
    }
}

/* Eski stiller kullanmasın — boş ondan eski .mc-main-nav li padding override */

.mc-main-nav li > a,
.mc-main-nav li > button.mc-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1rem;
    border-radius: 6px;
    color: #dddddd;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

.mc-main-nav li > a:hover,
.mc-main-nav li > button.mc-dropdown-toggle:hover {
    background: rgba(80, 130, 0, 0.25);
    color: #ffffff;
}

.mc-main-nav li.active > a {
    background: rgba(80, 130, 0, 0.20);
    color: var(--success);
    border-color: rgba(80, 130, 0, 0.40);
}

/* Dropdown parent */
.mc-dropdown-parent {
    position: relative;
}

.mc-dropdown-arrow {
    font-size: 0.75rem;
    margin-left: 0.25rem;
    transition: transform 0.15s ease;
}

.mc-dropdown-parent.open .mc-dropdown-arrow {
    transform: rotate(180deg);
}

/* Dropdown menu */
.mc-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 6px;
    min-width: 280px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    list-style: none;
    padding: 6px 0;
    z-index: 1000;
    display: none;
}

.mc-dropdown-parent.open .mc-dropdown-menu {
    display: block;
    animation: mcDropdownFade 0.12s ease-out;
}

@keyframes mcDropdownFade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mc-dropdown-menu li {
    padding: 0;
    margin: 0;
    border: none;
}

.mc-dropdown-menu li > a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    color: #0f172a;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: background 0.12s ease;
}

.mc-dropdown-menu li > a:hover {
    background: #f1f5f9;
    color: #0f172a;
}

.mc-dropdown-menu li > a .fi {
    font-size: 1.4rem;
    border-radius: 2px;
    flex-shrink: 0;
}

.mc-dropdown-menu li > a .mc-lig-incele-text {
    white-space: nowrap;
}

/* MOBİL — dropdown tam genişlik dikey blok */
@media (max-width: 900px) {
    .mc-main-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
        width: 100%;
    }
    .mc-main-nav li > a,
    .mc-main-nav li > button.mc-dropdown-toggle {
        width: 100%;
        justify-content: flex-start;
    }
    .mc-dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        background: rgba(0,0,0,0.04);
        border-radius: 6px;
        margin-top: 4px;
        min-width: auto;
    }
    .mc-dropdown-menu li > a {
        color: #ffffff;
    }
    .mc-dropdown-menu li > a:hover {
        background: rgba(255,255,255,0.08);
        color: #ffffff;
    }
}

/* Workspace Layout */
.workspace-container {
    display: flex;
    flex: 1;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    box-sizing: border-box;
}

/* Main Content */
.main-content {
    flex: 1;
    padding: 2rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* Tighter layout for data density */
    min-width: 0; /* Prevents flex items from overflowing horizontally */
}

/* Right Sidebar (Monetization & Insights) */
.right-sidebar {
    width: 300px;
    min-width: 300px;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    background: var(--bg-panel);
    border-left: 1px solid var(--border-color);
    box-shadow: -2px 0 10px rgba(0,0,0,0.02);
}

.insight-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.insight-card h4 {
    color: var(--text-secondary);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1.5px; /* Slightly wider tracking for overlines */
    margin-bottom: 0.5rem;
}

.insight-card p {
    color: var(--text-primary);
    font-size: 0.95rem; /* Proportional scaling */
    line-height: 1.5;
}

.insight-card p strong {
    color: var(--success);
}

/* Header */
.dashboard-header {
    border-radius: 12px;
    padding: 1.5rem 2.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.league-info h2 {
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.5px;
    margin-bottom: 0.25rem;
}

.league-info p {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.stats {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-end;
}

.stat-line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.stat-line .label {
    font-size: 0.80rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.stat-line .value {
    font-size: 0.80rem;
    font-weight: 700;
    color: var(--accent-color);
    white-space: nowrap;
}

.stat-divider {
    color: var(--border-color);
    font-size: 0.9rem;
    margin: 0 0.25rem;
}

#view-container {
    flex: 1;
    /* Anti-flicker: fadeIn animasyonu kaldırıldı — tab geçişlerinde hayalet yazı sorununa neden oluyordu */
}

/* Teams Grid */
.teams-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); /* Prevent small-device overflow */
    gap: 1.25rem;
}

.team-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 1.5rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
}

.team-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--accent-color);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.team-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    background: var(--bg-panel-hover);
    border-color: #508200;
}

.team-card:hover::before {
    transform: scaleX(1);
}

.team-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.team-logo-placeholder {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    background: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--accent-color);
    border: 1px solid var(--border-color);
}

.team-name {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.5px;
}

.team-stats {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.team-stat-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
}

.team-stat-row .label { color: var(--text-secondary); }
.team-stat-row .val { font-weight: 500; }

/* Squad View */
.squad-view-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.back-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: inherit;
    font-size: 0.9rem;
}

.back-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* Data Table */
.data-table-container {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 0;
    overflow-x: hidden;
}

.data-table {
    width: 100%; /* Tablo panelinin tam genişliğini kullansın */
    border-collapse: collapse; /* Siyah th zemininde görünen dikey beyaz çizgileri kaldırır */
}

.data-table.fixtures-table {
    table-layout: fixed;
    overflow: hidden;
    max-width: 100%;
}

/* Fikstür tablolarında Ev/Dep takım, TD ve Hakem isimleri
   hücre genişliğini aşarsa tek satırda kırpılmak yerine 2. satıra kaysın.
   Mobil davranışı (tek satır + ellipsis) aynen korunuyor, bu kural sadece desktop'ta aktif. */
@media (min-width: 901px) {
    .fixtures-table td.home-team-cell,
    .fixtures-table td.away-team-cell,
    .fixtures-table td.hide-mobile {
        white-space: normal !important;
        line-height: 1.25;
    }
}


.data-table th, 
.data-table td {
    padding: 0.4rem 1rem;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
    font-size: 0.9rem; /* 1 punto dropped */
}

.data-table.compact-table th, 
.data-table.compact-table td {
    padding: 0.3rem 0.5rem;
    font-size: 0.8rem;
}

.data-table.compact-table th {
    font-size: 0.7rem;
    letter-spacing: 0px;
}

.data-table th {
    color: #ffffff;
    font-weight: 600;
    font-size: 0.75rem; /* Dropped from 0.85 */
    letter-spacing: 0.5px;
    text-transform: uppercase;
    background: #1c1c1c; /* Sleek, dark modern header */
    border: 1px solid #333333;
    white-space: normal; /* allow wrapping instead of blowing layout width */
}

.data-table tr:hover td {
    background: #f8fafc; /* Sleek slate-50 hover effect */
}

.data-table tr:last-child td {
    border-bottom: none;
}

.player-cell {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.player-avatar {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%; /* Perfect circle */
    background: #f1f5f9; /* Light slate background */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem; /* Dropped from 0.85 */
    font-weight: 700;
    color: var(--text-primary); /* Dark text for contrast */
    border: 1px solid #e2e8f0;
}

.player-name {
    font-weight: 600;
    font-size: 0.85rem; /* Dropped from 0.95 */
    color: var(--text-primary);
}

.player-position {
    display: inline-block;
    padding: 0.2rem 0;
    width: 42px;
    text-align: center;
    border-radius: 2px;
    font-size: 0.70rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid var(--border-color);
}

/* Premium Readable Position Colors (Dark Text on Light Pastel Backgrounds) */
.pos-gk { color: #854d0e; background: #fef08a; border-color: #fde047; }
.pos-def { color: #075985; background: #e0f2fe; border-color: #bae6fd; }
.pos-mid { color: #166534; background: #dcfce7; border-color: #bbf7d0; }
.pos-fwd { color: #991b1b; background: #fee2e2; border-color: #fecaca; }

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Modal Styles */
.modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(10px);
    z-index: 1000; display: flex; align-items: center; justify-content: center;
    opacity: 0; pointer-events: none; transition: opacity 0.3s ease;
}
.modal-overlay.active { opacity: 1; pointer-events: auto; }
.modal-content {
    width: 96%; max-width: 1400px; max-height: 90vh; overflow-y: auto;
    border-radius: 8px; padding: clamp(1.5rem, 3vw, 2.5rem); position: relative;
    transform: translateY(20px); transition: transform 0.3s;
    background: #ffffff;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
.modal-overlay.active .modal-content { transform: translateY(0); }
.close-btn {
    position: absolute; top: 1rem; right: 1.5rem; background: transparent;
    border: none; color: #666; font-size: 2rem;
    cursor: pointer; transition: color 0.2s;
}
.close-btn:hover { color: #e50b01; }
.player-profile-header { display: flex; gap: 1.5rem; align-items: center; margin-bottom: 2rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1.5rem; }
.player-large-avatar { width: 80px; height: 80px; border-radius: 16px; background: linear-gradient(135deg, var(--accent-color), var(--success)); display: flex; align-items: center; justify-content: center; font-size: 2.5rem; font-weight: 700; color: white;}
.player-profile-details h2 { font-size: 1.7rem; font-weight: 700; margin-bottom: 0.25rem; letter-spacing: -0.5px; }
.player-profile-details p { color: var(--text-secondary); font-size: 0.9rem; }
.stats-table { width: 100%; border-collapse: collapse; margin-top: 1rem; background: transparent; border-radius: 8px; overflow: hidden; table-layout: auto; border: 1px solid var(--border-color); }
.stats-table th, .stats-table td { padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--border-color); text-align: right; vertical-align: middle; font-variant-numeric: tabular-nums; }
.stats-table th { color: #ffffff; font-size: 0.75rem; text-transform: uppercase; background: #000000; font-weight: 600; }
.stats-table tr:hover td { background: rgba(255, 255, 255, 0.05); }
.empty-stats { text-align: center; padding: 3rem; color: var(--text-secondary); font-style: italic; }

/* Metin Sütunlarını Sola Hizala (Sezon, Müsabaka, �Slke, Seviye, Kulüp) */
.stats-table th:nth-child(1), .stats-table td:nth-child(1),
.stats-table th:nth-child(2), .stats-table td:nth-child(2),
.stats-table th:nth-child(3), .stats-table td:nth-child(3),
.stats-table th:nth-child(4), .stats-table td:nth-child(4),
.stats-table th:nth-child(5), .stats-table td:nth-child(5) {
    text-align: left;
}
/* Müsabaka (2) ve Kulüp (5) gibi uzun isimleri biraz daha dar alanda tut ama kaydırma yapmadan sı�xdır */
.stats-table td:nth-child(2), .stats-table td:nth-child(5) {
    max-width: 15vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Stats Tabs */
.stats-tabs {
    display: inline-flex;
    margin-bottom: 1.5rem;
    border-radius: 0;
    align-items: center;
}

.tab-btn {
    /* BACKUP (Ctrl+Z): background: #2b2b2b; */
    background: linear-gradient(to bottom, #3a3a3a 0%, #2b2b2b 40%, #2b2b2b 60%, #1a1a1a 100%);
    border: 1px solid #444444;
    color: #dddddd;
    padding: 0.6rem 1.75rem;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s;
    margin-right: -1px; /* Overlap borders */
    position: relative;
    border-radius: 0;
}

.tab-btn:hover {
    background: rgba(80, 130, 0, 0.25);
    border-color: rgba(80, 130, 0, 0.4);
    color: #ffffff;
    z-index: 1;
}

.tab-btn.active {
    /* BACKUP (Ctrl+Z): background: #508200; */
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%);
    border-color: #416900;
    color: #ffffff;
    font-weight: bold;
    z-index: 2;
}

/* Simulation Engine Styles */
.simulation-container {
    padding: 1rem;
    max-width: 1100px;
    margin: 0 auto;
}

.fade-in {
    animation: fadeIn 0.3s ease forwards;
}

/* Tab pane'lerin opak arka planı: alt katmandaki hayalet yazıları engeller */
.league-tab-pane {
    background: var(--bg-base);
    min-height: 100px;
}

.sim-selectors {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    margin-top: 2.5rem;
}

.team-selector-box {
    flex: 1;
    padding: 2.5rem;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.3s ease;
}

.team-selector-box:hover {
    transform: translateY(-5px);
}

.team-selector-box h3 {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.1rem;
}

.sim-select {
    width: 100%;
    max-width: 250px;
    padding: 8px 12px;
    border-radius: 6px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(0,0,0,0.3);
    color: white;
    font-size: 0.95rem;
    font-family: inherit;
    outline: none;
    cursor: pointer;
    transition: all 0.2s;
    appearance: none;
}

.sim-select:focus {
    border-color: var(--accent-color);
    box-shadow: none;
}

.sim-select option {
    background: #1c1c1c;
    color: white;
}

.sim-select option:checked {
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%) !important;
    background-color: #508200 !important; /* Fallback for browsers that don't support gradient on options */
    color: white !important;
}
.team-preview {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.preview-logo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(255,255,255,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    font-weight: 800;
    color: rgba(255,255,255,0.2);
    border: 2px dashed rgba(255,255,255,0.1);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.preview-logo.active {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(16, 185, 129, 0.05));
    color: var(--success);
    border: 2px solid var(--success);
    box-shadow: 0 10px 25px rgba(16, 185, 129, 0.2);
    transform: scale(1.05);
}

.preview-logo.active.away {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(239, 68, 68, 0.05));
    color: var(--danger);
    border: 2px solid var(--danger);
    box-shadow: 0 10px 25px rgba(239, 68, 68, 0.2);
}

.preview-name {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--text-primary);
}

.team-preview.empty .preview-name {
    display: none;
}

.sim-vs-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.vs-circle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #f8f8f8;
    border: 1px solid #dddddd;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: 800;
    color: #666666;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.action-btn {
    padding: 1.25rem 3rem;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 2px;
    border-radius: 8px;
    border: none;
    background: #e0e0e0;
    color: #999999;
    cursor: not-allowed;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    font-family: inherit;
    box-shadow: none;
}

.action-btn.ready {
    background: #508200;
    color: white;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    border: 1px solid #416900;
}

.action-btn.ready:hover {
    background: #539900;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.action-btn.ready:active {
    transform: translateY(1px);
}

.text-center {
    text-align: center;
}

/* Custom Flag Glossy Effect */
.pg-flag {
    position: relative;
    overflow: hidden;
}

.pg-flag::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 50%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
    z-index: 10;
}

/* Media Queries for Responsiveness */
@media (max-width: 1250px) {
    .workspace-container {
        flex-direction: column;
    }
    
    .right-sidebar {
        width: 100%;
        min-width: 100%;
        border-left: none;
        border-top: 1px solid var(--border-color);
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .insights-container {
        flex: 1;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 1rem;
    }
}

/* ════════════════════════════════════════════════════════════════════
   MOBILE @media (max-width: 900px) — MODÜLERLEŞTİRİLDİ (2026-05-12)
   ════════════════════════════════════════════════════════════════════
   Önceki 928 satırlık @media (max-width: 900px) bloğu (eski 837-1763)
   5 ayrı dosyaya bölündü:
     - css/mobile-shared.css   → navbar/drawer/auth/sidebar/scrollbar/layout/calendar/shared-table
     - css/mobile-mainpage.css → anasayfa fixture table (.mc-mainpage-table)
     - css/mobile-league.css   → lig sayfası (teams/standings/fixtures/managers/referees)
     - css/mobile-team.css     → takım sayfası (squad/perf/transfers/predictions)
     - css/mobile-match.css    → maç inceleme (sub-tab, form, h2h, smart-stats)
   index.html: 5 ayrı <link> tag (her dosyanın cache buster
'
ı ayrı).
   Disiplin: yeni mobil kural eklerken hangi view's dosyasına ait olduğunu seç.
   ════════════════════════════════════════════════════════════════════ */

@media (max-width: 600px) {
    .dashboard-header {
        padding: 1rem;
    }
    
    .league-info h2 {
        font-size: 1.25rem;
    }
    
    .teams-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .nav-horizontal-list {
        flex-wrap: wrap; /* allow double rows on very narrow phones */
        justify-content: center;
        gap: 0.25rem;
    }
    
    .nav-horizontal-list li {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
    }
}

/* --- RESPONSIVE PITCH CSS --- */
.pitch-container {
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-radius: 8px;
    background: repeating-linear-gradient(
        90deg,
        #4ba027,
        #4ba027 5.55%,
        #479724 5.55%,
        #479724 11.1%
    );
    border: 3px solid rgba(255, 255, 255, 0.7);
    box-shadow: inset 0 0 40px rgba(0,0,0,0.25);
    overflow: hidden;
    aspect-ratio: 1.5 / 1;
    min-height: 500px;
    max-width: 1100px;
}

.pitch-layer {
    position: absolute; top:0; left:0; width:100%; height:100%; pointer-events:none;
}

.pitch-desktop { display: block; }
.pitch-mobile { display: none; }

.pitch-line {
    position: absolute;
    border: 2px solid rgba(255, 255, 255, 0.65);
}
.pitch-circle {
    position: absolute;
    border: 2px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
}
.pitch-point {
    position: absolute;
    width: 6px; height: 6px;
    background: rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

/* DESKTOP LAYOUT */
.pitch-desktop .p-center-line { top:0; bottom:0; left:50%; border-left-width: 2px; }
.pitch-desktop .p-center-circle { top:50%; left:50%; height:25%; }
.pitch-desktop .p-center-spot { top:50%; left:50%; }

.pitch-desktop .p-pen-left { top:20%; bottom:20%; left:0; width:16%; border-left:none; }
.pitch-desktop .p-goal-left { top:35%; bottom:35%; left:0; width:6%; border-left:none; }
.pitch-desktop .p-spot-left { top:50%; left:12%; }

.pitch-desktop .p-pen-right { top:20%; bottom:20%; right:0; width:16%; border-right:none; }
.pitch-desktop .p-goal-right { top:35%; bottom:35%; right:0; width:6%; border-right:none; }
.pitch-desktop .p-spot-right { top:50%; right:12%; }

/* MOBILE LAYOUT */
.pitch-mobile .p-center-line { left:0; right:0; top:50%; border-top-width: 2px; }
.pitch-mobile .p-center-circle { top:50%; left:50%; width:25%; }
.pitch-mobile .p-center-spot { top:50%; left:50%; }

.pitch-mobile .p-pen-bottom { left:20%; right:20%; bottom:0; height:16%; border-bottom:none; }
.pitch-mobile .p-goal-bottom { left:35%; right:35%; bottom:0; height:6%; border-bottom:none; }
.pitch-mobile .p-spot-bottom { left:50%; bottom:12%; }

.pitch-mobile .p-pen-top { left:20%; right:20%; top:0; height:16%; border-top:none; }
.pitch-mobile .p-goal-top { left:35%; right:35%; top:0; height:6%; border-top:none; }
.pitch-mobile .p-spot-top { left:50%; top:12%; }

/* PLAYER ZONES */
.player-squad-zone {
    position: absolute;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 20;

    /* Desktop Mapping */
    left: var(--pos-x);
    top: var(--pos-y);
    width: 200px;
}

@media (max-width: 768px) {
    .pitch-container {
        aspect-ratio: 9 / 16;
        min-height: 80vh;
        max-width: 100%;
        background: repeating-linear-gradient(
            180deg,
            #4ba027,
            #4ba027 5.55%,
            #479724 5.55%,
            #479724 11.1%
        );
    }
    .pitch-desktop { display: none; }
    .pitch-mobile { display: block; }

    .player-squad-zone {
        /* Swap X and Y for vertical orientation & support optional mobile overrides */
        left: var(--mob-pos-y, var(--pos-y));
        top: calc(100% - var(--mob-pos-x, var(--pos-x)));
        width: 150px;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0 !important;
    }
    /* KURAL 1: Kaleci zone alt sınır referansı — sahanın alt çizgisinden 4 px yukarıda
       En alttaki kaleci kartının BİTİŞ kenarı = saha alt kenarı - 4 px.
       Diğer takımlarda kaleci sayısı 2-5 arası değişse de alt sınır sabit kalır.
       Not: bottom değeri token negative margin + scale origin etkisinden ötürü 0 olarak set
       edildi; visual gap ~4 px çıkar (token margin: -1px ve scale 0.9 etkisi). */
    .player-squad-zone[data-position="Goalkeeper"] {
        top: auto !important;
        bottom: 0 !important;
        transform: translate(-50%, 0) !important;
    }
    /* Oyuncu kartları mobile'da 0.90 ölçek + negatif margin ile DOM alanı kompanse */
    .pitch-container .pitch-player-token {
        transform: scale(0.9);
        transform-origin: top center;
        margin: -1px -7px !important;
    }
    /* Beyaz metric kutusu: 36 px visual (= 45 px DOM, scale 0.8) + 2px yatay padding */
    .pitch-container .pitch-player-token > div:nth-child(2) {
        width: 45px !important;
        flex: 0 0 45px !important;
        max-width: 45px !important;
        padding: 4px 2px !important;
    }
    /* Siyah isim kutusu: 62 px visual (= 77.5 px DOM, scale 0.8) */
    .pitch-container .pitch-player-token > div:nth-child(1) {
        width: 77.5px !important;
        flex: 0 0 77.5px !important;
        max-width: 77.5px !important;
    }
}

/* Hover Underline Menu */
.hover-underline-menu { display: flex; gap: 30px; align-items: center; justify-content: center; margin-bottom: 25px; padding-bottom: 5px; }
.hover-underline-menu a { position: relative; text-decoration: none; color: var(--text-secondary); font-weight: bold; font-size: 0.95rem; padding: 5px 0; cursor: pointer; transition: color 0.3s; }
.hover-underline-menu a:hover, .hover-underline-menu a.active { color: var(--text-primary); }

/* Baseline setup for the line */
.hover-underline-menu a::before { 
    content: ""; position: absolute; z-index: 2; left: 0; right: 100%; bottom: 0px; 
    height: 3px; border-radius: 2px;
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%);
    transition-property: right, background; transition-duration: 0.3s; transition-timing-function: ease-out; 
}

/* Hover state (Bright green gradient sliding in) */
.hover-underline-menu a:hover::before { 
    right: 0; 
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #508200 60%, #3b6000 100%);
}

/* Active state (Dark gradient) */
.hover-underline-menu a.active::before { 
    right: 0; 
    background: linear-gradient(to bottom, #3a3a3a 0%, #2b2b2b 40%, #2b2b2b 60%, #1a1a1a 100%);
}

/* Cross Hover Enhancements */
.data-table tr.team-row:hover td { 
    background-color: rgba(90, 145, 0, 0.20) !important; 
}
.data-table tr.team-row.opp-highlight td { 
    background-color: rgba(198, 40, 40, 0.3) !important; 
    border-top: 1px dashed rgba(198, 40, 40, 0.7) !important; 
    border-bottom: 1px dashed rgba(198, 40, 40, 0.7) !important; 
}

/* ══════════════════════════════════════════════════════════════
   PANEL HEADER — koyu başlık kutusu (tüm sekmelerde ortak)
   JS'de: class="mc-panel-header" kullan, inline stil YAZMA
   ══════════════════════════════════════════════════════════════ */
.mc-panel-header {
    background: #383838;
    border: 1px solid #555555;
    padding: 10px 15px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 6px;
}
.mc-panel-header-title {
    color: #ffffff;
    font-weight: bold;
    font-size: 1.05rem;
    display: flex;
    align-items: center;
}
.mc-panel-header-title i {
    margin-right: 8px;
    opacity: 0.8;
}
.mc-panel-header-right {
    display: flex;
    align-items: center;
    gap: 15px;
}
/* Panel başlığı içindeki custom dropdown — yazı beyaz olmalı */
.mc-panel-header .mc-summary {
    color: #ffffff;
    border-bottom-color: rgba(255,255,255,0.3);
}
.mc-panel-header .mc-summary::after {
    border-top-color: rgba(255,255,255,0.5);
}

/* ══════════════════════════════════════════════════════════════
   CARD WRAPPER — tablo/içerik sarmalayıcı kutu
   ══════════════════════════════════════════════════════════════ */
.mc-card {
    background: var(--bg-card);
    padding: 15px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.05);
    margin-top: 20px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
}

/* MatchChase Vanilla Custom Select Component
   No more Native Browser constraints. Total custom color mapping. */
.mc-custom-select {
    position: relative;
    user-select: none;
    display: inline-block;
}
.mc-summary {
    background: transparent; border: none; border-bottom: 1px solid var(--text-secondary); color: var(--text-primary); font-size: 0.95rem; font-weight: 500; cursor: pointer; padding: 4px 22px 4px 8px; transition: border-color 0.3s;
    position: relative; text-align: left; white-space: nowrap;
}
.mc-summary:hover {
    border-color: var(--accent-color);
}
.mc-summary::after {
    content: '';
    width: 0; height: 0;
    border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #888888;
    position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
}
.mc-summary.no-caret::after {
    display: none !important;
}
.mc-dropdown {
    position: absolute; top: 100%; right: 0; margin-top: 5px;
    background: #1c1c1c; border: 1px solid #333; border-radius: 0;
    list-style: none; padding: 0;
    max-height: 300px; overflow-y: auto; min-width: 100%;
    z-index: 1000; box-shadow: 0 8px 20px rgba(0,0,0,0.5);
    display: none;
}
.mc-custom-select.open .mc-dropdown { display: block; }
.mc-custom-select.open .mc-summary::after {
    border-top: none; border-bottom: 5px solid var(--accent-color);
}

.mc-option {
    padding: 7px 12px; color: #ffffff; cursor: pointer; font-size: 0.9rem; border-bottom: 1px solid rgba(255,255,255,0.05); text-align: left; white-space: nowrap;
}
.mc-option:last-child { border-bottom: none; }
.mc-option:hover {
    background: rgba(198, 40, 40, 0.6);
    color: #ffffff; font-weight: 500;
}
.mc-option.selected {
    background: rgba(46, 125, 50, 0.6); 
    font-weight: 600; color: #ffffff;
}

/* Scrollbar specific to custom dropdown as requested */
.mc-dropdown::-webkit-scrollbar { width: 8px; }
.mc-dropdown::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0); }
.mc-dropdown::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0); border-radius: 0; }
.mc-dropdown::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0); }

/* ══════════════════════════════════════════════════════════════
   PREDICTIONS VIEW — Tahmin ve Sonuçlar tablosu
   ══════════════════════════════════════════════════════════════ */

/* Özet kartları */
.pv-summary-grid { margin-bottom: 10px; }
.pv-summary-title {
    font-size: 0.9rem; font-weight: 600; color: var(--text-primary);
    margin-bottom: 10px; padding-left: 2px;
}
.pv-summary-cards {
    display: flex; gap: 12px;
}
.pv-summary-card {
    flex: 1;
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 12px 15px;
}
.pv-card-title {
    font-weight: 700; font-size: 0.85rem; color: var(--accent-color);
    margin-bottom: 8px; text-align: center;
    padding-bottom: 6px; border-bottom: 2px solid var(--accent-color);
}
.pv-card-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 3px 0; font-size: 0.82rem; color: var(--text-secondary);
}
.pv-card-val { font-weight: 700; color: var(--text-primary); font-size: 0.82rem; font-variant-numeric: tabular-nums; }
.pv-card-total {
    margin-top: 4px; padding-top: 6px;
    border-top: 1px solid var(--border-color);
    font-size: 0.78rem; color: #999;
}

/* Tahmin tablosu */
.pv-table { table-layout: fixed; border-collapse: collapse; }
.pv-table thead th {
    position: sticky; top: 0; z-index: 2;
}

/* Motor başlık renkleri */
.pv-th-match {
    background: #2b2b2b !important; color: #fff !important;
}
.pv-th-ss1 {
    background: #1a5276 !important; color: #fff !important;
}
/* Rozetli hücre — 1X2 marketlerinde takım profili bandında model tahminini tutuyor */
.pv-val.pv-has-badge {
    position: relative;
    font-weight: 700 !important;
    box-shadow: inset 0 0 0 2px #f1c40f !important;
    cursor: help;
}
.pv-val.pv-has-badge::after {
    content: '★';
    position: absolute;
    top: 1px; right: 3px;
    font-size: 0.7em;
    color: #f1c40f;
    text-shadow: 0 0 2px #000;
    line-height: 1;
}
.pv-th-dc {
    background: #6c3483 !important; color: #fff !important;
}
.pv-th-int {
    background: #1e8449 !important; color: #fff !important;
}
.pv-th-sub {
    font-size: 0.7rem !important; padding: 3px 4px !important;
    text-align: center !important; font-weight: 600 !important;
}

/* Tahmin hücreleri */
.pv-val {
    text-align: center !important;
    font-size: 0.8rem !important;
    padding: 4px 3px !important;
    font-variant-numeric: tabular-nums;
}

/* Eski takım adı hücresi — İstatistik Takımlar tablosu hala kullanıyor */
.pv-team-cell {
    font-size: 0.82rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 140px;
}

/* Birleşik maç hücresi (Tahminler tablosu): ev + skor + dep + altın bölge — grid ile sabit hiza */
.pv-match-cell {
    font-size: 0.82rem;
    padding: 6px 10px;
}
.pv-match-wrap {
    display: grid;
    grid-template-columns: 1fr 52px 1fr 42px;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.pv-match-home, .pv-match-away {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}
.pv-match-home { text-align: right; }
.pv-match-away { text-align: left; }
.pv-match-score {
    font-weight: 700;
    padding: 2px 6px;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    text-align: center;
    font-size: 0.82rem;
    justify-self: center;
}
.pv-match-score.pv-not-played {
    background: transparent;
    color: #888;
    font-weight: 400;
}
.pv-match-badge {
    /* Altın bölge rozeti için sabit yer — rozet olmasa da kolon korunur */
    text-align: center;
    min-width: 42px;
}

/* Renklendirme */
.pv-hit {
    background: rgba(46, 125, 50, 0.25) !important;
    color: #1b5e20 !important;
    font-weight: 700 !important;
}
.pv-miss {
    background: rgba(198, 40, 40, 0.15) !important;
    color: #c62828 !important;
    text-decoration: line-through;
    opacity: 0.7;
}
.pv-actual {
    background: rgba(46, 125, 50, 0.08) !important;
    font-weight: 600 !important;
}
.pv-predicted {
    background: rgba(80, 130, 0, 0.08) !important;
    font-weight: 600 !important;
}

/* Henüz oynanmamış maç */
.pv-upcoming td { opacity: 0.6; }
.pv-not-played { color: #999 !important; font-weight: 400 !important; }

/* Boş hücre (rozet modunda gösterilmeyen) */
.pv-empty { color: transparent !important; }

/* Bant dışı tahmin — okunur ama soluk (referans amaçlı) */
.pv-val-muted {
    opacity: 0.35 !important;
    color: #888 !important;
    font-weight: 400 !important;
    background-color: transparent !important;
}

/* Mod geçiş butonları */
.pv-mode-btn {
    background: #2b2b2b; border: 1px solid #555; color: #999;
    padding: 5px 12px; font-size: 0.78rem; cursor: pointer;
    font-family: inherit; transition: all 0.2s;
}
.pv-mode-btn:first-child { border-radius: 0; }
.pv-mode-btn:last-child { border-radius: 0; margin-left: -1px; }
.pv-mode-btn.pv-mode-active {
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #3b6000 100%);
    border-color: #416900; color: #fff; font-weight: 700;
}
.pv-mode-btn:hover:not(.pv-mode-active) {
    background: rgba(80, 130, 0, 0.25); color: #fff;
}

/* Alt tab sistemi */
.pv-sub-tabs {
    display: flex; gap: 0;
}
.pv-sub-tab {
    background: linear-gradient(to bottom, #3a3a3a 0%, #2b2b2b 40%, #1a1a1a 100%);
    border: 1px solid #444; color: #bbb; padding: 8px 20px;
    font-size: 0.85rem; font-weight: 500; cursor: pointer;
    font-family: inherit; transition: all 0.2s;
    margin-right: -1px; position: relative;
}
.pv-sub-tab:first-child { border-radius: 0; }
.pv-sub-tab:last-child { border-radius: 0; }
.pv-sub-tab:hover { background: rgba(80, 130, 0, 0.25); color: #fff; }
.pv-sub-tab-active {
    background: linear-gradient(to bottom, #5a9100 0%, #508200 40%, #3b6000 100%);
    border-color: #416900; color: #fff; font-weight: 700; z-index: 1;
}

/* Market tabları */
.pv-market-tabs { display: flex; gap: 0; }
.pv-market-tab {
    background: var(--bg-panel); border: 1px solid var(--border-color); color: var(--text-secondary);
    padding: 6px 16px; font-size: 0.82rem; font-weight: 500; cursor: pointer;
    font-family: inherit; transition: all 0.2s; margin-right: -1px;
}
.pv-market-tab:first-child { border-radius: 0; }
.pv-market-tab:last-child { border-radius: 0; }
/* Hover state sadece gerçek hover destekleyen cihazlarda (touch'ta sticky :hover sorununu önler) */
@media (hover: hover) and (pointer: fine) {
    .pv-market-tab:hover { background: rgba(80, 130, 0, 0.1); color: var(--text-primary); }
}
.pv-market-tab-active {
    background: var(--accent-color); border-color: var(--accent-color);
    color: #fff; font-weight: 700;
}

/* Takım istatistik tablosu */
.pv-team-stats-table { table-layout: fixed; }

/* Satır hover — yeşil/kırmızı hücreleri ezmesin */
.pv-table tbody tr:hover td {
    background: rgba(0, 0, 0, 0.06);
}
.pv-table tbody tr:hover td.pv-hit {
    background: rgba(46, 125, 50, 0.30) !important;
}
.pv-table tbody tr:hover td.pv-miss {
    background: rgba(198, 40, 40, 0.20) !important;
}
.pv-table tbody tr:hover td.pv-actual {
    background: rgba(46, 125, 50, 0.12) !important;
}

/* ══════════════════════════════════════════════
   SMART STATS — Akıllı İstatistik
   ══════════════════════════════════════════════ */
.mc-smart-stats-container {
    padding: 15px 0;
}

/* Alt menü (hover-underline) ek stiller */
.ss-sub-menu a.ss-tab-disabled {
    color: var(--text-secondary, #999) !important;
    opacity: 0.45;
    cursor: not-allowed;
}
.ss-tab-count {
    display: inline-block;
    background: rgba(0,0,0,0.08);
    color: var(--text-secondary, #666);
    font-size: 0.65rem;
    font-weight: 700;
    padding: 1px 5px;
    margin-left: 4px;
    vertical-align: middle;
}
.ss-sub-menu a.active .ss-tab-count {
    background: rgba(0,0,0,0.15);
    color: var(--text-primary, #333);
}
/* İstatistik ikonu — menü öğesinin sağında */
.ss-stats-icon {
    margin-left: 6px;
    font-size: 0.75em;
    color: var(--success, #508200);
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s, color 0.2s;
    vertical-align: baseline;
}
.ss-stats-icon:hover {
    opacity: 1;
    color: var(--text-primary, #333);
}
.ss-stats-icon.ss-stats-locked {
    color: var(--danger, #e53935);
    opacity: 0.8;
    cursor: not-allowed;
}
.ss-stats-icon.ss-stats-locked:hover {
    color: var(--danger, #e53935);
    opacity: 1;
}
.ss-pipe {
    color: var(--text-secondary, #999);
    font-size: 0.8rem;
    opacity: 0.4;
    user-select: none;
}
.ss-pipe:last-child {
    display: none;
}

/* Katman özet paneli */
.ss-layer-summary {
    background: var(--bg-panel, #f8f8f8);
    border: 1px solid rgba(0,0,0,0.08);
    padding: 15px;
    margin-bottom: 20px;
}
.ss-layer-row {
    display: flex;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0,0,0,0.04);
}
.ss-layer-row:last-child {
    border-bottom: none;
}
.ss-layer-icon {
    width: 28px;
    text-align: center;
    color: var(--text-secondary, #666);
    font-size: 0.85rem;
}
.ss-layer-label {
    flex: 1;
    font-size: 0.85rem;
    color: var(--text-primary, #333);
    font-weight: 500;
}
.ss-layer-status {
    font-size: 0.8rem;
    font-weight: 600;
}

/* Bölüm başlıkları */
.ss-section {
    margin-bottom: 25px;
}
.ss-section-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-primary, #333);
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--success, #508200);
}

/* Market satırları */
.ss-market-row {
    margin-bottom: 12px;
}
.ss-market-labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary, #333);
}
.ss-market-values {
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
    font-size: 0.85rem;
}

/* Çift yönlü bar */
.ss-bar-track {
    display: flex;
    height: 16px;
    background: rgba(0,0,0,0.06);
    overflow: hidden;
}
.ss-bar-fill {
    height: 100%;
    transition: width 0.8s ease;
}
.ss-bar-left {
    /* soldan sağa büyür */
}
.ss-bar-right {
    margin-left: auto;
    /* sağdan sola büyür */
}

/* Alt bilgi */
.ss-footer {
    font-size: 0.75rem;
    color: var(--text-secondary, #888);
    text-align: center;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(0,0,0,0.06);
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════
   FAZ 7b2 — CSS hover sınıfları (eski inline onmouseover yerine)
   ═══════════════════════════════════════════════════════════════ */

/* Basit underline link (manager/referee link, breadcrumb, oyuncu link) */
.mc-link-underline-hover { text-decoration: none; cursor: pointer; }
.mc-link-underline-hover:hover { text-decoration: underline; }

/* Takım adı satırı: color shift + underline */
.mc-team-name-hover { color: var(--text-primary); transition: color 0.2s; cursor: pointer; }
.mc-team-name-hover:hover { color: var(--success); text-decoration: underline; }

.mc-team-name-hover-inherit { color: inherit; transition: color 0.2s; cursor: pointer; }
.mc-team-name-hover-inherit:hover { color: var(--success); text-decoration: underline; }

/* Accordion satırı (Compare card açılır kapanır) */
.mc-card-row-hover { background: var(--bg-secondary, rgba(0,0,0,0.02)); transition: background 0.2s; cursor: pointer; }
.mc-card-row-hover:hover { background: var(--border-color, rgba(0,0,0,0.05)); }

/* Hafta nav buton (mainpage prev/next) */
.mc-week-nav-btn { background: rgba(255,255,255,0.06); color: #888; transition: all 0.2s; }
.mc-week-nav-btn:hover { background: rgba(80,130,0,0.3); color: #fff; }

/* Today butonu (mainpage takvim "Bugün") */
.mc-today-btn { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); color: #ccc; transition: all 0.2s; }
.mc-today-btn:hover { background: rgba(80,130,0,0.25); border-color: rgba(80,130,0,0.4); color: #fff; }

/* Modal close butonu (TD/hakem profil header) */
.mc-modal-close-btn { color: #aaa; transition: color 0.2s; }
.mc-modal-close-btn:hover { color: #fff; }

/* Match global nav (önceki/sonraki maç butonu) */
.match-global-nav-btn { background: #ffffff; border: 1px solid #e5e7eb; transition: background 0.15s, border-color 0.15s; }
.match-global-nav-btn:hover { background: #f8fafc; border-color: #cbd5e1; }

/* Sibling nav (oyuncu önceki/sonraki butonu) */
.sibling-nav-btn { background: var(--bg-card); border: 1px solid var(--border-color); transition: all 0.15s; }
.sibling-nav-btn:hover { background: var(--bg-panel-hover); border-color: var(--accent-color); }

/* Compare BFI / Chaos / TimeDecay tetikleyici buton (active sınıfı varsa hover yok) */
.mc-trigger-btn { transition: background 0.2s; cursor: pointer; }
.mc-trigger-btn:not(.bfi-active):not(.chaos-active):not(.timedecay-active):hover {
    background: linear-gradient(to bottom, #ff1c11 0%, #e31005 40%, #c40c03 60%, #990801 100%);
}
.mc-trigger-btn:not(.bfi-active):not(.chaos-active):not(.timedecay-active):hover i {
    color: #ffffff;
}

/* ═══════════════════════════════════════════════════════════════════
   ÜYELİK SİSTEMİ — Üst nav auth-section (Faz 4a, 2026-05-09)
   Anonim: "Giriş yap | Üye ol" linkleri
   Üye: username + ⚠ rozet (onay yoksa) + Hesabım + Çıkış
   ═══════════════════════════════════════════════════════════════════ */
.auth-section {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 14px;
}

.auth-state {
    display: flex;
    align-items: center;
    gap: 8px;
}

.auth-link {
    color: #ffffff;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 0;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
    background: #f59e0b;
    border: none;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.auth-link:hover {
    background: #ea8a06;
    color: #ffffff;
}

/* "Üye ol" — vurgu CTA */
.auth-cta {
    background: var(--success, #5a9b00) !important;
    color: #ffffff;
    font-weight: 600;
    border: none !important;
}

.auth-cta:hover {
    background: var(--success, #5a9b00);
    color: #ffffff;
    filter: brightness(1.1);
}

/* ── Üye pill + dropdown menu (kullanıcı seçimi: Seçenek C) ───────── */
#auth-user {
    position: relative;
}

.auth-user-pill {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px 3px 3px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    color: #ffffff;
    font-family: inherit;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    flex-shrink: 0;
}

/* Kompakt pill — username pill'de gizli (yer kazanmak için), dropdown header'da görünür */
.auth-user-pill .auth-username {
    display: none;
}

.auth-user-pill:hover,
.auth-user-pill[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.18);
}

.auth-user-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--success, #508200);
    color: #ffffff;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-transform: uppercase;
    line-height: 1;
}

.auth-username {
    color: #ffffff;
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1;
}

.auth-unverified {
    color: #f59e0b;
    font-size: 0.85rem;
    cursor: help;
    user-select: none;
}

.auth-pill-arrow {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.7rem;
    transition: transform 0.15s;
    margin-left: 2px;
}

.auth-user-pill[aria-expanded="true"] .auth-pill-arrow {
    transform: rotate(180deg);
}

/* Dropdown menü */
.auth-user-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    background: #1f1f1f;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    padding: 6px;
    display: none;
    z-index: 200;
}

.auth-user-menu.open {
    display: block;
}

/* Dropdown header — username + email "Hoş geldin" bilgisi */
.auth-menu-header {
    padding: 10px 12px 12px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 4px;
}

.auth-menu-username {
    color: #ffffff;
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.2;
    margin-bottom: 2px;
}

.auth-menu-email {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.78rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.auth-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    background: transparent;
    border: none;
    color: #d8d8d8;
    font-family: inherit;
    font-size: 0.9rem;
    text-decoration: none;
    cursor: pointer;
    border-radius: 5px;
    text-align: left;
    transition: background 0.12s, color 0.12s;
    box-sizing: border-box;
}

.auth-menu-item i {
    width: 16px;
    text-align: center;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.9rem;
    transition: color 0.12s;
}

.auth-menu-item:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.auth-menu-item:hover i {
    color: rgba(255, 255, 255, 0.85);
}

.auth-menu-logout:hover {
    background: rgba(255, 71, 87, 0.12);
    color: #ff6b78;
}

.auth-menu-logout:hover i {
    color: #ff6b78;
}

/* ═══════════════════════════════════════════════════════════════════
   AUTH FORM SAYFALARI (Faz 4b1) — /giris, /uye-ol, /sifre-unuttum
   Site açık tema (--text-primary:#333, --border:#ccc, --success:#508200).
   Form: position:fixed overlay + nav altında (top:80px) ortalanmış.
   ═══════════════════════════════════════════════════════════════════ */

#mc-auth-page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #f5f5f7;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 20px 40px;  /* nav alanı için üst padding */
    box-sizing: border-box;
    overflow-y: auto;
}

.auth-form-container {
    width: 100%;
    max-width: 420px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 32px 28px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    margin: auto;  /* flex parent'tan bağımsız ortalama */
}

.auth-form-title {
    color: #1a1a1a;
    font-size: 1.6rem;
    margin: 0 0 8px 0;
    font-weight: 600;
}

.auth-form-desc {
    color: #555555;
    font-size: 0.9rem;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
}

.auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.auth-field label {
    color: #1a1a1a;
    font-size: 0.9rem;
    font-weight: 500;
}

.auth-field input {
    width: 100%;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 6px;
    color: #1a1a1a;
    font-size: 0.95rem;
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.auth-field input:focus {
    outline: none;
    border-color: var(--success, #508200);
    box-shadow: 0 0 0 3px rgba(80, 130, 0, 0.18);
}

.auth-hint {
    color: #888888;
    font-size: 0.8rem;
    margin-top: 2px;
}

.auth-error {
    color: #d32f2f;
    font-size: 0.82rem;
    min-height: 1em;
}

.auth-success {
    color: var(--success, #508200);
    font-size: 0.9rem;
    margin-top: 8px;
    line-height: 1.5;
}

.auth-submit-btn {
    width: 100%;
    padding: 12px;
    background: var(--success, #508200);
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: filter 0.15s;
    margin-top: 8px;
}

.auth-submit-btn:hover:not(:disabled) {
    filter: brightness(1.08);
}

.auth-submit-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.auth-divider {
    display: flex;
    align-items: center;
    margin: 24px 0 18px 0;
    color: #888888;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.auth-divider::before,
.auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e0e0e0;
}

.auth-divider span {
    padding: 0 12px;
}

.auth-alt-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 11px 14px;
    background: #ffffff;
    color: #1a1a1a;
    border: 1px solid #cccccc;
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    margin-bottom: 8px;
    box-sizing: border-box;
}

.auth-alt-btn:hover:not(:disabled) {
    background: #f5f5f5;
    border-color: #999999;
}

.auth-alt-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.auth-google-btn .fa-google {
    color: #4285F4;
}

.auth-form-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
    text-align: center;
}

.auth-form-footer a {
    color: #555555;
    text-decoration: none;
    font-size: 0.88rem;
}

.auth-form-footer a:hover {
    color: var(--success, #508200);
}

.auth-success-block {
    color: #1a1a1a;
    line-height: 1.6;
    margin: 16px 0;
}

.auth-success-block p {
    margin: 8px 0;
}

.auth-success-block code {
    background: #f0f0f0;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.85rem;
    font-family: monospace;
    color: #1a1a1a;
}

/* Token tüketici sayfaları (Faz 4b2) — verify-email, magic-link, reset-password */
.auth-status-message {
    text-align: center;
    padding: 20px 0;
    color: #1a1a1a;
}

.auth-status-message i.fa-spinner {
    color: var(--success, #508200);
    font-size: 2rem;
    display: block;
    margin-bottom: 12px;
}

.auth-status-message i.fa-check-circle {
    margin-right: 6px;
}

.auth-status-message p {
    margin: 8px 0;
    font-size: 0.95rem;
}

.auth-success-text {
    color: var(--success, #508200);
    font-size: 1rem;
    font-weight: 500;
    margin: 8px 0 16px 0;
}

.auth-error-block {
    color: #d32f2f;
    font-size: 0.95rem;
    margin: 8px 0 16px 0;
    line-height: 1.5;
}

.auth-error-block code {
    background: #fff;
    padding: 1px 5px;
    border-radius: 3px;
    border: 1px solid #f0c2c2;
    font-family: monospace;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════════════════
   HESABIM SAYFASI (Faz 4c) — /hesabim
   ═══════════════════════════════════════════════════════════════════ */

.account-container {
    max-width: 560px;
}

.account-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 20px;
}

.account-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--success, #508200);
    color: #ffffff;
    font-weight: 700;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-transform: uppercase;
    line-height: 1;
}

.account-header-info {
    min-width: 0;
    overflow: hidden;
}

.account-header-info h2 {
    word-break: break-word;
}

.account-warning {
    background: #fff8e1;
    border: 1px solid #ffd54f;
    color: #6a5000;
    padding: 12px 14px;
    border-radius: 6px;
    margin-bottom: 18px;
    font-size: 0.9rem;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    line-height: 1.4;
}

.account-warning i {
    color: #c89000;
    font-size: 1rem;
    margin-top: 2px;
}

.account-section {
    margin-bottom: 24px;
}

.account-section-title {
    font-size: 0.78rem;
    font-weight: 700;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 10px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.account-info-list {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 10px 16px;
    margin: 0;
    font-size: 0.92rem;
    align-items: baseline;
}

.account-info-list dt {
    color: #777;
    font-weight: 500;
    white-space: nowrap;
}

.account-info-list dd {
    color: #1a1a1a;
    margin: 0;
    word-break: break-word;
}

.account-pill-verified {
    display: inline-block;
    background: rgba(80, 130, 0, 0.12);
    color: var(--success, #508200);
    border-radius: 12px;
    padding: 1px 9px;
    font-size: 0.78rem;
    font-weight: 600;
    margin-left: 6px;
    vertical-align: middle;
}

.account-provider-badge {
    display: inline-block;
    background: #f0f0f0;
    color: #1a1a1a;
    border-radius: 12px;
    padding: 3px 10px;
    font-size: 0.82rem;
    margin: 2px 4px 2px 0;
}

.account-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.account-danger-btn {
    color: #d32f2f !important;
    border-color: #f0c2c2 !important;
}

.account-danger-btn:hover:not(:disabled) {
    background: #ffebee !important;
    border-color: #d32f2f !important;
    color: #d32f2f !important;
}

.account-danger-btn i {
    color: #d32f2f;
}

/* ═══════════════════════════════════════════════════════════════════
   ANONIM CTA BANNER (Faz 5a) — sadece anonim user, dismissible
   ═══════════════════════════════════════════════════════════════════ */

.mc-anon-banner {
    background: linear-gradient(90deg, rgba(80, 130, 0, 0.10) 0%, rgba(80, 130, 0, 0.02) 100%);
    border-bottom: 1px solid rgba(80, 130, 0, 0.20);
    color: #1a1a1a;
    font-size: 0.92rem;
}

.mc-anon-banner-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.mc-anon-banner-text {
    flex: 1;
    min-width: 250px;
}

.mc-anon-banner-text strong {
    color: var(--success, #508200);
    font-weight: 700;
    margin-right: 6px;
}

.mc-anon-banner-desc {
    color: #555;
    font-size: 0.88rem;
}

.mc-anon-banner-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.mc-anon-banner-btn {
    display: inline-block;
    padding: 6px 16px;
    font-size: 0.88rem;
    border-radius: 6px;
    text-decoration: none;
    color: #1a1a1a;
    background: transparent;
    border: 1px solid #cccccc;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
}

.mc-anon-banner-btn:hover {
    background: #ffffff;
    border-color: #999;
    color: #1a1a1a;
}

.mc-anon-banner-cta {
    background: var(--success, #508200);
    color: #ffffff;
    border-color: var(--success, #508200);
    font-weight: 600;
}

.mc-anon-banner-cta:hover {
    background: var(--success, #508200);
    color: #ffffff;
    filter: brightness(1.08);
    border-color: var(--success, #508200);
}

.mc-anon-banner-close {
    background: transparent;
    border: none;
    color: #888;
    font-size: 1.4rem;
    cursor: pointer;
    padding: 0 6px;
    line-height: 1;
    transition: color 0.15s;
    font-family: inherit;
}

.mc-anon-banner-close:hover {
    color: #1a1a1a;
}

/* Mobile — banner dikey istif */
@media (max-width: 600px) {
    .mc-anon-banner-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px 16px;
    }
    .mc-anon-banner-desc {
        display: block;
        margin-top: 4px;
    }
    .mc-anon-banner-actions {
        align-self: stretch;
        justify-content: flex-end;
    }
}


/* === Maç sayfası Paylaş butonu dropdown (mc_share.js) === */
.mc-share-dropdown {
    background: #ffffff;
    border: 1px solid #ccc;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    border-radius: 6px;
    padding: 6px 0;
    min-width: 200px;
    font-size: 0.95rem;
}
.mc-share-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: #333;
    text-decoration: none;
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    font-size: 0.95rem;
    transition: background 0.15s;
}
.mc-share-item:hover {
    background: #f5f5f5;
}
.mc-share-item i {
    width: 20px;
    text-align: center;
}
.mc-share-copy {
    border-top: 1px solid #eee;
    margin-top: 4px;
    padding-top: 12px;
}

/* === Maç Paylaş Modal — kart önizleme + paylaş butonları === */
.mc-share-modal {
    position: fixed;
    inset: 0;
    z-index: 10001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: mcShareFadeIn 0.18s ease-out;
}
.mc-share-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.78);
    cursor: pointer;
}
.mc-share-modal-content {
    position: relative;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    max-width: 720px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: 24px;
    z-index: 1;
}
.mc-share-modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.06);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.1rem;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.mc-share-modal-close:hover {
    background: rgba(0, 0, 0, 0.12);
}
.mc-share-modal-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 8px 0 16px 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
.mc-share-modal-image-fallback {
    background: #f0f0f0;
    color: #888;
    padding: 60px 20px;
    text-align: center;
    border-radius: 6px;
    margin: 8px 0 16px 0;
    font-size: 0.95rem;
}
.mc-share-modal-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 18px;
    text-align: center;
}
.mc-share-modal-buttons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 8px;
}
.mc-share-modal-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 14px;
    background: #f5f5f5;
    color: #333;
    text-decoration: none;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: 500;
    transition: background 0.15s, transform 0.1s;
}
.mc-share-modal-btn:hover {
    background: #e8e8e8;
    transform: translateY(-1px);
}
.mc-share-modal-btn i {
    font-size: 1.05rem;
}
.mc-share-modal-btn-whatsapp i { color: #25D366; }
.mc-share-modal-btn-twitter i  { color: #1DA1F2; }
.mc-share-modal-btn-telegram i { color: #0088cc; }
.mc-share-modal-btn-facebook i { color: #1877F2; }
.mc-share-modal-btn-linkedin i { color: #0A66C2; }
.mc-share-modal-btn-copy i { color: #508200; }

@keyframes mcShareFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (max-width: 600px) {
    .mc-share-modal { padding: 10px; }
    .mc-share-modal-content { padding: 16px; }
    .mc-share-modal-buttons { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================================
   MC POSITION HISTOGRAM — TM tm_position_raw 14 kutu yatay grid
   (2026-05-28 — Kadro Sahada 2. sub-tab, Lazio test sayfası birebir)
   ===================================================================== */
.mc-pos-hist-wrap { max-width: 1000px; margin: 0 auto; }
.mc-pos-hist-summary { background:#fff; border:1px solid #ddd; padding:14px 18px; margin-bottom:14px; }
.mc-pos-hist-summary h3 { margin:0 0 10px; font-size:14px; letter-spacing:0.5px; text-transform:uppercase; color:#1c1c1c; }
.mc-pos-hist-tabs { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.mc-pos-hist-tabs:last-child { margin-bottom:0; }
.mc-pos-hist-tabs .lbl { font-size:12px; letter-spacing:1px; text-transform:uppercase; font-weight:700; color:#1c1c1c; min-width:90px; }
.mc-pos-hist-tabs button { background:#fff; border:1px solid #1c1c1c; color:#1c1c1c; padding:6px 14px; cursor:pointer; font-weight:600; font-size:13px; font-family:inherit; }
.mc-pos-hist-tabs button.active { background:#1c1c1c; color:#fff; }
.mc-pos-hist-tabs button:hover:not(.active) { background:#f5f5f5; }
.mc-pos-hist-selection { text-align:center; font-size:13px; color:#1c1c1c; background:#f6fbef; border:1px solid #cfe3a5; padding:8px 12px; margin-bottom:14px; }
.mc-pos-hist-selection b { color:#5b8222; }
.mc-pos-hist-gridwrap { overflow-x:auto; }
.mc-pos-hist-grid {
    display:grid;
    grid-template-columns: repeat(6, minmax(125px, 1fr));
    grid-template-rows: 150px 150px 150px;
    column-gap:8px; row-gap:8px;
    min-width:790px;
}
.mc-pos-hist-grid .pos-GK  { grid-column:1; grid-row:2; }
.mc-pos-hist-grid .pos-DL  { grid-column:2; grid-row:1; }
.mc-pos-hist-grid .pos-DC  { grid-column:2; grid-row:2; }
.mc-pos-hist-grid .pos-DR  { grid-column:2; grid-row:3; }
.mc-pos-hist-grid .pos-DMC { grid-column:3; grid-row:2; }
.mc-pos-hist-grid .pos-ML  { grid-column:4; grid-row:1; }
.mc-pos-hist-grid .pos-MC  { grid-column:4; grid-row:2; }
.mc-pos-hist-grid .pos-MR  { grid-column:4; grid-row:3; }
.mc-pos-hist-grid .pos-AML { grid-column:5; grid-row:1; }
.mc-pos-hist-grid .pos-AMC { grid-column:5; grid-row:2; }
.mc-pos-hist-grid .pos-AMR { grid-column:5; grid-row:3; }
.mc-pos-hist-grid .pos-FWL { grid-column:6; grid-row:1; }
.mc-pos-hist-grid .pos-FW  { grid-column:6; grid-row:2; }
.mc-pos-hist-grid .pos-FWR { grid-column:6; grid-row:3; }
.mc-pos-hist-box { background:#fff; border:1px solid #ddd; display:flex; flex-direction:column; overflow:hidden; }
.mc-pos-hist-box .head { display:grid; grid-template-columns: 1fr 28px 34px; background:#1c1c1c; color:#fff; padding:0; font-size:9px; font-weight:700; flex-shrink:0; }
.mc-pos-hist-box .head .lbl { padding:6px 8px; letter-spacing:1px; }
.mc-pos-hist-box .head .apps, .mc-pos-hist-box .head .rating { background:#5b8222; color:#fff; padding:6px 0; font-size:8.5px; text-align:center; }
.mc-pos-hist-box .head .apps { border-right:1px solid rgba(255,255,255,0.18); }
.mc-pos-hist-box .head .rating { border-left:1px solid rgba(255,255,255,0.18); }
.mc-pos-hist-box .body { flex:1; overflow:hidden; }
.mc-pos-hist-box .row-data { display:grid; grid-template-columns: 1fr 28px 34px; padding:0; border-bottom:1px solid #f1f1f1; font-size:10px; align-items:center; min-height:22px; box-sizing:border-box; }
.mc-pos-hist-box .row-data:last-child { border-bottom:none; }
.mc-pos-hist-box .row-data.top1 { background:#f6fbef; font-weight:700; }
.mc-pos-hist-box .name { color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 8px; }
.mc-pos-hist-box .a { text-align:center; color:#475569; font-weight:600; }
.mc-pos-hist-box .r { text-align:center; color:#5b8222; font-weight:600; }
.mc-pos-hist-box .empty { flex:1; padding:10px; color:#aaa; font-style:italic; text-align:center; font-size:11px; display:flex; align-items:center; justify-content:center; }
.mc-pos-hist-box .mc-pos-hist-more { flex-shrink:0; text-align:center; padding:5px 6px; background:#f6fbef; color:#5b8222; font-size:10px; font-weight:700; cursor:pointer; border-top:1px solid #cfe3a5; letter-spacing:0.3px; }
.mc-pos-hist-box .mc-pos-hist-more:hover { background:#e8f5e9; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel { background:#fff; border:1px solid #1c1c1c; color:#1c1c1c; padding:6px 10px; font-weight:600; font-size:13px; font-family:inherit; cursor:pointer; min-width:170px; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel:hover { background:#f5f5f5; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel:focus { outline:2px solid #5b8222; outline-offset:1px; }