/* FutChances — Tema padrão (default theme)
   Modern sports analytics aesthetic.
   Dark header, light surfaces, Inter font, minimal shadows, data-forward.
   (Previously known as "Stitch Skin".) */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
    /* ── UI Chrome (semantic) ── */
    --tema-texto: #0c1014;
    --tema-texto-secundario: #595f65;
    --tema-fundo: #f8f9fa;
    --tema-fundo-cartao: #ffffff;
    --tema-fundo-baixo: #f3f4f5;
    --tema-fundo-alto: #e7e8e9;
    --tema-borda: #c5c6ca;
    --tema-erro: #ba1a1a;

    /* ── Chart variables (semantic) ── */
    --chart-aproveitamento-real: #6b7580;
    --chart-aproveitamento-projecao: #cdd0d4;
    --chart-gols-pro: #5bb88a;
    --chart-gols-contra: #d47272;
    --chart-datalabel: #0c1014;

    /* ── Match probability RGB triplets ── */
    --cor-favorito: 25, 135, 84;
    --cor-empate: 255, 193, 7;
    --cor-zebra: 220, 53, 69;

    /* ── Classification zone RGB triplets ── */
    --cor-zona-a: 25, 135, 84;
    --cor-zona-b: 13, 110, 253;
    --cor-zona-c: 13, 202, 240;
    --cor-zona-d: 255, 193, 7;
    --cor-zona-e: 220, 53, 69;

    /* ── Performance comparison RGB triplets ── */
    --cor-melhor: 25, 135, 84;
    --cor-pior: 220, 53, 69;
    --cor-igual: 255, 193, 7;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background-color: var(--tema-fundo) !important;
    color: var(--tema-texto);
    -webkit-font-smoothing: antialiased;
}

/* ── Navbar ── */
.navbar {
    background-color: var(--tema-texto) !important;
    box-shadow: 0 8px 30px rgba(0,0,0,0.2);
    border: none !important;
}

.navbar-brand {
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    font-style: italic;
}

.nav-link {
    font-weight: 600 !important;
    font-size: 0.75rem !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.75rem 1rem !important;
    transition: background-color 0.2s;
}

.nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    border-radius: 0.5rem;
}

.nav-link.active-page {
    background-color: rgba(255,255,255,0.12);
    border-radius: 0.5rem;
}

.dropdown-menu {
    background-color: var(--tema-fundo-cartao);
    border: 1px solid rgba(197,198,202,0.1);
    border-radius: 0.75rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    padding: 0.5rem;
}

.dropdown-item {
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.5rem 0.75rem;
    transition: background-color 0.15s;
}

.dropdown-item:hover {
    background-color: var(--tema-fundo-baixo);
}

/* ── Content wrapper ── */
.content-wrapper {
    padding-top: 80px;
    padding-bottom: 80px;
}

.container {
    max-width: 1280px;
}

/* ── Typography hierarchy ── */
/* h1: Bold sports headline — italic, uppercase, tight tracking */
h1 {
    text-align: left !important;
    font-weight: 900 !important;
    letter-spacing: -0.03em;
    font-style: italic;
    text-transform: uppercase;
    color: var(--tema-texto);
}

/* h2-h6: Calm section headers — bold, no italic, no uppercase */
h2, h3, h4, h5, h6 {
    text-align: left !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    font-style: normal;
    color: var(--tema-texto);
}

h5 {
    font-weight: 700 !important;
    font-size: 0.95rem;
}

/* Card titles — left-aligned */
.card-title {
    text-align: left !important;
}

/* Stat label — small uppercase under big numbers */
.stat-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tema-texto-secundario);
}

/* Chart caption — axis label below chart */
.chart-caption {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tema-texto-secundario);
    text-align: center;
    padding: 0.5rem 0 0.25rem;
}

/* Breadcrumb */
.stitch-breadcrumb {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--tema-texto-secundario);
    margin-bottom: 0.75rem;
}

.stitch-breadcrumb a {
    color: var(--tema-texto-secundario);
    text-decoration: none;
    transition: color 0.15s;
}

.stitch-breadcrumb a:hover {
    color: var(--tema-texto);
}

.stitch-breadcrumb .separator {
    margin: 0 0.35rem;
    opacity: 0.4;
}

/* ── Section spacing ── */
.section-block {
    margin-top: 1.75rem;
}

