/*
 * Manual de Estilo: Proyecto Gestión Quimiapan
 * Archivo: feg.css
 */

/* --- I. Filosofía General y Layout --- */

.feg-portal-content {
    background-color: #f4f4f4;
    padding: 20px; /* Añadido para dar espacio al contenido */
}

/* --- I.A. Layout del Portal (Header, Nav, Responsive) --- */

:root {
    --feg-header-height: 60px;
    --feg-nav-width: 240px;
    --feg-z-overlay: 100;
    --feg-z-nav: 110;
    
    /* Paleta de Colores Estandarizada */
    --feg-color-boton-principal: #345C00;
    --feg-color-boton-principal-hover: #2a4a00;
    --feg-color-boton-secundario-texto: #333;
    --feg-color-boton-secundario-borde: #ccc;
    --feg-color-boton-secundario-fondo-hover: #f9f9f9;
    --feg-color-boton-peligro: #D32F2F;
    --feg-color-boton-peligro-hover: #b71c1c;
    
    --feg-color-fondo: #f4f4f4;
    --feg-color-fondo-tarjeta: #FFFFFF;
    --feg-color-borde: #e0e0e0;
    --feg-color-texto-principal: #333;
    --feg-color-texto-secundario: #555;
    --feg-color-error: #a94442;
    --feg-color-exito: #3c763d;
    --feg-color-info: #31708f;

    --feg-radio-borde: 4px;
}

#feg-portal-wrap {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.feg-header {
    background-color: #ffffff;
    border-bottom: 1px solid #e0e0e0;
    height: var(--feg-header-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    position: sticky;
    top: 0;
    z-index: 99;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.feg-logo-container {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 8px 0;
}

.feg-logo-container img {
    height: 100%;
    width: auto;
    object-fit: contain;
}

.feg-menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    width: 40px;
    height: 40px;
    z-index: var(--feg-z-nav);
}

.feg-menu-toggle__bar {
    width: 100%;
    height: 3px;
    background-color: #333;
    border-radius: 2px;
    transition: all 0.3s ease;
}

.feg-header__placeholder {
    width: 40px; /* Mismo ancho que el botón de menú para centrar el logo */
    flex-shrink: 0;
}

/* Navegación */
.feg-portal-nav {
    position: fixed;
    top: 0;
    left: calc(-1 * var(--feg-nav-width));
    width: var(--feg-nav-width);
    height: 100%;
    background-color: #333;
    color: #fff;
    padding-top: calc(var(--feg-header-height) + 20px);
    z-index: var(--feg-z-nav);
    transition: left 0.3s ease-in-out;
    overflow-y: auto;
}

.feg-portal-nav.is-open {
    left: 0;
}

.feg-portal-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.feg-portal-nav li a {
    display: block;
    padding: 12px 20px;
    color: #f1f1f1;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.feg-portal-nav li a:hover {
    background-color: #4a4a4a;
    color: #fff;
}

.feg-portal-nav li a.feg-active-module {
    background-color: #345C00;
    color: #fff;
    font-weight: bold;
}

.feg-portal-nav li.feg-menu-hr-separator {
    height: 1px;
    background-color: #555;
    margin: 10px 0;
}

/* Overlay */
.feg-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: var(--feg-z-overlay);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.feg-menu-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

/* Contenido Principal */
#feg-portal-content {
    flex-grow: 1;
    padding: 20px;
    transition: margin-left 0.3s ease-in-out;
}

/* Responsive: Cuando la pantalla es ancha */
@media (min-width: 960px) {
    .feg-menu-toggle,
    .feg-menu-overlay,
    .feg-header__placeholder {
        display: none; /* Ocultar menú hamburguesa y overlay */
    }

    .feg-header {
        justify-content: center; /* Centrar el logo en desktop */
    }

    .feg-portal-nav {
        left: 0; /* Menú visible */
        padding-top: var(--feg-header-height);
    }

    #feg-portal-content {
        margin-left: var(--feg-nav-width); /* Empujar el contenido */
    }
}


/* --- II. Componente: Tarjeta (.feg-card) --- */

.feg-card {
    background-color: #FFFFFF;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    border-radius: 4px;
    margin-bottom: 25px;
}

