/* ============================================
   GOLDEN CUP — CANLI YAYIN STİLLERİ
   ============================================ */

/* Wrapper */
.broadcast-wrapper {
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 55px);
    background: #000;
}

/* 16:9 Container */
.broadcast-container {
    position: relative;
    width: 100%;
    max-width: 1920px;
    aspect-ratio: 16 / 9;
    background-image: url('../assets/BACKGROUND.jpg');
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.6);
}

/* ====== BRACKET SLOTS ====== */
.bracket-slot {
    position: absolute;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.1cqw;
    color: rgba(255, 255, 255, 0.3);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 1px;
    z-index: 10;
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bracket-slot.has-letter {
    color: #000000;
    font-size: 2.2cqw;
    -webkit-text-stroke: 1px #ffffff;
    paint-order: stroke fill;
    text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff,
         0   -1px 0 #fff,
         0    1px 0 #fff,
        -1px  0   0 #fff,
         1px  0   0 #fff;
}

.bracket-slot.has-team {
    color: #000000;
    font-size: 1.4cqw;
    -webkit-text-stroke: 1px #ffffff;
    paint-order: stroke fill;
    text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff,
         0   -1px 0 #fff,
         0    1px 0 #fff,
        -1px  0   0 #fff,
         1px  0   0 #fff;
    animation: teamPopIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes teamPopIn {
    0%   { transform: scale(0); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* Slot hover highlight (debug mode) */
.bracket-slot.debug-mode {
    outline: 1px dashed rgba(255, 215, 0, 0.4);
    cursor: move;
}

.bracket-slot.debug-mode:hover {
    outline: 2px solid var(--gold-light, #FFD700);
    background: rgba(255, 215, 0, 0.1);
}