/* -------------------------------------------------------------------------- */
/*                                Falcon Button                               */
/* -------------------------------------------------------------------------- */
/* prettier-ignore */

/* Fix: números de días del calendario invisibles en modo dark */
[data-bs-theme=dark] .fc .fc-daygrid-day-number {
    color: var(--falcon-gray-900) !important;
    background-color: var(--falcon-gray-200) !important;
}

/* Dark mode: unificar luminosidad del texto normal con la de los headings
   (h1..h6 usan --falcon-secondary-color #d8e2ef, body usaba #9da9bb -> poco visible) */
[data-bs-theme=dark] {
    --falcon-body-color: #d8e2ef;
    --falcon-body-color-rgb: 216, 226, 239;

    /* Bug del theme: dentro del bloque [data-bs-theme=dark], theme.css fija
       --falcon-quaternary-bg y --falcon-emphasis-bg a #fff, dejando blancos
       los .form-control, .btn-falcon, popups de flatpickr/tinymce, etc.
       Los redirigimos a un tono de tarjeta oscura. */
    --falcon-quaternary-bg: #162231;
    --falcon-quaternary-bg-rgb: 22, 34, 49;
    --falcon-emphasis-bg: #162231;
    --falcon-emphasis-bg-rgb: 22, 34, 49;
}

/* .bg-light se resuelve a rgba(--falcon-light-rgb,1) (≈ #f9fafd) y queda blanco
   también en modo oscuro (cabeceras tipo "Opciones de presupuesto"). Lo bajamos
   al color de fondo secundario. Especificidad alta para vencer a vendor CSS. */
html[data-bs-theme=dark] .bg-light,
html[data-bs-theme=dark] .card-header.bg-light,
html[data-bs-theme=dark] div.bg-light {
    background-color: var(--falcon-secondary-bg) !important;
    color: var(--falcon-body-color) !important;
}

/* Forzamos fondo oscuro a TODO .form-control en dark mode. */
html[data-bs-theme=dark] .form-control,
html[data-bs-theme=dark] input.form-control,
html[data-bs-theme=dark] textarea.form-control,
html[data-bs-theme=dark] select.form-control,
html[data-bs-theme=dark] select.form-select,
html[data-bs-theme=dark] .form-control[readonly]:not([type=file]),
html[data-bs-theme=dark] .form-control:read-only:not([type=file]),
html[data-bs-theme=dark] .form-control:disabled {
    background-color: var(--falcon-quaternary-bg) !important;
    color: var(--falcon-body-color) !important;
}

/* theme.css fuerza background:#dee3eb a los inputs readonly de total_tarrif e
   insurance_value_net con ID, dejándolos casi blancos en modo oscuro. Pisamos
   con misma especificidad de ID + atributo de tema, ambos con !important. */
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_2,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_3,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_4,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_5,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_6,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_7,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_8,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_9,
html[data-bs-theme=dark] #tblpresupuestos-total_tarrif_10,
html[data-bs-theme=dark] #tblpresupuestos-insurance_value_net {
    background: var(--falcon-quaternary-bg) !important;
    color: var(--falcon-body-color) !important;
}

/* Edge/Chrome aplican autofill a inputs con name "total"/"value"/etc. y meten
   un box-shadow inset blanco que el background-color NO puede vencer. Único
   modo de neutralizarlo: pisar el inset shadow con uno del color oscuro. */
html[data-bs-theme=dark] .form-control:-webkit-autofill,
html[data-bs-theme=dark] .form-control:-webkit-autofill:hover,
html[data-bs-theme=dark] .form-control:-webkit-autofill:focus,
html[data-bs-theme=dark] .form-control:-webkit-autofill:active,
html[data-bs-theme=dark] input:-webkit-autofill,
html[data-bs-theme=dark] input:-webkit-autofill:hover,
html[data-bs-theme=dark] input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--falcon-quaternary-bg) inset !important;
    box-shadow: 0 0 0 1000px var(--falcon-quaternary-bg) inset !important;
    -webkit-text-fill-color: var(--falcon-body-color) !important;
    caret-color: var(--falcon-body-color) !important;
    transition: background-color 99999s ease-in-out 0s !important;
}

/* Fix bug en theme.css: el selector ".datepicker-days thead, tbody, tfoot, tr, td, th"
   por culpa de la coma aplica color:#14191e a TODAS las celdas de la página, dejando
   las tablas ilegibles en modo oscuro. Restauramos el color heredado. */
[data-bs-theme=dark] tbody,
[data-bs-theme=dark] tfoot,
[data-bs-theme=dark] tr,
[data-bs-theme=dark] td,
[data-bs-theme=dark] th {
    color: inherit;
}

/* Las tablas de Falcon definen --falcon-table-color: #5e6e82 hardcoded,
   muy oscuro para dark mode. Lo subimos a la luminosidad del body. */
