:root {
    /* === Paleta de Colores Alegre y Profesional para Entradas y Salidas === */
    /* --- Colores Base --- */
    --esmp-color-primario: #5E35B1; /* Púrpura profundo: se mantiene como ancla profesional */
    --esmp-color-acento: #DCE775; /* Un verde lima más brillante y alegre para el hover */
    --esmp-color-superficie: #FFFFFF;
    --esmp-color-fondo: #FDFEFE; /* Fondo casi blanco para una máxima limpieza y luminosidad */
    
    /* --- Colores para Entradas y Salidas --- */
    --esmp-color-entrada: #2E7D32; /* Verde para entradas */
    --esmp-color-salida: #C62828; /* Rojo para salidas */
    --esmp-color-desconocido: #757575; /* Gris para desconocido */
    
    /* --- Colores de Fondo para Entradas y Salidas --- */
    --esmp-fondo-entrada: rgba(46, 125, 50, 0.05); /* Fondo verde suave */
    --esmp-fondo-salida: rgba(198, 40, 40, 0.05); /* Fondo rojo suave */
    --esmp-fondo-entrada-alt: rgba(46, 125, 50, 0.1); /* Fondo verde alternativo */
    --esmp-fondo-salida-alt: rgba(198, 40, 40, 0.1); /* Fondo rojo alternativo */
    
    /* --- Colores de Texto --- */
    --esmp-texto-principal: #263238; /* Gris oscuro intenso para una excelente legibilidad */
    --esmp-texto-secundario: #546E7A; /* Gris azulado para información secundaria */
    --esmp-texto-sobre-primario: #FFFFFF;
    --esmp-texto-sobre-acento: #424242; /* Texto más oscuro para el nuevo acento */
    /* --- Estilos de Tabla --- */
    --esmp-tabla-borde: #E0E0E0;
    --esmp-tabla-header-bg: var(--esmp-color-primario);
    --esmp-tabla-header-text: var(--esmp-texto-sobre-primario);
    --esmp-tabla-fila-impar-bg: var(--esmp-color-superficie);
    --esmp-tabla-fila-par-bg: #EDE7F6; /* Lila muy pálido: un toque de color sutil y elegante */
    --esmp-tabla-fila-hover-bg: var(--esmp-color-acento); /* El verde lima brillante para un hover destacado */
    /* --- Estilos de Botones --- */
    --esmp-btn-icon-color: var(--esmp-texto-secundario);
    --esmp-btn-icon-hover-bg: rgba(94, 53, 177, 0.1); /* Halo púrpura para el hover */
    --esmp-btn-icon-hover-color: var(--esmp-color-primario);
}

/* === Estilos Generales del Componente === */
#entradas-salidas-materia-prima {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: var(--esmp-color-fondo);
    padding: 1.5rem;
    gap: 1.5rem;
}

    #entradas-salidas-materia-prima .buttons-bar {
        padding: 0;
        border-bottom: 1px solid var(--esmp-tabla-borde);
    }

    #entradas-salidas-materia-prima .table-container-esmp {
        flex-grow: 1;
        min-height: 0;
        background-color: var(--esmp-color-superficie);
        border: 1px solid var(--esmp-tabla-borde);
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        overflow: hidden;
    }

    #entradas-salidas-materia-prima .table-esmp {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    /* === Estilos de la Tabla === */

    /* Cabecera */
    #entradas-salidas-materia-prima .esmp-col-header {
        background-color: var(--esmp-tabla-header-bg);
        color: var(--esmp-tabla-header-text);
        font-weight: 600;
        white-space: nowrap;
    }

        #entradas-salidas-materia-prima .esmp-col-header span {
            color: var(--esmp-tabla-header-text);
        }

    /* Filas */
    #entradas-salidas-materia-prima .esmp-row td {
        background-color: var(--esmp-tabla-fila-impar-bg);
        color: var(--esmp-texto-principal);
        border-bottom: 1px solid var(--esmp-tabla-borde);
        transition: background-color 0.2s ease-in-out;
    }

    /* Filas alternas */
    #entradas-salidas-materia-prima .esmp-row:nth-child(even) td {
        background-color: var(--esmp-tabla-fila-par-bg);
    }

    /* Hover sobre filas */
    #entradas-salidas-materia-prima .esmp-row:hover td {
        background-color: var(--esmp-tabla-fila-hover-bg);
    }

    /* === Estilos para Acciones y Barra de Botones === */
    #entradas-salidas-materia-prima .buttons-bar .mud-icon-button {
        color: var(--esmp-btn-icon-color);
        transition: background-color 0.2s, color 0.2s;
    }

        #entradas-salidas-materia-prima .buttons-bar .mud-icon-button:hover {
            background-color: var(--esmp-btn-icon-hover-bg);
            color: var(--esmp-btn-icon-hover-color);
        }

/* === Estilos para celdas de Entradas y Salidas === */
    #entradas-salidas-materia-prima .entrada-cell {
        color: var(--esmp-color-entrada);
        font-weight: 500;
    }

    #entradas-salidas-materia-prima .salida-cell {
        color: var(--esmp-color-salida);
        font-weight: 500;
    }

/* Combinación con filas alternas */
    #entradas-salidas-materia-prima .esmp-row:nth-child(odd) .entrada-cell {
        background-color: var(--esmp-fondo-entrada);
    }

    #entradas-salidas-materia-prima .esmp-row:nth-child(even) .entrada-cell {
        background-color: var(--esmp-fondo-entrada-alt);
    }

    #entradas-salidas-materia-prima .esmp-row:nth-child(odd) .salida-cell {
        background-color: var(--esmp-fondo-salida);
    }

    #entradas-salidas-materia-prima .esmp-row:nth-child(even) .salida-cell {
        background-color: var(--esmp-fondo-salida-alt);
    }

/* Hover para mantener consistencia con el estilo de la tabla */
    #entradas-salidas-materia-prima .esmp-row:hover .entrada-cell,
    #entradas-salidas-materia-prima .esmp-row:hover .salida-cell {
        background-color: var(--esmp-tabla-fila-hover-bg);
        color: var(--esmp-texto-sobre-acento);
    }