.feg-card__header {
    padding: 15px 20px;
    border-bottom: 1px solid #e0e0e0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.feg-card__header h3,
.feg-card__header h4 {
    margin: 0;
    font-size: 1.3rem;
}

.feg-card__body {
    padding: 20px;
}

.feg-card__footer {
    padding: 15px 20px;
    border-top: 1px solid #e0e0e0;
    background-color: #f9f9f9;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}


/* --- III. Componente: Navegación por Pestañas (Tabs) --- */

.feg-tabs-nav {
    border-bottom: 2px solid #ccc;
    margin-bottom: 20px;
    display: flex;
}

.feg-tab-link {
    background-color: transparent;
    border: none;
    color: #555;
    text-decoration: none;
    padding: 10px 15px;
    margin-bottom: -2px; /* Alinea con el borde inferior del contenedor */
    border-bottom: 3px solid transparent;
    transition: all 0.2s ease-in-out;
}

.feg-tab-link:hover {
    color: #000;
    border-bottom-color: #ccc;
}

.feg-tab-link.active {
    color: #000;
    font-weight: 600; /* Ligeramente más que normal */
    border-bottom: 3px solid #345C00;
}


/* --- IV. Componente: Botones (.feg-button) --- */

.feg-button {
    padding: 10px 15px;
    border-radius: 4px;
    font-weight: bold;
    border: 1px solid transparent; /* Base para alinear secundarios */
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    line-height: 1;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.feg-button--primary {
    background-color: var(--feg-color-boton-principal);
    color: #FFFFFF;
    border-color: var(--feg-color-boton-principal);
}

.feg-button--primary:hover {
    background-color: var(--feg-color-boton-principal-hover);
    border-color: var(--feg-color-boton-principal-hover);
}

.feg-button--secondary {
    background-color: #FFFFFF;
    color: var(--feg-color-boton-secundario-texto);
    border: 1px solid var(--feg-color-boton-secundario-borde);
}

.feg-button--secondary:hover {
    background-color: var(--feg-color-boton-secundario-fondo-hover);
    border-color: #bbb;
}

.feg-button--danger {
    background-color: var(--feg-color-boton-peligro);
    color: #FFFFFF;
    border-color: var(--feg-color-boton-peligro);
}

.feg-button--danger:hover {
    background-color: var(--feg-color-boton-peligro-hover);
    border-color: var(--feg-color-boton-peligro-hover);
}

.feg-button--delete {
    background: transparent;
    border: none;
    color: var(--feg-color-boton-peligro);
    font-weight: bold;
    cursor: pointer;
    padding: 5px 8px;
    font-size: 1.2em;
    line-height: 1;
}
.feg-button--delete:hover {
    color: #000;
}

.feg-button--small {
    padding: 5px 10px;
    font-size: 13px;
}

.feg-button--nav-active {
    background-color: var(--feg-color-boton-principal);
    color: #FFFFFF;
    border-color: var(--feg-color-boton-principal);
}
.feg-button--nav-active:hover {
    background-color: var(--feg-color-boton-principal-hover);
    border-color: var(--feg-color-boton-principal-hover);
}


/* --- V. Componente: Formularios (.feg-form) --- */

.feg-form__group {
    margin-bottom: 15px; /* Espacio entre grupos de label/input */
}

/* Helper para el renderizador de helpers.php */
.feg-form-field {
     margin-bottom: 15px;
}
.feg-form-field label {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 14px;
}
.feg-form-field input[type="text"],
.feg-form-field input[type="number"],
.feg-form-field input[type="url"],
.feg-form-field input[type="date"],
.feg-form-field select,
.feg-form-field textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.feg-form-field input:focus,
.feg-form-field select:focus,
.feg-form-field textarea:focus {
    border-color: #345C00;
    outline: none;
    box-shadow: 0 0 0 2px rgba(52, 92, 0, 0.2);
}

.feg-form__label {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 14px;
}

.feg-form__input,
.feg-form__select,
.feg-form__textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box; /* Clave para padding + width 100% */
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.feg-form__input:focus,
.feg-form__select:focus,
.feg-form__textarea:focus {
    border-color: #345C00;
    outline: none;
    box-shadow: 0 0 0 2px rgba(52, 92, 0, 0.2); /* Sombra de foco sutil */
}

.feg-form__textarea {
    min-height: 120px;
    resize: vertical;
}

/* Grid de Formulario */
.feg-form__grid {
    display: grid;
    gap: 20px; /* Espacio entre campos del grid */
}

/* Reglas base (Mobile-first) */
.feg-grid--2-col {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.feg-grid--3-col {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

/* Overrides para Desktop */
@media (min-width: 768px) {
    .feg-grid--2-col {
        grid-template-columns: repeat(2, 1fr);
    }
    .feg-grid--3-col {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* --- VI. Componente: Tablas (.feg-table) --- */

.feg-table-container {
    overflow-x: auto;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background-color: #fff; /* Para que el radius funcione bien */
}

/* Alias para gestionar tareas */
.feg-table-overflow-container {
    overflow-x: auto;
}

.feg-table {
    width: 100%;
    border-collapse: collapse;
}

.feg-table th {
    background-color: #f9f9f9;
    padding: 12px 15px;
    text-align: left;
    border-bottom: 2px solid #e0e0e0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.feg-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #555;
    vertical-align: middle; /* Buena práctica */
}

.feg-table tbody tr:last-child td {
    border-bottom: none; /* Sin borde en la última fila */
}

.feg-table tbody tr:hover {
    background-color: #fcfcfc;
}

/* Modificador para tablas de formulario */
.feg-table.feg-form-table th {
    width: 30%;
    background-color: #fdfdfd;
    vertical-align: top;
    padding-top: 15px;
}
.feg-table.feg-form-table td {
    background-color: #fff;
}
.feg-table.feg-form-table tr:last-child td {
    border-bottom: 1px solid #f0f0f0; /* Restaurar borde para tablas de formulario */
}
.feg-table.feg-form-table .feg-form__input,
.feg-table.feg-form-table .feg-form__select,
.feg-table.feg-form-table .feg-form__textarea {
    max-width: 400px;
}


/* Clases de ayuda para alineación */
.feg-text-right {
    text-align: right;
}

.feg-text-center {
    text-align: center;
}


/* --- VII. Jerarquía de Títulos --- */

h2.feg-module-title {
    font-size: 1.8rem;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 25px;
    color: #333;
}

h3.feg-section-title {
    /* Título de tarjeta ya definido en .feg-card__header h3 */
    /* Este es un h3 genérico si se usa fuera de una tarjeta */
    font-size: 1.3rem;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 20px;
}

h4.feg-table-group-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-top: 30px;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
    color: #444;
}

/* --- VIII. Módulo: Jornales --- */

.feg-asignacion-wizard { 
    display: flex; 
    flex-direction: column; 
    gap: 25px; 
}
.feg-wizard-step .feg-card__body { 
    display: flex; 
    flex-direction: column; 
    gap: 20px; 
}
.feg-wizard-step-hidden { 
    display: none; 
}
.feg-wizard-step .feg-form__group { 
    margin-bottom: 0; 
}
.feg-wizard-step label { 
    margin-bottom: 8px; 
    font-size: 0.9em; 
    color: var(--feg-color-texto-secundario); 
}
.feg-wizard-step input[type="date"], 
.feg-wizard-step select, 
.feg-wizard-step input[type="number"] { 
    font-size: 1.1em; 
    padding: 12px; 
}
.feg-trabajadores-list { 
    display: flex; 
    flex-direction: column; 
    gap: 15px; 
}
.feg-trabajador-card { 
    background-color: var(--feg-color-fondo-tarjeta); 
    border: 1px solid var(--feg-color-borde); 
    border-radius: var(--feg-radio-borde); 
    padding: 15px; 
    transition: box-shadow 0.2s ease, border-color 0.2s ease; 
}
.feg-trabajador-card.feg-trabajador--selected { 
    border-left: 5px solid var(--feg-color-boton-principal); 
    background-color: #fff; 
}
.feg-trabajador-card.feg-trabajador--ya-asignado { 
    background-color: #f7f2e9; 
    border-left: 5px solid #d4b991; 
}
.feg-trabajador-tareas { 
    font-size: 0.85em; 
    color: #8a6d3b; 
    font-style: italic; 
    margin-top: 5px; 
    padding-left: 35px; 
}
.feg-trabajador-card label { 
    display: flex; 
    align-items: center; 
    font-size: 1.1em; 
    font-weight: 600; 
    color: var(--feg-color-texto-principal); 
    margin-bottom: 0; 
}
.feg-trabajador-card input[type="checkbox"] { 
    width: 20px; 
    height: 20px; 
    margin-right: 15px; 
}
.feg-trabajador-card .feg-trabajador-info { 
    font-weight: 400; 
    font-size: 0.9em; 
    color: var(--feg-color-error); 
}
.feg-herramienta-container-wizard { 
    margin-top: 15px; 
    padding-top: 15px; 
    border-top: 1px solid var(--feg-color-borde); 
}
#feg-step-6-resumen ul { 
    list-style: none; 
    padding: 0; 
    margin: 0; 
    font-size: 1.1em; 
}
#feg-step-6-resumen ul li { 
    padding: 5px 0; 
    display: flex; 
    justify-content: space-between; 
}
#feg-step-6-resumen ul li strong { 
    color: var(--feg-color-texto-principal); 
    text-align: right; 
    margin-left: 15px; 
}
.feg-wizard-submit-button { 
    width: 100%; 
    padding: 15px; 
    font-size: 1.2em; 
    text-align: center; 
}
.feg-inline-flex { 
    display: flex; 
    gap: 10px; 
    align-items: center; 
}
.feg-inline-flex input { 
    flex: 2; 
}
.feg-inline-flex span { 
    flex: 1; 
}
#feg-distribucion-zonas-container { 
    margin-top: 20px; 
    padding-top: 20px; 
    border-top: 1px dashed #ccc; 
}
.feg-distribucion-fila { 
    display: grid; 
    grid-template-columns: 1fr auto auto; 
    align-items: center; 
    gap: 15px; 
    margin-bottom: 10px; 
}
.feg-distribucion-fila .feg-zona-nombre { 
    text-align: left; 
    font-size: 1em; 
    color: var(--feg-color-texto-principal); 
}
.feg-distribucion-fila .feg-avance-input { 
    max-width: 100px; 
}
.feg-distribucion-fila .feg-completada-check { 
    display: flex; 
    align-items: center; 
    gap: 5px; 
    font-size: 0.9em; 
}
.feg-jornales-dia-header { 
    text-align: center; 
    margin-bottom: 20px; 
}
.feg-jornales-dia-nav { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin-top: 10px; 
    flex-wrap: wrap; 
    gap: 10px; 
}
.feg-fecha-actual { 
    font-size: 1.2em; 
    font-weight: bold; 
    color: var(--feg-color-texto-principal); 
    flex-grow: 1; 
}
@media (max-width: 782px) {
    .feg-jornales-dia-nav { 
        flex-direction: column; 
    }
    .feg-jornales-dia-nav a { 
        width: 100%; 
        text-align: center; 
    }
    .feg-fecha-actual { 
        order: -1; 
        margin-bottom: 10px; 
    }
}
/* --- IX. Módulo: Ventas (Vistas y Formularios) --- */

#feg-ventas-app-container .feg-jornales-navigation { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 5px; 
    margin-bottom: 20px; 
}
#feg-ventas-app-container .feg-jornales-navigation .feg-button { 
    padding: 8px 12px; 
    font-size: 14px; 
    flex-grow: 1; 
    text-align: center; 
    text-decoration: none; 
}