[data-bs-theme=dark] .table {
    --falcon-table-color: #d8e2ef;
    --falcon-table-striped-color: #d8e2ef;
}

/* Dark mode: botones en blanco (texto + borde transparente -> blanco).
   El layout main.php fija color/borde con un color de marca oscuro (#18476c)
   via params, ilegible sobre fondo dark. Hover -> fondo blanco, texto oscuro. */
[data-bs-theme=dark] .btn-primary,
[data-bs-theme=dark] .btn-success,
[data-bs-theme=dark] .btn-danger,
[data-bs-theme=dark] .btn-warning,
[data-bs-theme=dark] .btn-info,
[data-bs-theme=dark] .btn-outline-secondary,
[data-bs-theme=dark] .btn-primary:focus,
[data-bs-theme=dark] .btn-success:focus,
[data-bs-theme=dark] .btn-danger:focus,
[data-bs-theme=dark] .btn-warning:focus,
[data-bs-theme=dark] .btn-info:focus,
[data-bs-theme=dark] .btn-outline-secondary:focus {
    background-color: transparent !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
}
[data-bs-theme=dark] .btn-primary:hover,
[data-bs-theme=dark] .btn-success:hover,
[data-bs-theme=dark] .btn-danger:hover,
[data-bs-theme=dark] .btn-warning:hover,
[data-bs-theme=dark] .btn-info:hover,
[data-bs-theme=dark] .btn-outline-secondary:hover,
[data-bs-theme=dark] .btn-primary.active,
[data-bs-theme=dark] .btn-success.active,
[data-bs-theme=dark] .btn-danger.active,
[data-bs-theme=dark] .btn-warning.active,
[data-bs-theme=dark] .btn-info.active,
[data-bs-theme=dark] .btn-outline-secondary.active,
[data-bs-theme=dark] .btn-primary:active,
[data-bs-theme=dark] .btn-success:active,
[data-bs-theme=dark] .btn-danger:active,
[data-bs-theme=dark] .btn-warning:active,
[data-bs-theme=dark] .btn-info:active,
[data-bs-theme=dark] .btn-outline-secondary:active {
    background-color: #ffffff !important;
    color: #0b1727 !important;
    border-color: #ffffff !important;
}

/* Otro bug de coma en theme.css: la regla pensada para #invoice_container
   acaba aplicando "color:#34404f !important" a TODOS los td/th :first-child.
   En dark mode esto deja invisibles las primeras columnas. */
[data-bs-theme=dark] .table tr th:first-child,
[data-bs-theme=dark] .table tr td:first-child,
[data-bs-theme=dark] .table thead > tr > th:first-child,
[data-bs-theme=dark] .table tfoot > tr > th:first-child {
    color: inherit !important;
}

/* ===== PAGINACIÓN GLOBAL GRIDVIEW - ESTILO EVENTOS/FALCON ===== */
.grid-view .pagination {
  justify-content: center;
  margin: 1rem 0;
}

.grid-view .pagination .page-item.disabled {
  display: none !important;
}

.grid-view .pagination .page-item .page-link {
  border-radius: 0.25rem !important;
}

.grid-view .pagination .page-item:first-child .page-link,
.grid-view .pagination .page-item:last-child .page-link {
  border-radius: 0.25rem !important;
}

/* ===== DATEPICKER DARK MODE: texto blanco y fondo oscuro ===== */
/* theme.css bug: ".datepicker-days thead, tbody, tfoot, tr, td, th"
   la coma suelta aplica color:#14191e a TODOS los td/th globalmente.
   Usamos selectores de alta especificidad + !important para forzar blanco. */
