/* =====================================================
   FUSADI — tokens globales (única fuente de verdad)
   ===================================================== */
:root {
    --fusadi-blue:  #1b54a5;
    --fusadi-green: #87c440;
    --bg-soft:      #f7f9fc;
    --border-soft:  #e9eef6;
    --text-soft:    #6c757d;
}

/* =====================================================
   Botón primario FUSADI — clase única unificada
   ===================================================== */
.btn-fusadi {
    background: linear-gradient(180deg, var(--fusadi-blue) 0%, #15458a 100%) !important;
    border: none !important;
    color: #fff !important;
}
.btn-fusadi:hover,
.btn-fusadi:focus {
    filter: brightness(1.05);
    color: #fff !important;
}
.btn-fusadi:disabled {
    opacity: .65;
    pointer-events: none;
}

/* =====================================================
   Toggle contraseña (login)
   ===================================================== */
.password-toggle {
    position: absolute;
    right: .75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    color: var(--text-soft);
    cursor: pointer;
    z-index: 10;
    line-height: 1;
}
.password-toggle:focus-visible {
    outline: 2px solid var(--fusadi-blue);
    border-radius: 4px;
}

/* =====================================================
   Selects: restaurar padding izquierdo que MD Pro elimina
   ===================================================== */
.form-select {
    padding-left: 0.75rem !important;
}

/* =====================================================
   Selects en modal — fondo blanco + borde suave
   ===================================================== */
.modal .form-select {
    background-color: #fff !important;
    border: 1px solid #d2d6da;
}

/* =====================================================
   Indicador de campo requerido
   ===================================================== */
.form-label .required {
    color: #f44335;
    margin-left: .2rem;
}

/* =====================================================
   Filtros con Choices.js — evitar corte de texto
   ===================================================== */
.choices__list--single .choices__item {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.choices__list--dropdown .choices__item {
    white-space: nowrap !important;
}

/* =====================================================
   Choices.js — overrides con colores FUSADI
   ===================================================== */

/* Elimina el margin-bottom que Choices agrega por defecto (rompe grid g-3 en móvil) */
.choices {
    margin-bottom: 0 !important;
}

/* Sin borde en la caja — solo línea inferior como MD Pro */
.choices__inner {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0.5rem 0 !important;
    font-size: .875rem !important;
    min-height: unset !important;
    background-color: transparent !important;
}

.is-open .choices__inner,
.is-focused .choices__inner,
.is-flipped.is-open .choices__inner {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Reemplaza el rosado MD Pro con azul FUSADI, mantiene el efecto
   de crecimiento desde el centro (background-size 0→100%) */
.choices .choices__list.choices__list--single,
.choices .choices__list.choices__list--single:focus {
    background-image:
        linear-gradient(0deg, var(--fusadi-blue) 2px, rgba(27, 84, 165, 0) 0),
        linear-gradient(0deg, #d2d2d2 1px, hsla(0, 0%, 82%, 0) 0) !important;
}

/* Texto del ítem seleccionado */
.choices__list--single .choices__item {
    padding: 0 !important;
    font-size: .875rem !important;
    color: #344767 !important;
}

/* Flecha (chevron) */
.choices[data-type*="select-one"]::after {
    border-color: #7b8aa0 transparent transparent transparent !important;
    right: 0.5rem !important;
}
.choices[data-type*="select-one"].is-open::after {
    border-color: transparent transparent var(--fusadi-blue) transparent !important;
}

/* Dropdown panel */
.choices__list--dropdown,
.choices__list[aria-expanded] {
    border: 1px solid #d2d6da !important;
    border-radius: 0 !important;
    box-shadow: 0 8px 24px rgba(27, 84, 165, .10) !important;
    z-index: 9999 !important;
    max-height: 400px !important;
}

/* Opción en hover */
.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background-color: rgba(27, 84, 165, .07) !important;
    color: var(--fusadi-blue) !important;
}

/* Opción actualmente seleccionada */
.choices__list--dropdown .choices__item.is-selected {
    color: var(--fusadi-blue) !important;
    font-weight: 600 !important;
}

/* Estado deshabilitado */
.choices.is-disabled .choices__inner {
    opacity: .5 !important;
    cursor: not-allowed !important;
}

/* =====================================================
   input-group-static — reemplaza rosado MD Pro con azul FUSADI
   ===================================================== */
.input-group.input-group-static.is-focused label,
.input-group.input-group-static .form-control:focus ~ label {
    color: var(--fusadi-blue) !important;
}
.input-group.input-group-static.is-focused .form-control,
.input-group.input-group-static .form-control:focus {
    background-image:
        linear-gradient(0deg, var(--fusadi-blue) 2px, rgba(27, 84, 165, 0) 0),
        linear-gradient(0deg, #d2d2d2 1px, hsla(0, 0%, 82%, 0) 0) !important;
}

/* Alinea los fondos de inputs y selects cuando van lado a lado en modals */
.modal form .row.g-3 {
    align-items: flex-end;
}

/* =====================================================
   Flatpickr — colores FUSADI
   (mismo selector que MD Pro para ganarle en especificidad)
   ===================================================== */
.flatpickr-calendar .flatpickr-day.today,
.flatpickr-calendar .flatpickr-day.selected,
.flatpickr-calendar .flatpickr-day.startRange,
.flatpickr-calendar .flatpickr-day.endRange {
    background: var(--fusadi-blue) !important;
    border-color: var(--fusadi-blue) !important;
    color: #fff !important;
}

.flatpickr-calendar .flatpickr-day.today:hover,
.flatpickr-calendar .flatpickr-day.selected:hover,
.flatpickr-calendar .flatpickr-day.startRange:hover,
.flatpickr-calendar .flatpickr-day.endRange:hover {
    background: #15458a !important;
    border-color: #15458a !important;
    color: #fff !important;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
    box-shadow: -10px 0 0 var(--fusadi-blue) !important;
}

/* =====================================================
   Sidenav mini mode (g-sidenav-hidden) — ajustes FUSADI
   ===================================================== */
@media (min-width: 1200px) {
    /* Mini mode: ocultar solo el texto, ícono y divider siempre visibles */
    .g-sidenav-hidden #sidenav-main .fusadi-section-text-wrap {
        display: none;
    }
    .g-sidenav-hidden #sidenav-main .fusadi-section-wrap {
        justify-content: flex-start;
        padding: .5rem 0 .25rem .9rem;
    }

    /* Hover: vuelve a full mode */
    .g-sidenav-hidden #sidenav-main:hover .fusadi-section-text-wrap {
        display: block;
    }
    .g-sidenav-hidden #sidenav-main:hover .fusadi-section-wrap {
        justify-content: flex-start;
        padding: .5rem .75rem .25rem .5rem;
    }

    /* Ocultar accent line y subtitle */
    .g-sidenav-hidden #sidenav-main .fusadi-accent-line,
    .g-sidenav-hidden #sidenav-main .fusadi-subtitle {
        opacity: 0;
        overflow: hidden;
        height: 0;
        padding: 0;
        margin: 0;
    }
    .g-sidenav-hidden #sidenav-main:hover .fusadi-accent-line,
    .g-sidenav-hidden #sidenav-main:hover .fusadi-subtitle {
        opacity: 1;
        height: auto;
    }

    /* Ocultar nombre de marca */
    .g-sidenav-hidden #sidenav-main .fusadi-brand {
        opacity: 0;
        width: 0;
        overflow: hidden;
    }
    .g-sidenav-hidden #sidenav-main:hover .fusadi-brand {
        opacity: 1;
        width: auto;
    }
}