/* ═══════════════════════════════════════════════════════
   CNDC 2026 — Hoja de estilos principal
   Variables definitivas se actualizarán con identidad visual
   ═══════════════════════════════════════════════════════ */

/* ── Reset mínimo ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
img, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

/* ── Base ─────────────────────────────────────────────── */
body {
    font-family: var(--font-primary);
    color: var(--text-primary);
    background: var(--surface-alt);
    line-height: 1.6;
    font-size: 1rem;
    transition: background 0.25s, color 0.25s;
}

.cndc-container {
    max-width: var(--max-width);
    margin-inline: auto;
    padding-inline: 1.5rem;
}

/* ── Header ───────────────────────────────────────────── */
.cndc-header {
    background: var(--primary);
    color: var(--white);
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.cndc-header__inner {
    max-width: var(--max-width);
    margin-inline: auto;
    padding: 0.75rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.cndc-logo-text {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.cndc-header__nav { flex: 1; }

.cndc-nav__list {
    display: flex;
    gap: 1.25rem;
    list-style: none;
}

.cndc-nav__list a {
    color: rgba(255,255,255,0.85);
    font-size: 0.9rem;
    font-weight: 600;
    transition: color 0.2s;
}
.cndc-nav__list a:hover { color: var(--white); }

.cndc-header__mem-btn {
    background: var(--accent-green);
    color: var(--white);
    padding: 0.45rem 1rem;
    border-radius: var(--radius);
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
    transition: opacity 0.2s;
}
.cndc-header__mem-btn:hover { opacity: 0.9; }

/* ── RT Widget (header) ───────────────────────────────── */
.cndc-rt-widget {
    display: flex;
    gap: 1rem;
    font-size: 0.8rem;
}
.rt-item { display: flex; flex-direction: column; align-items: center; }
.rt-label { opacity: 0.7; font-size: 0.7rem; }
.rt-value { font-weight: 700; color: var(--accent-green); }

/* ── Hero ─────────────────────────────────────────────── */
.cndc-hero {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    color: var(--white);
    padding: 4rem 1.5rem;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2rem;
    max-width: 100%;
}
.cndc-hero h1 { font-size: clamp(1.75rem, 4vw, 2.75rem); margin-bottom: 0.75rem; }
.cndc-hero p  { opacity: 0.85; font-size: 1.1rem; }

/* ── Indicadores strip ────────────────────────────────── */
.cndc-indicadores {
    background: var(--neutral-dark);
    color: var(--white);
    padding: 0.75rem 1.5rem;
}
.cndc-indicadores__strip {
    max-width: var(--max-width);
    margin-inline: auto;
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}
.indicador { display: flex; gap: 0.5rem; align-items: center; }
.indicador__label { font-size: 0.8rem; opacity: 0.7; }
.indicador__valor { font-weight: 700; color: var(--accent-green); }

/* ── Cards de noticias ────────────────────────────────── */
.cndc-noticias { padding: 3rem 1.5rem; }
.cndc-noticias h2 { font-size: 1.5rem; margin-bottom: 1.5rem; color: var(--primary); }
.cndc-noticias__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}
.cndc-card {
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: transform 0.2s;
}
.cndc-card:hover { transform: translateY(-3px); }
.cndc-card__body { padding: 1rem; }
.cndc-card__body time { font-size: 0.8rem; color: var(--neutral-mid); }
.cndc-card__body h3 { font-size: 1rem; margin: 0.25rem 0 0.5rem; }
.cndc-card__body h3 a:hover { color: var(--primary); }

/* ── Accesos Nivel 2 / 3 ──────────────────────────────── */
.cndc-accesos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    padding: 2rem 1.5rem 3rem;
}
.cndc-acceso-card {
    background: var(--neutral-light);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 2rem;
    transition: box-shadow 0.2s;
}
.cndc-acceso-card:hover { box-shadow: var(--shadow); }
.cndc-acceso-card h3 { color: var(--primary); margin-bottom: 0.5rem; }
.cndc-acceso-card--mem { background: var(--primary); color: var(--white); }
.cndc-acceso-card--mem h3 { color: var(--accent-green); }

/* ── Sector Eléctrico ─────────────────────────────────── */
.cndc-sector__hero {
    background: var(--primary);
    color: var(--white);
    padding: 3rem 1.5rem;
}
.cndc-sector__hero h1 { font-size: clamp(1.5rem, 3vw, 2.25rem); margin-bottom: 0.5rem; }
.cndc-sector__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 2rem;
    padding: 2rem 1.5rem;
}
.cndc-panel {
    background: var(--white);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow);
}
.cndc-panel h2 {
    font-size: 1.1rem;
    color: var(--primary);
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--accent-green);
}
.cndc-chart { min-height: 200px; background: var(--neutral-light); border-radius: var(--radius); margin-bottom: 1rem; }

/* ── Publicaciones filtros ────────────────────────────── */
.cndc-pub-filtros { display: flex; gap: 0.5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.cndc-filtro {
    padding: 0.3rem 0.75rem;
    border: 1px solid var(--primary);
    border-radius: 2rem;
    background: none;
    color: var(--primary);
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s;
}
.cndc-filtro.active, .cndc-filtro:hover { background: var(--primary); color: var(--white); }
.cndc-pub-item { padding: 0.5rem 0; border-bottom: 1px solid var(--neutral-line); }
.cndc-pub-item a:hover { color: var(--primary); }

/* ── MEM Dashboard ────────────────────────────────────── */
.cndc-mem { background: var(--neutral-light); min-height: calc(100vh - 80px); }
.cndc-mem__header {
    background: var(--primary);
    color: var(--white);
    padding: 2rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.cndc-mem__header h1 { flex: 1; font-size: 1.5rem; }
.cndc-mem__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
    padding: 2rem 1.5rem;
}
.cndc-mem__modulo {
    background: var(--white);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow);
}
.cndc-mem__modulo h2 {
    font-size: 1rem;
    color: var(--primary);
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--accent-green);
}

/* ── MEM Login ────────────────────────────────────────── */
.cndc-mem-login {
    max-width: 400px;
    margin: 4rem auto;
    padding: 2rem;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.cndc-field { display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: 1rem; }
.cndc-field label { font-size: 0.875rem; font-weight: 600; color: var(--neutral-mid); }
.cndc-field input {
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    font-size: 1rem;
    transition: border-color 0.2s;
}
.cndc-field input:focus { outline: none; border-color: var(--primary); }

/* ── Botones ──────────────────────────────────────────── */
.cndc-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-5);
    background: var(--primary);
    color: var(--white);
    border: 1px solid transparent;
    border-radius: var(--radius);
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: opacity var(--transition), transform var(--transition);
    line-height: 1.5;
    white-space: nowrap;
}
.cndc-btn:hover { opacity: 0.88; transform: translateY(-1px); }
.cndc-btn--sm   { padding: var(--sp-1) var(--sp-3); font-size: var(--text-xs); }
.cndc-btn--lg   { padding: var(--sp-3) var(--sp-8); font-size: var(--text-base); }
.cndc-btn--ghost {
    background: transparent;
    border-color: rgba(255,255,255,0.45);
    color: var(--white);
}
.cndc-btn--ghost:hover { background: rgba(255,255,255,0.08); }
.cndc-btn--outline {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}
.cndc-btn--outline:hover { background: var(--primary); color: var(--white); opacity: 1; }
.cndc-btn--light {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.3);
    color: var(--white);
}
.cndc-btn--light:hover { background: rgba(255,255,255,0.22); opacity: 1; }

/* ── Footer ───────────────────────────────────────────── */
.cndc-footer {
    background: var(--neutral-dark);
    color: rgba(255,255,255,0.7);
    padding: 2.5rem 1.5rem;
    font-size: 0.875rem;
    margin-top: auto;
}
.cndc-footer__inner {
    max-width: var(--max-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    align-items: start;
}
.cndc-footer__list { list-style: none; display: flex; flex-direction: column; gap: 0.4rem; }
.cndc-footer__list a:hover { color: var(--white); }

/* ── Utilidades ───────────────────────────────────────── */
.cndc-loading, .cndc-empty { color: var(--neutral-mid); font-style: italic; font-size: 0.875rem; }

/* Hint de interacción — regla de diseño: todo chart con drill-down debe incluir
   un elemento .cndc-drill-hint que el JS actualiza según el nivel activo.       */
.cndc-drill-hint {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0 0 0.6rem;
    font-size: 0.76rem;
    color: var(--text-muted);
    min-height: 1.2em;
}
.cndc-drill-hint::before {
    content: '\f245'; /* fa-mouse-pointer */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.7rem;
    flex-shrink: 0;
}
.cndc-drill-hint:empty { margin: 0; }
.cndc-doc-list { list-style: none; display: flex; flex-direction: column; gap: 0.4rem; }
.cndc-doc-list li a:hover { color: var(--primary); }
.cndc-glosario dt { font-weight: 600; color: var(--primary); margin-top: 0.75rem; }
.cndc-glosario dd { margin-left: 1rem; color: var(--neutral-mid); }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 960px) {
    .cndc-hero { grid-template-columns: 1fr; }
    .cndc-rt-widget { display: none; }
    .cndc-mem__header { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
    .cndc-accesos { grid-template-columns: 1fr; }
    .cndc-footer__inner { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════
   TOPBAR + HEADER — diseño institucional
   ═══════════════════════════════════════════════════════ */

/* ── Topbar ───────────────────────────────────────────── */
.cndc-topbar {
    background: var(--primary-dark);
    color: rgba(210,230,248,.85);
    font-size: var(--text-xs);
    padding: var(--sp-1) 0;
    border-bottom: 2px solid var(--accent-orange);
}
.cndc-topbar__inner {
    max-width: var(--max-width);
    margin-inline: auto;
    padding: 0 1.25rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cndc-topbar__right { display: flex; align-items: center; gap: 1rem; }
.cndc-topbar__right a { color: rgba(210,230,248,.85); transition: color var(--transition); }
.cndc-topbar__right a:hover { color: #fff; }
.cndc-topbar__right a i { margin-right: 4px; }

.cndc-online-badge {
    background: var(--accent-orange);
    color: #fff;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .3px;
    display: flex;
    align-items: center;
    gap: 5px;
}
.cndc-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--accent-green);
    display: inline-block;
    animation: cndc-pulse 1.5s infinite;
}
@keyframes cndc-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ── Header rediseñado ────────────────────────────────── */
.cndc-header {
    background: #ff9016;
    color: #005db9;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 3px 10px rgba(0,0,0,.4);
    padding: 10px 0;
}
.cndc-header__inner {
    max-width: var(--max-width);
    margin-inline: auto;
    padding: 0 1.25rem;
    display: flex;
    align-items: center;
    gap: 1.25rem;
}
.cndc-header__logo { display: flex; align-items: center; flex-shrink: 0; }
.cndc-logo-barra {
    height: 40px;
    width: auto;
    display: block;
}
.cndc-logo-name { display: block; font-size: var(--text-lg); font-weight: 700; color: var(--white); line-height: 1.2; }
.cndc-logo-sub  { display: block; font-size: var(--text-xs); color: rgba(255,255,255,.7); letter-spacing: .3px; }

/* ── Nav ──────────────────────────────────────────────── */
.cndc-header__nav { margin-left: auto; }
.cndc-nav-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 4px;
    background: transparent;
    color: var(--white);
    font-size: 18px;
    cursor: pointer;
}
.cndc-nav__list {
    list-style: none;
    display: flex;
    gap: 3px;
    margin: 0; padding: 0;
}
.cndc-nav__list li a {
    display: block;
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--radius-sm);
    color: #005db9;
    font-size: var(--text-base);
    font-weight: 600;
    letter-spacing: .2px;
    transition: background var(--transition), color var(--transition);
    white-space: nowrap;
}
.cndc-nav__list li a:hover,
.cndc-nav__list li.current-menu-item a,
.cndc-nav__list li.current_page_item a {
    background: var(--primary-light);
    color: var(--white);
}
.cndc-header__mem-btn {
    background: var(--neutral-light);
    color: var(--primary);
    padding: var(--sp-2) var(--sp-4);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity var(--transition);
}
.cndc-header__mem-btn:hover { opacity: .88; }

/* ═══════════════════════════════════════════════════════
   HOMEPAGE — Hero, Ticker, Info, Noticias
   ═══════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────────── */
.cndc-hero {
    background: linear-gradient(to bottom, var(--neutral-light) 60%, #eef1f5 100%);
    color: var(--text-primary);
    padding: 3.5rem 0 3rem;
    border-bottom: 3px solid var(--accent-orange);
}
.cndc-hero__grid {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 3rem;
    align-items: center;
}
.cndc-hero__text h1 {
    font-size: var(--h1);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--sp-3);
    color: var(--primary);
}
.cndc-hero__text p {
    font-size: var(--text-base);
    color: var(--text-secondary);
    line-height: 1.75;
    margin-bottom: var(--sp-6);
    text-align: left;
}
.cndc-hero__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    background: var(--accent-orange);
    color: var(--white);
    padding: var(--sp-3) var(--sp-6);
    border-radius: var(--radius);
    font-weight: 700;
    font-size: var(--text-sm);
    transition: background var(--transition), transform var(--transition);
}
.cndc-hero__btn:hover { background: var(--accent-orange-mid); transform: translateY(-2px); }

/* Logo principal en el hero */
.cndc-hero__logo {
    display: flex;
    align-items: center;
    justify-content: center;
}
.cndc-hero__logo-img {
    max-width: 280px;
    width: 100%;
    height: auto;
}

/* ── Tira de KPIs bajo el hero ────────────────────────── */
.cndc-hero-kpis {
    background: var(--primary-dark);
    border-bottom: 3px solid var(--accent-orange);
    padding: 0;
}
.cndc-hero-kpis__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}
.cndc-kpi-hero {
    padding: 1.1rem 1.25rem;
    text-align: center;
    border-right: 1px solid rgba(255,255,255,.1);
    color: var(--white);
}
.cndc-kpi-hero:last-child { border-right: none; }
.cndc-kpi-hero__val  { font-size: 1.6rem; font-weight: 700; color: var(--accent-yellow); line-height: 1; }
.cndc-kpi-hero__unit { font-size: 11px; color: rgba(255,255,255,.55); margin-left: 3px; }
.cndc-kpi-hero__lbl  { font-size: 10px; color: rgba(210,230,248,.75); margin-top: 5px; text-transform: uppercase; letter-spacing: .5px; display: block; }

/* ── Ticker ───────────────────────────────────────────── */
.cndc-ticker {
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding: 8px 0;
}
.cndc-ticker__inner {
    max-width: var(--max-width);
    margin-inline: auto;
    padding: 0 1.25rem;
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    align-items: center;
}
.cndc-ticker__item  { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.cndc-ticker__label { color: var(--neutral-mid); }
.cndc-ticker__val   { font-weight: 700; color: var(--primary); font-size: 14px; }
.cndc-ticker__up    { color: #27ae60; font-size: 11px; }
.cndc-ticker__dn    { color: #c0392b; font-size: 11px; }

/* ── Sección título ───────────────────────────────────── */
.cndc-sec-title { padding: var(--sp-8) 0 var(--sp-3); }
.cndc-sec-title h2 {
    font-size: var(--h3);
    font-weight: 700;
    color: var(--primary);
    border-left: 4px solid var(--accent-orange);
    padding-left: var(--sp-3);
}
.cndc-sec-title p { color: var(--neutral-mid); font-size: var(--text-sm); margin-top: var(--sp-1); padding-left: var(--sp-4); }

/* ── Info cards ───────────────────────────────────────── */
.cndc-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    padding: 1rem 0 2rem;
}
.cndc-info-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow);
    border-top: 3px solid var(--accent-orange);
}
.cndc-info-card i  { font-size: 1.75rem; color: var(--primary-light); margin-bottom: var(--sp-3); display: block; }
.cndc-info-card h3 { font-size: var(--text-base); font-weight: 700; color: var(--primary); margin-bottom: var(--sp-2); }
.cndc-info-card p  { font-size: var(--text-sm); color: var(--neutral-mid); line-height: 1.7; text-align: left; }

