/* =========================================================
   Estilo tipo MARN para las páginas de asignación de metas (AG):
   AsignarMetas.razor (contenedor con tabs) y los componentes
   {TR,EK,GA,ES,MP}AsignarMeta. Paleta y tarjetas alineadas a MARN:
   texto #263238 / #607d8b, borde #e6ecef, sombra suave, azul #1f5b8a.
   ========================================================= */

.agmeta-page {
    padding: 6px 4px;
}

/* ---- Tarjetas: look MARN (borde tenue, sombra suave, radio pequeño) ---- */
.agmeta-page .rz-card {
    border: 1px solid #e6ecef !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.05) !important;
    background-color: #fff !important;
    background-image: none !important;
}

/* ---- Encabezado de la página ---- */
.agmeta-page .card-title {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: #263238;
    letter-spacing: .01em;
}

/* ---- Etiquetas de los selectores (RadzenText Subtitle2) ---- */
.agmeta-page .rz-text-subtitle2 {
    color: #607d8b !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* ---- Texto de ayuda (Caption) ---- */
.agmeta-page .rz-text-caption {
    color: #90a4ae !important;
}

/* ---- Botones estilo MARN ---- */
.agmeta-page .rz-button {
    border-radius: 4px;
    font-weight: 700;
}

/* ---- Grilla de metas: cifras tabulares y cabeceras en gris MARN ---- */
.agmeta-page .rz-grid-table {
    font-feature-settings: "tnum";
}

.agmeta-page .rz-column-title,
.agmeta-page .rz-column-title-content {
    color: #607d8b;
    font-weight: 700;
}

/* =========================================================
   Navegación por estación (tabs del contenedor AsignarMetas)
   ========================================================= */
.agmeta-tabs {
    height: 100%;
}

.agmeta-tabs .rz-tabview-nav {
    border: none;
    gap: 2px;
    background: transparent;
}

.agmeta-tabs .rz-tabview-nav a,
.agmeta-tabs .rz-tabview-nav-link {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .03em;
    color: #607d8b;
    border-radius: 6px;
    border: 1px solid transparent;
    transition: background .15s ease, color .15s ease;
}

.agmeta-tabs .rz-tabview-nav a:hover {
    background: rgba(31,91,138,.06);
    color: #1f5b8a;
}

/* Pestaña activa: azul institucional con fondo tintado (estilo MARN) */
.agmeta-tabs .rz-tabview-nav li.rz-tabview-selected a,
.agmeta-tabs .rz-tabview-nav li.rz-state-active a,
.agmeta-tabs .rz-tabview-selected,
.agmeta-tabs .rz-state-active {
    color: #1f5b8a !important;
    background: #e3eef7 !important;
    border-color: #cfe0ef !important;
}