/* Section title — used for h2 sub-headings on team page etc. */
.section-title {
    font-size: 1rem;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-style: normal;
    color: var(--tema-texto);
}

/* ── Tile cards (stat cards, prob cards — unified system) ── */
/* Container-query driven: all content sizes relative to card width (cqw). */
/* Aspect ratio: 16:9 default, 3:2 max on narrow viewports. */
.tile-row {
    display: grid;
    gap: 0.75rem;
}

.tile-row-4 { grid-template-columns: repeat(4, 1fr); }
.tile-row-3 { grid-template-columns: repeat(3, 1fr); }

.tile-row .card {
    container-type: inline-size;
    aspect-ratio: 16 / 9;
}

.tile-row .card .card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4cqw;
    height: 100%;
}

.tile-row .tile-value {
    font-size: 18cqw;
    font-weight: 700;
    line-height: 1;
    color: var(--tema-texto);
}

.tile-row .stat-label {
    font-size: 5cqw;
    margin-top: 2cqw;
}

.tile-row .tile-logo {
    height: 34cqw;
    width: auto;
    object-fit: contain;
}

@media (max-width: 767.98px) {
    .tile-row-4 { grid-template-columns: repeat(2, 1fr); }
    .tile-row-3 { grid-template-columns: repeat(3, 1fr); }
}

/* ── Gols chart layout ── */
.gols-chart-row {
    display: grid;
    grid-template-columns: 5fr 2fr 5fr;
    align-items: stretch;
    gap: 0;
    overflow: hidden;
}

.gols-chart-row > div {
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.gols-chart-labels {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--tema-texto-secundario);
    padding: 8px 0;
}

/* ── Cards ── */
.card {
    background-color: var(--tema-fundo-cartao) !important;
    border: 1px solid rgba(197,198,202,0.1) !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    overflow: hidden;
}

.card-body {
    padding: 1.25rem;
}

.custom-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.custom-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.08) !important;
}

/* Home card footer with chevron affordance */
.card-link-footer {
    padding: 0.5rem 1rem;
    background-color: var(--tema-fundo-baixo);
    border-top: 1px solid rgba(197,198,202,0.1);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tema-texto-secundario);
}

.card-link-footer i {
    font-size: 0.8rem;
    margin-left: 0.25rem;
    transition: transform 0.15s;
}

.custom-card:hover .card-link-footer i {
    transform: translateX(2px);
}

.card-footer {
    background-color: var(--tema-fundo-baixo) !important;
    border-top: 1px solid rgba(197,198,202,0.1) !important;
}

/* ── Tables ── */
.table {
    font-size: 0.82rem;
    color: var(--tema-texto);
}

.table-dark {
    background-color: var(--tema-fundo-alto) !important;
    color: var(--tema-texto-secundario) !important;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    --bs-table-bg: var(--tema-fundo-alto) !important;
    --bs-table-color: var(--tema-texto-secundario) !important;
    border-color: rgba(197,198,202,0.1) !important;
}

.table-dark th {
    border-color: rgba(197,198,202,0.1) !important;
    font-weight: 700;
}

.table > tbody > tr {
    border-color: rgba(197,198,202,0.1);
    transition: background-color 0.15s;
}

.table-hover > tbody > tr:hover {
    background-color: var(--tema-fundo-baixo) !important;
    --bs-table-hover-bg: var(--tema-fundo-baixo) !important;
}

.table-sm th, .table-sm td {
    font-weight: 500;
}

/* ── Classification zone colors (semantic) ── */
.table-zona-a {
    --bs-table-bg: rgba(var(--cor-zona-a), 0.18) !important;
    --bs-table-hover-bg: rgba(var(--cor-zona-a), 0.26) !important;
    border-left: 3px solid rgb(var(--cor-zona-a));
}

.table-zona-b {
    --bs-table-bg: rgba(var(--cor-zona-b), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-zona-b), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-zona-b));
}

.table-zona-c {
    --bs-table-bg: rgba(var(--cor-zona-c), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-zona-c), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-zona-c));
}

.table-zona-d {
    --bs-table-bg: rgba(var(--cor-zona-d), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-zona-d), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-zona-d));
}

.table-zona-e {
    --bs-table-bg: rgba(var(--cor-zona-e), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-zona-e), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-zona-e));
}

