:root {
    --matias-verde: #1E6B3A; /* Tu nuevo color principal */
    --matias-marron: #6B4F2A;
    --matias-trigo: #F9B233;     /* Amarillo/Ocre de las espigas */
    --matias-carbono: #1A1A1A;   /* Negro para contraste y textos */
    --matias-crema: #F8F9FA;     /* Fondo de pantallas */
    --matias-bg: #FFFFFF;
    --sidebar-width: 16rem;
}

/* --- CONFIGURACIÓN BASE --- */
body { 
    font-family: 'Poppins', system-ui, -apple-system, sans-serif;
    background-color: var(--matias-bg); 
    overflow-x: hidden; 
}

#wrapper { display: flex; width: 100%; position: relative; }

/* --- SIDEBAR --- */
#sidebar-wrapper {
    min-height: 100vh;
    width: var(--sidebar-width);
    margin-left: calc(var(--sidebar-width) * -1);
    transition: margin .25s ease-out;
    background-color: var(--matias-bg); 
    color: var(--matias-trigo);
    border-right: 1px solid var(--matias-bg);
    position: fixed; 
    z-index: 1050; 
    top: 0; bottom: 0;
    display: flex;
    flex-direction: column; 
}

.sidebar-heading {
    padding: 0.7rem 0.7rem;
    display: flex; justify-content: center; align-items: center;
    background-color: var(--matias-bg);
    border-bottom: 1px solid #f1f5f9;
}

.list-group { flex-grow: 1; overflow-y: auto; }

.list-group-item {
    color: #64748b;
    border: none;
    padding: 0.9rem 1.2rem; 
    font-size: 0.95rem;
    font-weight: 500;
}

.list-group-item:hover { 
    background-color: #f1f5f9;
    color: var(--matias-verde); 
}

.list-group-item.active {
    background-color: rgba(227, 6, 19, 0.08); /* Fondo rojizo muy sutil */
    color: var(--matias-trigo) !important;
    font-weight: 700;
    border-left: 4px solid var(--matias-trigo);
}

.sidebar-footer {
    padding: 15px;
    background-color: #f8fafc;
    border-top: 1px solid #e2e8f0;
    text-align: center;
    font-size: 0.8rem;
}

/* --- CONTENIDO --- */
#page-content-wrapper {
    width: 100%;
    margin-left: 0;
    transition: margin .25s ease-out;
    min-height: 100vh;
}

.navbar-top { 
    background: white; 
    box-shadow: 0 1px 3px rgba(0,0,0,0.1); 
    padding: 0.8rem 0.5rem;
    border-bottom: 3px solid var(--matias-verde); /* Acento superior */
}

/* Botones y Avatares */
.btn-primary {
    background-color: var(--matias-trigo);
    border-color: var(--matias-trigo);
}
.btn-primary:hover {
    background-color: white;
    border-color: var(--matias-trigo);
    color: var(--matias-trigo);
}
.bg-primary { background-color: var(--matias-trigo) !important; }

body.sb-sidenav-toggled #sidebar-wrapper { margin-left: 0; }

/* --- RESPONSIVE --- */
@media (min-width: 768px) {
    #sidebar-wrapper { margin-left: 0; }
    #page-content-wrapper { margin-left: var(--sidebar-width); }
    body.sb-sidenav-toggled #sidebar-wrapper { margin-left: calc(var(--sidebar-width) * -1); }
    body.sb-sidenav-toggled #page-content-wrapper { margin-left: 0; }
}

@media (max-width: 768px) {
    body.sb-sidenav-toggled::before {
        content: "";
        position: fixed; top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(0,0,0,0.5); z-index: 1040;
    }
}

.w2p_flash { display: none !important; }
/* FIX SWEETALERT TOAST  */
body.swal2-toast-shown .swal2-container { width: auto !important; }
.swal2-popup.swal2-toast {
    font-size: 1rem !important; 
    padding: 0.75rem 1rem !important; 
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15) !important;
}

/* Customización de DataTables para Panificadora Matías */
.page-item.active .page-link {
    background-color: var(--matias-trigo) !important;
    border-color: var(--matias-trigo) !important;
    color: white !important;
}
.page-link {
    color: var(--matias-carbono);
}
.page-link:focus {
    box-shadow: 0 0 0 0.25rem rgba(227, 6, 19, 0.25);
}
.dtr-details { width: 100%; } /* Para que el desplegable en mobile ocupe todo el ancho */

ul.dtr-details {
    width: 100%;
    display: block;
    padding: 0;
}

ul.dtr-details > li {
    display: flex !important;
    flex-direction: column; /* Apila el título arriba y el dato abajo */
    border-bottom: 1px solid #dee2e6;
    padding: 0.5rem 0;
}

ul.dtr-details > li:last-child {
    border-bottom: none;
}

ul.dtr-details > li > span.dtr-title {
    font-weight: bold;
    color: #6c757d; /* text-muted */
    margin-bottom: 0.25rem;
    font-size: 0.85rem;
}

ul.dtr-details > li > span.dtr-data {
    white-space: normal !important; /* Fuerza el salto de línea */
    word-wrap: break-word;
    word-break: break-word; /* Evita que el texto largo rompa el ancho */
    width: 100%;
    color: #212529;
}

/* Alineación de los botones de acción en el detalle */
ul.dtr-details > li > span.dtr-data .btn {
    margin-top: 0.5rem;
}