/* ── Noticias + Sidebar ───────────────────────────────── */
.cndc-news-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
    padding-bottom: 3rem;
}
.cndc-news-list { list-style: none; padding: 0; margin: 0; }
.cndc-news-list li {
    background: var(--white);
    border-radius: 6px;
    padding: 14px 16px;
    margin-bottom: 10px;
    box-shadow: var(--shadow);
    display: flex;
    gap: 14px;
    align-items: flex-start;
    border-left: 3px solid var(--accent-orange);
}
.cndc-news-date  { font-size: 11px; color: var(--neutral-mid); white-space: nowrap; padding-top: 2px; min-width: 72px; }
.cndc-news-list li strong { font-size: 13px; color: var(--primary); display: block; margin-bottom: 3px; }
.cndc-news-list li strong a { color: var(--primary); }
.cndc-news-list li strong a:hover { color: var(--primary-light); }
.cndc-news-list li span { font-size: 12px; color: var(--neutral-mid); }

.cndc-sidebar { display: flex; flex-direction: column; gap: 1rem; }
.cndc-sidebar-widget {
    background: var(--white);
    border-radius: var(--radius);
    padding: 1.25rem;
    box-shadow: var(--shadow);
}
.cndc-sidebar-widget h4 {
    font-size: 14px;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: .75rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--neutral-line);
}
.cndc-sidebar-widget h4 i { color: var(--primary-light); margin-right: 6px; }
.cndc-link-list { list-style: none; padding: 0; margin: 0; }
.cndc-link-list li a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid var(--neutral-line);
    font-size: 13px;
    color: var(--primary);
    transition: color .2s;
}
.cndc-link-list li a:hover { color: var(--primary-light); }
.cndc-link-list li a i { color: var(--primary-light); font-size: 12px; width: 14px; }

/* ── Responsive homepage ──────────────────────────────── */
@media (max-width: 960px) {
    .cndc-hero__grid  { grid-template-columns: 1fr; }
    .cndc-hero__logo  { display: none; }
    .cndc-info-grid   { grid-template-columns: 1fr; }
    .cndc-news-grid   { grid-template-columns: 1fr; }
    .cndc-topbar__right { display: none; }
    .cndc-hero-kpis__grid { grid-template-columns: repeat(2, 1fr); }
    .cndc-kpi-hero:nth-child(2) { border-right: none; }
}
@media (max-width: 600px) {
    .cndc-header__inner { position: relative; }
    .cndc-logo-barra { height: 40px; max-width: 180px; }
    .cndc-nav-toggle { display: inline-flex; margin-left: auto; }
    .cndc-header__nav {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        left: 1rem;
        right: 1rem;
        z-index: 1000;
        margin-left: 0;
        background: var(--primary-dark);
        border: 1px solid rgba(255,255,255,.12);
        box-shadow: 0 16px 32px rgba(0,0,0,.24);
    }
    .cndc-header__nav.is-open { display: block; }
    .cndc-nav__list {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: .5rem;
    }
    .cndc-nav__list li a {
        padding: .75rem;
        white-space: normal;
    }
    .cndc-header__mem-btn { padding: 8px 10px; font-size: 12px; }
    .cndc-hero-kpis__grid { grid-template-columns: repeat(2, 1fr); }
    .cndc-kpi-hero { border-right: 1px solid rgba(255,255,255,.1); }
    .cndc-kpi-hero:nth-child(even) { border-right: none; }
    .cndc-ticker__inner { gap: 1rem; }
}

/* ═══════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════ */
.cndc-footer {
    background: var(--primary-dark);
    color: rgba(210,230,248,.8);
    font-size: var(--text-xs);
    padding: var(--sp-10) 0 0;
    margin-top: 0;
    border-top: 3px solid var(--accent-orange);
}
.cndc-footer__grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.cndc-footer__logo {
    margin-bottom: 1rem;
}
.cndc-footer__logo-img {
    height: 40px;
    width: auto;
    display: block;
    filter: brightness(0) invert(1);
    opacity: .85;
}
.cndc-footer__logo-name { color: #fff; font-weight: 700; font-size: var(--text-xs); }
.cndc-footer__logo-sub  { font-size: 0.65rem; }
.cndc-footer__brand p   { font-size: var(--text-xs); line-height: 1.7; }
.cndc-footer__contact   { margin-top: .75rem; display: flex; flex-direction: column; gap: .3rem; }
.cndc-footer__contact span i { color: var(--accent-orange-mid); margin-right: 5px; }

.cndc-footer h5 {
    color: #fff;
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-2);
    border-bottom: 1px solid rgba(255,255,255,.1);
}
.cndc-footer ul { list-style: none; padding: 0; margin: 0; }
.cndc-footer ul li { margin-bottom: var(--sp-3); }
.cndc-footer ul li a { color: rgba(180,210,240,.65); transition: color .2s; }
.cndc-footer ul li a:hover { color: var(--accent-orange-mid); }

.cndc-footer__copy {
    text-align: center;
    padding: var(--sp-4) 0;
    color: rgba(210,230,248,.45);
    font-size: var(--text-xs);
    border-top: 1px solid rgba(255,255,255,.06);
}

@media (max-width: 960px) {
    .cndc-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
    .cndc-footer__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════
   Sector Eléctrico — sección tabs del front-page
   ═══════════════════════════════════════════════════════ */

.cndc-sin-section {
    background: var(--neutral-light);
    padding: 3rem 0 2.5rem;
    border-top: 1px solid var(--neutral-line);
    border-bottom: 1px solid var(--neutral-line);
}

/* Navegación de tabs */
.cndc-sin-tabs__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    border-bottom: 2px solid var(--neutral-line);
    margin-bottom: 1.75rem;
}
.cndc-sin-tab {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.1rem;
    border: none;
    background: transparent;
    color: var(--neutral-mid);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color 0.15s, border-color 0.15s;
    font-family: var(--font-primary);
}
.cndc-sin-tab:hover { color: var(--primary); }
.cndc-sin-tab.active { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }
.cndc-sin-tab i { font-size: 0.8rem; }

/* Panels */
.cndc-sin-panel { display: none; }
.cndc-sin-panel.active { display: block; }