.table-zona-z {
    --bs-table-bg: transparent !important;
    --bs-table-hover-bg: var(--tema-fundo-baixo) !important;
}

/* ── Match probability table colors (semantic) ── */
.table-favorito {
    --bs-table-bg: rgba(var(--cor-favorito), 0.18) !important;
    --bs-table-hover-bg: rgba(var(--cor-favorito), 0.26) !important;
    border-left: 3px solid rgb(var(--cor-favorito));
}

.table-empate {
    --bs-table-bg: rgba(var(--cor-empate), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-empate), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-empate));
}

.table-zebra {
    --bs-table-bg: rgba(var(--cor-zebra), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-zebra), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-zebra));
}

/* ── Performance comparison table colors (semantic) ── */
.table-melhor {
    --bs-table-bg: rgba(var(--cor-melhor), 0.18) !important;
    --bs-table-hover-bg: rgba(var(--cor-melhor), 0.26) !important;
    border-left: 3px solid rgb(var(--cor-melhor));
}

.table-pior {
    --bs-table-bg: rgba(var(--cor-pior), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-pior), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-pior));
}

.table-igual {
    --bs-table-bg: rgba(var(--cor-igual), 0.16) !important;
    --bs-table-hover-bg: rgba(var(--cor-igual), 0.22) !important;
    border-left: 3px solid rgb(var(--cor-igual));
}

/* ── Score matrix background colors (semantic) ── */
.bg-favorito {
    background-color: rgba(var(--cor-favorito), var(--bs-bg-opacity, 1)) !important;
}

.bg-empate {
    background-color: rgba(var(--cor-empate), var(--bs-bg-opacity, 1)) !important;
}

.bg-zebra {
    background-color: rgba(var(--cor-zebra), var(--bs-bg-opacity, 1)) !important;
}

/* ── Match result tables (rodada, team page) ── */
.match-table {
    table-layout: fixed;
}

/* Desktop colgroup: spacer | date | icon | name | score | x | score | name | icon | action */
.match-table .col-spacer { width: 3%; }
.match-table .col-date   { width: 10%; }
.match-table .col-icon   { width: 4%; }
.match-table .col-name   { width: 21%; }
.match-table .col-score  { width: 7%; }
.match-table .col-center { width: 6%; }
.match-table .col-action { width: 3%; }

@media (max-width: 575.98px) {
    /* xs: hide date+icon, spacer+action balance the sides */
    .match-table .col-spacer { width: 4%; }
    .match-table .col-date   { width: 0; }
    .match-table .col-icon   { width: 0; }
    .match-table .col-name   { width: 28%; }
    .match-table .col-score  { width: 10%; }
    .match-table .col-center { width: 8%; }
    .match-table .col-action { width: 4%; }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    /* sm: hide date, keep icon small */
    .match-table .col-spacer { width: 3%; }
    .match-table .col-date   { width: 0; }
    .match-table .col-icon   { width: 4%; }
    .match-table .col-name   { width: 25%; }
    .match-table .col-score  { width: 8%; }
    .match-table .col-center { width: 6%; }
    .match-table .col-action { width: 3%; }
}

/* Match comparison table — cleaner styling */
.match-comparison .table td,
.match-comparison .table th {
    white-space: nowrap;
}

.match-comparison .stat-center {
    color: var(--tema-texto-secundario);
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── Buttons ── */
.btn-outline-dark {
    border-color: rgba(197,198,202,0.3);
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 0.5rem;
    transition: all 0.2s;
}

.btn-outline-dark:hover {
    background-color: var(--tema-texto);
    border-color: var(--tema-texto);
    transform: scale(0.97);
}

/* ── Badges ── */
.badge {
    font-weight: 800;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 0.375rem;
}

/* ── Footer ── */
.footer {
    background-color: var(--tema-fundo-cartao) !important;
    border-top: 1px solid rgba(197,198,202,0.1) !important;
}

.footer small {
    color: var(--tema-texto-secundario);
    font-weight: 500;
    font-size: 0.7rem;
    letter-spacing: 0.02em;
}

/* ── Tooltips ── */
.tooltip-inner {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 0.5rem;
}

/* ── Rodada navigation arrows ── */
.rodada-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 0.5rem;
    border: 1px solid var(--tema-borda);
    color: var(--tema-texto);
    text-decoration: none;
    font-size: 1rem;
    transition: background-color 0.15s, border-color 0.15s;
}

