/* ============== BRACKET PREDICTIONS ============== */

/* ===== Main tabs (Crea / Classifica / Bracket GM) ===== */
.k2-main-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid #333;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.k2-main-tab {
    padding: 12px 22px;
    background: #1a1a1a;
    color: #aaa;
    text-decoration: none;
    border-radius: 8px 8px 0 0;
    font-weight: 600;
    border: 2px solid transparent;
    border-bottom: none;
    transition: all .15s;
}
.k2-main-tab:hover { background: #2a2a2a; color: #fff; }
.k2-main-tab.active {
    background: #e63946;
    color: #fff;
    border-color: #e63946;
}
.k2-tab-panel { padding: 8px 0; color:#fff; }
.k2-tab-panel h2 { margin-top: 0; color: #fff; }

/* GM picker dropdown */
.k2-gm-picker { margin: 16px 0; }
.k2-gm-picker select {
    background: #2a2a2a;
    color: #fff;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 10px 14px;
    font-size: 1em;
    min-width: 320px;
}

.k2-bracket-wrap { font-family: inherit; color: #fff; }
.k2-bracket-tabs { display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.k2-bracket-tabs .k2-tab { padding:8px 16px; background:#222; color:#fff; text-decoration:none; border-radius:6px; }
.k2-bracket-tabs .k2-tab.active { background:#e63946; }
.k2-bracket-status { margin-left:auto; opacity:.8; font-size:.9em; }
.k2-bracket-saved { color:#4ade80; font-size:.9em; min-width:80px; }

.k2-bracket-msg { padding:20px; background:#1a1a1a; border-radius:8px; color:#fff; text-align:center; }
.k2-bracket-help { opacity:.75; font-size:.9em; margin:6px 0 12px; }

/* ===== Seeds table ===== */
.k2-seeds-table { width:100%; max-width:600px; border-collapse:collapse; margin-bottom:24px; color:#fff; }
.k2-seeds-table th, .k2-seeds-table td { padding:6px 10px; border-bottom:1px solid #333; text-align:left; }
.k2-seeds-table th { background:#222; font-size:.8em; text-transform:uppercase; letter-spacing:1px; }
.k2-seeds-table select { width:100%; padding:6px; background:#2a2a2a; color:#fff; border:1px solid #444; border-radius:4px; }
.k2-seeds-table tr.k2-seed-playin td { background:rgba(230,57,70,0.06); }

.k2-bracket-wrap h3 { margin-top:24px; }

/* ===== Bracket tree (mirrored, East-Center-West) ===== */
.k2-bracket-tree {
    width: 100%;
    overflow-x: auto;
    padding: 10px 0 30px;
}
.k2-bracket-row {
    display: flex;
    gap: 14px;
    align-items: stretch;
    min-width: 1400px;
}
.k2-col {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    flex: 1 1 0;
    min-width: 140px;
    gap: 12px;
}
.k2-col-title {
    text-transform: uppercase;
    font-size: .72em;
    opacity: .6;
    letter-spacing: 1px;
    text-align: center;
    margin-bottom: 4px;
    color: #fff;
}

/* Center / Finals column gets a special look */
.k2-col:nth-child(5) { /* Finals */
    min-width: 170px;
}
.k2-col:nth-child(5) .k2-matchup {
    background: linear-gradient(135deg, #1a1a1a 0%, #3a1a1a 100%);
    border-color: #e63946;
}

/* ===== Matchup card ===== */
.k2-matchup {
    background: #1a1a1a;
    border: 1px solid #333;
    border-radius: 8px;
    padding: 8px;
    transition: all .15s;
}
.k2-matchup.k2-correct { border-color: #4ade80; box-shadow: 0 0 0 2px rgba(74,222,128,.2); }
.k2-matchup.k2-wrong   { border-color: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,.2); opacity: .85; }

.k2-matchup-teams {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 6px;
}
.k2-source-slot { display: flex; flex-direction: column; gap: 2px; }
.k2-seed-inline {
    width: 100%;
    background: #1f1f1f;
    color: #aaa;
    border: 1px solid #333;
    border-radius: 4px;
    padding: 3px 6px;
    font-size: .7em;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.k2-seed-inline:focus { outline: 1px solid #e63946; color:#fff; }

.k2-team {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: #2a2a2a;
    border-radius: 6px;
    cursor: grab;
    user-select: none;
    font-size: .85em;
    line-height: 1.2;
}
.k2-team img { width: 22px; height: 22px; object-fit: contain; flex-shrink: 0; }
.k2-team span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k2-team.k2-team-empty { color: #555; cursor: default; justify-content: center; font-style: italic; }
.k2-team.dragging { opacity: .4; }

.k2-dropzone {
    min-height: 42px;
    border: 2px dashed #444;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    transition: all .15s;
}
.k2-dropzone.k2-drag-over { border-color: #e63946; background: rgba(230,57,70,.15); }
.k2-dropzone-hint { color: #555; font-size: .75em; font-style: italic; }
.k2-dropzone .k2-team {
    width: 100%;
    background: #e63946;
    color: #fff;
    font-weight: 600;
}

/* Locked state — strict read-only when viewing another GM or predictions closed */
.k2-bracket-wrap[data-locked="1"] .k2-team[draggable="true"] { cursor: not-allowed; }
.k2-bracket-wrap[data-locked="1"] .k2-dropzone { border-style: solid; }
.k2-bracket-wrap[data-locked="1"] .k2-matchup,
.k2-bracket-wrap[data-locked="1"] .k2-seed-inline {
    pointer-events: none;
    user-select: none;
}
.k2-bracket-wrap[data-locked="1"] .k2-seed-inline { opacity: .85; }

/* Score */
.k2-bracket-score { margin-top: 16px; font-size: 1.1em; }

/* Save button */
button.k2-bracket-save-btn,
.k2-bracket-save-btn {
    background: #e63946 !important;
    background-color: #e63946 !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 28px !important;
    font-size: 1em !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all .15s !important;
}
button.k2-bracket-save-btn:hover,
.k2-bracket-save-btn:hover {
    background: #c1121f !important;
    background-color: #c1121f !important;
    transform: translateY(-1px);
}
.k2-bracket-save-btn:disabled { opacity: .6 !important; cursor: not-allowed !important; transform: none !important; }

/* Save button placed inside the Finals column of the bracket tree */
.k2-col-finals { justify-content: center !important; gap: 24px; }
.k2-save-in-tree {
    display: block;
    width: 100%;
    padding: 18px 12px;
    font-size: .95em;
    line-height: 1.2;
    box-shadow: 0 4px 18px rgba(230,57,70,.4);
    margin-bottom: 8px;
}

/* Leaderboard table */
.k2-bracket-leaderboard { width: 100%; max-width: 500px; border-collapse: collapse; color: #fff; }
.k2-bracket-leaderboard th, .k2-bracket-leaderboard td { padding: 8px 12px; border-bottom: 1px solid #333; text-align: left; }
.k2-bracket-leaderboard th { background: #222; }
.k2-bracket-leaderboard a { color: #4ade80; text-decoration: none; }
.k2-bracket-leaderboard a:hover { text-decoration: underline; }
.k2-view-link { font-size: .85em; }

/* ===== Mobile: tap-to-pick (drag&drop HTML5 non funziona su touch) ===== */
@media (max-width: 768px) {
    .k2-bracket-wrap:not([data-locked="1"]) .k2-matchup .k2-team-preview .k2-team[data-team] {
        cursor: pointer;
        position: relative;
    }
    .k2-bracket-wrap:not([data-locked="1"]) .k2-matchup .k2-team-preview .k2-team[data-team]:active {
        background: #e63946;
        color: #fff;
    }
    .k2-bracket-wrap:not([data-locked="1"]) .k2-dropzone-hint::before {
        content: "tocca ↑ ";
    }
}

/* Viewing-other banner */
.k2-bracket-viewing-banner {
    background: #2a2a3a;
    border-left: 4px solid #4ade80;
    padding: 12px 16px;
    margin-bottom: 16px;
    border-radius: 4px;
    color: #fff;
}
.k2-bracket-viewing-banner a { color: #4ade80; margin-left: 8px; }