.feg-inner-tabs-nav { 
    border-bottom: 2px solid var(--feg-color-borde); 
    margin-bottom: 15px; 
    display: flex; 
    flex-wrap: wrap; 
    gap: 5px; 
}
.feg-inner-tab-link { 
    background: #f0f0f1; 
    border: 1px solid var(--feg-color-borde); 
    border-bottom: none; 
    padding: 10px 15px; 
    cursor: pointer; 
    margin-bottom: -2px; 
    border-radius: 4px 4px 0 0; 
    text-decoration: none; 
    color: var(--feg-color-texto-secundario); 
    display: inline-block; 
}
.feg-inner-tab-link.active { 
    background: var(--feg-color-fondo-tarjeta); 
    border-bottom: 2px solid var(--feg-color-fondo-tarjeta); 
    font-weight: bold; 
    color: var(--feg-color-texto-principal); 
}

.feg-tab-content, .feg-inner-tab-content { display: none; }
.feg-tab-content.active, .feg-inner-tab-content.active { display: block; }

#feg-app-loader { 
    text-align: center; 
    padding: 40px; 
    font-size: 1.2em; 
    color: var(--feg-color-texto-secundario); 
}
.feg-notice { 
    padding: 15px; 
    margin-bottom: 20px; 
    border-radius: var(--feg-radio-borde); 
    border-width: 1px;
    border-style: solid;
}
.feg-notice--error { 
    background-color: #f2dede; 
    border-color: #ebccd1; 
    color: var(--feg-color-error); 
}
.feg-notice--success { 
    background-color: #dff0d8; 
    border-color: #d6e9c6; 
    color: var(--feg-color-exito); 
}
.feg-notice--info { 
    background-color: #d9edf7; 
    border-color: #bce8f1; 
    color: var(--feg-color-info); 
}
/* Aviso inline para Inventario Café */
.feg-notice-inline {
    background-color: #fdfdfd;
    border: 1px solid var(--feg-color-borde);
    border-left-width: 4px;
    border-left-color: var(--feg-color-info);
    padding: 10px 15px;
    margin-bottom: 20px;
}
.feg-notice-inline p {
    margin: 0;
    color: var(--feg-color-texto-principal);
}