.rodada-arrow:hover {
    background-color: var(--tema-texto);
    border-color: var(--tema-texto);
    color: #fff;
}

.rodada-arrow.disabled {
    opacity: 0.25;
    pointer-events: none;
}

/* ── Sort arrows ── */
.seta {
    opacity: 0.25;
    font-size: 0.65rem;
    transition: opacity 0.15s;
}

th.crescente .seta,
th.decrescente .seta {
    opacity: 1;
    color: var(--tema-texto);
}

th[style*="cursor: pointer"]:hover .seta {
    opacity: 0.6;
}

/* ── Team icons ── */
.team-icon {
    vertical-align: middle;
}

/* ── SVG link overlay ── */
a.svg-link {
    position: relative;
    display: inline-block;
}

a.svg-link:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/* ── Charts ── */
canvas {
    border-radius: 0.5rem;
}

.chart-container {
    padding: 1rem;
    background-color: var(--tema-fundo-baixo);
    border-radius: 0.75rem;
    overflow: hidden;
    max-width: 100%;
}

.chart-canvas {
    width: 100%;
    height: 240px;
}

.chart-canvas-tall {
    width: 100%;
    height: 340px;
}

/* Chart hover label (comparação) */
.chart-hover-label {
    display: none;
    position: absolute;
    pointer-events: none;
    white-space: nowrap;
    font-size: 12px;
    font-weight: bold;
    padding: 3px 8px;
    border-radius: 4px;
    background: rgba(255,255,255,0.95);
    box-shadow: 0 1px 4px rgba(0,0,0,0.15);
    z-index: 10;
}

/* ── Notícias links ── */
.noticias-grid {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.noticias-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background-color: var(--tema-fundo-baixo);
    border-radius: 0.75rem;
    flex: 1 1 0;
    min-width: 100px;
    max-width: 180px;
    transition: background-color 0.15s;
}

.noticias-item:hover {
    background-color: var(--tema-fundo-alto);
}

.noticias-item img {
    max-height: 40px;
    width: auto;
    object-fit: contain;
}

/* ── Probability cards (jogo page — semantic) ── */
.prob-card-favorito {
    background-color: rgba(var(--cor-favorito), 0.18) !important;
    border-left: 3px solid rgb(var(--cor-favorito)) !important;
}

.prob-card-empate {
    background-color: rgba(var(--cor-empate), 0.16) !important;
    border-left: 3px solid rgb(var(--cor-empate)) !important;
}

.prob-card-zebra {
    background-color: rgba(var(--cor-zebra), 0.16) !important;
    border-left: 3px solid rgb(var(--cor-zebra)) !important;
}

/* ── Border-bottom utility for section headers ── */
.pb-2.border-bottom {
    border-color: rgba(197,198,202,0.2) !important;
}

