/* ========================================
   CosmoADM - Tema Claro
   Base: #efefee (inspirado en CosmoFE)
   ======================================== */

/* Header principal - mismo patrón que CosmoFE */
.header-main {
	background: #1765a1;
	min-height: 50px;
	height: 50px;
	width: 100%;
	z-index: 200;
	position: relative;
	display: flex;
	align-items: center;
}

.header-main .header-title {
	font-weight: 600;
	color: #ffffff;
}

.header-main .rz-icon,
.header-main .rz-button {
	color: #cbd5e1 !important;
}

.header-main .rz-icon:hover,
.header-main .rz-button:hover {
	color: #ffffff !important;
}

.header-main .rz-button {
	height: 50px !important;
	padding: 0 0.5rem !important;
	display: flex !important;
	align-items: center !important;
}

:root {
    /* --- Fondos --- */
    --rz-base-background-color: #efefee;
    --rz-base-100: #e8e8e7;
    --rz-base-200: #e0e0df;
    --rz-base-300: #d6d6d5;

    /* --- Superficies elevadas --- */
    --rz-surface: #f7f7f6;
    --rz-surface-card: #ffffff;

    /* --- Texto --- */
    --rz-text-color: #2d2d2d;
    --rz-text-title-color: #1a1a1a;
    --rz-text-secondary-color: #6b6b6b;
    --rz-text-disabled-color: #a0a0a0;
    --rz-text-contrast-color: #ffffff;

    /* --- Bordes --- */
    --rz-border-color: #d0d0cf;

    /* --- Sombras --- */
    --rz-shadow-1: 0 2px 4px rgba(0, 0, 0, 0.08);
    --rz-shadow-2: 0 4px 8px rgba(0, 0, 0, 0.10);

    /* --- Inputs / Forms --- */
    --rz-input-background-color: #ffffff;
    --rz-input-border: 1px solid #d0d0cf;
    --rz-input-color: #2d2d2d;
    --rz-input-placeholder-color: #a0a0a0;

    /* --- DataGrid --- */
    --rz-grid-header-background-color: #1765a1;
    --rz-grid-header-color: #ffffff;
    --rz-grid-row-background-color: #ffffff;
    --rz-grid-alt-row-background-color: #f8fafd;
    --rz-grid-row-hover-background-color: #eef4ff;
    --rz-grid-border: none;
    --rz-grid-cell-border: none;

    /* --- Card --- */
    --rz-card-background-color: #ffffff;

    /* --- Dialog --- */
    --rz-dialog-background-color: #ffffff;
    --rz-dialog-titlebar-background-color: #f2f2f1;

    /* --- Dropdown / Popup --- */
    --rz-dropdown-background-color: #ffffff;
    --rz-dropdown-item-hover-background-color: #eaeae9;
}

/* Forzar fondo claro en layout */
html, body {
    background-color: #efefee !important;
    color: #2d2d2d !important;
}

.rz-layout {
    background-color: #efefee !important;
    grid-template-columns: 1fr !important;
}

.rz-body {
    background-color: #efefee !important;
}

/* Scrollbar personalizada */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #e8e8e7;
}

::-webkit-scrollbar-thumb {
    background: #c0c0bf;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #a8a8a7;
}

/* DataGrid header override */
.rz-grid-table thead th {
	background-color: #1765a1 !important;
}
.rz-grid-table thead th .rz-column-title {
	color: #ffffff !important;
}

/* Header y tabview */
.rz-header {
    background-color: #1765a1 !important;
    border-bottom: none !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
    z-index: 300 !important;
    position: relative !important;
}

.rz-tabview-nav {
    background-color: #1765a1 !important;
}