/* Estilos para formularios y tarjetas dentro de la app JS */
.feg-form .feg-card { 
    border-color: var(--feg-color-borde); 
    padding: 0; /* Los feg-card__body y header ya tienen padding */
    margin-bottom: 1.5em; 
    background: var(--feg-color-fondo-tarjeta); 
}
.feg-form .feg-card .feg-card__header {
    font-size: 1.1em; /* Reducido de 1.3em a 1.1em para items */
    padding: 12px 20px;
}
.feg-form .feg-card .feg-card__header h5 {
    margin: 0;
    font-size: 1.1rem; /* Asegura que el h5 interno sea del tamaño adecuado */
    font-weight: 600;
}
.feg-form .feg-venta-item .feg-card__header,
.feg-form .feg-wizard-item .feg-card__header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
}
.feg-form-actions { 
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 15px;
    border-top: 1px solid var(--feg-color-borde);
    margin-top: 20px;
}
.feg-card__footer .feg-button {
    margin-left: 8px;
}
.feg-form__actions--column {
    flex-direction: column;
    align-items: flex-start;
}

.feg-totals-summary { 
    background: #f9f9f9; 
    border: 1px solid var(--feg-color-borde); 
    padding: 1em; 
    margin-top: 1.5em; 
    border-radius: var(--feg-radio-borde); 
}
.feg-totals-summary p { 
    margin: 0.5em 0; 
    display: flex; 
    justify-content: space-between; 
}
.feg-totals-summary strong { 
    font-size: 1.2em; 
    text-align: right;
    min-width: 100px;
}

