.ros-fids-board,
.ros-fids-board * {
    box-sizing: border-box;
}

.ros-fids-board {
    --ros-fids-surface: #ffffff;
    --ros-fids-border: #f0f1f4;
    --ros-fids-text: #1c1d2b;
    --ros-fids-muted: #9094a6;
    --ros-fids-accent: #0e7490;
    --ros-fids-band-bg: #eef0f4;
    --ros-fids-band-text: #4a4c63;
    position: relative;
    width: 100%;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: hidden;
    border-radius: 14px;
    background: var(--ros-fids-surface);
    color: var(--ros-fids-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.35;
    isolation: isolate;
    box-shadow: 0 1px 3px rgba(28, 29, 43, .08), 0 12px 32px -12px rgba(28, 29, 43, .18);
    margin-bottom: 40px;
}

/* Rainbow top accent */
.ros-fids-board::before {
    content: '';
    display: block;
    height: 4px;
    background: linear-gradient(90deg, #ff8a00, #ff3d3d, #e0247a, #8b2bd6);
}

.ros-fids-board button {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
    box-shadow: none;
}

.ros-fids-board button:focus-visible {
    outline: 3px solid #60a5fa;
    outline-offset: 2px;
}

/* ===== Tab bar ===== */

.ros-fids-board__controls {
    display: flex;
    padding: 14px 20px 0;
    background: #383a52;
    transition: background-color 0.2s ease;
}

.ros-fids-board__controls:has(.ros-fids-board__tab[data-kind="arribos"].is-active) {
    background: #3c354c; /* soft purple/violet tint */
}

.ros-fids-board__controls:has(.ros-fids-board__tab[data-kind="partidas"].is-active) {
    background: #333c37; /* soft green/emerald tint */
}

.ros-fids-board__tabs {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    margin: 0;
}

.ros-fids-board__tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    padding: 11px 26px;
    border: 0 !important;
    border-radius: 9px 9px 0 0 !important;
    background: transparent !important;
    color: #cbd5e1 !important;
    font-size: 0.95rem;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
    transition: color 0.15s ease;
}

.ros-fids-board__tab:hover {
    color: #ffffff !important;
}

.ros-fids-board__tab-icon {
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    vertical-align: middle;
    fill: currentColor;
}

.ros-fids-board__tab.is-active {
    padding: 8px 26px 11px !important;
    background: var(--ros-fids-surface) !important;
    color: var(--ros-fids-text) !important;
    font-weight: 700 !important;
}

.ros-fids-board__tab[data-kind="arribos"].is-active {
    border-top: 3px solid #8b5cf6 !important; /* purple/violet */
}

.ros-fids-board__tab[data-kind="partidas"].is-active {
    border-top: 3px solid #10b981 !important; /* green/emerald */
}

.ros-fids-board__status {
    display: none !important;
}

/* ===== Content ===== */

.ros-fids-board__content {
    overflow-x: hidden;
    background: var(--ros-fids-surface);
    padding: 0;
}

/* ===== Marquee ===== */

.ros-fids-board__marquee {
    overflow: hidden;
    padding: 7px 0;
    background: #3a3d56;
    color: rgba(255, 255, 255, .72);
    font-size: 0.78rem;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.ros-fids-board__marquee-inner {
    display: inline-block;
    padding-left: 100%;
    animation: ros-fids-marquee 40s linear infinite;
}

@keyframes ros-fids-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* ===== Table ===== */

.ros-fids-board__table {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed;
    background: var(--ros-fids-surface) !important;
    color: var(--ros-fids-text) !important;
}

.ros-fids-board__table th,
.ros-fids-board__table td {
    height: auto !important;
    padding: 10px 20px !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font: inherit !important;
    text-align: left !important;
    vertical-align: middle !important;
}

/* Column header */

.ros-fids-board__head-row th {
    padding: 13px 20px !important;
    border-bottom: 1px solid var(--ros-fids-border) !important;
    color: var(--ros-fids-muted) !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

/* Data rows — thin divider, no card shadow */

.ros-fids-board__table tbody tr:not(.ros-fids-board__date-row) td {
    border-bottom: 1px solid var(--ros-fids-border) !important;
}

/* Anchos de columnas - Partidas (6 columnas) */
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(1),
.ros-fids-board__table--partidas tbody tr > :nth-child(1) { width: 18%; }
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(2),
.ros-fids-board__table--partidas tbody tr > :nth-child(2) { width: 9%; }
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(3),
.ros-fids-board__table--partidas tbody tr > :nth-child(3) { width: 29%; }
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(4),
.ros-fids-board__table--partidas tbody tr > :nth-child(4) { width: 8%; }
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(5),
.ros-fids-board__table--partidas tbody tr > :nth-child(5) { width: 18%; }
.ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(6),
.ros-fids-board__table--partidas tbody tr > :nth-child(6) { width: 18%; }

/* Anchos de columnas - Arribos (5 columnas) */
.ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(1),
.ros-fids-board__table--arribos tbody tr > :nth-child(1) { width: 18%; }
.ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(2),
.ros-fids-board__table--arribos tbody tr > :nth-child(2) { width: 10%; }
.ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(3),
.ros-fids-board__table--arribos tbody tr > :nth-child(3) { width: 40%; }
.ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(4),
.ros-fids-board__table--arribos tbody tr > :nth-child(4) { width: 10%; }
.ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(5),
.ros-fids-board__table--arribos tbody tr > :nth-child(5) { width: 22%; }

/* Date band */

.ros-fids-board__date-row td {
    padding: 8px 20px !important;
    border-bottom: 0 !important;
    background: var(--ros-fids-band-bg) !important;
    color: var(--ros-fids-band-text) !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    letter-spacing: .02em;
}

/* ===== Airline badge ===== */

.ros-fids-board__airline-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    max-width: 185px;
    height: 40px;
    overflow: hidden;
    padding: 0 12px;
    border: 0 !important;
    border-radius: 9px;
    font-size: 0.9rem;
    font-weight: 600;
}

.ros-fids-board__airline-badge img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
}

/* ===== Flight number ===== */

.ros-fids-board__flight,
.ros-fids-board__time {
    font-variant-numeric: tabular-nums;
}

.ros-fids-board__table td.ros-fids-board__flight {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
}

/* ===== Location: city + IATA code ===== */

.ros-fids-board__table td.ros-fids-board__location {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.ros-fids-board__location-code {
    color: var(--ros-fids-muted);
    font-weight: 500;
}

/* ===== Time — color-coded by status ===== */

.ros-fids-board__table td.ros-fids-board__time {
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    color: var(--ros-fids-accent) !important;
}

.ros-fids-board__table td.ros-fids-board__time--delayed {
    color: #d97706 !important;
}

.ros-fids-board__table td.ros-fids-board__time--cancelled {
    color: #c0c4d6 !important;
}

.ros-fids-board__table td.ros-fids-board__time--completed {
    color: #8892a4 !important;
}

/* ===== Status pill with dot ===== */

.ros-fids-board__flight-status {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: 6px;
    padding: 4px 10px 4px 9px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ros-fids-board__flight-status::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex: none;
}

.ros-fids-board__flight-status--scheduled   { background: #eceef3; color: #5a5d72; }
.ros-fids-board__flight-status--on-time     { background: #e7f6ec; color: #15803d; }
.ros-fids-board__flight-status--delayed     { background: #fef3c7; color: #92400e; }
.ros-fids-board__flight-status--boarding    { background: #e8edfd; color: #1d4ed8; }
.ros-fids-board__flight-status--completed   { background: #e0f2fe; color: #0f5470; }
.ros-fids-board__flight-status--cancelled   { background: #fee2e2; color: #991b1b; }

.ros-fids-board__flight-status--scheduled::before  { background: #a3a8bd; }
.ros-fids-board__flight-status--on-time::before    { background: #22a35a; }
.ros-fids-board__flight-status--delayed::before    { background: #d97706; }
.ros-fids-board__flight-status--boarding::before   { background: #3b6ef0; }
.ros-fids-board__flight-status--completed::before  { background: #0ea5e9; }
.ros-fids-board__flight-status--cancelled::before  { background: #ef4444; }

.ros-fids-board__mobile-gate {
    display: none;
}

.ros-fids-board__status-mobile-extra {
    display: none;
}

/* ===== Gate / Sector column ===== */

.ros-fids-board__table td.ros-fids-board__gate {
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    letter-spacing: .04em !important;
    color: var(--ros-fids-band-text) !important;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.ros-fids-board__gate--empty {
    color: #d0d3de;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

/* ===== Empty state ===== */

.ros-fids-board__empty {
    margin: 0 !important;
    padding: 48px 20px !important;
    color: var(--ros-fids-muted) !important;
    text-align: center;
}

/* ===== Medium screens (768–1050px) ===== */

@media (min-width: 768px) and (max-width: 1050px) {
    .ros-fids-board__table th,
    .ros-fids-board__table td {
        padding-inline: 12px !important;
    }

    /* Partidas (6 columnas) */
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(1),
    .ros-fids-board__table--partidas tbody tr > :nth-child(1) { width: 17%; }
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(2),
    .ros-fids-board__table--partidas tbody tr > :nth-child(2) { width: 10%; }
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(3),
    .ros-fids-board__table--partidas tbody tr > :nth-child(3) { width: 25%; }
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(4),
    .ros-fids-board__table--partidas tbody tr > :nth-child(4) { width: 9%; }
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(5),
    .ros-fids-board__table--partidas tbody tr > :nth-child(5) { width: 20%; }
    .ros-fids-board__table--partidas .ros-fids-board__head-row > :nth-child(6),
    .ros-fids-board__table--partidas tbody tr > :nth-child(6) { width: 19%; }

    /* Arribos (5 columnas) */
    .ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(1),
    .ros-fids-board__table--arribos tbody tr > :nth-child(1) { width: 18%; }
    .ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(2),
    .ros-fids-board__table--arribos tbody tr > :nth-child(2) { width: 11%; }
    .ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(3),
    .ros-fids-board__table--arribos tbody tr > :nth-child(3) { width: 37%; }
    .ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(4),
    .ros-fids-board__table--arribos tbody tr > :nth-child(4) { width: 11%; }
    .ros-fids-board__table--arribos .ros-fids-board__head-row > :nth-child(5),
    .ros-fids-board__table--arribos tbody tr > :nth-child(5) { width: 23%; }
}

/* ===== Mobile (<768px) ===== */

@media (max-width: 767px) {
    .ros-fids-board {
        border-radius: 10px;
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 32px;
        overflow-x: hidden;
    }

    .ros-fids-board__content,
    .ros-fids-board__table,
    .ros-fids-board__table tbody {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .ros-fids-board__controls {
        padding: 12px 14px 0;
    }

    .ros-fids-board__tab {
        flex: 1 1 50%;
        padding: 11px 10px !important;
        text-align: center;
    }

    .ros-fids-board__tab.is-active {
        padding: 8px 10px 11px !important;
    }

    /* WHY: permitir que el grid móvil controle cada celda sin heredar anchos de tabla. */
    .ros-fids-board__table,
    .ros-fids-board__table tbody,
    .ros-fids-board__table tr,
    .ros-fids-board__table td {
        display: block !important;
        width: 100% !important;
    }

    /* WHY: en móvil cada fila tiene jerarquía propia y no necesita cabecera. */
    .ros-fids-board__table thead {
        display: none !important;
    }

    /* WHY: no usamos etiquetas pseudo porque compiten con el tablero compacto. */
    .ros-fids-board__table td::before {
        display: none !important;
    }

    /* WHY: layout móvil independiente para evitar solapes entre logo, texto y estado. */
    .ros-fids-board__table tbody tr:not(.ros-fids-board__date-row) {
        display: grid !important;
        grid-template-columns: 64px minmax(0, 1fr) 3.7rem !important;
        grid-template-rows: 31px 27px !important;
        column-gap: 8px !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 68px !important;
        padding: 5px 3px 5px 6px !important;
        border-bottom: 1px solid var(--ros-fids-border) !important;
        background: var(--ros-fids-surface) !important;
        box-shadow: none !important;
    }

    .ros-fids-board__table tbody tr:not(.ros-fids-board__date-row) > td {
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    /* WHY: el logo identifica la fila y acompaña ambas líneas de datos. */
    .ros-fids-board__airline {
        grid-column: 1 !important;
        grid-row: 1 / span 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0 !important;
    }

    .ros-fids-board__airline-badge {
        width: 64px !important;
        max-width: 64px !important;
        height: 54px !important;
        border-radius: 8px !important;
        padding: 0 !important;
    }

    .ros-fids-board__airline-badge img {
        max-height: 28px !important;
    }

    /* WHY: el vuelo queda debajo como metadato secundario. */
    .ros-fids-board__table td.ros-fids-board__flight {
        grid-column: 2 !important;
        grid-row: 2 !important;
        font-size: 0.88rem !important;
        font-weight: 550 !important;
        color: var(--ros-fids-muted) !important;
        letter-spacing: .02em;
        width: auto !important;
    }

    /* WHY: destino/origen es la información principal para lectura rápida. */
    .ros-fids-board__table td.ros-fids-board__location {
        grid-column: 2 / 4 !important;
        grid-row: 1 !important;
        padding-right: 3.7rem !important;
        font-size: 0.98rem !important;
        font-weight: 750 !important;
        color: var(--ros-fids-text) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: auto !important;
        min-width: 0 !important;
    }

    /* WHY: hora queda fija a la derecha en la línea principal. */
    .ros-fids-board__table td.ros-fids-board__time {
        grid-column: 3 !important;
        grid-row: 1 !important;
        text-align: right !important;
        font-size: 0.95rem !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        color: var(--ros-fids-accent) !important;
        width: auto !important;
    }

    .ros-fids-board__table td.ros-fids-board__time--delayed  { color: #d97706 !important; }
    .ros-fids-board__table td.ros-fids-board__time--cancelled { color: #c0c4d6 !important; }
    .ros-fids-board__table td.ros-fids-board__time--completed { color: #8892a4 !important; }

    /* WHY: en móvil sector/puerta viajan dentro del pill de estado. */
    .ros-fids-board__table td.ros-fids-board__gate {
        display: none !important;
    }

    .ros-fids-board__status-cell {
        grid-column: 2 / 4 !important;
        grid-row: 2 !important;
        display: block !important;
        align-self: center !important;
        justify-self: end !important;
        width: min(45vw, 10.8rem) !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-align: right !important;
    }

    .ros-fids-board__flight-status {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        font-size: 0.64rem;
        padding: 2px 5px 2px 4px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ros-fids-board__flight-status::before {
        display: inline-block;
        margin-right: 3px;
        vertical-align: 0.08em;
    }

    .ros-fids-board__status-mobile-extra {
        display: inline;
    }

    .ros-fids-board__flight-status::before {
        width: 5px;
        height: 5px;
    }

    /* Date band */
    .ros-fids-board__date-row {
        display: block !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .ros-fids-board__date-row td {
        display: block !important;
        padding: 8px 14px !important;
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ros-fids-board *,
    .ros-fids-board *::before,
    .ros-fids-board *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}
