h1:focus, h2:focus, h3:focus {
    outline: none !important;
    box-shadow: none !important;
}


/* ==========================================================================
   PITRIVALS BRAND LOGO
   ========================================================================== */
.pr-logo-container {
    display: flex;
    align-items: flex-start; /* Para que el badge flote arriba */
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    letter-spacing: -0.5px;
    cursor: pointer;
    text-decoration: none !important;
}

.pr-logo-pit {
    color: #ffffff;
}

.pr-logo-rivals {
    color: var(--mud-palette-secondary);
}

.pr-badge-beta {
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 800;
    background-color: var(--mud-palette-primary);
    color: #000000;
    padding: 1px 6px;
    border-radius: 4px;
    margin-left: 6px;
    letter-spacing: 1px;
    line-height: 1.4;
}


/* ==========================================================================
   SSR NATIVE FORM ELEMENTS (Design System)
   ========================================================================== */

.ssr-filter-form {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-end;
}

.ssr-filter-action {
    display: flex;
    align-items: center;
    height: 44px;
}

/* ==========================================================================
   PADDOCK LOADER (InteractiveServer Anti-Flicker)
   ========================================================================== */

.ssr-main-content {
    position: relative;
    min-height: calc(100vh - 64px);
}

#pr-paddock-loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--mud-palette-background);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: opacity 0.3s ease-out;
}

    #pr-paddock-loader span {
        font-family: 'Montserrat', sans-serif;
        font-size: 0.75rem;
        font-weight: 800;
        color: var(--mud-palette-text-disabled);
        letter-spacing: 2px;
        text-transform: uppercase;
    }

.racing-spinner {
    width: 50px;
    height: 50px;
    border: 4px solid rgba(46, 196, 182, 0.1);
    border-top-color: var(--mud-palette-primary);
    border-radius: 50%;
    animation: spin 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* ==========================================================================
   INTERACTIVE ACTION BUTTONS
   ========================================================================== */

.pr-btn-link {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    letter-spacing: 0.5px;
    position: relative;
}

    /* 1. Efecto de fondo sutil al pasar el ratón */
    .pr-btn-link:hover {
        background-color: rgba(255, 255, 255, 0.05) !important;
        text-decoration: none !important; /* Quitamos el subrayado estándar para usar algo más pro */
    }

        /* 2. El "Glow" (Brillo) del texto */
        .pr-btn-link:hover .mud-button-label {
            text-shadow: 0 0 8px currentColor;
        }

        /* 3. 🚀 EFECTO DINÁMICO: El icono se desplaza indicando dirección */
        .pr-btn-link:hover .mud-button-icon-end {
            transform: translateX(4px);
            transition: transform 0.2s ease-in-out;
        }

    /* 4. Línea de acento inferior (Estilo iRacing UI) */
    .pr-btn-link::after {
        content: "";
        position: absolute;
        bottom: 4px;
        left: 8px;
        right: 8px;
        height: 1px;
        background-color: currentColor;
        transform: scaleX(0);
        transition: transform 0.3s ease;
        opacity: 0.5;
    }

    .pr-btn-link:hover::after {
        transform: scaleX(1); /* La línea aparece al hacer hover */
    }

/* =======================================================
   ESTILO DE ENLACES DE PILOTO (CONTRAL DE AFFORDANCE)
   ======================================================= */
.driver-profile-link,
.driver-profile-link:link,
.driver-profile-link:visited {
    color: var(--mud-palette-primary) !important;
    text-decoration: none;
    font-weight: 700;
    transition: opacity 0.2s ease, text-decoration 0.2s ease;
}

    .driver-profile-link:hover,
    .driver-profile-link:active {
        color: var(--mud-palette-primary) !important;
        text-decoration: underline !important;
        opacity: 0.85;
    }

/* Cuando la fila de MudBlazor tiene el fondo rojo de "Mi fila", forzamos el texto a blanco */
.mud-table-row.mud-theme-secondary .driver-profile-link,
.mud-table-row.mud-theme-secondary .driver-profile-link:link,
.mud-table-row.mud-theme-secondary .driver-profile-link:visited {
    color: var(--mud-palette-text-primary) !important;
}

/* ==========================================================================
   IRACING OFFICIAL LICENSE COLORS
   ========================================================================== */

/* Rookie */
.bg-license-r {
    background-color: #fc0706 !important;
    color: white !important;
}

/* Class D */
.bg-license-d {
    background-color: #fc8a27 !important;
    color: white !important;
}

/* Class C */
.bg-license-c {
    background-color: #feec04 !important;
    color: #111111 !important;
}

/* Class B  */
.bg-license-b {
    background-color: #00c702 !important;
    color: white !important;
}

/* Class A */
.bg-license-a {
    background-color: #0153db !important;
    color: white !important;
}

/* Pro y Pro/WC */
.bg-license-p, .bg-license-pwc {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

/* Fallback desconocido */
.bg-license-unknown {
    background-color: var(--mud-palette-action-disabled) !important;
    color: white !important;
}