/* ── SEGUIMIENTO DE JUGADORES — estilos premium ────────────────────────── */

/* ── Tabs principales de Biblioteca ─────────────────────────────────────── */
#cbd-main-tabs.nav-tabs,
#cbd-main-tabs .nav-tabs {
    width: max-content;
    max-width: calc(100% - 40px);
    margin: 12px 20px 0;
    padding: 4px;
    border: 1px solid #C4CFDC;
    border-radius: 9px;
    background: #E8EDF3;
    gap: 4px;
}

#cbd-main-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    letter-spacing: normal !important;
    color: #475569 !important;
    background: transparent !important;
    transition: color .15s, background-color .15s, border-color .15s;
    text-transform: none;
}

#cbd-main-tabs .nav-link:hover {
    color: #003875 !important;
    background: #F5F7FA !important;
    border-color: #BCC8D6 !important;
}

#cbd-main-tabs .nav-link.active {
    color: #003875 !important;
    border-color: #D5DCE5 !important;
    background: #fff !important;
    font-weight: 700 !important;
    box-shadow: inset 0 -2px 0 #C9A227;
}

#cbd-main-tabs .nav-link:focus-visible { outline:2px solid #C79B00!important; outline-offset:2px; }
@media(pointer:coarse) { #cbd-main-tabs .nav-link { min-height:44px; } }
@media(prefers-reduced-motion:reduce) { #cbd-main-tabs .nav-link { transition:none; } }

#cbd-main-tabs .tab-content {
    background: transparent;
}


/* ── Modal campogramas jugador ───────────────────────────────────────────── */
#seg-modal-jugador .modal-content {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #C9A227;
    box-shadow: 0 8px 24px rgba(0, 50, 112, 0.12);
}

#seg-modal-jugador .modal-header {
    background: #00489A;
    border-bottom: 1px solid #C9A227;
}
#seg-modal-jugador-titulo { color:#fff !important; font-size:.76rem !important; font-weight:700 !important; }
#seg-modal-jugador .modal-header .btn-close { filter:invert(1) grayscale(1) brightness(2); opacity:.85; }
#seg-modal-jugador .modal-header .btn-close:hover { opacity:1; }