/* ── Panel Datos del Sistema ── */
.cndc-sin-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1.75rem;
}
.cndc-sin-kpi {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.85rem;
}
.cndc-sin-kpi__icon {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    color: var(--white);
}
.cndc-sin-kpi__icon--blue   { background: var(--primary); }
.cndc-sin-kpi__icon--green  { background: var(--accent-green); }
.cndc-sin-kpi__icon--yellow { background: var(--accent-yellow); }
.cndc-sin-kpi__icon--purple { background: #7c3aed; }
.cndc-sin-kpi__icon--teal   { background: #0891b2; }
.cndc-sin-kpi__val  { display: block; font-size: 1.25rem; font-weight: 700; color: var(--neutral-dark); line-height: 1.2; }
.cndc-sin-kpi__unit { font-size: 0.72rem; color: var(--neutral-mid); font-weight: 600; }
.cndc-sin-kpi__lbl  { display: block; font-size: 0.75rem; color: var(--neutral-mid); margin-top: 0.1rem; }

/* Barras de generación */
.cndc-sin-gen-titulo {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--neutral-mid);
    font-weight: 700;
    margin-bottom: 0.75rem;
}
.cndc-sin-gen-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.65rem;
    margin-bottom: 1.5rem;
}
.cndc-sin-gen-item {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 0.75rem 1rem;
}
.cndc-sin-gen-item__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}
.cndc-sin-gen-item__icon {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    color: var(--white);
    flex-shrink: 0;
}
.cndc-sin-gen-item__icon--hidro   { background: #0891b2; }
.cndc-sin-gen-item__icon--termo   { background: #dc2626; }
.cndc-sin-gen-item__icon--eolica  { background: #059669; }
.cndc-sin-gen-item__icon--solar   { background: #d97706; }
.cndc-sin-gen-item__icon--biomasa { background: #65a30d; }
.cndc-sin-gen-item__lbl { font-size: 0.8rem; font-weight: 600; color: var(--neutral-dark); flex: 1; }
.cndc-sin-gen-item__val { font-size: 0.8rem; color: var(--neutral-mid); white-space: nowrap; }
.cndc-sin-gen-item__track {
    height: 6px;
    background: var(--neutral-line);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 0.25rem;
}
.cndc-sin-gen-item__fill { height: 100%; border-radius: 3px; transition: width 0.6s ease; }
.cndc-sin-gen-item__fill--hidro   { background: #0891b2; }
.cndc-sin-gen-item__fill--termo   { background: #dc2626; }
.cndc-sin-gen-item__fill--eolica  { background: #059669; }
.cndc-sin-gen-item__fill--solar   { background: #d97706; }
.cndc-sin-gen-item__fill--biomasa { background: #65a30d; }
.cndc-sin-gen-item__pct { font-size: 0.72rem; color: var(--neutral-mid); }

/* Footer de cada panel */
.cndc-sin-panel__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--neutral-line);
    margin-top: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.cndc-sin-fuente { font-size: 0.78rem; color: var(--neutral-mid); display: flex; align-items: center; gap: 0.4rem; }
.cndc-dot-mock { color: #f59e0b; font-size: 0.5rem; }
.cndc-dot-live { color: #10b981; font-size: 0.5rem; }

/* ── Panel Programación / Resultado / Planificación ── */
.cndc-pub-table { display: flex; flex-direction: column; gap: 0; }
.cndc-pub-row {
    display: grid;
    grid-template-columns: 110px 1fr auto auto;
    align-items: center;
    gap: 0.75rem 1rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--neutral-line);
    font-size: 0.875rem;
}
.cndc-pub-row:last-child { border-bottom: none; }
.cndc-pub-row__fecha { color: var(--neutral-mid); font-size: 0.8rem; white-space: nowrap; }
.cndc-pub-row__titulo a { color: var(--primary); font-weight: 600; }
.cndc-pub-row__titulo a:hover { text-decoration: underline; }
.cndc-badge--periodo { background: rgba(29,78,216,.1); color: #1d4ed8; }

/* ── Panel Eventos ── */
.cndc-eventos-lista { display: flex; flex-direction: column; gap: 0.75rem; }
.cndc-evento {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 0.75rem 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--neutral-line);
}
.cndc-evento:last-child { border-bottom: none; }
.cndc-evento__fecha { font-size: 0.78rem; color: var(--neutral-mid); padding-top: 0.2rem; }
.cndc-evento__header { display: flex; gap: 0.4rem; margin-bottom: 0.3rem; flex-wrap: wrap; }
.cndc-evento__titulo { display: block; font-size: 0.875rem; margin-bottom: 0.25rem; }
.cndc-evento__titulo a { color: var(--primary); }
.cndc-evento__titulo a:hover { text-decoration: underline; }
.cndc-evento__desc { font-size: 0.8rem; color: var(--neutral-mid); margin: 0; }
.cndc-badge--evento-tipo { background: rgba(146,64,14,.1); color: #92400e; }
.cndc-badge--activo   { background: rgba(153,27,27,.1); color: #991b1b; }
.cndc-badge--resuelto { background: rgba(6,95,70,.1); color: #065f46; }

/* ── Panel Demanda ── */
.cndc-demanda-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}
.cndc-demanda-kpi {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 0.75rem 1rem;
    text-align: center;
}
.cndc-demanda-kpi__lbl { display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-secondary); font-weight: 600; margin-bottom: 0.2rem; }
.cndc-demanda-kpi__val { font-size: 1rem; font-weight: 700; color: var(--primary); }
.cndc-demanda-chart { width: 100%; min-height: 280px; background: var(--surface-card); border: 1px solid var(--neutral-line); border-radius: var(--radius); }

/* ── Estado vacío ── */
.cndc-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2.5rem 1rem;
    gap: 0.5rem;
    color: var(--neutral-mid);
}
.cndc-empty-state__icon {
    width: 56px;
    height: 56px;
    background: var(--neutral-light);
    border: 1px solid var(--neutral-line);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: var(--primary);
    margin-bottom: 0.25rem;
}
.cndc-empty-state strong { color: var(--neutral-dark); font-size: 0.9rem; }
.cndc-empty-state p { font-size: 0.83rem; max-width: 400px; }
.cndc-empty-state__hint { font-size: 0.75rem; color: var(--text-muted); }
.cndc-empty-state__hint a { color: var(--primary); text-decoration: underline; }

/* Responsive sector */
@media (max-width: 768px) {
    .cndc-sin-tab span { display: none; }
    .cndc-sin-tab i    { font-size: 1rem; }
    .cndc-sin-tab      { padding: 0.6rem 0.85rem; }
    .cndc-demanda-kpis { grid-template-columns: repeat(2, 1fr); }
    .cndc-pub-row      { grid-template-columns: 90px 1fr auto; }
    .cndc-pub-row .cndc-badge--periodo { display: none; }
    .cndc-evento       { grid-template-columns: 1fr; }
    .cndc-evento__fecha { padding-top: 0; }
}

@media (max-width: 480px) {
    .cndc-sin-kpis    { grid-template-columns: 1fr 1fr; }
    .cndc-sin-gen-grid { grid-template-columns: 1fr; }
    .cndc-demanda-kpis { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════
   Marco Legal — páginas de documentos legales
   ═══════════════════════════════════════════════════════ */

/* Hero */
.cndc-legal-hero {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    color: var(--white);
    padding: 2.5rem 0 2rem;
}
.cndc-legal-hero h1 {
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    font-weight: 700;
    margin-bottom: 0.4rem;
}
.cndc-legal-hero p { opacity: 0.85; font-size: 1rem; }

/* Breadcrumb */
.cndc-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
    font-size: 0.8rem;
    opacity: 0.8;
    margin-bottom: 1rem;
}
.cndc-breadcrumb a { color: var(--white); text-decoration: underline; }
.cndc-breadcrumb span[aria-hidden] { opacity: 0.6; }

/* Disclaimer informativo */
.cndc-legal-disclaimer {
    background: #fff8e1;
    border-left: 4px solid var(--accent-yellow);
    padding: var(--sp-3) 0;
}
.cndc-legal-disclaimer .cndc-container {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--text-sm);
    color: #5a4000;
}
.cndc-legal-disclaimer .fa-info-circle {
    color: var(--accent-orange-mid);
    font-size: 1rem;
    flex-shrink: 0;
}

/* Layout 2 columnas */
.cndc-legal-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 2rem;
    padding-block: 2rem;
    align-items: start;
}

/* Secciones */
.cndc-legal-section {
    margin-bottom: 2.5rem;
}
.cndc-legal-section h2 {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--primary);
    border-bottom: 2px solid var(--accent-orange);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}
.cndc-legal-section p { margin-bottom: 0.85rem; color: var(--neutral-mid); line-height: 1.7; text-align: justify; }
.cndc-legal-section p:last-child { margin-bottom: 0; }

/* Ficha del documento */
.cndc-doc-card {
    background: var(--neutral-light);
    border: 1px solid var(--neutral-line);
    border-left: 4px solid var(--accent-orange);
    border-radius: var(--radius);
    padding: 1.25rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
}
.cndc-doc-card__meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.75rem 1.5rem;
    flex: 1;
}
.cndc-doc-card__item { display: flex; flex-direction: column; gap: 0.15rem; }
.cndc-doc-card__label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--neutral-mid); font-weight: 600; }
.cndc-doc-card__value { font-size: 0.9rem; color: var(--neutral-dark); font-weight: 600; }

/* Badges */
.cndc-badge {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.cndc-badge--vigente { background: rgba(6,95,70,.1); color: #065f46; }
.cndc-badge--operacion { background: rgba(30,64,175,.1); color: #1e40af; }
.cndc-badge--mercado   { background: rgba(76,29,149,.1); color: #4c1d95; }
.cndc-badge--calidad   { background: #fef3c7; color: #92400e; }
.cndc-badge--conexion  { background: rgba(131,24,67,.1); color: #831843; }

/* Tabla de contenidos (TOC) */
.cndc-toc {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    overflow: hidden;
}
.cndc-toc__item {
    display: grid;
    grid-template-columns: 90px 1fr auto;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--neutral-line);
    font-size: 0.875rem;
    transition: background 0.15s;
}
.cndc-toc__item:last-child { border-bottom: none; }
.cndc-toc__item:nth-child(odd) { background: var(--neutral-light); }
.cndc-toc__item:hover { background: rgba(0,93,185,.08); }
.cndc-toc__num { font-weight: 700; color: var(--primary); white-space: nowrap; }
.cndc-toc__titulo { color: var(--neutral-dark); }
.cndc-toc__arts { font-size: 0.75rem; color: var(--neutral-mid); white-space: nowrap; }

/* Highlights */
.cndc-highlights {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}
.cndc-highlight {
    display: flex;
    gap: 0.85rem;
    padding: 1rem;
    background: var(--neutral-light);
    border-radius: var(--radius);
    border: 1px solid var(--neutral-line);
}
.cndc-highlight__icon {
    width: 40px;
    height: 40px;
    background: var(--primary);
    color: var(--white);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
}
.cndc-highlight strong { display: block; font-size: 0.875rem; color: var(--neutral-dark); margin-bottom: 0.3rem; }
.cndc-highlight p { font-size: 0.8rem; color: var(--neutral-mid); margin: 0; }

/* Modificaciones */
.cndc-amendments { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
.cndc-amendment {
    display: grid;
    grid-template-columns: 130px 1fr 60px;
    gap: 1rem;
    align-items: center;
    padding: 0.65rem 1rem;
    background: var(--neutral-light);
    border-radius: 6px;
    font-size: 0.85rem;
}
.cndc-amendment__num { font-weight: 700; color: var(--primary); }
.cndc-amendment__desc { color: var(--neutral-dark); }
.cndc-amendment__date { color: var(--neutral-mid); text-align: right; }

/* Jerarquía normativa */
.cndc-hierarchy { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.cndc-hierarchy__item {
    width: 100%;
    padding: 0.85rem 1rem;
    border-radius: var(--radius);
    border: 1px solid var(--neutral-line);
    margin-bottom: 0;
}
.cndc-hierarchy__item--1 { border-left: 4px solid var(--accent-yellow); background: var(--surface-alt); }
.cndc-hierarchy__item--2 { border-left: 4px solid var(--accent-orange); background: var(--surface-alt); }
.cndc-hierarchy__item--3 { border-left: 4px solid var(--accent-orange); background: var(--surface-alt); }
.cndc-hierarchy__item--4 { border-left: 4px solid var(--accent-green); background: var(--surface-alt); }
.cndc-hierarchy__item--current { box-shadow: 0 0 0 2px var(--primary); }
.cndc-hierarchy__tag {
    display: inline-block;
    font-size: 0.65rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--neutral-mid);
    margin-bottom: 0.25rem;
}
.cndc-hierarchy__item strong { display: block; font-size: 0.875rem; color: var(--neutral-dark); }
.cndc-hierarchy__item span { font-size: 0.8rem; color: var(--neutral-mid); }
.cndc-hierarchy__connector {
    align-self: flex-start;
    margin-left: 1.5rem;
    color: var(--neutral-mid);
    font-size: 0.9rem;
    padding: 0.15rem 0;
}

/* Box de descarga */
.cndc-download-box {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background: var(--neutral-light);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    flex-wrap: wrap;
}
.cndc-download-box__icon { font-size: 2rem; color: #e53e3e; flex-shrink: 0; }
.cndc-download-box__info { flex: 1; }
.cndc-download-box__info strong { display: block; font-size: 0.9rem; color: var(--neutral-dark); }
.cndc-download-box__info span { font-size: 0.8rem; color: var(--neutral-mid); }

/* Normas Operativas — filtros */
.cndc-normas-filtros {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}
.cndc-norma {
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 0.65rem 1rem;
    margin-bottom: 0.5rem;
    background: var(--white);
    transition: box-shadow 0.15s;
}
.cndc-norma:hover { box-shadow: var(--shadow); }
.cndc-norma[style*="display: none"] { display: none !important; }
.cndc-norma__header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.25rem; flex-wrap: wrap; }
.cndc-norma__num { font-weight: 700; font-size: 1rem; color: var(--primary); font-family: monospace; }
.cndc-norma__titulo { font-weight: 600; font-size: 0.92rem; color: var(--neutral-dark); margin-bottom: 0.3rem; line-height: 1.35; }
.cndc-norma__desc { font-size: 0.82rem; color: var(--neutral-mid); margin-bottom: 0.5rem; }
.cndc-norma__meta {
    display: grid;
    grid-template-columns: 9rem auto;
    gap: 0.4rem;
    margin: 0 0 0.55rem;
}
.cndc-norma__meta div { min-width: 0; }
.cndc-norma__meta dt {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--neutral-mid);
    text-transform: uppercase;
}
.cndc-norma__meta dd {
    margin: 0.1rem 0 0;
    font-size: 0.84rem;
    color: var(--neutral-dark);
}
.cndc-norma__footer { display: flex; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; }
.cndc-norma__bottom {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.cndc-norma__bottom .cndc-norma__meta { flex: 1; min-width: 0; margin: 0; }
.cndc-norma__acciones { display: flex; gap: 0.5rem; flex-wrap: wrap; flex-shrink: 0; justify-content: flex-end; min-width: 15rem; }
.cndc-norma__mods {
    margin-top: 0.55rem;
    padding-top: 0.55rem;
    border-top: 1px dashed var(--neutral-line);
}
.cndc-norma__mods-titulo {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--neutral-mid);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 0.35rem;
}
.cndc-norma__mod-item {
    margin-top: 0.3rem;
}
.cndc-norma__mod-desc {
    font-size: 0.82rem;
    color: var(--neutral-dark);
    background: var(--neutral-bg);
    border-radius: calc(var(--radius) - 2px);
    padding: 0.35rem 0.6rem;
    margin: 0 0 0.3rem;
    line-height: 1.4;
}
.cndc-norma__bottom--mod { margin-top: 0.2rem; }

/* Botones */
.cndc-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1.1rem;
    border-radius: var(--radius);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s, background 0.2s;
    border: none;
    white-space: nowrap;
}
.cndc-btn--primary { background: var(--primary); color: var(--white); }
.cndc-btn--primary:hover { background: var(--primary-light); }
.cndc-btn--outline { background: transparent; color: var(--primary); border: 2px solid var(--primary); }
.cndc-btn--outline:hover { background: var(--primary); color: var(--white); }
.cndc-btn--sm { padding: 0.3rem 0.75rem; font-size: 0.78rem; }
.cndc-btn--full { width: 100%; justify-content: center; }

/* Sidebar */
.cndc-legal-sidebar { position: sticky; top: 80px; display: flex; flex-direction: column; gap: 1rem; }
.cndc-sidebar-card {
    background: var(--white);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 1.25rem;
}
.cndc-sidebar-card h3 {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--neutral-mid);
    margin-bottom: 0.85rem;
    font-weight: 700;
}
.cndc-sidebar-nav { list-style: none; display: flex; flex-direction: column; gap: 0.25rem; }
.cndc-sidebar-nav li {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    color: var(--neutral-mid);
}
.cndc-sidebar-nav li a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--neutral-mid);
    width: 100%;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    margin: -0.5rem -0.75rem;
    transition: background 0.15s, color 0.15s;
}
.cndc-sidebar-nav li a:hover { background: var(--neutral-light); color: var(--primary); }
.cndc-sidebar-nav li.active { background: var(--white); color: var(--primary); font-weight: 600; border-left: 3px solid var(--primary); }
.cndc-sidebar-nav li.active a { color: var(--primary); }
.cndc-sidebar-nav li i { width: 16px; text-align: center; flex-shrink: 0; }
.cndc-sidebar-links { list-style: none; display: flex; flex-direction: column; gap: 0.4rem; }
.cndc-sidebar-links li a { font-size: 0.83rem; color: var(--primary); text-decoration: underline; }
.cndc-sidebar-links li a:hover { color: var(--primary-light); }
.cndc-count { font-size: 0.72rem; background: var(--neutral-light); border-radius: 10px; padding: 0.1rem 0.4rem; }

/* Supertítulo del hero (ej. "Anexo Técnico del Reglamento MEM") */
.cndc-legal-hero__supertitulo {
    font-size: 0.8rem;
    opacity: 0.8;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.cndc-legal-hero__supertitulo a { color: var(--white); text-decoration: underline; }

/* Aviso/notice informativo */
.cndc-notice {
    display: flex;
    gap: 0.85rem;
    padding: 1rem 1.25rem;
    border-radius: var(--radius);
    margin-bottom: 1.75rem;
    font-size: 0.875rem;
    line-height: 1.6;
}
.cndc-notice--info {
    background: rgba(0,93,185,.06);
    border: 1px solid var(--neutral-line);
    color: var(--primary);
}
.cndc-notice--info i { margin-top: 0.15rem; flex-shrink: 0; }
.cndc-notice--info a { color: var(--primary-light); font-weight: 600; text-decoration: underline; }

/* Banner ROME (enlace prominente desde Reglamento MEM) */
.cndc-rome-banner {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    background: var(--neutral-light);
    border: 2px solid var(--primary-light);
    border-radius: var(--radius);
    color: var(--neutral-dark);
    transition: background 0.15s, border-color 0.15s;
    margin-top: 0.85rem;
}
.cndc-rome-banner:hover { background: rgba(0,93,185,.08); border-color: var(--primary); }
.cndc-rome-banner__icon {
    width: 44px;
    height: 44px;
    background: var(--primary);
    color: var(--white);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.cndc-rome-banner__text { flex: 1; }
.cndc-rome-banner__text strong { display: block; font-size: 0.9rem; color: var(--primary); margin-bottom: 0.2rem; }
.cndc-rome-banner__text span { font-size: 0.8rem; color: var(--neutral-mid); }
.cndc-rome-banner__arrow { color: var(--primary); font-size: 1rem; }

/* Sidebar sub-ítem (ROME subordinado al Reglamento MEM) */
.cndc-sidebar-nav__sub { padding-left: 1.5rem !important; }
.cndc-sidebar-nav__sub em { font-size: 0.75rem; font-weight: 400; opacity: 0.75; }

/* Nota */
.cndc-note { font-size: 0.82rem; color: var(--neutral-mid); }
.cndc-note i { margin-right: 0.3rem; }
.cndc-note a { color: var(--primary); text-decoration: underline; }

/* Responsive legal */
@media (max-width: 900px) {
    .cndc-legal-layout { grid-template-columns: 1fr; }
    .cndc-legal-sidebar { position: static; }
    .cndc-toc__item { grid-template-columns: 80px 1fr; }
    .cndc-toc__arts { display: none; }
    .cndc-amendment { grid-template-columns: 110px 1fr; }
    .cndc-amendment__date { display: none; }
    .cndc-doc-card { flex-direction: column; }
}
}

/* ══════════════════════════════════════════════════════════════
   Agentes del MEM
   ══════════════════════════════════════════════════════════════ */
.cndc-agentes-page .cndc-legal-hero {
    background:
        linear-gradient(135deg, rgba(0,72,152,.96) 0%, rgba(0,93,185,.92) 100%),
        linear-gradient(90deg, rgba(255,108,0,.22), transparent 48%);
}
.cndc-agentes-page .cndc-legal-section {
    scroll-margin-top: 130px;
}
.cndc-agentes-page .cndc-legal-section h2 {
    display: flex;
    align-items: center;
    gap: .65rem;
    border-bottom-color: var(--neutral-line);
    color: var(--neutral-dark);
    font-size: 1.05rem;
}
.cndc-section-icon,
.cndc-nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cndc-section-icon {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background: rgba(0,93,185,.08);
    border: 1px solid rgba(0,93,185,.16);
    color: var(--primary);
    font-size: .85rem;
}
.cndc-agente-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: .9rem;
    margin-top: 1.1rem;
}
.cndc-agente-card {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-left: 3px solid var(--accent-orange);
    border-radius: var(--radius);
    padding: 1.1rem 1.15rem;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
    transition: border-color .2s, box-shadow .2s, transform .2s;
}
.cndc-agente-card:hover {
    border-color: rgba(0,93,185,.28);
    box-shadow: 0 10px 24px rgba(0,59,110,.09);
    transform: translateY(-1px);
}
.cndc-agente-card--transmision { border-left-color: var(--accent-green); }
.cndc-agente-card--distribucion { border-left-color: #D97706; }
.cndc-agente-card--consumidor   { border-left-color: #64748B; }
.cndc-agente-card__header {
    display: flex;
    align-items: center;
    min-height: 28px;
    margin-bottom: .45rem;
}
.cndc-agente-card__sigla {
    display: inline-flex;
    max-width: 100%;
    font-size: .76rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--primary);
    background: rgba(0,93,185,.08);
    border: 1px solid rgba(0,93,185,.12);
    padding: .22rem .55rem;
    border-radius: 4px;
    line-height: 1.25;
}
.cndc-agente-card--transmision .cndc-agente-card__sigla {
    color: #047857;
    background: rgba(0,149,59,.08);
    border-color: rgba(0,149,59,.14);
}
.cndc-agente-card--distribucion .cndc-agente-card__sigla {
    color: #92400E;
    background: rgba(217,119,6,.08);
    border-color: rgba(217,119,6,.15);
}
.cndc-agente-card--consumidor .cndc-agente-card__sigla {
    color: #334155;
    background: rgba(100,116,139,.1);
    border-color: rgba(100,116,139,.16);
}
.cndc-agente-card__nombre {
    font-size: .9rem;
    font-weight: 650;
    color: var(--neutral-dark);
    margin: .45rem 0 .75rem;
    line-height: 1.42;
    text-align: left;
}
.cndc-agente-card__datos {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .42rem;
}
.cndc-agente-card__datos li {
    font-size: .79rem;
    color: var(--neutral-mid);
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: .5rem;
    align-items: flex-start;
    line-height: 1.45;
}
.cndc-agente-card__datos li i {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    font-size: .68rem;
    margin-top: -.05rem;
}
.cndc-agente-card__datos a {
    color: var(--primary);
    font-weight: 600;
    overflow-wrap: anywhere;
}
.cndc-agente-card__datos a:hover { color: var(--primary-dark); text-decoration: underline; }
.cndc-agentes-page .cndc-sidebar-nav a,
.cndc-agentes-page .cndc-sidebar-nav .active {
    display: flex;
    align-items: center;
    gap: .55rem;
}
.cndc-agentes-page .cndc-sidebar-nav .active {
    color: var(--primary);
    font-weight: 700;
}
.cndc-nav-icon {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background: rgba(0,93,185,.08);
    color: var(--primary);
    font-size: .72rem;
}
@media (max-width: 600px) {
    .cndc-agente-grid { grid-template-columns: 1fr; }
    .cndc-agente-card { padding: 1rem; }
}

/* ══════════════════════════════════════════════════════════════════════
   SECTOR ELÉCTRICO — Estilos del template Nivel 2
   ══════════════════════════════════════════════════════════════════════ */

/* Página completa — fondo gris como el prototipo */
#sector-electrico-page {
    background: var(--surface-alt);
    min-height: 100vh;
    padding: 0;
    margin: 0;
}

/* Cabecera técnica — full-width */
.sin-tech-header {
    background: linear-gradient(90deg, #004a8f, var(--primary, #003B6E));
    color: #fff;
    padding: 24px 0;
    width: 100%;
}
.sin-tech-header h2 { font-size: 22px; font-weight: 700; }
.sin-tech-header p  { color: #e0f0ff; font-size: 13px; margin-top: 4px; }
.sin-tech-header__status {
    margin-left: auto;
    text-align: right;
    font-size: 12px;
    color: #e0f0ff;
}

/* Área de tarjetas — fondo gris */
#sector-electrico-page > .cndc-container {
    background: var(--surface-alt);
}

/* Tarjetas de generación */
.sin-gen-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}
.sin-gen-card {
    background: var(--surface-card);
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,.10);
    border-left: 4px solid var(--accent-orange);
}
.sin-gen-card h5     { font-size: 12px; font-weight: 700; color: var(--primary-dark); margin-bottom: 8px; }
.sin-gval            { font-size: 22px; font-weight: 700; color: var(--primary-dark); }
.sin-gunit           { font-size: 11px; color: var(--text-secondary); }
.sin-gsub            { font-size: 11px; color: var(--text-secondary); margin-top: 4px; }
.sin-gen-card.hydro  { border-left-color: #1a78c2; }
.sin-gen-card.thermo { border-left-color: #e07000; }
.sin-gen-card.wind   { border-left-color: #27ae60; }
.sin-gen-card.solar  { border-left-color: #f39c12; }
.sin-gen-card.hydro  h5 { color: #1a78c2; }
.sin-gen-card.thermo h5 { color: #e07000; }
.sin-gen-card.wind   h5 { color: #27ae60; }
.sin-gen-card.solar  h5 { color: #f39c12; }
.sin-gen-card.hydro  .sin-gval { color: #1a78c2; }
.sin-gen-card.thermo .sin-gval { color: #e07000; }
.sin-gen-card.wind   .sin-gval { color: #27ae60; }
.sin-gen-card.solar  .sin-gval { color: #f39c12; }

/* Tabs nav — sticky justo debajo del .cndc-header (~68px) */
.sin-tabs-nav {
    background: var(--surface-card);
    border-bottom: 2px solid var(--neutral-line);
    position: sticky;
    top: 68px;
    z-index: 50;
    box-shadow: 0 2px 4px rgba(0,0,0,.06);
}

/* Área de contenido de tabs — fondo gris */
.sin-tabs-nav + .cndc-container {
    padding-top: 8px;
    padding-bottom: 40px;
}
.sin-tabs-nav ul {
    max-width: 1200px;
    margin: auto;
    padding: 0 20px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    overflow-x: visible;
}
.sin-tabs-nav li a {
    display: block;
    padding: 14px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    border-bottom: 3px solid transparent;
    transition: all .2s;
    margin-bottom: -2px;
    white-space: nowrap;
    text-decoration: none;
}
.sin-tabs-nav li a.sin-tab-active,
.sin-tabs-nav li a:hover { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }

/* Tab content */
.sin-tab-content         { display: none; padding: 24px 0; }
.sin-tab-content.sin-tab-show { display: block; }

/* Section title */
.sin-sec-title           { padding: 16px 0 8px; }
.sin-sec-title h3        { font-size: 18px; font-weight: 700; color: var(--primary-dark); border-left: 4px solid var(--accent-orange); padding-left: 12px; }
.sin-sec-title p         { color: var(--text-secondary); font-size: 13px; margin-top: 4px; padding-left: 16px; }

/* Tablas de datos */
.sin-data-wrap { background: var(--surface-card); border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,.10); overflow: hidden; margin-bottom: 20px; }
.sin-tbl-header {
    background: var(--primary-dark);
    color: #fff;
    padding: 12px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sin-tbl-header h4   { font-size: 14px; font-weight: 600; margin: 0; }
.sin-tbl-header span { font-size: 11px; color: #9bb; }
table.sin-data-tbl   { width: 100%; border-collapse: collapse; }
table.sin-data-tbl th {
    background: var(--surface-alt);
    padding: 10px 14px;
    font-size: 12px;
    font-weight: 700;
    color: var(--primary-dark);
    text-align: left;
    border-bottom: 1px solid var(--neutral-line);
}
table.sin-data-tbl td {
    padding: 9px 14px;
    font-size: 12px;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--neutral-line);
}
table.sin-data-tbl tr:hover td { background: var(--surface-alt); }
table.sin-data-tbl th.num { text-align: right; }
table.sin-data-tbl td.num { text-align: right; font-weight: 600; color: var(--primary-dark); font-family: monospace; }
table.sin-data-tbl .trx-row td { color: var(--primary-dark); }
table.sin-data-tbl .trx-subtotal td { background: var(--surface-alt); color: var(--primary-dark); border-top: 2px solid var(--neutral-line); }
table.sin-data-tbl .trx-subtotal .trx-col-fix { background: var(--surface-alt); color: var(--primary-dark); }
.sin-empty-msg {
    padding: 2rem;
    text-align: center;
    color: var(--text-muted);
    font-size: 13px;
    background: rgba(8, 100, 50, .04);
    border: 1px dashed rgba(8, 100, 50, .18);
    border-radius: 6px;
}
.sin-empty-msg--updating {
    color: var(--primary);
    background: rgba(242, 148, 0, .08);
    border-color: rgba(242, 148, 0, .28);
}

/* Badges */
.sin-badge        { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 10px; font-weight: 700; letter-spacing: .3px; }
.sin-badge-pub    { background: #e6f4ea; color: #27ae60; }
.sin-badge-priv   { background: rgba(230,126,34,.12); color: #e67e22; }
.sin-badge-mem    { background: #fce4ec; color: #c2185b; }
.sin-badge-daily  { background: #e3f2fd; color: #1a7fc0; }
.sin-badge-week   { background: #f3e5f5; color: #7b1fa2; }
.sin-badge-month  { background: #e8f5e9; color: #2e7d32; }

/* Info cards (marco legal) */
.sin-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 16px 0 20px; }
.sin-info-card {
    background: var(--surface-card);
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,.10);
    border-top: 3px solid var(--accent-orange);
}
.sin-info-card h4 { font-size: 15px; font-weight: 700; color: var(--primary-dark); margin-bottom: 10px; }
.sin-info-card p  { font-size: 13px; color: var(--text-secondary); line-height: 1.7; margin-bottom: 12px; }
.sin-info-card i  { font-size: 28px; color: var(--primary-light); margin-bottom: 12px; display: block; }

/* Chart card */
.sin-chart-card {
    background: var(--surface-card);
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.10);
}
.sin-chart-card h4 { font-size: 14px; font-weight: 700; color: var(--primary-dark); margin-bottom: 4px; }
.sin-chart-card p  { font-size: 11px; color: var(--text-secondary); margin-bottom: 14px; }
.sin-chart-nota {
    margin-top: 10px;
    padding: 8px 12px;
    background: var(--surface-alt);
    border-left: 3px solid var(--accent-orange);
    border-radius: 0 4px 4px 0;
    font-size: 11px;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* Responsive */
@media (max-width: 900px) {
    .sin-gen-grid     { grid-template-columns: 1fr 1fr; }
    .sin-info-grid    { grid-template-columns: 1fr; }
    .sin-tabs-nav li a { padding: 12px 12px; font-size: 11px; }
}
@media (max-width: 600px) {
    .sin-gen-grid { grid-template-columns: 1fr; }
}

/* ── Evolución de Embalses ──────────────────────────────────────────────── */
/* ── Operación en Tiempo Real ─────────────────────────────────────────────── */
.rt-loading {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    gap: 8px;
    font-size: 1rem;
    color: var(--text-muted);
}
.rt-loading .fa-spinner { font-size: 1.4rem; color: var(--primary-light); }

.rt-timestamp {
    font-size: .78rem;
    color: var(--text-muted);
    font-style: italic;
}

/* ── Embalses ─────────────────────────────────────────────────────────────── */
.emb-subtabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.emb-subtab {
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background .2s, color .2s;
}
.emb-subtab i { margin-right: 6px; }
.emb-subtab:hover { background: var(--surface-alt); color: var(--primary-dark); }
.emb-subtab.emb-subtab-active {
    background: var(--primary-dark);
    color: #fff;
    border-color: var(--primary-dark);
}
.emb-panel { display: none; }
.emb-panel.emb-panel-show { display: block; }

/* ── Cabecera derecha (selector + botón export) ─────────────────── */
.res-hdr-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* ── Resultados Operación sub-tabs (reutiliza estilos emb-subtab) ── */
.res-subtabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.res-subtab {
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background .2s, color .2s;
}
.res-subtab i { margin-right: 6px; }
.res-subtab:hover { background: var(--surface-alt); color: var(--primary-dark); }
.res-subtab.res-subtab-active {
    background: var(--primary-dark);
    color: #fff;
    border-color: var(--primary-dark);
}
.res-panel { display: none; }
.res-panel.res-panel-show { display: block; }

/* ── Programación sub-tabs ────────────────────────────────────────── */
.prog-subtabs { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
.prog-subtab { background: var(--surface-alt); border: 1px solid var(--neutral-line); border-radius: 6px; padding: 8px 18px; font-size: 13px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: background .2s, color .2s; }
.prog-subtab i { margin-right: 6px; }
.prog-subtab:hover { background: var(--surface-alt); color: var(--primary-dark); }
.prog-subtab.prog-subtab-active { background: var(--primary-dark); color: #fff; border-color: var(--primary-dark); }
.prog-panel { display: none; }
.prog-panel.prog-panel-show { display: block; }

/* Indisponibilidades badges */
.trx-badge-prog { background:#dbeafe; color:#1e40af; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; }
.trx-badge-forc { background:#fee2e2; color:#b91c1c; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; }

/* Indisponibilidades — filtro por unidad */
.indp-filtro-wrap { display:inline-flex; align-items:center; gap:5px; color:var(--text-muted); }
.indp-filtro-wrap .fa-search { font-size:12px; }
.indp-filtro-input {
    border:1px solid var(--neutral-line); border-radius:4px;
    padding:4px 8px; font-size:13px; width:180px;
    outline:none; color:var(--text-primary); background: var(--surface-card);
}
.indp-filtro-input:focus { border-color:var(--primary); box-shadow:0 0 0 2px rgba(0,93,185,.15); }

/* Costo Marginal rows */
.trx-cm-hdr { background: var(--primary-dark) !important; color: #fff !important; }
.trx-cm-hdr td { color: #fff !important; }
.trx-cm-row { background: var(--surface-alt); font-weight: 600; }
.trx-bal-area-hdr { background: var(--surface-alt) !important; color: var(--primary-dark) !important; }
.trx-bal-area-hdr .trx-nodo { color: var(--primary-dark) !important; }

/* ── ODP — tarjetas resumen ───────────────────────────────────────── */
.odp-resumen-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}
.odp-res-card {
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
    padding: 14px 16px;
    text-align: center;
}
.odp-res-label {
    font-size: 11px;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 6px;
}
.odp-res-label i { margin-right: 4px; color: var(--primary-dark); }
.odp-res-val {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-dark);
    line-height: 1.1;
}
.odp-res-unit { font-size: 13px; font-weight: 400; color: var(--text-muted); }
.odp-res-sub  { font-size: 11px; color: var(--text-muted); margin-top: 4px; }
.emb-hint {
    font-size: 11px;
    color: var(--text-muted);
    margin-bottom: 12px;
}
.emb-hint i { color: var(--primary-light); margin-right: 4px; }

/* ── Embalses — tabla y descarga ────────────────────────────────────────── */
.emb-data-bar {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    flex-wrap: wrap;
}
.emb-btn-tabla, .emb-btn-csv {
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    padding: 7px 16px;
    font-size: 12px;
    font-weight: 600;
    color: var(--primary-dark);
    cursor: pointer;
    transition: background .2s;
}
.emb-btn-tabla:hover { background: var(--surface-alt); }
.emb-btn-csv { background: rgba(27,94,32,.08); border-color: rgba(27,94,32,.25); color: #1b5e20; }
.emb-btn-csv:hover { background: rgba(27,94,32,.15); }
.emb-btn-csv i, .emb-btn-tabla i { margin-right: 5px; }
.emb-tbl-wrap {
    margin-top: 14px;
    overflow-x: auto;
    border-radius: 6px;
    border: 1px solid var(--neutral-line);
}
.emb-tbl th, .emb-tbl td { white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════════════════
   TRANSACCIONES ECONÓMICAS — tabla horaria wide
   ═══════════════════════════════════════════════════════════════════════════ */

/* Selector de fecha */
.trx-selector-wrap .sin-tbl-header { align-items: center; gap: 12px; }
.trx-fecha-sel {
    padding: 6px 12px;
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    font-size: 13px;
    color: var(--primary-dark);
    background: var(--surface-alt);
    cursor: pointer;
    min-width: 200px;
}
.trx-fecha-sel:focus { outline: 2px solid var(--primary); }

/* Nota informativa */
.trx-nota {
    font-size: 11px;
    color: var(--text-muted);
    margin: -6px 0 10px;
    padding: 6px 10px;
    background: var(--surface-alt);
    border-left: 3px solid var(--neutral-line);
    border-radius: 0 4px 4px 0;
}
.trx-nota i { color: var(--primary-light); margin-right: 4px; }
.trx-nota--warn { background: #fffbf0; border-left-color: #f59e0b; margin-top: 8px; }
.trx-nota--warn i { color: #f59e0b; }

/* Botón exportar Excel */
.trx-export-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(27,94,32,.08);
    border: 1px solid rgba(27,94,32,.25);
    border-radius: 6px;
    padding: 7px 16px;
    font-size: 12px;
    font-weight: 600;
    color: #1b5e20;
    cursor: pointer;
    transition: background .2s;
}
.trx-export-btn:hover { background: rgba(27,94,32,.15); }
.trx-export-btn i { font-size: 14px; }
.sin-tbl-header .trx-export-btn {
    color: #fff;
    background: rgba(255,255,255,.15);
    border-color: rgba(255,255,255,.35);
}
.sin-tbl-header .trx-export-btn:hover { background: rgba(255,255,255,.25); }

/* Contenedor con scroll horizontal */
.trx-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
}

/* Tabla wide */
.trx-tbl {
    border-collapse: collapse;
    font-size: 11.5px;
    min-width: 100%;
    white-space: nowrap;
}
.trx-tbl th, .trx-tbl td {
    padding: 5px 8px;
    border: 1px solid #e8eef5;
    text-align: right;
}
.trx-tbl thead th { background: var(--surface-alt); color: var(--primary-dark); font-weight: 700; }

/* Columna fija (nombre) */
.trx-col-fix {
    position: sticky;
    left: 0;
    background: var(--surface-card);
    z-index: 2;
    text-align: left !important;
    min-width: 180px;
    max-width: 260px;
    white-space: normal;
    border-right: 2px solid var(--neutral-line) !important;
    box-shadow: 2px 0 4px rgba(0,0,0,.06);
}
.trx-tbl thead .trx-col-fix { background: var(--surface-alt); z-index: 3; }

/* Headers */
.trx-hdr-top th { border-bottom: 1px solid var(--neutral-line); }
.trx-hdr-group { text-align: center !important; font-size: 11px; letter-spacing: .5px; }
.trx-hdr-horas th { font-size: 10.5px; color: var(--text-muted); font-weight: 600; }

/* Filas normales */
.trx-row td { color: var(--primary-dark); }
.trx-row:hover td { background: var(--surface-alt); }
.trx-row .trx-col-fix { background: var(--surface-card); color: var(--primary-dark); }
.trx-row:hover .trx-col-fix { background: var(--surface-alt); }

/* Nombre del nodo */
.trx-nodo { font-size: 11px; }

/* Subtotal de empresa (cabecera colapsable) */
.trx-subtotal td {
    background: var(--surface-alt);
    color: var(--primary-dark);
    border-top: 2px solid var(--neutral-line);
}
.trx-subtotal .trx-col-fix { background: var(--surface-alt); }
.trx-subtotal .trx-nodo { font-weight: 700; }
.trx-subtotal-toggle:hover td { background: var(--surface-alt) !important; }
.trx-subtotal-toggle:hover .trx-col-fix { background: var(--surface-alt) !important; }

/* Ícono expand/collapse */
.trx-toggle-icon {
    display: inline-block;
    width: 14px;
    font-size: 10px;
    color: var(--primary-dark);
    transition: transform .15s;
    user-select: none;
}

/* Filas de detalle (nodos individuales) */
.trx-nodo-det { padding-left: 14px !important; }
.trx-nodo-indent {
    color: var(--plomo);
    margin-right: 4px;
    font-size: 11px;
}

/* Total general */
.trx-total td {
    background: var(--primary-dark);
    color: #fff;
    font-weight: 700;
}
.trx-total .trx-col-fix { background: var(--primary-dark); color: #fff; }

/* Negrita para columnas resumen */
.trx-bold { font-weight: 700; }

/* Subtotal tecnología — mismos colores que .trx-subtotal */
.trx-tec-subtotal td { background: var(--surface-alt); border-top: 2px solid var(--neutral-line); }
.trx-tec-subtotal .trx-col-fix { background: var(--surface-alt); }
.trx-tec-subtotal:hover td { background: var(--surface-alt) !important; }
.trx-tec-subtotal:hover .trx-col-fix { background: var(--surface-alt) !important; }

/* Costo marginal */
.trx-cm-hdr td {
    background: rgba(255,184,29,0.12);
    color: var(--accent-yellow);
    font-size: 11.5px;
    padding: 6px 10px;
    border-top: 2px solid rgba(255,184,29,0.35);
}
.trx-cm-hdr .trx-col-fix { background: rgba(255,184,29,0.12); }
.trx-cm-row td { background: rgba(255,184,29,0.06); color: var(--text-primary); font-weight: 600; }
.trx-cm-row .trx-col-fix { background: rgba(255,184,29,0.06); }

/* ═══════════════════════════════════════════════════════════════════════════
   DASHBOARD OPERATIVO
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Página ───────────────────────────────────────────────────────────────── */
.do-page { background: var(--surface-alt); min-height: 100vh; }

/* ── Breadcrumb dentro del header ─────────────────────────────────────────── */
.do-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .75rem;
    color: rgba(255,255,255,.6);
    margin-bottom: 6px;
    transition: color .15s;
}
.do-breadcrumb:hover { color: #fff; }
.do-breadcrumb i { font-size: .65rem; }

/* ── Barra de controles (blanca, bajo el header) ─────────────────────────── */
.do-controls-bar {
    background: var(--surface-card);
    border-bottom: 1px solid var(--neutral-line);
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    padding: 10px 0;
    position: sticky;
    top: 56px;   /* ajustar si el nav tiene otra altura */
    z-index: 50;
    transition: opacity 0.25s;
}
.do-controls-bar--hidden {
    opacity: 0;
    pointer-events: none;
}
.do-controls-bar__inner {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

/* Tabs de modo (fondo blanco → colores oscuros) */
.do-modo-tabs {
    display: flex;
    gap: 2px;
    background: var(--neutral-light, #f4f6f9);
    border-radius: 7px;
    padding: 3px;
    border: 1px solid var(--neutral-line);
}
.do-modo-btn {
    background: transparent;
    border: none;
    padding: 5px 15px;
    border-radius: 5px;
    font-size: .82rem;
    font-weight: 600;
    cursor: pointer;
    color: var(--neutral-mid, #4A5568);
    transition: background .15s, color .15s;
}
.do-modo-btn.do-modo-active {
    background: var(--primary, #003B6E);
    color: #fff;
}

/* Selects y botón en la barra blanca */
.do-selects { display: flex; align-items: center; gap: 8px; }
.do-sel {
    padding: 5px 10px;
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    font-size: .85rem;
    color: var(--neutral-dark, #1A1A2E);
    background: var(--surface-card);
    cursor: pointer;
    appearance: auto;
}
.do-sel:focus { outline: 2px solid var(--primary); border-color: var(--primary); }
.do-btn-apply {
    background: var(--primary, #003B6E);
    color: #fff;
    border: none;
    padding: 6px 16px;
    border-radius: 6px;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity .15s;
}
.do-btn-apply:hover    { opacity: .85; }
.do-btn-apply:disabled { opacity: .5; cursor: default; }

/* Etiqueta período */
.do-periodo-label {
    margin-left: auto;
    font-size: .82rem;
    font-weight: 700;
    color: var(--primary, #003B6E);
    white-space: nowrap;
}

/* ── Cuerpo ───────────────────────────────────────────────────────────────── */
.do-body { padding: 24px 0 56px; }

/* Label de sección */
.do-section-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--primary, #003B6E);
    border-bottom: 2px solid var(--accent-orange);
    padding-bottom: 8px;
    margin: 28px 0 18px;
}
.do-section-label i { font-size: 1rem; }
.do-section-label--coming { opacity: .45; margin-top: 20px; }

.do-badge-pronto {
    background: var(--surface-alt);
    color: var(--text-muted);
    font-size: .7rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-left: 4px;
}

/* ── KPI Row ──────────────────────────────────────────────────────────────── */
.do-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}
@media (max-width: 1000px) { .do-kpi-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .do-kpi-row { grid-template-columns: 1fr; } }

.do-kpi {
    background: var(--surface-card);
    border-radius: var(--radius, 8px);
    padding: 20px 18px 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
    border-top: 4px solid var(--neutral-line);
    text-align: center;
    position: relative;
}
.do-kpi--gen    { border-top-color: var(--primary, #003B6E); }
.do-kpi--gas    { border-top-color: #F59B00; }
.do-kpi--diesel { border-top-color: #E63946; }
.do-kpi--ret    { border-top-color: #00A878; }
.do-kpi--mono   { border-top-color: #6C3FC5; }
.do-kpi--ene-p  { border-top-color: #2196F3; }
.do-kpi--pot-p  { border-top-color: #009688; }
.do-kpi--tra-p  { border-top-color: #FF7043; }

/* Potencia Efectiva — KPIs por tecnología */
.do-kpi--pot-total  { border-top-color: var(--primary, #003B6E); }
.do-kpi--pot-termo  { border-top-color: #E63946; }
.do-kpi--pot-hidro  { border-top-color: #2196F3; }
.do-kpi--pot-solar  { border-top-color: #F59B00; }
.do-kpi--pot-eolica { border-top-color: #009688; }
.do-kpi--pot-biomasa{ border-top-color: #00A878; }

.do-kpi--pot-total  .do-kpi__icon { color: var(--primary, #003B6E); }
.do-kpi--pot-termo  .do-kpi__icon { color: #E63946; }
.do-kpi--pot-hidro  .do-kpi__icon { color: #2196F3; }
.do-kpi--pot-solar  .do-kpi__icon { color: #F59B00; }
.do-kpi--pot-eolica .do-kpi__icon { color: #009688; }
.do-kpi--pot-biomasa .do-kpi__icon { color: #00A878; }

.do-kpi--pot-termo  .do-kpi__val { color: #E63946; }
.do-kpi--pot-hidro  .do-kpi__val { color: #1565C0; }
.do-kpi--pot-solar  .do-kpi__val { color: #c47a00; }
.do-kpi--pot-eolica .do-kpi__val { color: #00695C; }
.do-kpi--pot-biomasa .do-kpi__val { color: #00875f; }

/* KPI row de 6 columnas para potencia */
.do-kpi-row--3   { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1000px) { .do-kpi-row--3   { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px)  { .do-kpi-row--3   { grid-template-columns: 1fr; } }

.do-kpi-row--pot { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 1100px) { .do-kpi-row--pot { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px)  { .do-kpi-row--pot { grid-template-columns: repeat(2, 1fr); } }

/* Asterisco suave en el label */
.do-pot-asterisco { font-size: .75rem; color: #E63946; font-weight: 700; }

/* Tabla detalle por central */
.do-pot-tbl { width: 100%; border-collapse: collapse; font-size: .82rem; }
.do-pot-tbl th { background: var(--surface-alt); padding: 6px 10px; text-align: left; color: var(--text-secondary); font-weight: 600; border-bottom: 2px solid var(--neutral-line); }
.do-pot-tbl th.num { text-align: right; }
.do-pot-tbl td { padding: 5px 10px; border-bottom: 1px solid var(--neutral-line); color: var(--text-secondary); vertical-align: middle; }
.do-pot-tbl td.num { text-align: right; font-variant-numeric: tabular-nums; }

/* Fila de grupo (tecnología) */
.do-pot-tbl__group td { background: var(--surface-alt); padding: 7px 10px; }
.do-pot-tbl__group td strong { font-size: .83rem; color: var(--text-primary); }
.do-pot-tbl__dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    margin-right: 7px;
    vertical-align: middle;
    flex-shrink: 0;
}
/* Fila de grupo — interactiva */
.do-pot-tbl__group--toggle { cursor: pointer; user-select: none; }
.do-pot-tbl__group--toggle:hover td { background: var(--surface-alt); }
.do-pot-tbl__count {
    margin-left: 8px;
    font-size: .75rem;
    font-weight: 400;
    color: var(--text-muted);
}
.do-pot-tbl__chevron-cell { white-space: nowrap; }
.do-pot-tbl__chevron {
    margin-left: 6px;
    font-size: .75rem;
    color: var(--text-muted);
    transition: transform .2s ease;
}
.do-pot-tbl__group--open .do-pot-tbl__chevron { transform: rotate(180deg); }

/* Fila de central (indentada) */
.do-pot-tbl__central--hidden { display: none; }
.do-pot-tbl__central td { padding-left: 24px; }
.do-pot-tbl__central-nombre { color: var(--text-secondary); }
.do-pot-tbl__central:last-child td { border-bottom: 2px solid var(--neutral-line); }
.do-pot-tbl__central:hover td { background: var(--surface-alt); }

/* Nota al pie de la sección */
.do-pot-nota {
    margin-top: 10px;
    font-size: .75rem;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 5px;
}
.do-pot-nota i { color: var(--text-muted); }

.do-kpi--clickable {
    cursor: pointer;
    transition: box-shadow 0.18s, transform 0.18s;
}
.do-kpi--clickable:hover {
    box-shadow: 0 4px 18px rgba(0,59,110,.18);
    transform: translateY(-2px);
}

/* Badge "Ver detalle" en KPI cards clickeables */
.do-drill-badge {
    position: absolute;
    top: 8px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
    transition: color 0.18s;
    pointer-events: none;
}
.do-kpi--clickable:hover .do-drill-badge { color: var(--primary, #003B6E); }

/* Badge "Ver detalle" en chart cards con drilldown */
.do-card--drillable {
    position: relative;
}
.do-card--drillable .do-card-drill-hint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
    vertical-align: middle;
    transition: color 0.18s;
    pointer-events: none;
}
.do-card--drillable:hover .do-card-drill-hint { color: var(--primary, #003B6E); }

.do-kpi__icon {
    font-size: 1.4rem;
    margin-bottom: 8px;
    opacity: .5;
}
.do-kpi--gen    .do-kpi__icon { color: var(--primary, #003B6E); }
.do-kpi--gas    .do-kpi__icon { color: #F59B00; }
.do-kpi--diesel .do-kpi__icon { color: #E63946; }
.do-kpi--ret    .do-kpi__icon { color: #00A878; }
.do-kpi--mono   .do-kpi__icon { color: #6C3FC5; }
.do-kpi--ene-p  .do-kpi__icon { color: #2196F3; }
.do-kpi--pot-p  .do-kpi__icon { color: #009688; }
.do-kpi--tra-p  .do-kpi__icon { color: #FF7043; }

.do-kpi__val {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--primary, #003B6E);
    font-variant-numeric: tabular-nums;
}
.do-kpi--gas    .do-kpi__val { color: #c47a00; }
.do-kpi--diesel .do-kpi__val { color: #E63946; }
.do-kpi--ret    .do-kpi__val { color: #00875f; }
.do-kpi--mono   .do-kpi__val { color: #6C3FC5; }
.do-kpi--ene-p  .do-kpi__val { color: #1565C0; }
.do-kpi--pot-p  .do-kpi__val { color: #00695C; }
.do-kpi--tra-p  .do-kpi__val { color: #BF360C; }

.do-kpi__lbl {
    font-size: .7rem;
    font-weight: 700;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: 4px 0 2px;
}
.do-kpi__unit { font-size: .72rem; color: var(--text-muted); font-weight: 600; }
.do-kpi__sub  { font-size: .72rem; color: var(--text-muted); margin-top: 6px; }

/* ── Drilldown panel ─────────────────────────────────────────────────────── */
.do-drilldown-panel {
    margin-bottom: 18px;
    border-left: 4px solid var(--accent-orange);
    animation: do-slide-in 0.25s ease;
}
@keyframes do-slide-in {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.do-drilldown-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}
.do-drilldown-header h3 { margin-bottom: 0; }
.do-drilldown-header p  { margin-bottom: 0; }
.do-btn-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    padding: 6px 14px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--primary, #003B6E);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s;
}
.do-btn-back:hover { background: var(--surface-alt); }

/* ── Drilldown header layout ─────────────────────────────────────────────── */
.do-drilldown-header__title { flex: 1; min-width: 0; }
.do-drilldown-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
}

/* ── Botones tabla / CSV (drilldown y cards) ─────────────────────────────── */
.do-btn-tbl, .do-btn-csv {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 4px;
    font-size: .78rem;
    cursor: pointer;
    font-weight: 600;
    white-space: nowrap;
    transition: background .15s, color .15s;
}
.do-btn-tbl {
    border: 1px solid var(--primary, #003B6E);
    background: var(--surface-card);
    color: var(--primary, #003B6E);
}
.do-btn-tbl:hover, .do-btn-tbl.activo { background: var(--primary, #003B6E); color: #fff; }
.do-btn-csv {
    border: 1px solid var(--accent-green, #00A878);
    background: var(--surface-card);
    color: var(--accent-green, #00A878);
}
.do-btn-csv:hover { background: var(--accent-green, #00A878); color: #fff; }

/* ── Área de tabla ───────────────────────────────────────────────────────── */
.do-tbl-area { margin-top: 14px; overflow-x: auto; }
.do-tbl-area .cndc-data-tbl { width: 100%; font-size: .82rem; }
.cndc-data-tbl th.num { text-align: right; }
.cndc-data-tbl td.num { text-align: right; font-variant-numeric: tabular-nums; }
.do-tbl-area-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

/* ── Botón "Datos" en cards — mismo estilo que Ver detalle ───────────────── */
.do-card-datos-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 0;
    border: none;
    background: none;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
    vertical-align: middle;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.18s;
}
.do-card-datos-btn:hover { color: var(--primary, #003B6E); }
.do-card-datos-btn.activo { color: var(--primary, #003B6E); }

/* ── Filas de gráficos ────────────────────────────────────────────────────── */
.do-row { display: grid; gap: 18px; margin-bottom: 18px; }
.do-row--2-1   { grid-template-columns: 2fr 1fr; }
.do-row--1-1   { grid-template-columns: 1fr 1fr; }
.do-row--1-1-1 { grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 900px) {
    .do-row--2-1,
    .do-row--1-1,
    .do-row--1-1-1 { grid-template-columns: 1fr; }
}

/* Alturas de chart */
.do-chart       { width: 100%; }
.do-chart--md   { min-height: 280px; }
.do-chart--sm   { min-height: 200px; }

/* Cabecera carta RT con selector de fecha */
.do-rt-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:2px; }
.do-rt-head h3 { margin:0; }
.do-rt-fecha { display:flex; align-items:center; gap:6px; }
.do-rt-fecha label { font-size:12px; color:var(--text-secondary); font-weight:600; white-space:nowrap; }
#do-gendem-fecha { font-size:12px; padding:3px 8px; border:1px solid var(--neutral-line); border-radius:5px; background:var(--surface-card); color:var(--text-primary); cursor:pointer; font-family:inherit; }
#do-gendem-sub  { font-size:11px; color:var(--text-muted); margin:2px 0 4px; }

/* Footer de card con acciones/links */
.do-card-footer {
    display: flex;
    justify-content: flex-end;
    padding: 0.5rem 0 0;
    margin-top: 0.25rem;
    border-top: 1px solid var(--neutral-line);
}

/* ── Card Inyecciones/Retiros ─────────────────────────────────────────────── */
.do-ir-summary {
    display: flex;
    gap: 0;
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
}
.do-ir-block {
    flex: 1;
    padding: 14px 12px;
    text-align: center;
    background: var(--surface-alt);
}
.do-ir-block--inj { border-right: 1px solid var(--neutral-line); }
.do-ir-sep { display: none; }

.do-ir-block__lbl {
    display: block;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--text-muted);
    margin-bottom: 4px;
}
.do-ir-block__val {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}
.do-ir-block__unit { font-size: .72rem; color: var(--text-muted); }
.do-ir-block--inj .do-ir-block__val { color: #00875f; }
.do-ir-block--ret .do-ir-block__val { color: var(--primary, #003B6E); }

/* ── Gas layout (pie + tabla lado a lado) ─────────────────────────────────── */
.do-gas-layout {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 16px;
    align-items: start;
}
@media (max-width: 700px) { .do-gas-layout { grid-template-columns: 1fr; } }

.do-gas-table { margin-top: 0; max-height: 240px; overflow-y: auto; }

/* ── Empty placeholder ────────────────────────────────────────────────────── */
.do-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    color: var(--text-muted);
    gap: 10px;
    text-align: center;
}
.do-empty i    { font-size: 2rem; }

/* ── Marco Legal — Índice ─────────────────────────────── */

/* Jerarquía normativa */
.cndc-ml-jerarquia {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 1.25rem;
    border-left: 3px solid var(--accent-orange);
    padding-left: 0;
}
.cndc-ml-nivel {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--neutral-light);
    background: var(--white);
}
.cndc-ml-nivel--1 { border-left: 4px solid var(--accent-orange); }
.cndc-ml-nivel--2 { border-left: 4px solid var(--accent-orange); padding-left: 1.75rem; }
.cndc-ml-nivel--3 { border-left: 4px solid var(--accent-green); padding-left: 2.5rem; }
.cndc-ml-nivel__tag {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
    color: var(--neutral-mid);
    min-width: 4.5rem;
}
.cndc-ml-nivel__texto {
    font-size: 0.85rem;
    color: var(--neutral-dark);
}

/* Tarjetas de documentos */
.cndc-ml-card {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    background: var(--white);
    border: 1px solid var(--neutral-light);
    border-radius: 8px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    transition: box-shadow 0.2s;
}
.cndc-ml-card:hover { box-shadow: 0 4px 16px rgba(0,59,110,0.08); }
.cndc-ml-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}
.cndc-ml-card__icon--ley     { background: rgba(0,93,185,.12);  color: var(--primary); }
.cndc-ml-card__icon--ds      { background: rgba(0,135,90,.12);  color: #00875a; }
.cndc-ml-card__icon--norma   { background: rgba(255,184,29,.15); color: var(--accent-yellow); }
.cndc-ml-card__icon--decreto { background: rgba(123,79,160,.12); color: #7b4fa0; }
.cndc-ml-card__body { flex: 1; }
.cndc-ml-card__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.4rem;
}
.cndc-ml-card__fecha {
    font-size: 0.75rem;
    color: var(--neutral-mid);
}
.cndc-ml-card__titulo {
    font-size: 1rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.4rem;
}
.cndc-ml-card__desc {
    font-size: 0.85rem;
    color: var(--neutral-mid);
    line-height: 1.6;
    margin-bottom: 0.85rem;
}
.cndc-ml-card__actions {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* Modal visor PDF */
.cndc-pdf-modal { position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center; }
.cndc-pdf-modal[hidden] { display: none; }
.cndc-pdf-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.65); }
.cndc-pdf-modal__box {
    position: relative; z-index: 1;
    width: min(94vw, 960px); height: 90vh;
    background: var(--surface); border-radius: var(--radius-lg);
    display: flex; flex-direction: column; overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
}
.cndc-pdf-modal__header {
    display: flex; align-items: center; gap: .75rem;
    padding: .6rem 1rem; border-bottom: 1px solid var(--border);
    background: var(--surface-alt); flex-shrink: 0;
}
.cndc-pdf-modal__titulo {
    flex: 1; min-width: 0;
    font-weight: 600; font-size: .875rem; color: var(--text-primary);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cndc-pdf-modal__close {
    background: none; border: none; cursor: pointer;
    font-size: 1.4rem; line-height: 1; color: var(--text-muted);
    padding: .2rem .5rem; border-radius: var(--radius); flex-shrink: 0;
}
.cndc-pdf-modal__close:hover { background: var(--border); color: var(--text-primary); }
.cndc-pdf-modal__frame { flex: 1; border: none; width: 100%; }

/* Línea de tiempo */
.cndc-ml-timeline {
    position: relative;
    padding-left: 2rem;
    margin-top: 1.25rem;
}
.cndc-ml-timeline::before {
    content: '';
    position: absolute;
    left: 0.6rem;
    top: 0.5rem;
    bottom: 0.5rem;
    width: 2px;
    background: var(--primary-light);
}
.cndc-ml-tl-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
    position: relative;
}
.cndc-ml-tl-item::before {
    content: '';
    position: absolute;
    left: -1.45rem;
    top: 0.4rem;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    border: 2px solid var(--white);
    box-shadow: 0 0 0 2px var(--primary);
}
.cndc-ml-tl-item__year {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--primary);
    min-width: 2.75rem;
    padding-top: 0.15rem;
}
.cndc-ml-tl-item__body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.cndc-ml-tl-item__body strong {
    font-size: 0.875rem;
    color: var(--neutral-dark);
}
.cndc-ml-tl-item__body span {
    font-size: 0.8rem;
    color: var(--neutral-mid);
}

@media (max-width: 640px) {
    .cndc-ml-card { flex-direction: column; }
    .cndc-ml-card__icon { width: 40px; height: 40px; font-size: 1.1rem; }
}

/* ── Info grid footer (link Sobre el CNDC) ────────────── */
.cndc-info-grid-footer {
    display: flex;
    justify-content: center;
    margin-top: 1.5rem;
    margin-bottom: 2.5rem;
}

/* ── Sobre el CNDC ────────────────────────────────────── */
.cndc-sobre-mv {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.25rem;
}
.cndc-sobre-mv__card {
    background: var(--white);
    border: 1px solid var(--neutral-light);
    border-top: 3px solid var(--accent-orange);
    border-radius: 6px;
    padding: 1.5rem;
}
.cndc-sobre-mv__icon {
    font-size: 1.5rem;
    color: var(--primary);
    margin-bottom: 0.75rem;
}
.cndc-sobre-mv__card h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.cndc-sobre-mv__card p {
    font-size: 0.875rem;
    color: var(--neutral-mid);
    line-height: 1.7;
    margin: 0;
    font-style: italic;
    text-align: justify;
}

.cndc-sobre-pv {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.25rem;
}
.cndc-sobre-pv__col {
    background: var(--neutral-bg, #f7f9fc);
    border-radius: 6px;
    padding: 1.5rem;
}
.cndc-sobre-pv__col h3 {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cndc-sobre-pv__col > p {
    font-size: 0.8rem;
    color: var(--neutral-mid);
    margin-bottom: 0.75rem;
}
.cndc-sobre-lista {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.cndc-sobre-lista li {
    font-size: 0.875rem;
    color: var(--neutral-dark);
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    text-align: justify;
}
.cndc-sobre-lista li i {
    color: var(--accent-green);
    font-size: 0.75rem;
    flex-shrink: 0;
    margin-top: 0.18em;
}

@media (max-width: 640px) {
    .cndc-sobre-mv,
    .cndc-sobre-pv { grid-template-columns: 1fr; }
}
.do-empty span { font-size: .85rem; font-weight: 600; }

/* ═══════════════════════════════════════════════════════
   HOME — Indicadores SIN
   ═══════════════════════════════════════════════════════ */

.cndc-indicadores {
    padding: 3rem 0 2.5rem;
    background: var(--surface-alt);
}

/* ── Donuts grid ─────────────────────────────────────── */
.home-ind-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-bottom: 0;
}

.home-ind-card {
    background: var(--surface-card);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow);
    border-top: 3px solid var(--accent-orange);
}

.home-ind-card__head {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.home-ind-card__icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.home-ind-card__icon--blue   { background: rgba(0,93,185,.12);   color: var(--primary); }
.home-ind-card__icon--green  { background: rgba(255,108,0,.12);   color: var(--accent-orange); }
.home-ind-card__icon--purple { background: rgba(255,184,29,.15);  color: #c47800; }
.home-ind-card__icon--orange { background: rgba(230,126,34,.12);  color: #E67E22; }
.home-ind-card__icon--violet { background: rgba(123,94,167,.12);  color: #7B5EA7; }
.home-ind-sub-head           { margin-top: 0.75rem; }

.home-ind-card__head h3 {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
    margin-bottom: 0.25rem;
}

.home-ind-badge {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--primary);
    background: rgba(0,93,185,.1);
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    display: inline-block;
}

.home-ind-kpi {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

.home-ind-kpi__val {
    font-size: 2.1rem;
    font-weight: 700;
    color: var(--primary);
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
}

.home-ind-kpi__meta {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.home-ind-kpi__unit {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--neutral-mid);
}

.home-ind-kpi__lbl {
    font-size: 0.72rem;
    color: var(--neutral-mid);
}

.home-ind-kpi-sep                           { border: none; border-top: 1px solid var(--neutral-line); margin: 0.5rem 0; }
.home-ind-kpi--secondary .home-ind-kpi__val { font-size: 1.5rem; color: var(--text-secondary); }
.home-ind-hist-chart                        { width: 100%; min-height: 200px; }

/* ── Barras de progreso ───────────────────────────────── */
.home-bars {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.home-bar-item__hdr {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.2rem;
}

.home-bar-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

.home-bar-lbl {
    font-size: 0.8rem;
    color: var(--neutral-mid);
    flex: 1;
}

.home-bar-pct {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--neutral-dark);
    min-width: 3rem;
    text-align: right;
}

.home-bar-track {
    height: 6px;
    background: var(--neutral-line);
    border-radius: 99px;
    overflow: hidden;
}

.home-bar-fill {
    height: 100%;
    border-radius: 99px;
    transition: width 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-ind-footnote {
    font-size: 0.70rem;
    color: var(--neutral-mid);
    margin: 0.5rem 0 0;
    font-style: italic;
    line-height: 1.4;
}


.home-footnote-ref {
    font-size: 0.65rem;
    font-style: normal;
    vertical-align: super;
    color: var(--neutral-mid);
    font-weight: 600;
}

.home-ind-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1rem;
    margin-top: 0.25rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--neutral-line);
}

.home-ind-leg-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    color: var(--neutral-mid);
}

.home-ind-leg-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ── Zonas A/B ───────────────────────────────────────── */
.home-zone {
    border-radius: 16px;
    padding: 2rem 1.75rem;
    margin-bottom: 1.5rem;
}

.home-zone-a {
    background: var(--surface-card);
    box-shadow: var(--shadow);
}

.home-zone-b {
    background: var(--surface-card);
    border-left: 4px solid var(--accent-orange);
    box-shadow: var(--shadow);
}

.home-zone-header {
    margin-bottom: 1.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.home-zone-header__main {
    flex: 1 1 auto;
}

.home-zone-header h2,
.home-zone-header__main h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 0.2rem;
    line-height: 1.2;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--accent-orange);
    display: inline-block;
}

.home-zone-header p,
.home-zone-header__main p {
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin: 0;
}

.home-section-label {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--primary-light);
    margin-bottom: 0.35rem;
}

.home-section-label--light {
    color: var(--text-muted);
    padding-bottom: 0.4rem;
    border-bottom: 2px solid var(--accent-orange);
    display: inline-block;
    margin-bottom: 0.75rem;
}

.home-rt-live-group {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.home-rt-freq {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
    padding: 0.5rem 0.85rem;
    text-align: center;
    min-width: 110px;
    box-shadow: var(--shadow);
}

.home-rt-freq__lbl {
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--neutral-mid);
    margin-bottom: 0.2rem;
}

.home-rt-freq__lbl i {
    margin-right: 0.25rem;
    color: var(--primary);
}

.home-rt-freq__val {
    display: block;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--neutral-dark);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.home-rt-freq__val small {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--neutral-mid);
}

/* ── RT Section ──────────────────────────────────────── */
.home-rt-section {
    background: var(--surface-card);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow);
    margin-bottom: 1.5rem;
}

.home-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.home-section-head h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--neutral-dark);
}

.home-section-head h3 i {
    color: var(--primary);
    margin-right: 0.35rem;
}

.home-rt-badge {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background: rgba(255,108,0,0.12);
    color: var(--accent-orange);
}

.home-rt-badge i {
    font-size: 0.55rem;
    vertical-align: middle;
    margin-right: 0.25rem;
    animation: home-blink 1.5s ease-in-out infinite;
}

@keyframes home-blink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.25; }
}

.home-rt-tabs {
    display: flex;
    gap: 0;
    flex-wrap: wrap;
    border-bottom: 2px solid var(--neutral-line);
    margin-bottom: 1rem;
}

.home-rt-tab {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    padding: 0.5rem 1.1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--neutral-mid);
    cursor: pointer;
    transition: color 0.18s, border-color 0.18s;
}

.home-rt-tab i { margin-right: 0.35rem; }
.home-rt-tab:hover  { color: var(--primary); }
.home-rt-tab.active { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }

.home-rt-panels { position: relative; }
.home-rt-panel  { display: none; }
.home-rt-panel.active { display: block; }

.home-rt-chart {
    min-height: 280px;
    width: 100%;
}

.home-rt-ts {
    display: block;
    font-size: 0.72rem;
    color: var(--neutral-mid);
    text-align: right;
    margin-top: 0.25rem;
}

.home-rt-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--neutral-line);
}

.home-rt-note {
    font-size: 0.8rem;
    color: var(--neutral-mid);
}
.home-rt-note i { margin-right: 0.3rem; }

.home-rt-empty {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--neutral-mid);
    gap: 0.75rem;
    text-align: center;
}
.home-rt-empty i  { font-size: 2rem; opacity: 0.35; }
.home-rt-empty p  { font-size: 0.875rem; }
.home-rt-empty a  { color: var(--primary); text-decoration: underline; }

/* ── Planificación — gráficos expansión SIN ──────────── */
.home-plan-charts__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.home-plan-charts__subtitle {
    font-size: 0.8rem;
    color: var(--neutral-mid);
    margin: 0 0 0.15rem;
    font-weight: 600;
}

.home-plan-charts__subsubtitle {
    font-size: 0.72rem;
    color: var(--neutral-mid);
    margin: 0 0 0.5rem;
    font-weight: 400;
    font-style: italic;
    opacity: 0.8;
}

.home-plan-chart-container {
    border-radius: 8px;
    overflow: hidden;
}

/* ── RT 2-col layout ─────────────────────────────────── */
.home-rt-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.home-rt-subcol { min-width: 0; }

.home-rt-subtitle {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--neutral-dark);
    margin-bottom: 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid #eef2f6;
}

.home-rt-subtitle i {
    color: var(--primary);
    margin-right: 0.35rem;
    font-size: 0.8rem;
}

/* Altura reducida en 2 columnas para que quepan bien */
.home-rt-2col .home-rt-chart { min-height: 240px; max-height: 320px; }

/* Frecuencia — fila completa */
.home-rt-frec-row { margin-top: 0; }
.home-rt-frec-row .home-rt-subtitle { margin-bottom: 0.5rem; }
.home-rt-chart--frec { min-height: 200px; }

/* ── Barra de control RT (tabs + toggle) ──────────────── */
.home-rt-ctrlbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

/* Tabs del modo expandido — ocultos por defecto */
.home-rt-etabs {
    display: none;
    gap: 0;
    flex: 1;
    border-bottom: 2px solid #eef2f6;
}
.home-zone-b--expanded .home-rt-etabs {
    display: flex;
}

.home-rt-etab {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    padding: 0.45rem 1rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--neutral-mid);
    cursor: pointer;
    transition: color 0.18s, border-color 0.18s;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.home-rt-etab:hover { color: var(--primary); }
.home-rt-etab--active { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }

/* Botón toggle compacto/expandido */
.home-rt-toggle {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: none;
    border: 1px solid #d0d7e2;
    border-radius: 6px;
    padding: 0.35rem 0.8rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--neutral-mid);
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.18s, border-color 0.18s, background 0.18s;
    flex-shrink: 0;
}
.home-rt-toggle:hover {
    color: var(--primary);
    border-color: var(--primary);
    background: rgba(0,93,185,.05);
}
.home-zone-b--expanded .home-rt-toggle {
    color: var(--primary);
    border-color: var(--primary);
    background: rgba(0,93,185,.05);
}

/* ── Vista expandida ──────────────────────────────────── */
.home-rt-expanded {
    margin-bottom: 1.25rem;
}
.home-rt-exp-panel { display: none; }
.home-rt-exp-panel--active { display: block; }

.home-rt-chart--full { min-height: 400px; }
.home-rt-chart--frec { min-height: 280px; }

/* ── Sobre el CNDC — sección oscura ──────────────────── */
.cndc-home-about {
    background: linear-gradient(to bottom, var(--neutral-light) 60%, #eef1f5 100%);
    color: var(--text-primary);
    padding: 3.5rem 0;
    margin-top: 0;
    border-top: 3px solid var(--accent-orange);
}

.cndc-home-about__header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.cndc-home-about__header h2 {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.4rem;
}

.cndc-home-about__header h2 a {
    color: var(--primary);
    text-decoration: none;
}

.cndc-home-about__header h2 a:hover {
    text-decoration: underline;
    text-decoration-color: rgba(0,93,185,.3);
}

.cndc-home-about__header p {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin: 0;
}

.cndc-home-about .cndc-info-grid .cndc-info-card {
    background: var(--surface-card);
    border: 1px solid var(--border);
    color: var(--text-primary);
}

.cndc-home-about .cndc-info-card p {
    color: var(--text-secondary);
    text-align: justify;
}

.cndc-home-about .cndc-info-card i {
    color: var(--primary);
}

.cndc-home-about .cndc-info-card h3 {
    color: var(--primary);
}

.cndc-home-about__cta {
    text-align: center;
    margin-top: 2.5rem;
}
.cndc-home-about__cta .cndc-btn--light {
    background: transparent;
    color: var(--primary);
    border: 2px solid var(--primary);
}
.cndc-home-about__cta .cndc-btn--light:hover {
    background: var(--primary);
    color: var(--white);
    opacity: 1;
}

.cndc-btn--light {
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.25);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.5rem;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: background .2s;
}
.cndc-btn--light:hover { background: rgba(255,255,255,.22); color: #fff; }

/* ── Toggle detalle indicadores ────────────────────────── */
.home-ind-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}
.home-ind-toggle,
.home-ind-hist-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.75rem;
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 20px;
    cursor: pointer;
    color: var(--primary);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--font-primary);
    text-decoration: none;
    transition: background .15s, border-color .15s;
}
.home-ind-toggle:hover,
.home-ind-hist-link:hover    { background: rgba(0,93,185,.08); border-color: var(--primary-light); color: var(--primary); }
.home-ind-toggle i           { font-size: 0.65rem; transition: transform 0.22s ease; }
.home-ind-toggle[aria-expanded="true"] { background: rgba(0,93,185,.08); }
.home-ind-toggle[aria-expanded="true"] i { transform: rotate(180deg); }

.home-ind-detail { display: none; margin-top: 0.75rem; }
.home-ind-detail.is-open { display: block; }

.home-chart-legend-wrap { margin-top: 6px; }
.home-legend-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.75rem;
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 20px;
    cursor: pointer;
    color: var(--primary);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--font-primary);
    transition: background .15s, border-color .15s;
}
.home-legend-toggle:hover { background: rgba(0,93,185,.08); border-color: var(--primary-light); }
.home-legend-toggle i { font-size: 0.65rem; transition: transform 0.22s ease; }
.home-legend-toggle[aria-expanded="true"] { background: rgba(0,93,185,.08); }
.home-chart-legend { display: none; margin-top: 8px; }
.home-chart-legend.is-open { display: block; }
.home-legend-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 6px;
    max-height: 50px;
    overflow: hidden;
}
.home-chart-legend__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
    padding: 6px 2px;
}
.home-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: var(--text-secondary);
}
.home-legend-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.home-legend-line {
    display: inline-block;
    width: 16px;
    height: 3px;
    border-radius: 2px;
    flex-shrink: 0;
}

/* ── Zona C — Triple panel ──────────────────────────────── */
.home-zone-c {
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    padding: 1.25rem;
}

.home-trizone-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto auto 300px auto;
    column-gap: 1rem;
    row-gap: 0;
}

.home-trizone-col {
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 1rem 1.1rem 0.75rem;
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
    box-shadow: var(--shadow);
    min-width: 0;
}

.home-trizone-col__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--neutral-line);
}

.home-trizone-col__footer {
    display: flex;
    flex-direction: column;
}

.home-trizone-col__title {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--primary);
    line-height: 1.3;
    flex: 1;
}

.home-trizone-col__title i {
    margin-right: 0.3rem;
    font-size: 0.72rem;
    opacity: 0.75;
}

.home-trizone-chart {
    overflow: hidden;
}

.home-trizone-col--empty {
    background: var(--surface-alt);
    border-style: dashed;
    border-color: var(--border);
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 500;
    min-height: 320px;
}

.home-trizone-col--empty i {
    font-size: 1.5rem;
    display: block;
    margin-bottom: 0.35rem;
    opacity: 0.3;
}

/* ── Proyección CTA col ──────────────────────────────── */
/* Modo expandido: col RT ocupa todo el ancho, cols 2-3 quedan debajo en 2 columnas */
.home-trizone-grid--rt-expanded {
    grid-template-columns: 1fr 1fr;
}
.home-trizone-grid--rt-expanded .home-trizone-col:first-child {
    grid-column: 1 / -1;
}

.home-trizone-expand-btn {
    flex-shrink: 0;
    background: none;
    border: 1px solid #c5d4ef;
    border-radius: 4px;
    padding: 3px 7px;
    cursor: pointer;
    color: var(--primary);
    font-size: 0.72rem;
    line-height: 1;
    opacity: 0.7;
    transition: opacity 0.15s;
}
.home-trizone-expand-btn:hover { opacity: 1; }

.home-col3-toggle-btn {
    flex-shrink: 0;
    background: none;
    border: 1px solid #c5d4ef;
    border-radius: 10px;
    padding: 3px 10px;
    cursor: pointer;
    color: var(--primary);
    font-size: 0.70rem;
    line-height: 1.4;
    opacity: 0.75;
    transition: background 0.15s, color 0.15s, opacity 0.15s;
    white-space: nowrap;
}
.home-col3-toggle-btn:hover { opacity: 1; background: var(--primary-light); color: #fff; border-color: var(--primary-light); }
.home-col3-toggle-btn.is-active { background: var(--primary); color: #fff; border-color: var(--primary); opacity: 1; }

.home-trizone-col--proyeccion {
    background: var(--surface-alt);
    border-color: var(--neutral-line);
}

.home-proy-cta {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    text-align: center;
    padding: 1rem 0.5rem;
}

.home-proy-cta__icon i {
    font-size: 2.2rem;
    color: var(--primary);
    opacity: 0.25;
}

.home-proy-cta__title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--primary);
    margin: 0;
}

.home-proy-cta__desc {
    font-size: 0.78rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0;
    max-width: 240px;
}

.home-proy-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 1.1rem;
    background: var(--primary);
    color: #fff;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s, transform .15s;
}

.home-proy-cta__btn:hover {
    background: var(--primary-dark, #1a3a6e);
    transform: translateX(2px);
    color: #fff;
}

/* ── hist-link variant — compact, for use inside col heads ── */
.home-ind-hist-link--sm {
    padding: 0.2rem 0.55rem;
    font-size: 0.68rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* G2 solo — ancho completo */
.home-plan-charts__grid--solo {
    grid-template-columns: 1fr;
}

/* ── Zona D — Tabla km Línea + Participación Generación ─── */
.home-zone-d { margin-top: 1rem; }

.home-zone-d-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    align-items: start;
}

.home-zone-d-tbl,
.home-zone-d-chart {
    background: var(--white);
    border: 1px solid var(--neutral-line);
    border-radius: var(--radius);
    padding: 1rem 1.1rem 0.75rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.home-zone-d-title {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.75rem;
}

.home-tx-scroll { overflow-x: auto; }

.home-tx-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    white-space: nowrap;
}
.home-tx-table th {
    background: var(--surface-alt);
    color: var(--primary-dark);
    font-weight: 700;
    padding: 5px 8px;
    text-align: right;
    border-bottom: 2px solid #d0daea;
}
.home-tx-table th:first-child { text-align: left; }
.home-tx-table td {
    padding: 4px 8px;
    text-align: right;
    border-bottom: 1px solid var(--neutral-line);
    color: var(--text-secondary);
}
.home-tx-table td:first-child { text-align: left; color: var(--text-primary); font-weight: 600; }
.home-tx-table tr:last-child td { border-bottom: none; }
.home-tx-table tr:hover td { background: var(--surface-alt); }
.home-tx-total td { font-weight: 700; background: var(--surface-alt); color: var(--primary-dark) !important; }

.home-tx-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 1024px) {
    .home-trizone-grid                  { grid-template-columns: 1fr 1fr; grid-template-rows: none; gap: 1rem; }
    .home-trizone-col                   { display: flex; flex-direction: column; grid-row: auto; }
    .home-trizone-col--empty            { display: none; }
    .home-zone-d-grid                   { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .cndc-hero__grid                    { grid-template-columns: 1fr; }
    .cndc-hero__kpis                    { display: none; }
    .home-trizone-grid                  { grid-template-columns: 1fr; grid-template-rows: none; gap: 1rem; }
    .home-trizone-col                   { display: flex; flex-direction: column; grid-row: auto; }
    .home-trizone-col--empty            { display: none; }
    .home-zone-d-grid                   { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .home-ind-grid               { grid-template-columns: 1fr; }
    .home-ind-kpi__val           { font-size: 1.75rem; }
    .home-rt-2col                { grid-template-columns: 1fr; }
    .home-plan-charts__grid      { grid-template-columns: 1fr; }
    .home-zone                   { padding: 1.5rem 1rem; }
    .home-rt-toggle__lbl         { display: none; }
    .home-rt-etab                { padding: 0.4rem 0.6rem; font-size: 0.78rem; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CONTACTO
   ═══════════════════════════════════════════════════════════════════════════ */

.cndc-contacto-page { padding: 2.5rem 0 4rem; }

.cndc-contacto-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 2.5rem;
    align-items: start;
}

/* Cards info ────────────────────────────────────────────────────────────── */
.cndc-contacto-info {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.cndc-contacto-card {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
}
.cndc-contacto-card__icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--primary, #003B6E);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    flex-shrink: 0;
}
.cndc-contacto-card h3 {
    margin: 0 0 0.25rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.cndc-contacto-card p {
    margin: 0;
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.5;
}
.cndc-contacto-card a {
    color: var(--primary, #003B6E);
    text-decoration: none;
}
.cndc-contacto-card a:hover { text-decoration: underline; }

/* Formulario ────────────────────────────────────────────────────────────── */
.cndc-contacto-form-wrap h2 {
    margin: 0 0 0.35rem;
    font-size: 1.4rem;
    color: var(--primary, #003B6E);
}
.cndc-contacto-form-intro {
    margin: 0 0 1.5rem;
    color: var(--text-secondary);
    font-size: 0.92rem;
}
.cndc-contacto-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.cndc-form-row { display: flex; gap: 1rem; }
.cndc-form-row--2 > * { flex: 1; min-width: 0; }
.cndc-form-group {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.cndc-form-group label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
}
.cndc-form-group label span { color: #e63946; margin-left: 1px; }
.cndc-form-group input,
.cndc-form-group select,
.cndc-form-group textarea {
    padding: 0.55rem 0.85rem;
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    color: var(--text-primary);
    background: var(--surface-card);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.cndc-form-group input:focus,
.cndc-form-group select:focus,
.cndc-form-group textarea:focus {
    outline: none;
    border-color: var(--primary, #003B6E);
    box-shadow: 0 0 0 3px rgba(0,59,110,0.1);
}
.cndc-form-group textarea { resize: vertical; min-height: 120px; }

.cndc-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.cndc-form-required {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0;
}
.cndc-form-required span { color: #e63946; }

.cndc-form-feedback {
    padding: 0.875rem 1.1rem;
    border-radius: 6px;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.cndc-form-feedback--ok  { background: rgba(22,163,74,.1); color: #15803d; border: 1px solid rgba(22,163,74,.25); }
.cndc-form-feedback--err { background: rgba(220,38,38,.08); color: #b91c1c; border: 1px solid rgba(220,38,38,.2); }

/* Footer email link */
.cndc-footer__contact a {
    color: inherit;
    text-decoration: none;
}
.cndc-footer__contact a:hover { text-decoration: underline; }

@media (max-width: 768px) {
    .cndc-contacto-layout { grid-template-columns: 1fr; }
    .cndc-form-row--2     { flex-direction: column; }
}

/* Sistemas de Gestión — tarjetas ────────────────────────────────────────── */
.cndc-sg-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-top: 1.5rem;
}
.cndc-sg-card {
    border: 1px solid var(--neutral-line);
    border-radius: 10px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background: var(--surface-card);
    transition: box-shadow 0.2s;
}
.cndc-sg-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

.cndc-sg-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cndc-sg-card__badge {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.6rem;
    border-radius: 20px;
}
.cndc-sg-card__badge--quality { background: #dcfce7; color: #15803d; }
.cndc-sg-card__badge--safety  { background: rgba(133,77,14,.1); color: #854d0e; }
.cndc-sg-card__badge--inspec  { background: rgba(29,78,216,.1); color: #1d4ed8; }

.cndc-sg-card__icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    background: var(--surface-alt);
    color: var(--text-secondary);
}
.cndc-sg-card h3 {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary, #003B6E);
    margin: 0;
    line-height: 1.35;
}
.cndc-sg-card p {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.6;
    flex: 1;
}
.cndc-sg-card__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: none;
    border: 1px solid var(--primary, #003B6E);
    color: var(--primary, #003B6E);
    border-radius: 6px;
    padding: 0.45rem 0.9rem;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    align-self: flex-start;
    transition: background 0.15s, color 0.15s;
}
.cndc-sg-card__btn:hover {
    background: var(--primary, #003B6E);
    color: #fff;
}

/* Modal de texto (Sistemas de Gestión) ──────────────────────────────────── */
.org-modal__box--text  { width: min(700px, 94vw); }
.org-modal__body--text {
    padding: 1.5rem 2rem;
    overflow-y: auto;
    max-height: calc(85vh - 60px);
    font-size: 0.92rem;
    line-height: 1.7;
    color: var(--text-primary);
}
.org-modal__body--text h4 {
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--primary, #003B6E);
    margin: 1.5rem 0 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid var(--neutral-line);
}
.org-modal__body--text ul {
    padding-left: 1.25rem;
    margin: 0.5rem 0 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.org-modal__body--text li { color: var(--text-secondary); }

.sg-intro { margin-bottom: 0.5rem; }
.sg-intro p { margin: 0.75rem 0 0; }
.sg-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
}
.sg-badge--quality { background: #dcfce7; color: #15803d; }
.sg-badge--safety  { background: rgba(133,77,14,.1); color: #854d0e; }
.sg-badge--inspec  { background: rgba(29,78,216,.1); color: #1d4ed8; }

/* Encabezado página individual sistema de gestión */
.cndc-sg-page-head {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    margin-top: 0.5rem;
}
.cndc-sg-page-head__icon {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--primary, #003B6E);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}
.cndc-sg-page-head p {
    margin: 0.6rem 0 0;
    color: var(--text-secondary);
    line-height: 1.7;
    text-align: justify;
}

/* Certificado */
.cndc-sg-certificado {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}
.cndc-sg-certificado__wrap {
    position: relative;
    display: inline-block;
    max-width: 480px;
    width: 100%;
}
.cndc-sg-certificado__img {
    display: block;
    max-width: 480px;
    width: 100%;
    border: 1px solid var(--neutral-line);
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}
.cndc-sg-certificado__shield {
    position: absolute;
    inset: 0;
    border-radius: 8px;
    cursor: default;
    -webkit-user-select: none;
    user-select: none;
}
.cndc-sg-certificado--pendiente .cndc-sg-certificado--pendiente__msg {
    display: flex !important;
    align-items: center;
    gap: 0.5rem;
    color: var(--neutral-mid);
    font-size: 0.9rem;
    padding: 1rem;
    border: 1px dashed var(--neutral-line);
    border-radius: 8px;
}
.cndc-sg-certificado--pendiente .cndc-sg-certificado__dl {
    display: none;
}

@media (max-width: 768px) {
    .cndc-sg-grid        { grid-template-columns: 1fr; }
    .cndc-sg-page-head   { flex-direction: column; }
    .cndc-sg-certificado__img { max-width: 100%; }
}

/* Botón organigrama inline */
.cndc-org-link {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 700;
    color: var(--primary, #003B6E);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    text-align: left;
}
.cndc-org-link:hover { text-decoration: underline; }
.cndc-org-link .fa-search-plus { font-size: 0.75em; opacity: 0.55; }

/* Modal organigrama */
.org-modal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.org-modal[hidden] { display: none; }

.org-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.72);
}
.org-modal__box {
    position: relative;
    z-index: 1;
    background: var(--surface-card);
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    max-width: 92vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.org-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--neutral-line);
    background: var(--surface-alt);
    flex-shrink: 0;
}
.org-modal__titulo {
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--primary, #003B6E);
}
.org-modal__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.org-modal__close {
    background: none;
    border: none;
    font-size: 1.1rem;
    color: var(--text-secondary);
    cursor: pointer;
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    line-height: 1;
}
.org-modal__close:hover { background: var(--surface-alt); color: var(--text-primary); }

.org-modal__body {
    overflow: auto;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.org-modal__body img {
    max-width: 100%;
    max-height: calc(90vh - 80px);
    object-fit: contain;
    display: block;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MEMORIAS ANUALES
   ═══════════════════════════════════════════════════════════════════════════ */

.cndc-memorias-page {
    padding: 2rem 0 4rem;
}

.mem-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1.5rem;
    align-items: start;
}
.mem-main {
    min-width: 0;
}

/* Sidebar ───────────────────────────────────────────────────────────────── */
.mem-sidebar {
    position: sticky;
    top: 5rem;
}

.mem-sidebar__title {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
    margin: 0 0 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.mem-year-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.mem-year-list__loading {
    font-size: 0.85rem;
    color: var(--text-muted);
    padding: 0.5rem 0;
}

.mem-year-btn {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    background: var(--surface-alt);
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s, border-color 0.15s;
}
.mem-year-btn:hover {
    background: var(--surface-alt);
    border-color: var(--text-muted);
}
.mem-year-btn--active {
    background: rgba(0,149,59,.06);
    border-color: var(--accent-green, #00A878);
}
.mem-year-btn__anio {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--primary, #003B6E);
    min-width: 2.8rem;
}
.mem-year-btn--active .mem-year-btn__anio {
    color: var(--accent-green, #00A878);
}
.mem-year-btn__label {
    font-size: 0.78rem;
    color: var(--text-secondary);
    flex: 1;
    line-height: 1.3;
}
.mem-year-btn__dl {
    color: var(--text-muted);
    font-size: 0.8rem;
    padding: 0.2rem 0.3rem;
    border-radius: 3px;
    transition: color 0.15s;
    text-decoration: none;
    flex-shrink: 0;
}
.mem-year-btn__dl:hover {
    color: var(--primary, #003B6E);
}

/* Combo gestiones anteriores ────────────────────────────────────────────── */
.mem-year-hist {
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--neutral-line);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.mem-year-hist__lbl {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
.mem-year-select {
    width: 100%;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--neutral-line);
    border-radius: 6px;
    font-size: 0.88rem;
    color: var(--text-primary);
    background: var(--surface-card);
    cursor: pointer;
    appearance: auto;
}
.mem-year-select:focus {
    outline: 2px solid var(--accent-green, #00A878);
    outline-offset: 1px;
    border-color: var(--accent-green, #00A878);
}

/* Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 700px) {
    .mem-layout {
        grid-template-columns: 1fr;
    }
    .mem-sidebar {
        position: static;
    }
    .mem-year-list {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .mem-year-btn {
        width: auto;
        padding: 0.45rem 0.75rem;
    }
    .mem-year-btn__label { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   DIAGRAMAS
   ═══════════════════════════════════════════════════════════════════════════ */

.cndc-diagramas-page {
    padding: 2rem 0 4rem;
}

/* Tabs ──────────────────────────────────────────────────────────────────── */
.diag-tabs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0;
    border-bottom: 2px solid var(--border-light, #e2e8f0);
}

.diag-tab {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-secondary);
    transition: color 0.2s, border-color 0.2s;
    white-space: nowrap;
}
.diag-tab:hover {
    color: var(--primary, #003B6E);
}
.diag-tab--active {
    color: var(--primary, #003B6E);
    border-bottom-color: var(--accent-green, #00A878);
}

/* Paneles ───────────────────────────────────────────────────────────────── */
.diag-panel {
    display: none;
}
.diag-panel--active {
    display: block;
}

/* Toolbar ───────────────────────────────────────────────────────────────── */
.diag-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--surface-alt);
    border: 1px solid var(--border-light, #e2e8f0);
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    margin-top: 1.25rem;
}

.diag-toolbar__info {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}
.diag-toolbar__nombre {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--primary, #003B6E);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 280px;
}
.diag-toolbar__fecha {
    font-size: 0.78rem;
    color: var(--text-secondary);
}

.diag-toolbar__actions {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.diag-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    background: var(--surface-card);
    border: 1px solid var(--neutral-line);
    border-radius: 4px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
}
.diag-btn:hover {
    background: var(--surface-alt);
    border-color: var(--plomo);
}
.diag-btn--secondary {
    color: var(--text-secondary);
}
.diag-btn--download {
    background: var(--primary, #003B6E);
    border-color: var(--primary, #003B6E);
    color: #fff;
}
.diag-btn--download:hover {
    background: var(--primary-light, #005A9E);
    border-color: var(--primary-light, #005A9E);
    color: #fff;
}
.diag-btn--dwg {
    background: #78350f;
    border-color: #78350f;
}
.diag-btn--dwg:hover {
    background: #92400e;
    border-color: #92400e;
}

.diag-zoom-val {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 3.2rem;
    text-align: center;
}
.diag-page-info {
    font-size: 0.82rem;
    color: var(--text-primary);
    white-space: nowrap;
}

/* Visor imagen ──────────────────────────────────────────────────────────── */
.diag-viewer {
    border: 1px solid var(--border-light, #e2e8f0);
    background: #0f172a;
    border-radius: 0 0 6px 6px;
    overflow: hidden;
    position: relative;
}

.diag-viewer--img {
    height: 70vh;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
}
.diag-viewer--img:active {
    cursor: grabbing;
}

.diag-img-wrap {
    transform-origin: center center;
    transition: none;
    cursor: grab;
    user-select: none;
}
.diag-img-wrap img {
    display: block;
    max-width: 100%;
    max-height: 65vh;
    object-fit: contain;
    user-select: none;
    pointer-events: none;
}

/* Visor PDF ─────────────────────────────────────────────────────────────── */
.diag-viewer--pdf,
#mem-viewer {
    min-height: 400px;
    max-height: 80vh;
    overflow: auto;
    padding: 1rem;
    cursor: grab;
    user-select: none;
}
.diag-viewer--pdf.is-dragging,
#mem-viewer.is-dragging {
    cursor: grabbing;
}
.diag-viewer--pdf canvas,
#mem-canvas {
    box-shadow: 0 2px 12px rgba(0,0,0,0.4);
    border-radius: 2px;
    display: block;
    margin: 0 auto;
}

/* Error ─────────────────────────────────────────────────────────────────── */
.diag-error {
    padding: 3rem 2rem;
    text-align: center;
    color: #f87171;
    font-size: 0.95rem;
}

/* Versiones anteriores ──────────────────────────────────────────────────── */
.diag-versions {
    margin-top: 1rem;
}
.diag-versions-detail summary {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-secondary);
    padding: 0.5rem 0;
    list-style: none;
    user-select: none;
}
.diag-versions-detail summary::-webkit-details-marker { display: none; }
.diag-versions-detail summary::before {
    content: '›';
    display: inline-block;
    transition: transform 0.2s;
    font-size: 1.1rem;
}
.diag-versions-detail[open] summary::before {
    transform: rotate(90deg);
}
.diag-versions-detail ul {
    list-style: none;
    padding: 0.5rem 0 0.5rem 1.5rem;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.diag-version-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--primary, #003B6E);
    text-decoration: none;
}
.diag-version-link:hover {
    text-decoration: underline;
}
.diag-version-fecha {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-left: 0.25rem;
}

/* Nota de actualización ─────────────────────────────────────────────────── */
.diag-update-note {
    margin-top: 2.5rem;
    padding: 0.875rem 1.25rem;
    background: rgba(0,93,185,.07);
    border: 1px solid rgba(0,93,185,.2);
    border-radius: 6px;
    font-size: 0.85rem;
    color: var(--primary);
    line-height: 1.6;
}
.diag-update-note code {
    background: rgba(0,93,185,.12);
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    font-size: 0.82rem;
}

/* Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .diag-tab span            { display: none; }
    .diag-tab                 { padding: 0.65rem 0.85rem; }
    .diag-toolbar             { flex-direction: column; align-items: flex-start; }
    .diag-toolbar__nombre     { max-width: 100%; }
    .diag-btn--dwg            { display: none; } /* ocultar DWG en móvil — muy específico */
    .diag-viewer--img         { height: 55vw; min-height: 260px; }
    .diag-viewer--pdf         { max-height: 70vh; }
}

/* ── Histórico SIN (nivel-2) ─────────────────────────────────────────────── */
.his-main                    { padding: 2rem 0 4rem; }
.his-header                  { margin-bottom: 1.75rem; padding: 0 1.5rem; }
.his-title                   { font-size: 1.5rem; font-weight: 700; color: var(--primary); margin: 0 0 0.4rem; }
.his-subtitle                { font-size: 0.95rem; color: var(--text-secondary); margin: 0; line-height: 1.5; }
.his-nav-back                { display: inline-flex; align-items: center; gap: 0.4rem; margin-bottom: 1.25rem;
                               padding: 0 1.5rem; font-size: 0.875rem; color: var(--text-secondary);
                               text-decoration: none; }
.his-nav-back:hover          { color: var(--primary); }

.his-tabs                    { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--neutral-line); margin-bottom: 1.25rem; }
.his-tab                     { background: none; border: none; border-bottom: 3px solid transparent;
                               margin-bottom: -2px; padding: 0.65rem 1.25rem; font-size: 0.92rem;
                               font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: color .15s, border-color .15s; }
.his-tab:hover               { color: var(--primary); }
.his-tab.active              { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }
.his-tab--disabled           { opacity: 0.45; cursor: not-allowed; }
.his-badge                   { font-style: normal; font-size: 0.72rem; font-weight: 600;
                               background: var(--surface-alt); color: var(--text-secondary); border-radius: 10px;
                               padding: 0.1rem 0.5rem; margin-left: 0.4rem; vertical-align: middle; }

.his-rango                   { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; padding: 0 1.5rem; }
.his-main .cndc-drill-hint   { padding-left: 1.5rem; }
.his-rango-btn               { background: var(--surface-alt); border: 1px solid var(--neutral-line); border-radius: 6px;
                               padding: 0.4rem 0.9rem; font-size: 0.82rem; font-weight: 600;
                               color: var(--text-secondary); cursor: pointer; transition: background .15s, color .15s; }
.his-rango-btn:hover         { background: var(--neutral-line); }
.his-rango-btn.active        { background: var(--primary); color: #fff; border-color: var(--primary); }

.home-ind-hist-link--disabled{ background: var(--surface-alt); border-color: var(--neutral-line); color: var(--text-muted); pointer-events: none; }

.his-back                    { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.his-back-btn                { background: none; border: 1px solid var(--neutral-line); border-radius: 6px;
                               padding: 0.4rem 0.9rem; font-size: 0.85rem; font-weight: 600;
                               color: var(--primary); cursor: pointer; transition: background .15s; }
.his-back-btn:hover          { background: var(--surface-alt); }
.his-detalle-label           { font-size: 0.9rem; font-weight: 700; color: var(--text-secondary); }

.his-chart-wrap              { position: relative; min-height: 300px; }
.his-chart                   { width: 100%; }
.his-loading                 { display: flex; align-items: center; justify-content: center;
                               min-height: 440px; color: var(--text-muted); font-size: 0.9rem; }
.his-error                   { padding: 1.5rem; background: rgba(220,38,38,.08); color: #991b1b;
                               border-radius: 8px; font-size: 0.9rem; }

@media (max-width: 640px) {
    .his-tabs                { gap: 0; overflow-x: auto; }
    .his-tab                 { padding: 0.55rem 0.85rem; font-size: 0.82rem; white-space: nowrap; }
    .his-rango               { flex-wrap: wrap; }
}
}