/* Personalización de Radzen para que coincida con el diseño de Sumato */

:root {
    --Primary1: #78C850;
    --Primary2: #00465F;
    --white: white;
    --black: black;
    --gris: #959899;
}

/* Override de colores primarios de Radzen */
.rz-primary {
    --rz-primary: var(--Primary1);
    --rz-primary-light: #8bd35a;
    --rz-primary-dark: #6bb142;
}

.rz-secondary {
    --rz-secondary: var(--Primary2);
    --rz-secondary-light: #0056736e;
    --rz-secondary-dark: #003647;
}

/* Fuentes personalizadas para Radzen */
.rz-body, .rz-button, .rz-textbox, .rz-dropdown, .rz-listbox {
    font-family: 'Barlow', sans-serif !important;
}

/* Botones personalizados */
.rz-button-primary {
    background-color: var(--Primary1) !important;
    border-color: var(--Primary1) !important;
    color: white !important;
    font-weight: 600 !important;
}

.rz-button-primary:hover {
    background-color: #6bb142 !important;
    border-color: #6bb142 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(120, 200, 80, 0.3) !important;
}

.rz-button-secondary {
    background-color: var(--Primary2) !important;
    border-color: var(--Primary2) !important;
    color: white !important;
    font-weight: 600 !important;
}

/* Cards personalizadas */
.rz-card {
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s ease !important;
}

.rz-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
}

/* Inputs personalizados */
.rz-textbox, .rz-dropdown {
    border-radius: 8px !important;
    border-color: rgba(149, 152, 153, 0.3) !important;
    font-family: 'Barlow', sans-serif !important;
}

.rz-textbox:focus, .rz-dropdown:focus {
    border-color: var(--Primary1) !important;
    box-shadow: 0 0 0 2px rgba(120, 200, 80, 0.2) !important;
}

/* Notificaciones personalizadas */
.rz-notification-success {
    background-color: var(--Primary1) !important;
}

.rz-notification-info {
    background-color: var(--Primary2) !important;
}

/* Dialog personalizados */
.rz-dialog .rz-dialog-titlebar {
    background-color: var(--Primary2) !important;
    color: white !important;
    font-weight: 600 !important;
}

/* Tablas personalizadas */
.rz-datatable .rz-datatable-header {
    background-color: var(--Primary2) !important;
    color: white !important;
    font-weight: 600 !important;
}

.rz-datatable .rz-datatable-row:hover {
    background-color: rgba(120, 200, 80, 0.1) !important;
}