/* =====================================================================
   Puck.ing Fantasy Hockey League - theme extensions on top of Cyborg
   ===================================================================== */

:root {
    --ice:        #2a9fd6;
    --ice-dim:    rgba(42, 159, 214, .14);
    --rink:       #131313;
    --rink-line:  #2b2b2b;
    --crease:     #1b1b1b;
}

body {
    background:
        radial-gradient(ellipse at 50% -10%, rgba(42, 159, 214, .10), transparent 55%),
        var(--bs-body-bg);
    min-height: 100vh;
}

/* ---------- Brand ---------- */
.navbar-brand .brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-right: .5rem;
    border-radius: 50%;
    background: var(--ice);
    color: #000;
    font-weight: 700;
    font-size: .8rem;
    letter-spacing: -.5px;
}

/* ---------- Hero ---------- */
.hero {
    position: relative;
    padding: 5rem 0 4rem;
    overflow: hidden;
    border-bottom: 1px solid var(--rink-line);
}
.hero::after {
    content: "";
    position: absolute;
    inset: auto 0 -60% 0;
    height: 120%;
    background:
        repeating-linear-gradient(90deg, transparent 0 78px, rgba(255,255,255,.025) 78px 80px);
    pointer-events: none;
}
.hero h1 {
    font-weight: 800;
    letter-spacing: -1px;
}
.hero .lead { max-width: 46rem; }

/* ---------- Cards ---------- */
.card {
    border: 1px solid var(--rink-line);
    background: var(--crease);
}
.card-stat {
    transition: border-color .15s ease, transform .15s ease;
}
.card-stat:hover {
    border-color: var(--ice);
    transform: translateY(-2px);
}
.card-stat .stat-value {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
}
.card-stat .stat-label {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--bs-secondary-color);
}

/* ---------- Player cards / tables ---------- */
.pos-badge {
    min-width: 2.2rem;
    font-size: .7rem;
    font-weight: 700;
}