html[data-bs-theme=dark] .datepicker,
html[data-bs-theme=dark] .datepicker-dropdown {
    background-color: #0b1727 !important;
    color: #ffffff !important;
    border-color: #344050 !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days thead tr th,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td,
html[data-bs-theme=dark] .datepicker .datepicker-months table tr td span,
html[data-bs-theme=dark] .datepicker .datepicker-years table tr td span,
html[data-bs-theme=dark] .datepicker .datepicker-decades table tr td span,
html[data-bs-theme=dark] .datepicker .datepicker-centuries table tr td span {
    color: #ffffff !important;
    background-color: transparent;
}
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.old,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.new {
    color: #6c757d !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.disabled,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.disabled:hover {
    color: #4a5568 !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.active,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.active:hover,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.active.active {
    background-color: #2c7be5 !important;
    color: #ffffff !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.today,
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td.today:hover {
    background-color: #344050 !important;
    color: #ffffff !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days tbody tr td:hover,
html[data-bs-theme=dark] .datepicker .datepicker-months table tr td span:hover,
html[data-bs-theme=dark] .datepicker .datepicker-years table tr td span:hover {
    background-color: #1e3a5f !important;
}
html[data-bs-theme=dark] .datepicker .datepicker-days thead tr:first-child th:hover,
html[data-bs-theme=dark] .datepicker .datepicker-days tfoot tr th:hover {
    background-color: #1e3a5f !important;
}

/* ===== DATEPICKER: tamaño más grande en desktop ===== */
@media (min-width: 768px) {
    .datepicker {
        min-width: 320px;
        font-size: 1rem;
    }
    .datepicker table {
        width: 100%;
    }
    .datepicker table tr td,
    .datepicker table tr th {
        padding: 8px 10px;
        font-size: 0.95rem;
    }
    .datepicker table tr td.day {
        width: 40px;
        height: 40px;
        line-height: 40px;
        padding: 0;
    }
}

/* Fix: Falcon theme overrides .btn.active breaking outline-secondary selection look */
.enviar-cuando-srv-option.active,
.enviar-cuando-option.active,
.seguimiento-option.active {
    background-color: var(--falcon-primary) !important;
    border-color: var(--falcon-primary) !important;
    color: #fff !important;
}

/* ===== MODAL HEADER RESPONSIVE: botones se ajustan en tablet/mobile =====
   Objetivo: que las cabeceras con varios botones (PDF, Copiar link, Enviar,
   Cancelar, idioma ES/EN/CA, etc.) no desborden ni queden enormes en
   pantallas pequeñas. Se aplica a TODOS los .modal-header globalmente. */
.modal-header {
    flex-wrap: wrap;
    row-gap: .35rem;
}
.modal-header > .ms-auto {
    flex-wrap: wrap;
    row-gap: .35rem;
}

/* Tablet (≤ 991.98px): botones algo más compactos */
@media (max-width: 991.98px) {
    .modal-header .btn,
    .modal-header .btn-group > .btn {
        padding: .3rem .55rem;
        font-size: .82rem;
        line-height: 1.3;
    }
    .modal-header .modal-title {
        font-size: 1.05rem;
    }
}

/* Mobile (≤ 767.98px): título a línea propia, botones aún más pequeños */
@media (max-width: 767.98px) {
    .modal-header {
        padding: .55rem .75rem;
        gap: .35rem;
    }
    .modal-header .modal-title {
        flex: 1 1 100%;
        font-size: 1rem;
        margin-right: 0;
        margin-bottom: .15rem;
    }
    .modal-header .btn,
    .modal-header .btn-group > .btn {
        padding: .25rem .45rem;
        font-size: .75rem;
        line-height: 1.25;
    }
    .modal-header .btn i.fas,
    .modal-header .btn i.fab,
    .modal-header .btn i.far {
        font-size: .8rem;
    }
    .modal-header .btn-close {
        padding: .35rem;
    }
    /* La fila .ms-auto pasa a ocupar todo el ancho y se reparte */
    .modal-header > .ms-auto {
        margin-left: 0 !important;
        width: 100%;
        justify-content: flex-start;
    }
}

/* Mobile pequeño (≤ 480px): apretar más y permitir que iconos sin texto
   queden mínimos, sin romper la acción */
@media (max-width: 480px) {
    .modal-header .btn,
    .modal-header .btn-group > .btn {
        padding: .22rem .4rem;
        font-size: .72rem;
    }
    .modal-header .btn i + span,
    .modal-header .btn .me-1 {
        margin-right: .15rem !important;
    }
}

/* ===== Switches encendidos en verde Falcon (#00d27a) ====================
   Solo cambia el color de FONDO del switch, sin tocar background-image
   (bolita SVG) ni background-position (animación slide). Sin !important
   para no interferir con la animación del slider. */
.form-switch .form-check-input:checked {
    background-color: #00d27a;
    border-color: #00d27a;
}

/* ===== Fix Falcon: restaurar clics en form-controls dentro de tooltip ===
   El theme.css incluye `[data-bs-toggle=tooltip] * { pointer-events: none; }`
   que rompe el click en inputs/selects/checkboxes/switches envueltos en un
   contenedor con tooltip. Restauramos `pointer-events: auto` en los controles
   de formulario para que el tooltip siga funcionando pero los clics lleguen. */
[data-bs-toggle=tooltip] input,
[data-bs-toggle=tooltip] select,
[data-bs-toggle=tooltip] textarea,
[data-bs-toggle=tooltip] button,
[data-bs-toggle=tooltip] label,
[data-bs-toggle=tooltip] a,
[data-bs-toggle=tooltip] .form-check-input,
[data-bs-toggle=tooltip] .form-check {
    pointer-events: auto !important;
}

/* Tarifas/categorias del presupuesto (Texto Precio 1..8): textarea
   redimensionable en alto desde la esquina inferior derecha. Vence al
   resize:none que el auto-grow de servicios/update mete inline. */
textarea[id*="-texto_precio_"],
textarea[id$="-trabajos"] {
    resize: vertical !important;
}

/*# sourceMappingURL=user.css.map */