/**
 * HLTV Tournament Style
 * Covers [hltv_featured_tournament], tournament list, single tournament page,
 * brackets, standings, group stage, and match rows.
 */

/* ============================================
   Base
   ============================================ */
.hltv-trn {
    color: #c9d1d9;
    font-family: inherit;
}

.hltv-trn-empty,
.hltv-trn-empty-tab {
    padding: 32px 20px;
    text-align: center;
    color: #6e7681;
    font-size: 13px;
}

/* ============================================
   Tournament Card (Grid)
   ============================================ */
.hltv-trn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}

.hltv-trn-card {
    background: #161a21;
    border: 1px solid #21262d;
    border-radius: 8px;
    overflow: hidden;
    transition: border-color .15s, transform .15s;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
}

.hltv-trn-card:hover {
    border-color: #e94560;
    transform: translateY(-2px);
    text-decoration: none;
}

.hltv-trn-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 14px 10px;
}

.hltv-trn-card-logo {
    width: 44px;
    height: 44px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 4px;
    background: #0d1117;
    padding: 4px;
}

.hltv-trn-card-logo-placeholder {
    width: 44px;
    height: 44px;
    background: #1c2333;
    border: 1px dashed #30363d;
    border-radius: 4px;
    flex-shrink: 0;
}

.hltv-trn-card-name {
    font-size: 14px;
    font-weight: 600;
    color: #e6edf3;
    line-height: 1.3;
}

.hltv-trn-card-body {
    padding: 0 14px 10px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 1;
}

.hltv-trn-card-date {
    font-size: 11px;
    color: #6e7681;
}