/* ── Posición badges en seguimiento ─────────────────────────────────────── */
.seg-pos-portero  { background: #EFF6FF; color: #1D4ED8; border-color: #BFDBFE; }
.seg-pos-defensa  { background: #F0FDF4; color: #166534; border-color: #A9D18E; }
.seg-pos-centro   { background: #FFFBEB; color: #92400E; border-color: #FDE68A; }
.seg-pos-delante  { background: #FFF1F2; color: #9F1239; border-color: #FECDD3; }

/* ── Rank badges top 3 ───────────────────────────────────────────────────── */
.seg-rank-gold   { background: #FFF7D6 !important; color: #C9A227 !important; border-color: #C9A227 !important; }
.seg-rank-silver { background: #F1F5F9 !important; color: #64748B !important; border-color: #CBD5E1 !important; }
.seg-rank-bronze { background: #FFF4ED !important; color: #C2410C !important; border-color: #FED7AA !important; }

/* ── Accordion de países ──────────────────────────────────────────────────── */
.seg-accordion-paises .accordion-item {
    border: 1px solid #C9A227 !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    overflow: hidden;
    box-shadow: none;
}

.seg-accordion-paises .accordion-button {
    background: #FFFFFF !important;
    border: none !important;
    padding: 6px 12px !important;
    font-size: .74rem !important;
    font-weight: 700 !important;
    color: #003875 !important;
    box-shadow: none !important;
    border-bottom: 1px solid #EDF2F7 !important;
    transition: background-color 0.15s !important;
}
.seg-accordion-paises .accordion-button:not(.collapsed) {
    background: #EAF1FA !important;
    border-bottom: 1px solid #DDE3EE !important;
    color: #00359A !important;
}
.seg-accordion-paises .accordion-button::after {
    filter: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2364748B'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

.seg-accordion-paises .accordion-body {
    padding: 0 !important;
    background: #fff;
}

/* ── Fila compacta de jugador ─────────────────────────────────────────────── */
.seg-player-row:last-child {
    border-bottom: none !important;
}
.seg-player-row:hover {
    background-color: #F8FAFD !important;
}

/* ── Sección de perfil dentro de país ────────────────────────────────────── */
.seg-accordion-paises .accordion-body > div > div {
    margin: 0;
}
.seg-accordion-paises .accordion-body > div {
    padding: 10px !important;
}

/* ── Fila de campograma en el modal ──────────────────────────────────────── */
.seg-modal-camp-row {
    transition: background-color 0.12s ease;
}
.seg-modal-camp-row:hover {
    background-color: #F8FAFD !important;
}

/* ── Esquinas redondeadas primer/último hijo de la barra de filtros ──────── */
/* (overflow:visible para que los dropdowns no se corten) */
#cbd-filtro-rango .DateRangePicker_picker {
    z-index: 9999 !important;
}

/* ── DatePickerRange compacto — barra filtros Biblioteca ─────────────────── */
#cbd-filtro-rango,
#cbd-filtro-rango .DateRangePicker,
#cbd-filtro-rango .DateRangePicker__withBorder {
    width: 100% !important;
}
#cbd-filtro-rango .DateRangePickerInput {
    height: 30px !important;
    border: 1px solid #C9A227 !important;
    border-radius: 6px !important;
    background: #FAFCFF !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
#cbd-filtro-rango .DateInput {
    width: 80px !important;
    background: transparent !important;
    flex-shrink: 0 !important;
}
#cbd-filtro-rango .DateInput_input {
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 5px !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    border: none !important;
    background: transparent !important;
    line-height: 28px !important;
    width: 100% !important;
}
#cbd-filtro-rango .DateInput_input::placeholder {
    color: #A0AEC0 !important;
    font-size: 10px !important;
}
#cbd-filtro-rango .DateInput_input__focused {
    background: #fff !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}
#cbd-filtro-rango .DateRangePickerInput_arrow {
    padding: 0 3px !important;
    color: #C9A227 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}
#cbd-filtro-rango .DateRangePickerInput_clearDates {
    padding: 0 5px !important;
    font-size: 9px !important;
    flex-shrink: 0 !important;
}
#cbd-filtro-rango .DateRangePickerInput_calendarIcon {
    display: none !important;
}

/* ── Dropdowns barra filtros: borde dorado ───────────────────────────────── */
.cbd-dropdown .Select-control {
    border: 1px solid #C9A227 !important;
    box-shadow: 0 1px 3px rgba(201,162,39,0.15) !important;
    background: #FAFCFF !important;
    border-radius: 6px !important;
    height: 30px !important;
    min-height: 30px !important;
}
.cbd-dropdown .Select-placeholder,
.cbd-dropdown .Select-value-label {
    line-height: 30px !important;
    font-size: 0.74rem !important;
}
.cbd-dropdown .Select-arrow-zone {
    line-height: 30px !important;
}
.cbd-dropdown.is-open .Select-control {
    border-color: #C9A227 !important;
    box-shadow: 0 0 0 3px rgba(201,162,39,0.20) !important;
}
.cbd-dropdown .Select-menu-outer {
    z-index: 9999 !important;
    border: 1px solid #C9A227 !important;
    border-top: none !important;
    box-shadow: 0 8px 24px rgba(0,50,112,0.14) !important;
    border-radius: 0 0 6px 6px !important;
}
.cbd-dropdown .Select-option.is-focused {
    background-color: rgba(201,162,39,0.10) !important;
}
.cbd-dropdown .Select-option.is-selected {
    background-color: rgba(201,162,39,0.18) !important;
    color: #6B4F00 !important;
    font-weight: 700 !important;
}
/* JUGADOR dropdown gold (same .cbd-dropdown rules already apply) */

/* ── Modal "Nuevo seguimiento manual" — dropdowns no cortados ────────────── */
/*
   Con scrollable=False el modal-body NO tiene overflow-y:auto por defecto,
   pero Bootstrap puede añadir overflow:hidden en .modal-content.
   Estas reglas aseguran que los menús de dcc.Dropdown fluyan hacia fuera
   del contenedor sin ser recortados.
*/
#seg-manual-modal .modal-content {
    overflow: visible !important;
}
#seg-manual-modal .modal-dialog {
    overflow: visible !important;
}
#seg-manual-modal .modal-body {
    overflow: visible !important;
}
/* z-index superior al backdrop (1040) y al modal (1050) de Bootstrap */
#seg-manual-modal .Select-menu-outer {
    z-index: 9999 !important;
    position: absolute !important;
}
