/**
 * Marca: header negro; rojo en botones primarios y enlaces — modo oscuro.
 */
:root {
    --cupones-header-bg: #000000;
    --cupones-brand: #dc2626;
    --cupones-brand-hover: #b91c1c;
    --bs-primary: #ef4444;
    --bs-primary-rgb: 239, 68, 68;
    --bs-primary-text-emphasis: #fecaca;
    --bs-primary-bg-subtle: rgba(239, 68, 68, 0.28);
    --bs-primary-border-subtle: #dc2626;
    --bs-link-color: #f87171;
    --bs-link-hover-color: #fecaca;
    --bs-link-color-rgb: 248, 113, 113;
    --bs-focus-ring-color: rgba(248, 113, 113, 0.4);
    --bs-blue: #ef4444;
    --bs-blue-rgb: 239, 68, 68;
}

/* Barra superior: negro (evita que gane el azul/rojo por defecto del CDN) */
.navbar.navbar-dark.bg-primary {
    background-color: var(--cupones-header-bg) !important;
    background-image: none !important;
}

.navbar.navbar-dark.bg-primary .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.35);
}

.navbar.navbar-dark.bg-primary .navbar-toggler-icon {
    filter: none;
}

/* Evita 0×0: el .container del navbar es flex y el brand encogía; width:auto del img quedaba en 0. */
.navbar.navbar-dark.bg-primary .navbar-brand-logo {
    display: block;
    height: 2.52rem;
    width: auto;
    max-width: min(70vw, 20.16rem);
    flex-shrink: 0;
    object-fit: contain;
}

/* Login: estilos en public/css/login.css */

.btn-primary {
    --bs-btn-bg: var(--cupones-brand);
    --bs-btn-border-color: var(--cupones-brand);
    --bs-btn-hover-bg: var(--cupones-brand-hover);
    --bs-btn-hover-border-color: var(--cupones-brand-hover);
    --bs-btn-active-bg: var(--cupones-brand-hover);
    --bs-btn-active-border-color: var(--cupones-brand-hover);
}

/*
 * Reimprimir en DataTables: la tabla fuerza color de texto y gana a .btn.
 * Subimos especificidad y fijamos fill del SVG (no solo currentColor).
 */
table.dataTable td .btn-reimprimir-qr.btn-outline-dark,
#tabla-cupones-historial_wrapper .btn-reimprimir-qr.btn-outline-dark,
.table .btn-reimprimir-qr.btn-outline-dark {
    --bs-btn-color: #fff !important;
    --bs-btn-border-color: rgba(255, 255, 255, 0.9) !important;
    --bs-btn-hover-bg: rgba(255, 255, 255, 0.15) !important;
    --bs-btn-hover-border-color: #fff !important;
    --bs-btn-hover-color: #fff !important;
    --bs-btn-focus-shadow-rgb: 255, 255, 255;
    --bs-btn-active-color: #fff !important;
    --bs-btn-active-bg: rgba(255, 255, 255, 0.25) !important;
    --bs-btn-active-border-color: #fff !important;
    --bs-btn-disabled-color: rgba(255, 255, 255, 0.45) !important;
    --bs-btn-disabled-border-color: rgba(255, 255, 255, 0.35) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.9) !important;
    background-color: transparent !important;
}

table.dataTable td .btn-reimprimir-qr.btn-outline-dark svg,
#tabla-cupones-historial_wrapper .btn-reimprimir-qr svg,
.table .btn-reimprimir-qr svg {
    fill: #fff !important;
    color: #fff !important;
}

table.dataTable td .btn-reimprimir-qr.btn-outline-dark svg path,
.table .btn-reimprimir-qr svg path {
    fill: #fff !important;
}

/* ——— Barra superior admin: ancho completo, logo al borde izquierdo ——— */
.admin-top-navbar .admin-navbar-brand {
    margin-bottom: 0;
    margin-right: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
}

.admin-top-navbar > .d-flex {
    padding-left: max(0.5rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.5rem, env(safe-area-inset-right, 0px));
}

@media (min-width: 576px) {
    .admin-top-navbar > .d-flex {
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }
}

/* ——— Panel administrador: sidebar (offcanvas en móvil, fijo en lg) ——— */
.admin-offcanvas-sidebar {
    --bs-offcanvas-width: min(280px, 85vw);
}

@media (min-width: 992px) {
    .admin-offcanvas-sidebar {
        visibility: visible !important;
        transform: none !important;
        position: relative !important;
        flex-shrink: 0;
        align-self: stretch;
        width: var(--bs-offcanvas-width);
        max-width: 280px;
        min-height: 0;
        transition: width 0.2s ease, max-width 0.2s ease;
    }

    /* Cuerpo del sidebar llena la altura de la columna; el nav crece y el pie queda abajo */
    .admin-offcanvas-sidebar > .admin-offcanvas-sidebar-body {
        flex: 1 1 auto;
        min-height: 0;
    }

    .admin-offcanvas-sidebar.admin-sidebar-collapsed {
        width: 4.25rem !important;
        max-width: 4.25rem !important;
        --bs-offcanvas-width: 4.25rem;
    }

    .admin-offcanvas-sidebar.admin-sidebar-collapsed .sidebar-label {
        display: none !important;
    }

    .admin-offcanvas-sidebar.admin-sidebar-collapsed .nav-link {
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .admin-sidebar-collapse-btn:focus-visible {
        box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.35);
    }
}

.admin-sidebar-collapse-chevron {
    display: block;
    transition: transform 0.2s ease;
}

.admin-offcanvas-sidebar.admin-sidebar-collapsed .admin-sidebar-collapse-chevron {
    transform: scaleX(-1);
}

.admin-offcanvas-sidebar .nav-link.active {
    font-weight: 600;
}

.admin-content-container {
    max-width: 1200px;
}

/* Cajero: engrane menú (dropdown), sin toggler clásico */
.navbar-gear-dropdown .dropdown-toggle::after {
    display: none;
}