/* --- Wizard Styles --- */
.feg-wizard-item { 
    border-color: #0073aa !important; /* Azul WP para destacar */
    background-color: #fdfdfd !important;
}
.feg-wizard-step { display: none; }
.feg-wizard-step.active { display: block; }
.feg-wizard-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
@media (min-width: 600px) {
    .feg-wizard-grid {
        grid-template-columns: max-content 1fr;
        align-items: center;
    }
    .feg-wizard-grid .feg-form__group {
        display: grid;
        grid-template-columns: max-content 1fr;
        gap: 0 12px;
        align-items: center;
        margin-bottom: 0;
    }
    .feg-wizard-grid .feg-form__label { 
        font-weight: bold; 
        text-align: right; 
        margin-bottom: 0;
    }
}
.feg-wizard-status { 
    color: var(--feg-color-error); 
    font-weight: bold; 
    margin-top: 10px; 
}
.feg-wizard-plan-summary ul {
    list-style: disc;
    padding-left: 20px;
}
.feg-wizard-plan-summary li {
    margin-bottom: 5px;
}

/* --- Módulo Muestras (Fichas de Lotes) --- */

.feg-tabs-nav-muestras {
    display: flex;
    border-bottom: 1px solid var(--feg-color-borde);
    margin-bottom: 15px;
}
.feg-tab-link-muestras {
    padding: 10px 15px;
    cursor: pointer;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
    font-size: 1.1em;
    color: var(--feg-color-texto-secundario);
}
.feg-tab-link-muestras.active {
    font-weight: 600;
    border-bottom-color: var(--feg-color-boton-principal);
    color: var(--feg-color-texto-principal);
}
.feg-tab-content-muestras {
    display: none;
    padding: 10px 0;
}
.feg-tab-content-muestras.active {
    display: block;
}

.feg-accordion-item {
    border: 1px solid var(--feg-color-borde);
    border-radius: var(--feg-radio-borde);
    margin-bottom: 10px;
    background: #fff;
}
.feg-accordion-header {
    background: #f9f9f9;
    border: none;
    padding: 15px 20px;
    width: 100%;
    text-align: left;
    font-size: 1.2em;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.feg-accordion-header .feg-accordion-icon {
    transition: transform 0.2s ease;
    font-weight: bold;
}
.feg-accordion-header.active .feg-accordion-icon {
    transform: rotate(45deg);
}
.feg-accordion-content {
    display: none;
    padding: 20px;
    border-top: 1px solid var(--feg-color-borde);
}
.feg-lotes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 15px;
}
.feg-lote-card {
    border-radius: var(--feg-radio-borde);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    background: var(--feg-color-fondo-tarjeta);
    border: 1px solid var(--feg-color-borde);
    display: flex;
    flex-direction: column;
}