.hltv-trn-card-meta {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.hltv-trn-card-location,
.hltv-trn-card-organizer,
.hltv-trn-card-prize,
.hltv-trn-card-format,
.hltv-trn-card-matches {
    font-size: 11px;
    color: #6e7681;
}

.hltv-trn-card-footer {
    padding: 8px 14px;
    border-top: 1px solid #21262d;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Tier badge */
.hltv-trn-tier-badge {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: rgba(255,255,255,.07);
    color: #8b949e;
}

.hltv-trn-tier-s     { background: rgba(245,166,35,.15); color: #e94560; }
.hltv-trn-tier-a     { background: rgba(76,195,247,.15); color: #4fc3f7; }
.hltv-trn-tier-b     { background: rgba(138,180,248,.12); color: #8ab4f8; }
.hltv-trn-tier-c     { background: rgba(255,255,255,.07); color: #8b949e; }
.hltv-trn-tier-d     { background: rgba(255,255,255,.05); color: #6e7681; }

/* Status */
.hltv-trn-status-live     { color: #e94560; font-size: 11px; font-weight: 600; }
.hltv-trn-status-upcoming { color: #e94560; font-size: 11px; }
.hltv-trn-status-finished { color: #6e7681; font-size: 11px; }

.hltv-trn-live-badge {
    font-size: 9px;
    font-weight: 700;
    color: #fff;
    background: #e94560;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .05em;
    animation: hltvPulse 2s ease-in-out infinite;
}

.live-dot-trn {
    width: 7px;
    height: 7px;
    background: #e94560;
    border-radius: 50%;
    display: inline-block;
    animation: hltvPulse 2s ease-in-out infinite;
    flex-shrink: 0;
}

/* ============================================
   Tournament Header (Single page)
   ============================================ */
.hltv-trn-header {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
    background: #161a21;
    border: 1px solid #21262d;
}

.hltv-trn-header-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #0d1117 0%, #161a21 100%);
    opacity: .9;
}

.hltv-trn-header-content {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 24px 24px 20px;
}

.hltv-trn-logo {
    width: 72px;
    height: 72px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 6px;
    background: rgba(0,0,0,.3);
    padding: 6px;
}

.hltv-trn-logo-placeholder {
    width: 72px;
    height: 72px;
    background: #1c2333;
    border: 1px dashed #30363d;
    border-radius: 6px;
    flex-shrink: 0;
}

.hltv-trn-header-info {
    flex: 1;
    min-width: 0;
}

.hltv-trn-name {
    font-size: 22px;
    font-weight: 700;
    color: #e6edf3;
    margin-bottom: 6px;
    line-height: 1.2;
}

.hltv-trn-header-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.hltv-trn-date-range {
    font-size: 12px;
    color: #8b949e;
}

.hltv-trn-format-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 3px;
    background: rgba(255,255,255,.07);
    color: #8b949e;
}

.hltv-trn-header-stats {
    display: flex;
    gap: 20px;
}

.hltv-trn-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.hltv-trn-stat-value {
    font-size: 16px;
    font-weight: 700;
    color: #e6edf3;
    line-height: 1;
}

.hltv-trn-stat-label {
    font-size: 10px;
    color: #6e7681;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.hltv-trn-description {
    font-size: 13px;
    color: #8b949e;
    line-height: 1.5;
    padding: 0 24px 16px;
    position: relative;
}

/* ============================================
   Tabs
   ============================================ */
.hltv-trn-tabs {
    display: flex;
    gap: 2px;
    background: #0d1117;
    border-bottom: 1px solid #21262d;
    padding: 0 4px;
    overflow-x: auto;
}

.hltv-trn-tab {
    padding: 10px 16px;
    font-size: 12px;
    font-weight: 600;
    color: #6e7681;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    white-space: nowrap;
    transition: color .15s, border-color .15s;
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
}

.hltv-trn-tab:hover {
    color: #c9d1d9;
}

.hltv-trn-tab.active {
    color: #e94560;
    border-bottom-color: #e94560;
}

.hltv-trn-tab-content {
    padding: 16px 0;
    min-height: 200px;
}

.hltv-trn-panel {
    visibility: hidden;
    height: 0;
    overflow: hidden;
    position: absolute;
    width: 100%;
}

.hltv-trn-panel.active {
    visibility: visible;
    height: auto;
    overflow: visible;
    position: relative;
}

.hltv-trn-tab-content {
    position: relative;
}

/* ============================================
   Section titles
   ============================================ */
.hltv-trn-section {
    margin-bottom: 20px;
}

.hltv-trn-section-title {
    font-size: 12px;
    font-weight: 700;
    color: #6e7681;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 0 0 8px;
    border-bottom: 1px solid #21262d;
    margin-bottom: 12px;
}

.hltv-trn-group-title {
    color: #e94560;
    border-bottom-color: rgba(245,166,35,.3);
}

/* ============================================
   Tournament List
   ============================================ */
.hltv-trn-list {
    background: #161a21;
    border: 1px solid #21262d;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 8px;
}

.hltv-trn-list-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid #21262d;
    background: #0d1117;
}

.hltv-trn-list-title {
    font-size: 12px;
    font-weight: 700;
    color: #8b949e;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* ============================================
   Match Rows (inside tournament)
   ============================================ */
.hltv-trn-matches {
    display: flex;
    flex-direction: column;
}

.hltv-trn-match-row {
    display: flex;
    align-items: center;
    padding: 9px 14px;
    border-bottom: 1px solid #1c2130;
    gap: 10px;
    text-decoration: none;
    color: inherit;
    transition: background .15s;
}

.hltv-trn-match-row:last-child {
    border-bottom: none;
}

.hltv-trn-match-row:hover {
    background: #1e2535;
    text-decoration: none;
}

.hltv-trn-match-live {
    border-left: 3px solid #e94560;
    padding-left: 11px;
}

.hltv-trn-match-teams {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.hltv-trn-match-team {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    flex: 1;
}

.hltv-trn-match-team-right {
    justify-content: flex-end;
}

.hltv-trn-match-team-logo {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
}

.hltv-trn-match-team-name {
    font-size: 13px;
    color: #c9d1d9;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.hltv-trn-match-winner .hltv-trn-match-team-name {
    color: #fff;
    font-weight: 600;
}

.hltv-trn-match-score {
    font-size: 12px;
    font-weight: 700;
    color: #6e7681;
    min-width: 40px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.hltv-trn-vs {
    font-size: 11px;
    color: #50545f;
    flex-shrink: 0;
}

.hltv-trn-match-time {
    font-size: 11px;
    color: #6e7681;
    min-width: 34px;
    font-variant-numeric: tabular-nums;
}

.hltv-trn-match-stage {
    font-size: 10px;
    color: #50545f;
    flex-shrink: 0;
    max-width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hltv-trn-match-format {
    font-size: 10px;
    color: #50545f;
    flex-shrink: 0;
}

.hltv-trn-match-date {
    font-size: 10px;
    color: #6e7681;
    flex-shrink: 0;
}

.hltv-trn-match-map {
    font-size: 10px;
    color: #50545f;
}

.hltv-trn-match-stars {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

.hltv-trn-score-sep {
    color: #50545f;
    font-size: 11px;
}

/* ============================================
   Standings Table
   ============================================ */
.hltv-trn-standings-wrap {
    overflow-x: auto;
}

.hltv-trn-standings-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.hltv-trn-standings-table th {
    padding: 7px 10px;
    font-size: 10px;
    font-weight: 700;
    color: #6e7681;
    text-transform: uppercase;
    letter-spacing: .06em;
    text-align: left;
    border-bottom: 1px solid #21262d;
    background: #0d1117;
}

.hltv-trn-standings-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #1c2130;
    vertical-align: middle;
}

.hltv-trn-standings-table tr:last-child td {
    border-bottom: none;
}

.hltv-trn-standings-table tr:hover td {
    background: #1e2535;
}

.hltv-trn-standings-rank {
    font-size: 12px;
    font-weight: 700;
    color: #6e7681;
    min-width: 24px;
    text-align: center;
}

.hltv-trn-standings-team {
    display: flex;
    align-items: center;
    gap: 8px;
}

.hltv-trn-standings-logo {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.hltv-trn-standings-team-link {
    font-size: 13px;
    color: #c9d1d9;
    text-decoration: none;
    font-weight: 500;
}

.hltv-trn-standings-team-link:hover {
    color: #e94560;
    text-decoration: none;
}

.hltv-trn-standings-w  { color: #4caf81; font-weight: 600; text-align: center; }
.hltv-trn-standings-l  { color: #e05c6b; text-align: center; }
.hltv-trn-standings-d  { color: #6e7681; text-align: center; }
.hltv-trn-standings-pts { font-weight: 700; color: #e6edf3; text-align: center; }

/* ============================================
   Bracket — left-to-right, top-aligned
   ============================================ */
.hltv-trn-bracket {
    overflow-x: auto;
    overflow-y: visible;
    padding-bottom: 16px;
    -webkit-overflow-scrolling: touch;
}

.hltv-trn-bracket-rounds {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
    min-width: max-content;
    width: 100%;
}

.hltv-trn-bracket-round {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 200px;
    width: 200px;
    flex-shrink: 0;
    border-right: 1px solid #21262d;
}

.hltv-trn-bracket-round:last-child { border-right: none; }

.hltv-trn-bracket-round-title {
    font-size: 10px;
    font-weight: 700;
    color: #6e7681;
    text-transform: uppercase;
    letter-spacing: .07em;
    text-align: center;
    padding: 8px 10px;
    background: #0d1117;
    border-bottom: 1px solid #21262d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hltv-trn-bracket-matchups {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1px;
    background: #21262d;
}

.hltv-trn-bracket-match {
    background: #161a21;
    cursor: pointer;
    transition: background .12s;
    text-decoration: none;
    color: inherit;
    display: block;
}

.hltv-trn-bracket-match:hover { background: #1e2535; }
.hltv-trn-bm-live { border-left: 2px solid #e94560; }

.hltv-trn-bm-team {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    border-bottom: 1px solid #1c2130;
    min-width: 0;
}
.hltv-trn-bm-team-info {
    display: flex;
    align-items: center;
    gap: 7px;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.hltv-trn-bm-team:last-of-type { border-bottom: none; }
.hltv-trn-bm-winner { background: rgba(76,175,129,.06); }
.hltv-trn-bm-loser .hltv-trn-bm-name { color: #50545f; }
.hltv-trn-bm-tbd .hltv-trn-bm-name { color: #50545f; font-style: italic; }

.hltv-trn-bm-logo {
    width: 18px; height: 18px; object-fit: contain; flex-shrink: 0;
}

.hltv-trn-bm-logo-placeholder,
.hltv-trn-team-logo-default,
.hltv-team-logo-default {
    width: 18px; height: 18px;
    background: #1c2333; border: 1px solid #30363d; border-radius: 2px; flex-shrink: 0;
}

.hltv-trn-bm-name {
    font-size: 12px; color: #c9d1d9;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    flex: 1; min-width: 0; font-weight: 500;
}

.hltv-trn-bm-winner .hltv-trn-bm-name { color: #fff; font-weight: 700; }

.hltv-trn-bm-score {
    font-size: 12px; font-weight: 700; color: #50545f;
    min-width: 18px; text-align: right; font-variant-numeric: tabular-nums; flex-shrink: 0;
}

.hltv-trn-bm-score-win { color: #4caf81; }

.hltv-trn-bm-date {
    font-size: 9px; color: #50545f;
    padding: 3px 10px; border-top: 1px solid #1c2130; background: #0d1117;
}

.hltv-trn-bm-format {
    font-size: 9px; color: #50545f;
    padding: 2px 10px 4px; background: #0d1117;
}

.hltv-trn-bm-divider { height: 1px; background: #21262d; }

.hltv-trn-bm-live-indicator {
    width: 6px; height: 6px; background: #e94560; border-radius: 50%;
    flex-shrink: 0; animation: hltvPulse 2s ease-in-out infinite;
}

.hltv-trn-bracket-section { margin-bottom: 24px; }

.hltv-trn-bracket-section-title,
.hltv-trn-bracket-upper-title,
.hltv-trn-bracket-lower-title {
    font-size: 11px; font-weight: 700; color: #8b949e;
    text-transform: uppercase; letter-spacing: .07em;
    padding: 6px 0 10px; border-bottom: 1px solid #21262d; margin-bottom: 0;
}

.hltv-trn-bracket-lower-title { color: #e94560; border-bottom-color: rgba(233,69,96,.3); }
.hltv-trn-bracket-grand-final .hltv-trn-bracket-section-title { color: #e94560; border-bottom-color: rgba(233,69,96,.3); }

/* ============================================
   Group Stage
   ============================================ */
.hltv-trn-group-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.hltv-trn-group-header {
    font-size: 12px;
    font-weight: 700;
    color: #e94560;
    padding: 8px 12px;
    background: rgba(245,166,35,.07);
    border-bottom: 1px solid rgba(245,166,35,.2);
    text-transform: uppercase;
    letter-spacing: .06em;
}

.hltv-trn-group-standings {
    background: #161a21;
    border: 1px solid #21262d;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 12px;
}

.hltv-trn-group-matches {
    background: #161a21;
    border: 1px solid #21262d;
    border-radius: 6px;
    overflow: hidden;
}

.hltv-trn-overview-group {
    margin-bottom: 24px;
}

.hltv-trn-overview-group-title {
    font-size: 12px;
    font-weight: 700;
    color: #e94560;
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(245,166,35,.25);
}

/* ============================================
   Teams Grid
   ============================================ */
.hltv-trn-teams-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}

.hltv-trn-team-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    padding: 14px 10px;
    background: #161a21;
    border: 1px solid #21262d;
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, background .15s;
}

.hltv-trn-team-card:hover {
    border-color: #e94560;
    background: #1a1f2a;
    text-decoration: none;
}

.hltv-trn-team-logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.hltv-trn-team-name {
    font-size: 12px;
    color: #c9d1d9;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.hltv-trn-team-flag {
    width: 18px;
    height: 13px;
    border-radius: 2px;
    object-fit: cover;
}

/* ============================================
   Animations
   ============================================ */
@keyframes hltvPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .4; }
}

/* ============================================
   Responsive
   ============================================ */
@media (max-width: 768px) {
    .hltv-trn-grid {
        grid-template-columns: 1fr;
    }

    .hltv-trn-group-layout {
        grid-template-columns: 1fr;
    }

    .hltv-trn-header-content {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .hltv-trn-name {
        font-size: 18px;
    }

    .hltv-trn-header-stats {
        gap: 14px;
    }

    .hltv-trn-bracket-round {
        min-width: 150px;
    }

    .hltv-trn-teams-grid {
        grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    }
}

@media (max-width: 480px) {
    .hltv-trn-match-stage,
    .hltv-trn-match-format,
    .hltv-trn-match-date {
        display: none;
    }

    .hltv-trn-tabs {
        gap: 0;
    }

    .hltv-trn-tab {
        padding: 9px 12px;
        font-size: 11px;
    }
}
