/* Tema claro global del panel administrativo */

:root {
    --admin-fondo: #fff;
    --admin-panel: #fff;
    --admin-panel-suave: #f5f7f6;
    --admin-verde: #2f4d3e;
    --admin-verde-claro: #426653;
    --admin-dorado: #b98a2e;
    --admin-terracota: #ad5b3d;
    --admin-texto: #292b27;
    --admin-suave: #716e66;
    --admin-borde: rgba(47, 77, 62, .15);
}

html,
body,
body.bg-light {
    min-height: 100%;
    color: var(--admin-texto) !important;
    background: #fff !important;
}

.navbar.bg-dark,
.navbar-dark.bg-dark {
    color: #fff !important;
    background: var(--admin-verde) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
    box-shadow: 0 7px 20px rgba(47, 77, 62, .16) !important;
}

.navbar-brand {
    color: #fff !important;
}

.navbar .btn-outline-light {
    color: #fff !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, .48) !important;
}

.navbar .btn-outline-light:hover {
    color: var(--admin-verde) !important;
    background: #fff !important;
    border-color: #fff !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.dashboard-card h4,
.card h5 {
    color: var(--admin-texto) !important;
}

.text-muted,
.dashboard-card .text-muted,
.dashboard-card p,
.form-text,
.table .text-muted {
    color: var(--admin-suave) !important;
}

.card,
.dashboard-card,
section.card,
[aria-label="Estadísticas de visitas"] .card {
    color: var(--admin-texto) !important;
    background: var(--admin-panel) !important;
    border: 1px solid var(--admin-borde) !important;
    box-shadow: 0 9px 25px rgba(65, 57, 43, .09) !important;
}

.card-header,
section.card .card-header {
    color: var(--admin-verde) !important;
    background: var(--admin-panel-suave) !important;
    border-bottom: 1px solid var(--admin-borde) !important;
}

.card h5::before,
.dashboard-card::before {
    background: var(--admin-terracota) !important;
}

.dashboard-card::after {
    color: var(--admin-terracota) !important;
}

.dashboard-card:hover,
.card:hover {
    border-color: rgba(47, 77, 62, .28) !important;
}

a.text-dark {
    color: var(--admin-texto) !important;
}

.form-label,
.form-check-label {
    color: #454740 !important;
}

.form-control,
.form-select {
    color: var(--admin-texto) !important;
    background-color: #fff !important;
    border-color: #cec8bb !important;
}

.form-control::placeholder {
    color: #9a968e !important;
}

.form-control:hover,
.form-select:hover {
    border-color: #a8a092 !important;
}

.form-control:focus,
.form-select:focus {
    color: var(--admin-texto) !important;
    background-color: #fff !important;
    border-color: var(--admin-verde-claro) !important;
    box-shadow: 0 0 0 .2rem rgba(47, 77, 62, .13) !important;
}

.form-select option {
    color: var(--admin-texto) !important;
    background: #fff !important;
}

.form-check-input {
    background-color: #fff !important;
    border-color: #aaa398 !important;
}

.form-check-input:checked {
    background-color: var(--admin-verde) !important;
    border-color: var(--admin-verde) !important;
}

.btn-warning,
.btn-primary {
    color: #fff !important;
    background: var(--admin-verde) !important;
    border-color: var(--admin-verde) !important;
    box-shadow: 0 6px 16px rgba(47, 77, 62, .15) !important;
}

.btn-warning:hover,
.btn-primary:hover {
    color: #fff !important;
    background: var(--admin-verde-claro) !important;
    border-color: var(--admin-verde-claro) !important;
}

.btn-secondary {
    color: #fff !important;
    background: #74756f !important;
    border-color: #74756f !important;
}

.btn-outline-success {
    color: var(--admin-verde) !important;
    background: transparent !important;
    border-color: var(--admin-verde) !important;
}

.btn-outline-success:hover {
    color: #fff !important;
    background: var(--admin-verde) !important;
}

.btn-danger {
    color: #fff !important;
    background: #a64d4d !important;
    border-color: #a64d4d !important;
}

.btn-success {
    color: #fff !important;
    background: #3f7855 !important;
    border-color: #3f7855 !important;
}

.table,
section.card .table {
    --bs-table-color: var(--admin-texto);
    --bs-table-bg: transparent;
    --bs-table-striped-color: var(--admin-texto);
    --bs-table-striped-bg: rgba(47, 77, 62, .035);
    --bs-table-border-color: rgba(47, 77, 62, .12);
    color: var(--admin-texto) !important;
}

.table thead th,
section.card .table th {
    color: #686a63 !important;
    background: #f3f5f4 !important;
}

.table tbody tr:hover {
    background: rgba(47, 77, 62, .04) !important;
}

.table .badge.bg-success,
.table .badge.text-bg-success {
    color: #fff !important;
    background: #36724d !important;
    border: 1px solid #2d6241 !important;
    opacity: 1 !important;
}

.table .badge.bg-secondary,
.table .badge.text-bg-secondary {
    color: #fff !important;
    background: #606560 !important;
    border: 1px solid #515651 !important;
    opacity: 1 !important;
}

.table .badge.bg-danger,
.table .badge.text-bg-danger {
    color: #fff !important;
    background: #a64d4d !important;
    border: 1px solid #8f3e3e !important;
    opacity: 1 !important;
}

.table .badge.bg-warning,
.table .badge.text-bg-warning {
    color: #3a2a00 !important;
    background: #e2b83f !important;
    border: 1px solid #c99e28 !important;
    opacity: 1 !important;
}

.table td strong,
.table td:nth-child(2) strong,
.table td:nth-child(3) strong {
    color: var(--admin-texto) !important;
}

.producto-img-tabla,
.table img {
    background: #f1f3f2 !important;
    border-color: var(--admin-borde) !important;
    box-shadow: 0 4px 12px rgba(65, 57, 43, .12) !important;
}

input[type="file"]::file-selector-button {
    color: #fff !important;
    background: var(--admin-verde) !important;
    border-color: var(--admin-verde) !important;
}

.alert-info {
    color: #244d58 !important;
    background: #e4f1f3 !important;
    border-color: #b9dadd !important;
}

.alert-success {
    color: #315d40 !important;
    background: #e5f2e8 !important;
    border-color: #bed9c5 !important;
}

.alert-danger {
    color: #7b3737 !important;
    background: #f7e6e4 !important;
    border-color: #e5bfbb !important;
}

/* Login claro */

.login-container {
    background: transparent !important;
}

.login-card {
    color: var(--admin-texto) !important;
    background: var(--admin-panel) !important;
    border: 1px solid var(--admin-borde) !important;
    box-shadow: 0 22px 55px rgba(65, 57, 43, .16) !important;
}

.login-card::after {
    background: linear-gradient(90deg, transparent, var(--admin-terracota), transparent) !important;
}

.login-marca {
    margin: -34px -38px 20px !important;
    padding: 27px 38px 22px;
    background: linear-gradient(145deg, #3b5d4c, #263f33);
}

.login-card h2 {
    color: var(--admin-verde) !important;
    text-shadow: none !important;
}

.login-card hr {
    border-color: var(--admin-borde) !important;
}

.login-card .btn-outline-light {
    color: var(--admin-verde) !important;
    background: transparent !important;
    border-color: var(--admin-verde) !important;
}

.login-card .btn-outline-light:hover {
    color: #fff !important;
    background: var(--admin-verde) !important;
}

@media (max-width: 768px) {
    .table {
        --bs-table-bg: transparent !important;
        --bs-table-striped-bg: transparent !important;
        --bs-table-accent-bg: transparent !important;
    }

    .table tbody tr {
        background: #fff !important;
        border: 1px solid #d9ddda !important;
        box-shadow: 0 5px 15px rgba(32, 48, 40, .07) !important;
    }

    .table tbody tr > td,
    .table.table-striped tbody tr > td {
        color: #292b27 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .table tbody td::before {
        color: #5f645f !important;
        font-weight: 800 !important;
    }

    .table small.text-muted,
    .table span.text-muted {
        color: #696d68 !important;
    }

    .table tbody td.text-end {
        border-top-color: #e1e4e2 !important;
    }
}

@media (max-width: 576px) {
    .login-marca {
        margin: -27px -22px 18px !important;
        padding: 23px 22px 19px;
    }
}

.preview-dialogo {
    width: min(92vw, 650px);
    padding: 0;
    background: #fff;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 25px 70px rgba(0, 0, 0, .28);
}

.preview-dialogo::backdrop {
    background: rgba(15, 20, 17, .62);
    backdrop-filter: blur(3px);
}

.preview-cabecera {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 19px;
    color: #fff;
    background: #2f4d3e;
}

.preview-cabecera > div { display: grid; gap: 2px; }
.preview-cabecera small { color: rgba(255, 255, 255, .72); font-size: .75rem; }

.preview-cabecera button {
    color: #fff;
    background: transparent;
    border: 0;
    font-size: 1.6rem;
}

.preview-producto {
    display: flex;
    align-items: stretch;
    gap: 18px;
    margin: 20px;
    padding: 14px;
    background: #fffdf8;
    border: 1px solid #dce2de;
    border-radius: 15px;
    box-shadow: 0 10px 28px rgba(31, 45, 37, .09);
}

.preview-media {
    position: relative;
    flex: 0 0 120px;
    width: 120px;
    height: 120px;
    overflow: hidden;
    background: linear-gradient(145deg, #eee8dc, #ded5c3);
    border: 1px solid #d6cebf;
    border-radius: 12px;
}

.preview-imagen {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.preview-sin-imagen { position: absolute; inset: 0; display: grid; place-items: center; color: #817b70; font-size: .85rem; }
.preview-sin-imagen[hidden] { display: none; }
.preview-contenido { flex: 1 1 auto; min-width: 0; }
.preview-estados { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 5px; }
.preview-estados span { padding: 3px 7px; border-radius: 999px; font-size: .68rem; font-weight: 700; }
.preview-destacado { color: #3f3106; background: #f5cf5d; }
.preview-agotado { color: #fff; background: #b34242; }

.preview-producto h3 {
    margin: 0 0 5px;
    font-size: 1.12rem;
    text-transform: capitalize;
}
.preview-producto p { margin: 0 0 8px; color: #6d706c; font-size: .9rem; }
.preview-precio { color: #ad5b3d; font-size: 1.15rem; }
.preview-etiquetas { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 9px; }
.preview-etiquetas span { padding: 4px 8px; color: #fff; background: #2f4d3e; border-radius: 999px; font-size: .7rem; }
.preview-alergenos { margin: 2px 0 9px !important; color: #626760 !important; }
.preview-alergenos strong { color: #2f4d3e; }
.preview-alergenos[hidden] { display: none; }

@media (max-width: 480px) {
    .preview-producto { display: grid; }
    .preview-media { width: 100%; height: 180px; }
}
.navbar .navbar-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
}

.navbar .container {
    position: relative;
}

.navbar .container::after {
    content: "Cafetería & Restaurant";
    position: absolute;
    top: 50%;
    left: 50%;
    color: rgba(255, 255, 255, .92);
    font-size: .86rem;
    font-weight: 650;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
    pointer-events: none;
    transform: translate(-50%, -50%);
}

.navbar .navbar-brand::before {
    content: "";
    display: block;
    flex: 0 0 58px;
    width: 58px;
    height: 36px;
    background: url("../../logo-blanco.png") center / contain no-repeat;
}

@media (max-width: 480px) {
    .navbar .navbar-brand {
        gap: 7px;
        font-size: 1rem;
    }

    .navbar .navbar-brand::before {
        flex-basis: 46px;
        width: 46px;
        height: 30px;
    }

    .navbar .container::after {
        max-width: 115px;
        font-size: .62rem;
        line-height: 1.15;
        text-align: center;
        white-space: normal;
    }
}