/* Colores de Proceso para Muestras */
.feg-accordion-item[data-proceso="lavado"] .feg-accordion-header { background-color: #E6F3FF; }
.feg-accordion-item[data-proceso="lavado"] .feg-lote-card { border-top: 4px solid #0073aa; }

.feg-accordion-item[data-proceso="honey"] .feg-accordion-header { background-color: #FFF8E1; }
.feg-accordion-item[data-proceso="honey"] .feg-lote-card { border-top: 4px solid #FFB300; }

.feg-accordion-item[data-proceso="natural"] .feg-accordion-header { background-color: #FBE9E7; }
.feg-accordion-item[data-proceso="natural"] .feg-lote-card { border-top: 4px solid #FF5722; }

.feg-accordion-item[data-proceso="blend"] .feg-accordion-header { background-color: #F3E5F5; }
.feg-accordion-item[data-proceso="blend"] .feg-lote-card { border-top: 4px solid #9C27B0; }
/* Fin Colores */

.feg-lote-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid var(--feg-color-borde);
}
.feg-lote-card__title {
    font-size: 1.1em;
    font-weight: 600;
}
.feg-lote-card__score {
    font-size: 0.9em;
    font-weight: 600;
    color: var(--feg-color-boton-principal);
}
.feg-lote-card__subheader {
    padding: 8px 15px;
    background: #fdfdfd;
    border-bottom: 1px solid var(--feg-color-borde);
}
.feg-lote-card__date {
    font-size: 0.9em;
    color: var(--feg-color-texto-secundario);
}
.feg-lote-card__body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.feg-clasificacion-item label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 10px;
    border-radius: var(--feg-radio-borde);
    background: #f9f9f9;
    cursor: pointer;
    border: 1px solid #f0f0f0;
}
.feg-clasificacion-item label:hover {
    background: #f0f0f0;
}
.feg-clasificacion-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}
.feg-clasificacion-item__nombre {
    flex-grow: 1;
    font-weight: 500;
}
.feg-clasificacion-item__peso {
    font-size: 0.9em;
    color: var(--feg-color-texto-secundario);
    white-space: nowrap;
}

/* --- Historial de Comunicaciones --- */
.feg-log-email-group__header {
    display: flex;
    align-items: center;
    gap: 8px; 
    cursor: pointer;
    padding: 10px 12px;
    border-bottom: 1px solid var(--feg-color-borde);
}
.feg-log-email-group__header:hover { background-color: #f9f9f9; }

.feg-log-email-group__toggle {
    order: 2; 
    flex-shrink: 0;
    transition: transform 0.2s ease;
    width: 0; 
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 6px solid var(--feg-color-texto-secundario); 
    color: transparent; 
    margin-left: auto; 
}
.feg-log-email-group.is-open .feg-log-email-group__toggle {
    transform: rotate(90deg); 
}
.feg-log-email-group__info {
    order: 1; 
    flex-grow: 1;
    flex-shrink: 1; 
    min-width: 0; 
}
.feg-log-email-group__asunto {
    display: block;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.feg-log-email-group__meta {
    display: block;
    font-size: 0.9em;
    color: var(--feg-color-texto-secundario);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.feg-log-email-group__details {
    display: none;
    padding: 15px;
    background-color: #fdfdfd;
    border-bottom: 1px solid var(--feg-color-borde);
}

/* --- Tabla de Resumen (usada en Wizard y otros) --- */
.feg-table--simple th,
.feg-table--simple td {
    border: 1px solid var(--feg-color-borde);
}
.feg-table--detalle th,
.feg-table--detalle td {
    border: none;
    padding: 8px 0; /* Aumentado padding para legibilidad */
}
.feg-table--detalle th {
    font-weight: 600;
    width: 40%;
}
.feg-table--detalle tr {
    border-bottom: 1px solid #f0f0f1;
}
.feg-table--detalle tr:last-child {
    border-bottom: none;
}

/* --- Tarjetas de Resumen (Detalle Venta) --- */
.feg-detalle-resumen-header {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}
.feg-detalle-resumen__card {
    background-color: var(--feg-color-fondo-tarjeta);
    border: 1px solid var(--feg-color-borde);
    border-radius: var(--feg-radio-borde);
    padding: 15px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.feg-detalle-resumen__label {
    display: block;
    font-size: 0.9em;
    color: var(--feg-color-texto-secundario);
    margin-bottom: 5px;
}
.feg-detalle-resumen__valor {
    display: block;
    font-size: 1.6em;
    font-weight: 600;
    color: var(--feg-color-texto-principal);
}

/* --- Tracker de Surtido --- */
.feg-tracker {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 20px 0;
    padding: 15px;
    background-color: #f9f9f9;
    border-radius: var(--feg-radio-borde);
}
.feg-tracker__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100px; /* Ancho fijo para cada paso */
    opacity: 0.4;
}
.feg-tracker__step--active {
    opacity: 1;
    font-weight: bold;
}
.feg-tracker__step--completed {
    opacity: 0.8;
}
.feg-tracker__icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #ccc;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #ccc;
}
.feg-tracker__step--completed .feg-tracker__icon {
    background-color: var(--feg-color-boton-principal);
    box-shadow: 0 0 0 2px var(--feg-color-boton-principal);
}
.feg-tracker__step--active .feg-tracker__icon {
    background-color: #fff;
    box-shadow: 0 0 0 2px var(--feg-color-boton-principal);
}
.feg-tracker__label {
    font-size: 0.9em;
    margin-top: 8px;
}
.feg-tracker__date {
    font-size: 0.8em;
    color: var(--feg-color-texto-secundario);
}
.feg-tracker__line {
    flex-grow: 1;
    height: 4px;
    background-color: #ccc;
    margin-top: 15px;
    opacity: 0.4;
}
.feg-tracker__step--completed + .feg-tracker__line {
    background-color: var(--feg-color-boton-principal);
    opacity: 0.8;
}

/* --- Componentes de Correo (Detalle Venta) --- */
.feg-email-preview-inline {
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-top: 15px;
}
.feg-email-preview-inline__header {
    font-weight: 600;
    padding: 10px 15px;
    background: #f9f9f9;
    border-bottom: 1px solid #eee;
}
.feg-email-preview-inline__tags {
    padding: 10px 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.feg-email-tag {
    display: inline-flex;
    align-items: center;
    background-color: #e0e0e0;
    border-radius: 15px;
    padding: 3px 10px;
    font-size: 0.9em;
}
.feg-email-tag--cliente {
    background-color: #d9edf7;
    color: #31708f;
}
.feg-email-tag__remove {
    background: none;
    border: none;
    cursor: pointer;
    margin-left: 5px;
    font-size: 1.2em;
    color: #888;
    padding: 0;
}
.feg-email-preview-inline__add-recipient {
    display: flex;
    gap: 5px;
    padding: 0 15px 10px;
    border-bottom: 1px solid #eee;
}
.feg-email-preview-inline__content {
    padding: 15px;
    max-height: 300px;
    overflow-y: auto;
    background: #fff;
    border-bottom: 1px solid #eee;
}
.feg-email-preview-inline__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 15px;
    background: #f9f9f9;
}

/* --- Estados de Venta y Surtido (Badges) --- */
.feg-status {
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 0.9em;
    font-weight: 600;
    white-space: nowrap;
}
.feg-status--success { background-color: #dff0d8; color: #3c763d; }
.feg-status--error { background-color: #f2dede; color: #a94442; }
.feg-status--warning { background-color: #fcf8e3; color: #8a6d3b; }
.feg-status--info { background-color: #d9edf7; color: #31708f; }

/* Estados de Surtido */
.feg-status--cotizado { background-color: #e0e0e0; color: #333; }
.feg-status--en_preparacion { background-color: #d9edf7; color: #31708f; }
.feg-status--listo_para_envio { background-color: #FFF8E1; color: #FFB300; }
.feg-status--enviado { background-color: #E1F5FE; color: #0277BD; }
.feg-status--entregado { background-color: #dff0d8; color: #3c763d; }
.feg-status--cancelada { background-color: #f2dede; color: #a94442; }

/* --- Select2 Override --- */
.select2-container .select2-selection--single {
    height: 40px !important;
    padding: 4px 6px !important;
    border: 1px solid #ccc !important;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 28px !important;
}
.select2-container .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
}
.select2-container--default .select2-selection--multiple {
    border: 1px solid #ccc !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid var(--feg-color-boton-principal) !important;
    box-shadow: 0 0 0 2px rgba(52, 92, 0, 0.2) !important;
}
.select2-dropdown {
    border: 1px solid #ccc !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--feg-color-boton-principal) !important;
    color: white !important;
}

/* --- X. Módulo: Inventario (Pestañas Principales) --- */

.feg-main-tabs { 
    display: flex; 
    border-bottom: 1px solid #c8d7e1; 
    margin-bottom: 25px; 
    gap: 5px; 
}
.feg-main-tabs a { 
    padding: 10px 20px; 
    text-decoration: none; 
    color: #50575e; 
    border: 1px solid #c8d7e1; 
    border-bottom: none; 
    margin-bottom: -1px; 
    background-color: #f0f0f1; 
    border-top-left-radius: 4px; 
    border-top-right-radius: 4px; 
    font-size: 14px; 
}
.feg-main-tabs a.feg-tab-active { 
    color: #1d2327; 
    font-weight: 600; 
    border-color: #c8d7e1; 
    background-color: #fff; 
}
.feg-main-tabs a:hover { 
    color: #1d2327; 
}

/* --- XI. Módulo: Inventario (Pestañas Herramientas) --- */

.feg-card-tabs .feg-card__header { 
    padding: 0 10px 0 0; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    border-bottom: 1px solid #c8d7e1; 
    background-color: #f6f7f7; 
    gap: 15px; 
}
.feg-tabs { 
    display: flex; 
    flex-shrink: 0; 
}
.feg-tabs a { 
    padding: 12px 18px; 
    text-decoration: none; 
    color: #50575e; 
    border-bottom: 3px solid transparent; 
    margin-bottom: -1px; 
    font-size: 14px; 
}
.feg-tabs a.feg-tab-active { 
    color: #1d2327; 
    font-weight: 600; 
    border-bottom-color: #2271b1; 
    background-color: #fff; 
}
.feg-tabs a:hover { 
    color: #1d2327; 
    background-color: #f0f0f1; 
}
.feg-tab-search { 
    position: relative; 
    flex-grow: 1; 
    text-align: center; 
}
.feg-tab-search .dashicons-search { 
    position: absolute; 
    left: 8px; 
    top: 50%; 
    transform: translateY(-50%); 
    color: #888; 
    pointer-events: none; 
}
.feg-tab-search input[type="search"] { 
    width: 100%; 
    max-width: 300px; 
    padding-left: 32px; 
    /* Hereda estilos de .feg-form__input */
    padding-top: 8px;
    padding-bottom: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.feg-search-results-container { 
    position: absolute; 
    top: 100%; 
    left: 50%; 
    transform: translateX(-50%); 
    width: 100%; 
    max-width: 350px; 
    background: #fff; 
    border: 1px solid #c8d7e1; 
    border-top: none; 
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); 
    z-index: 100; 
    max-height: 400px; 
    overflow-y: auto; 
}
.feg-search-results-container a { 
    display: block; 
    padding: 10px 15px; 
    text-decoration: none; 
    color: #1d2327; 
    border-bottom: 1px solid #f0f0f1; 
    text-align: left;
}
.feg-search-results-container a:hover { 
    background-color: #f0f0f1; 
}
.feg-search-results-container a small { 
    display: block; 
    color: #777; 
    font-size: 0.9em; 
}
.feg-search-results-container .no-results { 
    padding: 15px; 
    color: #777; 
}
.feg-tab-actions { 
    flex-shrink: 0; 
}
/* --- XII. Corrección Responsiva para Tablas de Formulario --- */

@media (max-width: 768px) {
    /* Forzar el apilamiento vertical de la tabla de formulario */
    .feg-table.feg-form-table,
    .feg-table.feg-form-table tbody,
    .feg-table.feg-form-table tr,
    .feg-table.feg-form-table th,
    .feg-table.feg-form-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .feg-table.feg-form-table tr {
        margin-bottom: 15px; /* Espacio entre cada "grupo" de input */
        padding-bottom: 15px;
        border-bottom: 1px solid var(--feg-color-borde);
    }
    .feg-table.feg-form-table tr:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .feg-table.feg-form-table th {
        width: 100%; /* Anular el 30% */
        background-color: transparent;
        padding: 0;
        border: none;
        text-align: left;
        vertical-align: top;
        font-weight: 600; /* Actúa como la etiqueta .feg-form__label */
        margin-bottom: 5px;
    }

    .feg-table.feg-form-table td {
        width: 100%;
        padding: 0;
        border: none;
    }

    /* Ocultar encabezados vacíos (como el del botón de submit) */
    .feg-table.feg-form-table th:empty {
        display: none;
    }

    /* Asegurar que los inputs usen todo el ancho */
    .feg-table.feg-form-table .feg-form__input,
    .feg-table.feg-form-table .feg-form__select,
    .feg-table.feg-form-table .feg-form__textarea {
        max-width: 100%; /* Anular el max-width: 400px */
    }
}