/* ── Focus visible (accessibility) ── */
:focus-visible {
    outline: 2px solid var(--tema-texto);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

.nav-link:focus-visible,
.dropdown-item:focus-visible {
    outline-color: rgba(255,255,255,0.6);
}

/* Sortable th keyboard accessible */
th[tabindex]:focus-visible {
    outline: 2px solid var(--tema-texto);
    outline-offset: -2px;
}

/* ══════════════════════════════════════════════════════
   Responsive — xs / sm / md / lg
   ══════════════════════════════════════════════════════ */

/* ── xs: Phones portrait (< 576px) ── */
@media (max-width: 575.98px) {
    /* Typography */
    h1 { font-size: 1.15rem; }
    h5 { font-size: 0.85rem; }
    .section-title { font-size: 0.85rem; }

    /* Layout */
    .container { padding-left: 6px; padding-right: 6px; }
    .content-wrapper { padding-top: 64px; padding-bottom: 72px; }
    .card-body { padding: 0.6rem; }
    .section-block { margin-top: 1.25rem; }
    .stitch-breadcrumb { font-size: 0.68rem; }

    /* Tables */
    .table-sm th, .table-sm td {
        font-size: 0.65rem;
        padding: 0.12rem 0.15rem;
        white-space: nowrap;
    }
    .table-sm .team-icon { display: none; }
    .table-sm .seta { display: none; }
    .table { font-size: 0.72rem; }

    /* Hide date column on match tables */
    .match-table-date { display: none; }

    /* Tile cards (unified) */
    .tile-row { gap: 0.5rem; }
    /* Tile cards: 2-col on xs, slightly taller for narrow cards */
    .tile-row .card { aspect-ratio: 3 / 2; }
    .stat-label { font-size: 0.58rem; }

    /* Charts */
    .chart-container { padding: 0.5rem; }
    .chart-height-wrap { height: 180px !important; }

    /* Gols chart */
    .gols-chart-row { grid-template-columns: 4fr 3fr 4fr; height: 180px; }
    .gols-chart-labels { font-size: 0.65rem; }
    .gols-title-row .section-title { font-size: 0.75rem !important; }

    /* Home page team icons */
    .home-team-grid .card { padding-top: 0.4rem !important; padding-bottom: 0.4rem !important; }
    .home-team-grid img { width: 22px !important; height: 22px !important; }
    .card-link-footer { font-size: 0.6rem; padding: 0.35rem 0.6rem; }

    /* Jogo page */
    .jogo-header-cards img { width: 60px !important; height: 60px !important; }
    .match-comparison .table td,
    .match-comparison .table th { white-space: normal; font-size: 0.68rem; }

    /* Navbar dropdown scroll */
    .dropdown-menu { max-height: 60vh; overflow-y: auto; }

    /* Notícias */
    .noticias-item { min-width: 60px; padding: 0.6rem; }
    .noticias-item img { max-height: 24px; }

    /* Score matrix */
    .score-matrix .table { font-size: 0.55rem; }
    .score-matrix .table th,
    .score-matrix .table td { padding: 0.1rem; }

    /* Rodada arrows */
    .rodada-arrow { width: 1.8rem; height: 1.8rem; font-size: 0.85rem; }
}

/* ── sm: Phone landscape / small tablet (576–767px) ── */
@media (min-width: 576px) and (max-width: 767.98px) {
    .table-sm th, .table-sm td {
        font-size: 0.74rem;
        padding: 0.18rem 0.22rem;
        white-space: nowrap;
    }
    .table-sm .seta { display: none; }

    /* Tile cards: 2-col on sm */
    .tile-row .card { aspect-ratio: 16 / 9; }

    /* Charts */
    .chart-height-wrap { height: 200px !important; }

    /* Gols chart */
    .gols-chart-row { height: 200px; }

    /* Navbar dropdown scroll */
    .dropdown-menu { max-height: 65vh; overflow-y: auto; }

    /* Jogo */
    .jogo-header-cards img { width: 80px !important; height: 80px !important; }

    /* Hide date on match tables */
    .match-table-date { display: none; }
}

/* ── md: Tablet portrait (768–991px) ── */
@media (min-width: 768px) and (max-width: 991.98px) {
    .table-sm th, .table-sm td {
        font-size: 0.78rem;
        padding: 0.22rem 0.28rem;
    }

    /* Tile cards: 16:9 on md */

    /* Charts */
    .chart-height-wrap { height: 220px !important; }

    /* Gols chart */
    .gols-chart-row { height: 220px; }
    .gols-chart-labels { font-size: 0.72rem; }

    /* Jogo */
    .jogo-header-cards img { width: 90px !important; height: 90px !important; }
}

/* ── Below md: phone + small tablet shared rules ── */
@media (max-width: 767.98px) {
    .table-sm .seta { display: none; }

    /* Stat cards → 2 columns */
    .tile-row { grid-template-columns: repeat(2, 1fr); }
}

/* ── Team name: nome / nome-curto responsive swap ── */
/* Default: show full nome, hide nome-curto */
.nome-curto { display: none; }

/* Viewport-based: phone portrait always uses nome-curto */
@media (max-width: 576px) {
    .nome { display: none; }
    .nome-curto { display: inline; }
}

/* Container-query-based: cards on home page switch based on card width */
.custom-card { container-type: inline-size; }

@container (max-width: 480px) {
    .nome { display: none; }
    .nome-curto { display: inline; }
}

@container (min-width: 481px) {
    .nome { display: inline; }
    .nome-curto { display: none; }
}

/* ── lg+: Desktop (>= 992px) ── */
@media (min-width: 992px) {
    .gols-chart-row { height: 240px; }
    .chart-height-wrap { height: 240px !important; }
}