/* ══════════════════════════════════════════════════════
   Paleta de marca — restyling visual (solo color/aspecto,
   la navegación y la estructura no cambian).
   ══════════════════════════════════════════════════════ */
:root {
    --bs-primary: #4F46E5;
    --bs-primary-rgb: 79, 70, 229;
    --bs-link-color: #4F46E5;
    --bs-link-color-rgb: 79, 70, 229;
    --bs-link-hover-color: #4338CA;
    --bs-link-hover-color-rgb: 67, 56, 202;
    --bs-focus-ring-color: rgba(79, 70, 229, .25);
}

.btn-primary {
    --bs-btn-bg: #4F46E5;
    --bs-btn-border-color: #4F46E5;
    --bs-btn-hover-bg: #4338CA;
    --bs-btn-hover-border-color: #4338CA;
    --bs-btn-active-bg: #3730A3;
    --bs-btn-active-border-color: #3730A3;
    --bs-btn-focus-shadow-rgb: 79, 70, 229;
    --bs-btn-disabled-bg: #4F46E5;
    --bs-btn-disabled-border-color: #4F46E5;
}

.btn-outline-primary {
    --bs-btn-color: #4F46E5;
    --bs-btn-border-color: #4F46E5;
    --bs-btn-hover-bg: #4F46E5;
    --bs-btn-hover-border-color: #4F46E5;
    --bs-btn-active-bg: #4338CA;
    --bs-btn-active-border-color: #4338CA;
    --bs-btn-focus-shadow-rgb: 79, 70, 229;
    --bs-btn-disabled-color: #4F46E5;
    --bs-btn-disabled-border-color: #4F46E5;
}

/* Barra superior: azul índigo de marca en vez del gris genérico de Bootstrap */
.navbar.bg-dark {
    background-color: #211E5E;
}

.navbar-brand {
    font-weight: 600;
    letter-spacing: .02em;
}

/* Tarjetas: sombra/hover algo más ricos que el shadow-sm plano de Bootstrap */
.card {
    border-radius: .6rem;
}

.card-hover,
.card-list-item {
    transition: transform .15s ease, box-shadow .15s ease;
}

.card-hover:hover,
.card-list-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 .5rem 1.25rem rgba(79, 70, 229, .12);
}

body {
    background-color: #F4F5FA;
    padding-bottom: 60px; /* Altura aproximada de la navbar */
}

/* Botón flotante "FAB" */
.fab {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    transition: background-color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
    transform: scale(0.95);
    opacity: 0;
    animation: fadeInFab 0.4s ease forwards 0.2s;
}

.fab:hover {
    background-color: #0b5ed7; /* Un azul más oscuro para el hover */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35);
}

/* Animación al aparecer */
@keyframes fadeInFab {
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Estado oculto */
.fab-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(20px);
}

.navbar .fab-in-navbar {
    position: absolute;
    top: -28px;          /* lo elevamos por encima de la barra */
    left: 50%;
    transform: translateX(-50%);
    width: 56px;         /* tamaño estándar FAB */
    height: 56px;
    border-radius: 50%;
    padding: 0;
    z-index: 1050;
    display: flex;
    justify-content: center;
    align-items: center;
}