:root{color-scheme:dark}
html,body{min-height:100%;background:#303133;color:#d7dde7}
body{margin:0;font-family:Arial,Helvetica,sans-serif;padding-top:54px}
.site-nav{position:fixed;z-index:10000;top:0;left:0;right:0;height:54px;background:#202124;border-bottom:1px solid #363a40;display:flex;align-items:center;justify-content:space-between;padding:0 18px}
.site-brand{color:#fff!important;font-weight:900;text-decoration:none!important}
.site-nav-links{display:flex;align-items:center;gap:16px}.site-nav-links a{color:#cbd5e1}.site-nav-links form{margin:0}.site-nav-links button{background:#34383f;border:1px solid #4b5563;color:#fff;border-radius:7px;padding:6px 10px}
.login-shell{min-height:calc(100vh - 54px);display:grid;place-items:center;padding:20px}.login-card{width:min(420px,100%);background:#272729;border:1px solid #3a3d43;border-radius:14px;padding:26px}.login-card h1{margin:0 0 6px}.login-card p{color:#9ca3af}.login-card label{display:block;margin:14px 0;color:#cbd5e1}.login-card input:not([type=checkbox]){display:block;width:100%;margin-top:6px;padding:11px;border:1px solid #475569;background:#171c24;color:#fff;border-radius:8px}.login-card .remember{display:flex;gap:8px;align-items:center}.login-card button{width:100%;padding:11px;border:0;border-radius:8px;background:#159447;color:#fff;font-weight:900}.login-error{background:#5b2525;color:#ffd0d0;padding:10px;border-radius:8px}.error-page{max-width:900px;margin:40px auto;padding:20px}.error-page pre{white-space:pre-wrap;background:#1b1f24;padding:16px;border-radius:10px;color:#ffb4a8}.country-emoji{font-size:18px;line-height:1}
@media(max-width:700px){.site-nav{padding:0 8px}.site-nav-links{gap:8px}.site-nav-links a{font-size:12px}}


/* FASTAPI COUNTRY ROUND FINAL START */

#datatable .match-meta-line {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;

    width: 100% !important;
    margin: 7px 0 0 0 !important;
    padding: 0 !important;
    gap: 8px !important;

    color: #9a9a9a !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
}

#datatable .match-meta-line > .country-with-flag {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;

    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 7px !important;
    white-space: nowrap !important;
}

#datatable .match-meta-line .team-flag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;

    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

#datatable .match-meta-line .team-flag img,
#datatable .match-meta-line .country-flag-img {
    display: block !important;
    flex: 0 0 auto !important;

    width: 22px !important;
    height: 15px !important;
    margin: 0 !important;

    object-fit: cover !important;
    border-radius: 2px !important;
}

#datatable .match-meta-line .country-name {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;

    color: #aba9a8 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 15px !important;
    white-space: nowrap !important;
}

#datatable .match-meta-line > .round-compact {
    display: inline-block !important;
    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;

    color: #9ea7b3 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 15px !important;
    text-align: left !important;
    white-space: nowrap !important;
}

@media (max-width: 768px), (pointer: coarse) {
    #datatable .match-meta-line {
        margin-top: 4px !important;
        gap: 5px !important;
        font-size: 9px !important;
    }

    #datatable .match-meta-line .team-flag img,
    #datatable .match-meta-line .country-flag-img {
        width: 18px !important;
        height: 12px !important;
    }

    #datatable .match-meta-line .country-name,
    #datatable .match-meta-line > .round-compact {
        font-size: 9px !important;
        line-height: 12px !important;
    }
}

/* FASTAPI COUNTRY ROUND FINAL END */

/* =========================================================
   FINAL NAVBAR LAYOUT
   ========================================================= */

body {
    padding-top: 70px !important;
}