.ovr {
    display: inline-block;
    min-width: 2.4rem;
    padding: .15rem .4rem;
    border-radius: .3rem;
    text-align: center;
    font-weight: 700;
    font-size: .85rem;
    font-variant-numeric: tabular-nums;
}
.ovr-elite { background: #00bc8c; color: #00110c; }
.ovr-great { background: #2a9fd6; color: #00131d; }
.ovr-good  { background: #f0ad4e; color: #2a1c00; }
.ovr-fair  { background: #6c757d; color: #fff; }
.ovr-depth { background: #2b2b2b; color: #adb5bd; }

.player-row td { vertical-align: middle; }
.headshot {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
    background: #222;
    border: 1px solid var(--rink-line);
}
.headshot-lg {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    object-fit: cover;
    background: #222;
    border: 2px solid var(--rink-line);
}

.team-logo   { width: 26px; height: 26px; object-fit: contain; }
.team-logo-lg{ width: 64px; height: 64px; object-fit: contain; }

/* ---------- Favourite team highlight ---------- */
.fav-team-row {
    background: var(--ice-dim) !important;
    box-shadow: inset 3px 0 0 var(--ice);
}
.fav-flag {
    font-size: .68rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* ---------- Scoreboard ---------- */
.scoreboard {
    background: linear-gradient(180deg, #0d0d0d, #151515);
    border: 1px solid var(--rink-line);
    border-radius: .5rem;
}
.scoreboard .score {
    font-size: 3.4rem;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.scoreboard .winner { color: var(--bs-success); }

.period-table td, .period-table th {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* ---------- Play by play ---------- */
.pbp-item {
    border-left: 2px solid var(--rink-line);
    padding: .35rem 0 .35rem 1rem;
    margin-left: .4rem;
    position: relative;
}
.pbp-item::before {
    content: "";
    position: absolute;
    left: -5px;
    top: .85rem;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rink-line);
}
.pbp-goal::before   { background: var(--bs-success); }
.pbp-penalty::before{ background: var(--bs-warning); }
.pbp-clock {
    font-variant-numeric: tabular-nums;
    font-size: .8rem;
    color: var(--bs-secondary-color);
}

/* ---------- Roster builder ---------- */
.slot-track {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
}
.slot-pip {
    width: 100%;
    max-width: 18px;
    height: 6px;
    border-radius: 3px;
    background: var(--rink-line);
}
.slot-pip.filled { background: var(--ice); }
.slot-pip.filled-d { background: var(--bs-warning); }
.slot-pip.filled-g { background: var(--bs-danger); }

/* ---------- Misc ---------- */
.table-hover > tbody > tr:hover > * {
    --bs-table-accent-bg: rgba(42, 159, 214, .07);
}
.sticky-filters {
    position: sticky;
    top: 1rem;
    z-index: 5;
}
.text-tabular { font-variant-numeric: tabular-nums; }

.footer {
    border-top: 1px solid var(--rink-line);
    margin-top: 4rem;
    padding: 2rem 0;
    color: var(--bs-secondary-color);
    font-size: .875rem;
}

.admin-badge {
    font-size: .65rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* Keep long tables readable on phones */
@media (max-width: 575.98px) {
    .hero { padding: 3rem 0 2.5rem; }
    .scoreboard .score { font-size: 2.4rem; }
}

/* ---------- Live games ---------- */
.live-clock {
    font-size: 2.6rem;
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
.live-dot { animation: live-pulse 1.6s ease-in-out infinite; }
@keyframes live-pulse { 50% { opacity: .45; } }

.live-flags { display: flex; gap: .25rem; justify-content: center; flex-wrap: wrap; min-height: 1.3rem; }
.live-energy { height: 6px; }

.goal-flash { animation: goal-flash 1.5s ease-out; }
@keyframes goal-flash {
    0%   { color: var(--bs-success); transform: scale(1.25); }
    100% { transform: scale(1); }
}

.pbp-coach::before { background: var(--ice); }
.pbp-save::before  { background: var(--bs-secondary-color); }
.live-new { animation: live-new 2.5s ease-out; }
@keyframes live-new { 0% { background: var(--ice-dim); } 100% { background: transparent; } }

@media (prefers-reduced-motion: reduce) {
    .live-dot, .goal-flash, .live-new { animation: none; }
}

@media (max-width: 575.98px) {
    .live-clock { font-size: 1.6rem; }
}

/* ---------- Rink view (live games) ---------- */
.rink-svg { display: block; width: 100%; height: auto; }
.rink-ice { fill: #16202a; stroke: #3a4a58; stroke-width: 1; }
.rink-red { stroke: #b0413e; stroke-width: 1; opacity: .8; }
.rink-blue { stroke: #3b6fb6; stroke-width: 1.2; opacity: .85; }
.rink-goal-line { stroke: #b0413e; stroke-width: .4; opacity: .7; }
.rink-circle { fill: none; stroke: #b0413e; stroke-width: .4; opacity: .55; }
.rink-dot { fill: #b0413e; opacity: .7; }
.rink-crease { fill: #3b6fb6; opacity: .35; }
.rink-net { fill: none; stroke: #cfd8dc; stroke-width: .5; }
.rink-net-goal { fill: var(--bs-danger, #cc0000); stroke: var(--bs-danger, #cc0000); }
.rink-label { fill: #5c6b78; font-size: 4px; letter-spacing: .06em; text-transform: uppercase; }
.rink-player { stroke: #0b0f13; stroke-width: .5; }
.rink-home { fill: var(--bs-primary, #2a9fd6); }
.rink-away { fill: var(--bs-warning, #ff8800); }
.rink-goalie { stroke: #ffffff; stroke-width: .7; }
.rink-flash { stroke: #ffffff; stroke-width: 1.6; }
.rink-puck { fill: #ffffff; stroke: #000000; stroke-width: .3; }
.rink-hit { fill: none; stroke: #ffffff; stroke-width: .6; }
.rink-overlay { fill: #ffffff; font-size: 6px; font-weight: 700; letter-spacing: .08em;
                paint-order: stroke; stroke: #0b0f13; stroke-width: 1.2px; }
.rink-key { display: inline-block; width: .7em; height: .7em; border-radius: 50%; vertical-align: middle; }
.rink-key-home { background: var(--bs-primary, #2a9fd6); }
.rink-key-away { background: var(--bs-warning, #ff8800); }