.site-nav {
    position: fixed !important;
    z-index: 10000 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    height: 70px !important;
    padding: 0 !important;
    margin: 0 !important;

    background: #454547 !important;
    border-bottom: 1px solid #3a3b3e !important;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .24) !important;
}

.site-nav-inner {
    width: 78% !important;
    max-width: 1320px !important;
    height: 100% !important;

    margin: 0 auto !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.site-brand {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.site-brand:hover,
.site-brand:focus {
    color: #ffffff !important;
    text-decoration: none !important;
}

.site-logo {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
}

.site-nav-links {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 28px !important;

    margin: 0 !important;
    padding: 0 !important;
}

.site-nav-links > a {
    display: inline-flex !important;
    align-items: center !important;

    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.site-nav-links > a:hover,
.site-nav-links > a:focus {
    color: #b5ffa1 !important;
    text-decoration: none !important;
}

.site-nav-links form {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.logout-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    min-width: 0 !important;
    margin: 0 !important;
    padding: 6px 8px !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 5px !important;
    box-shadow: none !important;

    color: #b5ffa1 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

.logout-button:hover,
.logout-button:focus {
    background: rgba(181, 255, 161, .08) !important;
    color: #d7ffca !important;
    outline: none !important;
}

.logout-icon {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    object-fit: contain !important;
    flex: 0 0 16px !important;
}

@media (max-width: 900px) {
    body {
        padding-top: 58px !important;
    }

    .site-nav {
        height: 58px !important;
    }

    .site-nav-inner {
        width: 100% !important;
        max-width: none !important;
        padding: 0 10px !important;
    }

    .site-nav-links {
        gap: 10px !important;
    }

    .site-brand,
    .site-nav-links > a,
    .logout-button {
        font-size: 10px !important;
    }

    .site-logo {
        width: 18px !important;
        height: 18px !important;
    }

    .logout-icon {
        width: 14px !important;
        height: 14px !important;
        max-width: 14px !important;
        max-height: 14px !important;
        flex-basis: 14px !important;
    }
}

/* =========================================================
   END FINAL NAVBAR LAYOUT
   ========================================================= */

/* FINAL VISUAL POLISH START */

:root {
    --page-background: #5a5a5d;
    --surface-main: #464649;
    --surface-dark: #393b3e;
    --border-soft: #5a5d61;

    --text-main: #c9ced5;
    --text-strong: #d9dde2;
    --text-muted: #9fa6af;
    --text-faint: #858c95;
    --accent-soft: #b7d99c;
}

html,
body {
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif !important;

    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    background: var(--page-background) !important;
    color: var(--text-main) !important;
}

/* Шапка того же цвета, что и основная карточка */
.site-nav {
    background: var(--surface-main) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .055) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .20) !important;
}

/* Название сайта без иконки */
.site-brand {
    gap: 0 !important;
    color: var(--text-strong) !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-size: 13px !important;
    font-weight: 650 !important;
    letter-spacing: .25px !important;
    text-shadow: none !important;
}

.site-brand:hover,
.site-brand:focus {
    color: #e2e5e9 !important;
}

/* На случай если старый CSS ещё содержит стили иконки */
.site-brand .site-logo {
    display: none !important;
}

/* Ссылки в шапке */
.site-nav-links {
    gap: 30px !important;
}

.site-nav-links > a {
    color: #c5cad1 !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .15px !important;
    text-shadow: none !important;
}

.site-nav-links > a:hover,
.site-nav-links > a:focus {
    color: #e0e4e8 !important;
}

/* Выход не должен быть кислотно-белым */
.logout-button {
    color: #c4d5bc !important;
    background: transparent !important;
    border: 0 !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .15px !important;
    text-shadow: none !important;
}

.logout-button:hover,
.logout-button:focus {
    color: #d9e8d2 !important;
    background: rgba(255, 255, 255, .045) !important;
}

/* Основная панель такого же оттенка */
.card {
    background: var(--surface-main) !important;
    border-color: rgba(255, 255, 255, .045) !important;
}

/* Переключатели */
.card-header .toggle-label,
.card-header .auto-refresh-status {
    color: #c2c7ce !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-weight: 600 !important;
    letter-spacing: .1px !important;
    text-shadow: none !important;
}

/* Поле поиска */
.dataTables_filter input {
    color: #d0d4da !important;
    background: #3c3e41 !important;
    border-color: #5b5e62 !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-size: 14px !important;
    font-weight: 400 !important;
}

.dataTables_filter input::placeholder {
    color: #9ca3ac !important;
    opacity: 1 !important;
}

/* Заголовок таблицы */
#datatable thead th {
    color: #cbd0d6 !important;
    background: var(--surface-dark) !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-size: 13px !important;
    font-weight: 650 !important;
    letter-spacing: .2px !important;
    text-shadow: none !important;
}

/* Названия команд */
#datatable .match-team-name,
#datatable span.team {
    color: #d4d8de !important;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif !important;

    font-weight: 650 !important;
    letter-spacing: .05px !important;
    text-shadow: none !important;
}

/* VS */
#datatable .match-vs {
    color: #9da3aa !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

/* Дата */
#datatable .date-start {
    color: #b7bdc5 !important;
    font-weight: 500 !important;
    text-shadow: none !important;
}

/* Коэффициенты */
#datatable .odd-col-cell,
#datatable .odd-number {
    color: #c5cbd2 !important;
    font-weight: 650 !important;
    text-shadow: none !important;
}

/* Страна и раунд */
#datatable .country-name {
    color: #b8bec6 !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

#datatable .round-compact {
    color: #9fa6af !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

/* Убираем слишком белый текст внутри строк */
#datatable tbody td {
    color: var(--text-main) !important;
    text-shadow: none !important;
}

@media (max-width: 900px) {
    .site-brand {
        font-size: 12px !important;
    }

    .site-nav-links {
        gap: 15px !important;
    }

    .site-nav-links > a,
    .logout-button {
        font-size: 11px !important;
    }
}

/* FINAL VISUAL POLISH END */

/* FINAL THEME V2 START */

:root {
    --ui-page: #303234;
    --ui-surface: #252729;
    --ui-surface-hover: #292c2f;
    --ui-surface-soft: #2b2e31;
    --ui-header: #2d3033;
    --ui-border: #3b3e42;

    --ui-text: #c2c8cf;
    --ui-text-strong: #d5dae0;
    --ui-text-muted: #969ea7;
    --ui-text-faint: #7f8790;

    --ui-accent: #a7d38a;
}

/* Единая современная типографика */
html,
html body {
    font-family:
        "Segoe UI Variable Text",
        "Segoe UI Variable",
        "Segoe UI",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        Roboto,
        Arial,
        sans-serif !important;

    font-synthesis: none !important;
    font-feature-settings: "kern" 1, "liga" 1 !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

html body {
    background: var(--ui-page) !important;
    color: var(--ui-text) !important;
}

/* Шапка и основная карточка — строго один цвет */
html body .site-nav,
html body .main-panel .card,
html body .card {
    background: var(--ui-surface) !important;
}

html body .site-nav {
    border-bottom: 1px solid var(--ui-border) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .22) !important;
}

/* Название сайта */
html body .site-brand {
    color: #cbd1d7 !important;
    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 13px !important;
    font-weight: 650 !important;
    letter-spacing: .2px !important;
    line-height: 1 !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

html body .site-brand:hover,
html body .site-brand:focus {
    color: #e0e4e8 !important;
}

/* Меню */
html body .site-nav-links > a,
html body .logout-button {
    color: #afb6be !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .12px !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

html body .site-nav-links > a:hover,
html body .site-nav-links > a:focus {
    color: #d7dce1 !important;
}

html body .logout-button {
    color: #abc5a0 !important;
}

html body .logout-button:hover,
html body .logout-button:focus {
    color: #cbe2c1 !important;
    background: rgba(167, 211, 138, .06) !important;
}

/* Карточка */
html body .main-panel .card,
html body .card {
    border: 1px solid rgba(255, 255, 255, .045) !important;
    box-shadow: 0 5px 18px rgba(0, 0, 0, .18) !important;
}

/* Верхняя область переключателей */
html body .card-header {
    background: var(--ui-surface) !important;
    border-color: var(--ui-border) !important;
}

html body .card-header > .toggle-container >
.toggle-container {
    background: var(--ui-surface-soft) !important;
    border: 1px solid #404449 !important;
    border-radius: 999px !important;
}

html body .card-header .toggle-label,
html body .card-header .auto-refresh-status {
    color: #bdc3ca !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: .08px !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* Поиск */
html body #datatable_wrapper .dataTables_filter input {
    background: #202224 !important;
    color: #c9ced4 !important;
    border: 1px solid #3b3f43 !important;
    box-shadow: none !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 14px !important;
    font-weight: 400 !important;
}

html body #datatable_wrapper .dataTables_filter input:focus {
    border-color: #596068 !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(150, 158, 167, .08) !important;
}

html body #datatable_wrapper .dataTables_filter input::placeholder {
    color: #8e969f !important;
    opacity: 1 !important;
}

/* Таблица */
html body #datatable {
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;
}

html body #datatable thead th {
    background: var(--ui-header) !important;
    color: #c7cdd3 !important;
    border-color: var(--ui-border) !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 650 !important;
    letter-spacing: .28px !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

html body #datatable tbody tr,
html body #datatable.table-striped tbody tr:nth-of-type(odd),
html body #datatable.table-striped tbody tr:nth-of-type(even) {
    background: var(--ui-surface) !important;
}

html body #datatable tbody tr:hover {
    background: var(--ui-surface-hover) !important;
}

html body #datatable tbody td {
    color: var(--ui-text) !important;
    border-color: #373a3e !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* Названия команд */
html body #datatable .match-team-name,
html body #datatable span.team {
    color: var(--ui-text-strong) !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.22 !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* VS */
html body #datatable .match-vs {
    color: #858d96 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-shadow: none !important;
}

/* Дата */
html body #datatable .date-start {
    color: #aeb5bd !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

/* Коэффициенты */
html body #datatable .odd-col-cell,
html body #datatable .odd-number {
    color: #c2c9d0 !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* Страна */
html body #datatable .country-name,
html body #datatable .country-with-flag {
    color: #aab1b9 !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: .05px !important;

    text-shadow: none !important;
}

/* Раунд */
html body #datatable .round-compact {
    color: #888f98 !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 500 !important;

    text-shadow: none !important;
}

/* XGB-бейджи */
html body #datatable .xgb-main,
html body #datatable .xgb-low {
    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

html body #datatable .xgb-low {
    background: #3a3e43 !important;
    color: #c3c9d0 !important;
}

/* Tips */
html body #datatable .tips,
html body #datatable .tips1 {
    color: #c4c9cf !important;

    font-family:
        "Segoe UI Variable Text",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    font-size: 11px !important;
    font-weight: 550 !important;

    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* Счёт завершённых матчей */
html body #datatable .score,
html body #datatable .live-date-score {
    font-family:
        "Segoe UI Variable Display",
        "Segoe UI",
        system-ui,
        sans-serif !important;

    color: #d5dae0 !important;
    font-weight: 650 !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

@media (max-width: 900px) {
    html body #datatable .match-team-name,
    html body #datatable span.team {
        font-size: 11px !important;
    }

    html body #datatable .odd-col-cell,
    html body #datatable .odd-number {
        font-size: 12px !important;
    }

    html body .site-nav-links > a,
    html body .logout-button {
        font-size: 10px !important;
    }
}

/* FINAL THEME V2 END */
