/* =====================================================================
   Ekklesia · Fase 6: dashboards, gráficos y reportes
   Mismos tokens que ekklesia.css (var(--ek-*)): ningún hex. La hoja de
   impresión toma el tema claro de Tokens.cs (VistaImpresion lo publica).
   ===================================================================== */

/* ---------- Gráficos (SVG propios; colores por variable del tema) ---------- */
.ek-grafico { margin: 0; display: grid; gap: 12px; }
.ek-grafico__lienzo { position: relative; width: 100%; min-width: 0; }
.ek-grafico__lienzo svg { display: block; overflow: visible; }
.ek-grafico__rejilla { stroke: var(--ek-borde-sutil); stroke-width: 1; shape-rendering: crispEdges; }
.ek-grafico__cero { stroke: var(--ek-borde-fuerte); stroke-width: 1; shape-rendering: crispEdges; }
.ek-grafico__eje { fill: var(--ek-texto-secundario); font-size: 11px; font-variant-numeric: tabular-nums; }
.ek-grafico__eje--destacado { fill: var(--ek-texto); font-weight: 600; }
.ek-grafico__foco { fill: var(--ek-hover); }
.ek-grafico__barra {
    fill: var(--ek-g-color); transform-box: fill-box; transform-origin: bottom;
    animation: ek-crecer 520ms cubic-bezier(0.2, 0, 0, 1) both; transition: opacity var(--ek-transicion);
}
.ek-grafico__barra--negativa { transform-origin: top; }
.ek-grafico__barra--atenuada { opacity: 0.35; }
.ek-grafico__linea {
    fill: none; stroke: var(--ek-g-color); stroke-width: 2.25; stroke-linejoin: round; stroke-linecap: round;
    stroke-dasharray: 1; stroke-dashoffset: 1; animation: ek-trazar 900ms 200ms cubic-bezier(0.2, 0, 0, 1) forwards;
}
.ek-grafico__punto { fill: var(--ek-superficie); stroke: var(--ek-g-color); stroke-width: 2; }
.ek-grafico__punto--activo { fill: var(--ek-g-color); }
.ek-grafico__zona { fill: transparent; cursor: pointer; outline: none; }
.ek-grafico__zona:focus-visible { stroke: var(--ek-primario); stroke-width: 2; stroke-opacity: 0.6; }
.ek-grafico__tooltip {
    position: absolute; z-index: 5; min-width: 188px; max-width: 260px; padding: 10px 12px; pointer-events: none;
    background: var(--ek-superficie-elevada); border: 1px solid var(--ek-borde); border-radius: 10px; box-shadow: var(--ek-sombra-elevada);
    font-size: 0.8125rem; display: grid; gap: 6px; animation: ek-aparecer 120ms ease-out;
}
.ek-grafico__tooltip-titulo { font-weight: 600; }
.ek-grafico__tooltip-fila { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; }
.ek-grafico__tooltip-nombre { color: var(--ek-texto-secundario); }
.ek-grafico__tooltip-valor { font-weight: 600; }
.ek-grafico__tooltip-pie { border-top: 1px solid var(--ek-borde-sutil); padding-top: 6px; color: var(--ek-texto-secundario); }
.ek-grafico__muestra { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 3px; background: var(--ek-g-color); }
.ek-grafico__muestra--linea { height: 3px; border-radius: 2px; width: 14px; }
.ek-grafico__leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-grafico__leyenda-item { display: inline-flex; align-items: center; gap: 6px; }
@keyframes ek-crecer { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes ek-trazar { to { stroke-dashoffset: 0; } }
@keyframes ek-aparecer { from { opacity: 0; transform: translateY(2px); } to { opacity: 1; transform: none; } }

/* Dona con leyenda */
.ek-dona { margin: 0; display: grid; grid-template-columns: minmax(140px, 176px) minmax(0, 1fr); gap: 20px; align-items: center; }
.ek-dona__grafico { position: relative; aspect-ratio: 1; }
.ek-dona__grafico svg { width: 100%; height: 100%; display: block; }
.ek-dona__pista { fill: none; stroke: var(--ek-hundido); stroke-width: 13; }
.ek-dona__porcion {
    fill: none; stroke: var(--ek-g-color); stroke-width: 13; cursor: pointer;
    transition: opacity var(--ek-transicion), stroke-width var(--ek-transicion); animation: ek-aparecer 400ms both;
}
.ek-dona__porcion--atenuada { opacity: 0.3; }
.ek-dona__porcion--activa { stroke-width: 16; }
.ek-dona__centro { position: absolute; inset: 22%; display: grid; place-content: center; text-align: center; gap: 2px; pointer-events: none; }
.ek-dona__centro-etiqueta { font-size: 0.75rem; color: var(--ek-texto-secundario); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.ek-dona__centro-valor { font-size: 1.375rem; font-weight: 600; letter-spacing: -0.02em; }
.ek-dona__leyenda { min-width: 0; }
.ek-dona__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ek-dona__item {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 10px; row-gap: 4px; align-items: center;
    padding: 8px 10px; border-radius: 8px; transition: background var(--ek-transicion); outline: none;
}
.ek-dona__item .ek-dona__barra { grid-column: 2; grid-row: 2; margin-top: 0; }
.ek-dona__item .ek-dona__porcentaje { grid-column: 3; grid-row: 2; }
.ek-dona__item:hover, .ek-dona__item--activo, .ek-dona__item:focus-visible { background: var(--ek-hover); }
.ek-dona__item:focus-visible { box-shadow: var(--ek-anillo-foco); }
.ek-dona__nombre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.875rem; }
.ek-dona__monto { font-size: 0.875rem; font-weight: 500; text-align: right; }
.ek-dona__porcentaje { font-size: 0.75rem; color: var(--ek-texto-secundario); text-align: right; }
.ek-dona__barra { grid-column: 2 / -1; height: 3px; border-radius: 2px; background: var(--ek-hundido); margin-top: 6px; overflow: hidden; }
.ek-dona__barra > span { display: block; height: 100%; border-radius: 2px; background: var(--ek-g-color); transition: width 500ms cubic-bezier(0.2, 0, 0, 1); }
@media (max-width: 599.98px) {
    .ek-dona { grid-template-columns: 1fr; justify-items: center; gap: 16px; }
    .ek-dona__grafico { width: min(200px, 60vw); }
    .ek-dona__leyenda { width: 100%; }
}

/* Minigráfico */
.ek-minigrafico { display: block; width: 100%; height: 36px; margin-top: 4px; }
.ek-minigrafico__linea { fill: none; stroke: var(--ek-g-color); stroke-width: 1.75; }
.ek-minigrafico__area { fill: var(--ek-g-color); opacity: 0.1; }

/* ---------- KPI: variación y minigráfico ---------- */
.ek-rejilla-kpi--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ek-rejilla-kpi--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) { .ek-rejilla-kpi--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .ek-rejilla-kpi--3 { grid-template-columns: 1fr; } }
@media (max-width: 479.98px) { .ek-rejilla-kpi--4 { grid-template-columns: 1fr; gap: 12px; } }
.ek-kpi { position: relative; align-content: start; height: 100%; box-sizing: border-box; }
.ek-kpi__icono-caja {
    display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px;
    background: var(--ek-tinte-primario); color: var(--ek-primario);
}
.ek-kpi__icono-caja--ingreso { background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
.ek-kpi__icono-caja--egreso { background: var(--ek-tinte-egreso); color: var(--ek-egreso); }
.ek-kpi__comparacion { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 22px; }
.ek-kpi__grafico { margin: 4px -4px -8px; width: calc(100% + 8px); }
.ek-kpi__valor { overflow-wrap: anywhere; }
.ek-rejilla-kpi--4 .ek-kpi__valor { font-size: clamp(1.25rem, 0.55rem + 1.05vw, 1.75rem); }
@media (max-width: 479.98px) { .ek-rejilla-kpi--4 .ek-kpi__valor { font-size: 1.75rem; } }
.ek-kpi--con-grafico { overflow: hidden; }
.ek-variacion {
    display: inline-flex; align-items: center; gap: 2px; height: 22px; padding: 0 8px 0 4px; border-radius: 999px;
    font-size: 0.75rem; font-weight: 600; white-space: nowrap;
}
.ek-variacion .mud-icon-root { font-size: 0.9375rem !important; }
.ek-variacion--buena { background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
.ek-variacion--mala { background: var(--ek-tinte-egreso); color: var(--ek-egreso); }
.ek-variacion--neutra { background: var(--ek-hover); color: var(--ek-texto-secundario); padding: 0 8px; }
.ek-actualizando { opacity: 0.72; transition: opacity var(--ek-transicion); }
.ek-widget-enlace { height: 100%; }

/* ---------- Inicio ---------- */
.ek-inicio__encabezado { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.ek-inicio__fecha { margin: 0 0 4px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario); }
.ek-inicio { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.ek-inicio__celda { grid-column: span 12; min-width: 0; display: flex; flex-direction: column; }
.ek-inicio__celda > * { flex: 1; }
.ek-inicio__celda--dostercios { grid-column: span 8; }
.ek-inicio__celda--tercio { grid-column: span 4; }
.ek-inicio__celda--mitad { grid-column: span 6; }
.ek-inicio__alerta { margin: 0; }
@media (max-width: 1199.98px) {
    .ek-inicio__celda--dostercios, .ek-inicio__celda--tercio { grid-column: span 12; }
}
@media (max-width: 899.98px) {
    .ek-inicio { gap: 16px; }
    .ek-inicio__celda--mitad { grid-column: span 12; }
}

/* Accesos rápidos */
.ek-atajos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.ek-atajo {
    display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; text-decoration: none; color: var(--ek-texto);
    background: var(--ek-superficie); border: 1px solid var(--ek-borde); border-radius: var(--ek-radio-tarjeta); box-shadow: var(--ek-sombra);
    transition: border-color var(--ek-transicion), transform var(--ek-transicion), box-shadow var(--ek-transicion);
}
.ek-atajo:hover { border-color: var(--ek-borde-fuerte); transform: translateY(-1px); box-shadow: var(--ek-sombra), 0 6px 16px -8px rgb(0 0 0 / 0.18); }
.ek-atajo:active { transform: none; }
.ek-atajo:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); border-color: var(--ek-primario); }
.ek-atajo__icono {
    display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 10px;
    background: var(--ek-hover); color: var(--ek-texto-secundario);
}
.ek-atajo--ingreso .ek-atajo__icono { background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
.ek-atajo--egreso .ek-atajo__icono { background: var(--ek-tinte-egreso); color: var(--ek-egreso); }
.ek-atajo--primario .ek-atajo__icono { background: var(--ek-tinte-primario); color: var(--ek-primario); }
.ek-atajo__textos { display: grid; min-width: 0; }
.ek-atajo__titulo { font-weight: 600; }
.ek-atajo__detalle { font-size: 0.75rem; color: var(--ek-texto-secundario); }
@media (max-width: 767.98px) {
    .ek-atajos { grid-template-columns: 1fr 1fr; gap: 8px; }
    .ek-atajo { min-height: 56px; padding: 10px 12px; gap: 10px; }
    .ek-atajo__icono { width: 36px; height: 36px; }
    .ek-atajo__detalle { display: none; }
}

/* Pendientes */
.ek-pendientes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.ek-pendiente {
    --ek-p-color: var(--ek-primario); --ek-p-tinte: var(--ek-tinte-primario);
    display: grid; gap: 6px; align-content: start; padding: 16px 18px; color: inherit; text-decoration: none; position: relative; overflow: hidden;
}
.ek-pendiente::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--ek-p-color); }
.ek-pendiente--advertencia { --ek-p-color: var(--ek-advertencia); --ek-p-tinte: var(--ek-tinte-advertencia); }
.ek-pendiente--egreso { --ek-p-color: var(--ek-egreso); --ek-p-tinte: var(--ek-tinte-egreso); }
.ek-pendiente--ingreso { --ek-p-color: var(--ek-ingreso); --ek-p-tinte: var(--ek-tinte-ingreso); }
.ek-pendiente:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-pendiente__cabecera { display: flex; align-items: center; gap: 8px; }
.ek-pendiente__icono { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--ek-p-tinte); color: var(--ek-p-color); }
.ek-pendiente__titulo { font-size: 0.875rem; font-weight: 500; color: var(--ek-texto-secundario); }
.ek-pendiente__cifra { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.ek-pendiente__cantidad { font-size: 1.75rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; }
.ek-pendiente__monto { font-size: 0.875rem; color: var(--ek-texto-secundario); }
.ek-pendiente__detalle { font-size: 0.8125rem; color: var(--ek-texto-secundario); overflow-wrap: anywhere; }
.ek-pendiente__accion { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 0.8125rem; font-weight: 600; color: var(--ek-p-color); }
.ek-pendiente__accion .mud-icon-root { transition: transform var(--ek-transicion); }
.ek-pendiente:hover .ek-pendiente__accion .mud-icon-root { transform: translateX(2px); }
.ek-al-dia { display: flex; align-items: center; gap: 14px; padding: 16px 20px; }
.ek-al-dia__icono { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
.ek-al-dia__titulo { font-weight: 600; }

/* Resumen financiero */
.ek-indicadores { display: grid; gap: 12px; }
.ek-indicadores__barra { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ek-indicadores__titulo { margin: 0; font-size: 1.0625rem; font-weight: 600; letter-spacing: -0.01em; }
.ek-indicadores__subtitulo { margin: 2px 0 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); min-height: 1.2em; }
.ek-indicadores__controles { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ek-indicadores__nota { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-en-vivo { display: inline-flex; align-items: center; gap: 6px; font-size: 0.75rem; font-weight: 500; color: var(--ek-texto-secundario); white-space: nowrap; }
.ek-en-vivo__punto { width: 8px; height: 8px; border-radius: 999px; background: var(--ek-texto-terciario); }
.ek-en-vivo--activo { color: var(--ek-ingreso); }
.ek-en-vivo--activo .ek-en-vivo__punto { background: var(--ek-ingreso); animation: ek-latido 2s ease-out infinite; }
@keyframes ek-latido {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--ek-ingreso) 45%, transparent); }
    70% { box-shadow: 0 0 0 7px transparent; }
    100% { box-shadow: 0 0 0 0 transparent; }
}
@media (max-width: 767.98px) {
    .ek-indicadores__controles { width: 100%; justify-content: space-between; flex-direction: row-reverse; }
    .ek-indicadores__controles .ek-selector-rango { flex: 1; }
}

/* ---------- Panel (tarjeta con encabezado) ---------- */
.ek-panel { display: flex; flex-direction: column; min-width: 0; }
.ek-panel__cabecera { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px 0; flex-wrap: wrap; }
.ek-panel__titulos { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.ek-panel__icono {
    display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 8px;
    background: var(--ek-hundido); color: var(--ek-texto-secundario); border: 1px solid var(--ek-borde-sutil);
}
.ek-panel__titulo { margin: 0; font-size: 0.9375rem; font-weight: 600; letter-spacing: -0.005em; line-height: 1.35; }
.ek-panel__subtitulo { margin: 2px 0 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-panel__enlace {
    display: inline-flex; align-items: center; gap: 4px; font-size: 0.8125rem; font-weight: 600; color: var(--ek-primario);
    text-decoration: none; border-radius: 6px; padding: 4px 6px; margin: -4px -6px; white-space: nowrap;
}
.ek-panel__enlace:hover { background: var(--ek-tinte-primario); }
.ek-panel__enlace:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-panel__cuerpo { padding: 16px 20px 20px; flex: 1; min-width: 0; }
.ek-panel__cuerpo--sin-relleno { padding: 8px 0 4px; }
.ek-inicio__alto .ek-panel__cuerpo { display: flex; flex-direction: column; }
.ek-segmentos--compacto .ek-segmentos__opcion { min-height: 30px; padding: 0 10px; font-size: 0.8125rem; }
.ek-esqueleto--plano .ek-tarjeta { border: 0; box-shadow: none; background: transparent; }
@media (max-width: 767.98px) {
    .ek-panel__cabecera { padding: 16px 16px 0; }
    .ek-panel__cuerpo { padding: 14px 16px 16px; }
    .ek-panel__accion { width: 100%; }
    .ek-panel__accion .ek-segmentos { display: flex; width: 100%; box-sizing: border-box; }
    .ek-panel__accion .ek-segmentos__opcion { flex: 1; min-height: 40px; }
}

/* Listas con barra de participación (cuentas, fondos) */
.ek-barras-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.ek-barras-lista__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: center; }
.ek-barras-lista__nombre { display: inline-flex; align-items: center; gap: 8px; min-width: 0; font-size: 0.875rem; font-weight: 500; }
.ek-barras-lista__nombre > span:not(.ek-punto):not(.ek-chip) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-barras-lista__tipo { font-size: 0.75rem; font-weight: 400; color: var(--ek-texto-secundario); }
.ek-barras-lista__monto { font-weight: 600; font-size: 0.875rem; }
.ek-barras-lista__barra { grid-column: 1 / -1; height: 6px; border-radius: 999px; background: var(--ek-hundido); overflow: hidden; }
.ek-barras-lista__barra > span {
    display: block; height: 100%; border-radius: 999px; background: var(--ek-serie, var(--ek-primario));
    transition: width 600ms cubic-bezier(0.2, 0, 0, 1);
}
.ek-barras-lista__total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--ek-borde-sutil); font-weight: 600; }
.ek-chip--pequeno { height: 20px; padding: 0 8px; font-size: 0.6875rem; }

/* Movimientos recientes */
.ek-recientes { list-style: none; margin: 0; padding: 0; }
.ek-reciente {
    display: grid; grid-template-columns: auto minmax(0, 1fr) 72px minmax(128px, auto); align-items: center; gap: 12px;
    padding: 10px 20px; color: inherit; text-decoration: none; border-top: 1px solid var(--ek-borde-sutil); transition: background var(--ek-transicion);
}
.ek-recientes li:first-child .ek-reciente { border-top: 0; }
.ek-reciente:hover { background: var(--ek-hover); }
.ek-reciente:focus-visible { outline: none; box-shadow: inset var(--ek-anillo-foco); }
.ek-reciente__textos { display: grid; min-width: 0; }
.ek-reciente__titulo { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-reciente__meta { font-size: 0.75rem; color: var(--ek-texto-secundario); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-reciente__monto { font-weight: 600; text-align: right; }
.ek-reciente__marca { display: flex; justify-content: flex-end; }
.ek-reciente--anulado .ek-reciente__titulo { color: var(--ek-texto-secundario); }
@media (max-width: 767.98px) {
    .ek-reciente { grid-template-columns: auto minmax(0, 1fr) auto; padding: 10px 16px; gap: 10px; }
    .ek-reciente__marca { display: none; }
}

/* ---------- Selector de rango ---------- */
.ek-selector-rango { position: relative; display: inline-flex; min-width: 0; }
.ek-selector-rango__boton {
    display: inline-flex; align-items: center; gap: 10px; min-height: 44px; width: 100%; padding: 4px 12px; text-align: left;
    border: 1px solid var(--ek-borde-fuerte); border-radius: var(--ek-radio); background: var(--ek-superficie); color: var(--ek-texto);
    font: inherit; cursor: pointer; transition: border-color var(--ek-transicion), background var(--ek-transicion);
}
.ek-selector-rango__boton:hover { border-color: var(--ek-texto-terciario); }
.ek-selector-rango__boton:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-selector-rango__boton > .mud-icon-root:first-child { color: var(--ek-texto-secundario); }
.ek-selector-rango__textos { display: grid; flex: 1; min-width: 0; line-height: 1.25; }
.ek-selector-rango__etiqueta { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario); }
.ek-selector-rango__valor { font-size: 0.875rem; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ek-selector-rango__flecha { color: var(--ek-texto-secundario); }
.ek-selector-rango__panel { margin-top: 6px; }
.ek-selector-rango__panel.mud-popover { z-index: 1200 !important; }
.ek-selector-rango__contenido { display: grid; grid-template-columns: 220px 240px; width: max-content; max-width: calc(100vw - 32px); }
.ek-selector-rango__atajos { display: grid; align-content: start; gap: 2px; padding: 8px; border-right: 1px solid var(--ek-borde-sutil); }
.ek-selector-rango__atajo {
    display: grid; gap: 1px; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--ek-texto);
    font: inherit; text-align: left; cursor: pointer; transition: background var(--ek-transicion);
}
.ek-selector-rango__atajo:hover { background: var(--ek-hover); }
.ek-selector-rango__atajo:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-selector-rango__atajo--activo, .ek-selector-rango__atajo--activo:hover { background: var(--ek-tinte-primario); color: var(--ek-primario); font-weight: 600; }
.ek-selector-rango__atajo-rango { font-size: 0.75rem; font-weight: 400; color: var(--ek-texto-secundario); }
.ek-selector-rango__personalizado { display: grid; align-content: start; gap: 12px; padding: 14px 16px 16px; }
.ek-selector-rango__subtitulo { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario); }
.ek-selector-rango__personalizado .mud-input-control { margin: 0; }
.ek-capa-cierre { position: fixed; inset: 0; z-index: 1100; background: transparent; }
@media (max-width: 599.98px) {
    .ek-selector-rango__contenido { grid-template-columns: 1fr; width: calc(100vw - 32px); }
    .ek-selector-rango__atajos { grid-template-columns: 1fr 1fr; border-right: 0; border-bottom: 1px solid var(--ek-borde-sutil); }
}

/* ---------- Reportes: página central y marco ---------- */
.ek-rejilla-reportes { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.ek-reporte-tarjeta { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 14px; padding: 20px; color: inherit; text-decoration: none; }
.ek-reporte-tarjeta:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); border-color: var(--ek-primario); }
.ek-reporte-tarjeta__icono { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--ek-tinte-primario); color: var(--ek-primario); }
.ek-reporte-tarjeta__textos { display: grid; gap: 4px; min-width: 0; }
.ek-reporte-tarjeta__titulo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 1rem; font-weight: 600; letter-spacing: -0.005em; }
.ek-reporte-tarjeta__descripcion { font-size: 0.875rem; color: var(--ek-texto-secundario); }
.ek-reporte-tarjeta__formatos { display: flex; gap: 6px; margin-top: 6px; }
.ek-reporte-tarjeta__formatos span {
    font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.04em; padding: 2px 8px; border-radius: 6px;
    background: var(--ek-hundido); border: 1px solid var(--ek-borde-sutil); color: var(--ek-texto-secundario);
}
.ek-reporte-tarjeta__privado .mud-icon-root { font-size: 0.875rem !important; margin-right: 2px; }
.ek-reporte-tarjeta .ek-catalogo-tarjeta__flecha { align-self: center; transition: transform var(--ek-transicion); }
.ek-reporte-tarjeta:hover .ek-catalogo-tarjeta__flecha { transform: translateX(3px); color: var(--ek-texto-secundario); }

.ek-reporte__exportar { display: flex; gap: 8px; }
.ek-reporte__filtros {
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 20px; padding: 12px;
    background: var(--ek-hundido); border: 1px solid var(--ek-borde-sutil); border-radius: var(--ek-radio-tarjeta);
}
.ek-reporte__filtros .mud-input-control { margin: 0; }
.ek-reporte__filtros .ek-filtro { flex: 0 1 220px; min-width: 160px; }
.ek-reporte__filtros .ek-filtro--ancho { flex: 1 1 280px; }
.ek-reporte__filtros .mud-input.mud-input-outlined { background: var(--ek-superficie); }
.ek-reporte__contenido { display: grid; gap: 20px; animation: ek-aparecer 200ms ease-out; }
.ek-reporte__cargando { display: grid; gap: 16px; }
@media (max-width: 767.98px) {
    .ek-reporte__exportar-movil, .ek-reporte__exportar-movil .mud-menu-activator { width: 100%; }
    .ek-reporte__filtros { padding: 10px; gap: 10px; }
    .ek-reporte__filtros > * { flex: 1 1 100% !important; max-width: none !important; }
    .ek-reporte__filtros .ek-selector-rango { width: 100%; }
    .ek-reporte__contenido { gap: 16px; }
}

/* ---------- Hoja de impresión de reportes ("Guardar como PDF": Web y Android) ---------- */
.ek-impresion { display: none; }
@media print {
    @page { size: letter; margin: 14mm 13mm 16mm; }
    @page horizontal { size: letter landscape; }
    body:has(.ek-impresion) .ek-shell,
    body:has(.ek-impresion) .mud-popover-provider,
    body:has(.ek-impresion) .mud-snackbar-provider,
    body:has(.ek-impresion) #blazor-error-ui { display: none !important; }
    .ek-impresion {
        display: block; background: var(--ek-superficie); color: var(--ek-texto); font-size: 9.5pt; line-height: 1.45;
        -webkit-print-color-adjust: exact; print-color-adjust: exact;
    }
    .ek-impresion--horizontal { page: horizontal; }
}
.ek-impresion__encabezado { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.ek-impresion__iglesia { display: flex; align-items: center; gap: 12px; }
.ek-impresion__logo { width: 44px; height: 44px; object-fit: contain; border-radius: 8px; }
.ek-impresion__inicial {
    display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; font-size: 18pt; font-weight: 700;
    background: var(--ek-primario); color: var(--ek-sobre-primario);
}
.ek-impresion__nombre { font-size: 12.5pt; font-weight: 600; }
.ek-impresion__meta { font-size: 8.5pt; color: var(--ek-texto-secundario); }
.ek-impresion__titulos { text-align: right; }
.ek-impresion__titulo { margin: 0; font-size: 15pt; font-weight: 600; letter-spacing: -0.01em; }
.ek-impresion__titulo--constancia { margin: 28px 0 20px; text-align: center; font-size: 15pt; letter-spacing: 0.06em; }
.ek-impresion__subtitulo { font-size: 9pt; color: var(--ek-texto-secundario); }
.ek-impresion__emision { margin: 10px 0 16px; padding-bottom: 6px; border-bottom: 1px solid var(--ek-borde); font-size: 8pt; color: var(--ek-texto-secundario); }
.ek-impresion__indicadores { display: flex; gap: 8px; margin-bottom: 16px; break-inside: avoid; }
.ek-impresion__indicador { flex: 1; padding: 8px 10px; background: var(--ek-hundido); border: 1px solid var(--ek-borde); border-radius: 6px; }
.ek-impresion__indicador-etiqueta { font-size: 7pt; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ek-texto-secundario); }
.ek-impresion__indicador-valor { margin-top: 2px; font-size: 13pt; font-weight: 600; font-variant-numeric: tabular-nums; }
.ek-impresion__indicador-detalle { font-size: 7.5pt; color: var(--ek-texto-secundario); }
.ek-impresion__seccion { margin-bottom: 16px; }
.ek-impresion__seccion-titulo { margin: 0 0 6px; font-size: 10.5pt; font-weight: 600; }
.ek-impresion__tabla { width: 100%; border-collapse: collapse; table-layout: fixed; }
.ek-impresion__tabla thead { display: table-header-group; }
.ek-impresion__tabla tr { break-inside: avoid; }
.ek-impresion__tabla th {
    padding: 5px 6px; text-align: left; font-size: 7pt; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    color: var(--ek-texto-secundario); background: var(--ek-hundido); border-bottom: 1px solid var(--ek-borde);
}
.ek-impresion__tabla td { padding: 4px 6px; border-bottom: 0.5px solid var(--ek-borde-sutil); vertical-align: top; overflow-wrap: anywhere; }
.ek-impresion__num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ek-impresion__fila--grupo td { background: var(--ek-hundido); font-weight: 600; }
.ek-impresion__fila--detalle td:first-child { padding-left: 18px; }
.ek-impresion__fila--subtotal td { font-weight: 600; border-top: 1px solid var(--ek-borde); }
.ek-impresion__fila--total td { font-weight: 600; border-top: 1.5px solid var(--ek-borde-fuerte); border-bottom: 0; }
.ek-impresion__fila--anulada td { color: var(--ek-texto-secundario); }
.ek-impresion__fila--anulada td.ek-impresion__num { text-decoration: line-through; }
.ek-impresion--ingreso { color: var(--ek-ingreso); }
.ek-impresion--egreso { color: var(--ek-egreso); }
.ek-impresion--advertencia { color: var(--ek-advertencia); }
.ek-impresion--atenuado { color: var(--ek-texto-secundario); }
.ek-impresion__parrafo { margin: 0 0 12px; font-size: 10.5pt; line-height: 1.6; }
.ek-impresion__parrafo--destacado { font-weight: 600; }
.ek-impresion__nota { margin: -8px 0 14px; font-size: 8pt; font-style: italic; color: var(--ek-texto-secundario); }
.ek-impresion__firmas { display: flex; gap: 48px; margin-top: 64px; break-inside: avoid; }
.ek-impresion__firma { flex: 1; text-align: center; }
.ek-impresion__firma-linea { border-top: 1px solid var(--ek-texto); margin-bottom: 4px; }
.ek-impresion__firma-nombre { font-weight: 600; }
.ek-impresion__pie { margin-top: 24px; padding-top: 6px; border-top: 0.5px solid var(--ek-borde); font-size: 7.5pt; color: var(--ek-texto-secundario); }
.ek-impresion--constancia { font-size: 10.5pt; }

/* ---------- Piezas comunes de los reportes ---------- */
.ek-reporte__contexto { display: flex; align-items: center; gap: 6px; margin: -4px 0 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-filtro-interruptor { margin: 0 4px; }
.ek-filtro-interruptor .mud-typography { font-size: 0.875rem; }

.ek-reporte__nota { margin: -8px 0 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-panel__vacio { margin: 0; padding: 12px 20px 16px; color: var(--ek-texto-secundario); font-size: 0.875rem; }
.ek-columnas--reporte { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 20px; }
.ek-barras-lista__nota { grid-column: 1 / -1; font-size: 0.75rem; color: var(--ek-texto-secundario); margin-top: -2px; }

/* Chips de filtro (fechas frecuentes, años) */
.ek-chips-filtro { display: flex; flex-wrap: wrap; gap: 6px; }
.ek-chip-filtro {
    display: inline-flex; align-items: center; gap: 4px; min-height: 36px; padding: 0 14px; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--ek-borde-fuerte); background: var(--ek-superficie); color: var(--ek-texto); font: inherit; font-size: 0.875rem; font-weight: 500;
    font-variant-numeric: tabular-nums; transition: background var(--ek-transicion), border-color var(--ek-transicion), color var(--ek-transicion);
}
.ek-chip-filtro:hover:not(:disabled) { border-color: var(--ek-texto-terciario); }
.ek-chip-filtro:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-chip-filtro--activo, .ek-chip-filtro--activo:hover:not(:disabled) { background: var(--ek-tinte-primario); border-color: var(--ek-primario); color: var(--ek-primario); }
.ek-chip-filtro:disabled { opacity: 0.45; cursor: not-allowed; }
.ek-chip-filtro .mud-icon-root { font-size: 1rem !important; }

/* Tablas de reportes */
.ek-tabla-contenedor--libre { max-height: none; }
.ek-tabla-contenedor--plano { border: 0; border-radius: 0; box-shadow: none; }
.ek-tabla__destacado { font-weight: 600; }
.ek-tabla__fila--futura td { color: var(--ek-texto-secundario); }
.ek-tabla__fila--futura .ek-monto { color: var(--ek-texto-secundario) !important; }
.ek-tabla__fila--apertura td { background: var(--ek-hundido); }
.ek-tabla__fila--anulada td { color: var(--ek-texto-secundario); }
.ek-tabla--matriz th, .ek-tabla--matriz td { white-space: nowrap; }
.ek-tabla__matriz-nombre { font-weight: 500; text-align: left; position: sticky; left: 0; background: var(--ek-superficie); z-index: 1; }
.ek-tabla--matriz thead th:first-child { position: sticky; left: 0; z-index: 2; }
.ek-tabla--matriz .ek-tabla__num { min-width: 120px; }

/* Resumen en línea (diario) */
.ek-cifras-resumen { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; overflow: hidden; }
.ek-cifras-resumen > div { flex: 1 1 150px; padding: 14px 20px; border-right: 1px solid var(--ek-borde-sutil); }
.ek-cifras-resumen > div:last-child { border-right: 0; }
.ek-cifras-resumen dt { font-size: 0.75rem; font-weight: 500; color: var(--ek-texto-secundario); }
.ek-cifras-resumen dd { margin: 2px 0 0; font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }

/* Libro de cuenta */
.ek-libro-resumen { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding: 18px 20px; }
.ek-libro-resumen__cuenta { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ek-libro-resumen__icono { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--ek-tinte-primario); color: var(--ek-primario); }
.ek-libro-resumen__nombre { font-size: 1.0625rem; font-weight: 600; }
.ek-libro-resumen__cifras { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; }
.ek-libro-resumen__cifras dt { font-size: 0.75rem; color: var(--ek-texto-secundario); }
.ek-libro-resumen__cifras dd { margin: 0; font-weight: 600; }
.ek-libro-resumen__final dd { font-size: 1.25rem; }
.ek-libro__fecha { white-space: nowrap; }
.ek-libro__movimiento { display: grid; min-width: 0; color: inherit; text-decoration: none; border-radius: 4px; }
a.ek-libro__movimiento:hover .ek-libro__descripcion { text-decoration: underline; text-underline-offset: 3px; }
a.ek-libro__movimiento:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-libro__descripcion { font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.ek-libro__meta { font-size: 0.75rem; color: var(--ek-texto-secundario); }

/* Conciliación de saldos */
.ek-conciliacion { display: flex; gap: 16px; padding: 20px 24px; }
.ek-conciliacion__icono { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 12px; }
.ek-conciliacion--cuadra .ek-conciliacion__icono { background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
.ek-conciliacion--difiere .ek-conciliacion__icono { background: var(--ek-tinte-advertencia); color: var(--ek-advertencia); }
.ek-conciliacion__cuerpo { display: grid; gap: 6px; min-width: 0; }
.ek-conciliacion__titulo { margin: 0; font-size: 1rem; font-weight: 600; }
.ek-conciliacion__cuerpo p { margin: 0; max-width: 75ch; }
.ek-conciliacion__formula { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 14px; margin-top: 8px; font-weight: 600; }
.ek-conciliacion__formula > span { display: grid; }
.ek-conciliacion__formula small { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario); }
.ek-conciliacion__operador { color: var(--ek-texto-secundario); font-size: 1.125rem; }

/* Anulaciones y ajustes */
.ek-correcciones { list-style: none; margin: 0; padding: 0; }
.ek-correccion { display: grid; gap: 8px; padding: 16px 20px; border-top: 1px solid var(--ek-borde-sutil); }
.ek-correcciones li:first-child { border-top: 0; }
.ek-correccion__cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ek-correccion__titulo { font-weight: 600; color: var(--ek-texto); text-decoration: none; overflow-wrap: anywhere; }
.ek-correccion__titulo:hover { text-decoration: underline; text-underline-offset: 3px; }
.ek-correccion__titulo:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); border-radius: 4px; }
.ek-correccion__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-correccion .ek-linea-tiempo__motivo { margin: 0; }

/* Conteo por servicio */
.ek-servicios-conteo { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 520px), 1fr)); }
.ek-servicio-conteo { display: grid; gap: 14px; padding: 18px 20px; align-content: start; }
.ek-servicio-conteo--diferencia { border-color: color-mix(in srgb, var(--ek-advertencia) 45%, var(--ek-borde)); }
.ek-servicio-conteo__cabecera { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ek-servicio-conteo__titulo { font-size: 1rem; font-weight: 600; color: var(--ek-texto); text-decoration: none; }
.ek-servicio-conteo__titulo:hover { text-decoration: underline; text-underline-offset: 3px; }
.ek-servicio-conteo__total { display: grid; justify-items: end; gap: 4px; font-size: 1.125rem; font-weight: 600; }
.ek-servicio-conteo__total .ek-chip .mud-icon-root { font-size: 0.875rem !important; margin-right: 2px; }
.ek-servicio-conteo__conteos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ek-servicio-conteo__conteo { padding: 12px; }
.ek-servicio-conteo__conteo--aceptado { border-color: var(--ek-primario); box-shadow: inset 0 0 0 1px var(--ek-primario); }
.ek-servicio-conteo__contador { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-bottom: 8px; font-size: 0.8125rem; font-weight: 600; }
.ek-servicio-conteo__medios { display: grid; gap: 4px; margin: 0; font-size: 0.8125rem; }
.ek-servicio-conteo__medios > div { display: flex; justify-content: space-between; gap: 8px; }
.ek-servicio-conteo__medios dt { color: var(--ek-texto-secundario); }
.ek-servicio-conteo__medios dd { margin: 0; }
.ek-servicio-conteo__suma { border-top: 1px solid var(--ek-borde-sutil); padding-top: 4px; font-weight: 600; }
.ek-servicio-conteo__alternar {
    justify-self: start; display: inline-flex; align-items: center; gap: 4px; min-height: 36px; padding: 0 10px; margin-left: -10px;
    border: 0; border-radius: 8px; background: transparent; color: var(--ek-primario); font: inherit; font-size: 0.8125rem; font-weight: 600; cursor: pointer;
}
.ek-servicio-conteo__alternar:hover { background: var(--ek-tinte-primario); }
.ek-servicio-conteo__alternar:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-desglose { display: grid; gap: 2px; padding: 8px 12px; border-radius: var(--ek-radio); background: var(--ek-hundido); font-size: 0.8125rem; }
.ek-desglose__fila { display: grid; grid-template-columns: minmax(0, 1fr) 70px 120px; gap: 8px; padding: 3px 0; }
.ek-desglose__fila > span:not(:first-child) { text-align: right; }
@media (max-width: 479.98px) {
    .ek-servicio-conteo__conteos { grid-template-columns: 1fr; }
    .ek-servicio-conteo { padding: 16px; }
}

/* Ofrendas: mezcla de medios */
.ek-ofrenda__tipo { display: inline-flex; align-items: center; gap: 8px; }
.ek-mezcla { display: flex; height: 6px; margin-top: 8px; max-width: 220px; border-radius: 999px; overflow: hidden; background: var(--ek-hundido); gap: 2px; }
.ek-mezcla > span { display: block; height: 100%; }
.ek-mezcla__efectivo { background: var(--ek-ingreso) !important; --ek-g-color: var(--ek-ingreso); }
.ek-mezcla__cheques { background: var(--ek-advertencia) !important; --ek-g-color: var(--ek-advertencia); }
.ek-mezcla__transferencias { background: var(--ek-texto-secundario) !important; --ek-g-color: var(--ek-texto-secundario); }
.ek-mezcla__leyenda { margin-top: -8px; }

/* Donantes: barras por mes */
.ek-meses { display: inline-flex; align-items: flex-end; gap: 3px; height: 28px; width: 132px; }
.ek-meses__barra { flex: 1; min-height: 2px; border-radius: 2px 2px 0 0; background: var(--ek-ingreso); }
.ek-meses__barra[data-vacio="true"] { background: var(--ek-borde); }
@media (max-width: 767.98px) {
    .ek-libro-resumen { padding: 16px; }
    .ek-libro-resumen__cifras { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .ek-cifras-resumen > div { flex: 1 1 45%; padding: 12px 16px; border-bottom: 1px solid var(--ek-borde-sutil); }
    .ek-conciliacion { padding: 16px; flex-direction: column; }
    .ek-correccion { padding: 14px 16px; }
    .ek-correccion__cabecera { flex-direction: column; gap: 2px; }
    .ek-tabla--libro tbody td.ek-tabla__num::before, .ek-tabla--diario tbody td.ek-tabla__num::before { content: none !important; }
    .ek-tabla--libro tbody tr, .ek-tabla--diario tbody tr { padding-right: 16px; }
    .ek-tabla--diario tbody td[data-etiqueta="Monto"] { position: absolute; top: 12px; right: 16px; font-size: 0.9375rem; font-weight: 600; }
    .ek-tabla--diario tbody td:nth-child(2) { padding-right: 120px; }
    .ek-tabla--diario tbody td[data-etiqueta="Estado"]::before { content: none; }
    .ek-tabla--libro tbody td[data-etiqueta="Saldo"] { font-size: 1rem; }
    .ek-tabla--donantes tbody tr { padding-right: 16px; }
    .ek-tabla--donantes .ek-tabla__acciones { position: static; margin-top: 6px; }
    .ek-tabla tfoot, .ek-tabla tfoot tr { display: block; }
    .ek-tabla tfoot tr { margin-top: 8px; padding: 12px 16px; background: var(--ek-hundido); border: 1px solid var(--ek-borde); border-radius: var(--ek-radio-tarjeta); }
    .ek-tabla .ek-totales th, .ek-tabla .ek-totales td { display: flex; justify-content: space-between; position: static; padding: 2px 0; border: 0; background: transparent; }
    .ek-tabla-contenedor:has(> .ek-tabla--sin-tarjetas) { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .ek-tabla--matriz .ek-tabla__num { min-width: 112px; }
    .ek-tabla .ek-totales td:empty { display: none; }
    .ek-tabla .ek-totales td[data-etiqueta]::before { content: attr(data-etiqueta); color: var(--ek-texto-secundario); font-weight: 500; }
}

/* ---------- Firma de Ekklesia (MarcaEkklesia: acceso y pantalla de carga) ----------
   Isotipo protagonista con un resplandor de su propio azul (da relieve en claro y brillo en oscuro) y el
   nombre en Inter 800 con el degradado azul real → turquesa del isotipo y un trazo dorado que recuerda la
   curva inferior de la «E». Colores: --ek-marca-* (Tokens.cs), AA en ambos temas. */
.ek-marca-ekklesia {
    /* Escala fluida (no dos tamaños fijos con salto): crece de 96 px/1440 px de ancho a 160 px/1440+,
       sin quedar nunca ni demasiado chico ni demasiado grande al cambiar el tamaño de la ventana. */
    --ek-marca-iso: clamp(96px, 72px + 6.1vw, 160px);
    --ek-marca-letra: clamp(1.75rem, 1.1rem + 2.667vw, 3.5rem);
    display: flex; align-items: center; gap: 20px;
}
.ek-marca-ekklesia--normal { --ek-marca-iso: 56px; --ek-marca-letra: 1.75rem; }
.ek-marca-ekklesia--vertical { flex-direction: column; gap: 18px; text-align: center; }
.ek-marca-ekklesia__isotipo {
    width: var(--ek-marca-iso); height: var(--ek-marca-iso); object-fit: contain; flex: none;
    filter: drop-shadow(0 14px 30px color-mix(in srgb, var(--ek-marca-inicio) 38%, transparent));
    animation: ek-marca-entrada 520ms cubic-bezier(0.2, 0.9, 0.3, 1.15) both;
}
.ek-marca-ekklesia__textos { display: flex; flex-direction: column; align-items: inherit; gap: 10px; }
.ek-marca-ekklesia--vertical .ek-marca-ekklesia__textos { align-items: center; }
.ek-marca-ekklesia__nombre {
    position: relative; display: inline-block; padding-bottom: 0.16em;
    font-size: var(--ek-marca-letra); font-weight: 800; letter-spacing: -0.045em; line-height: 1.05;
    color: var(--ek-marca-inicio);
    background: linear-gradient(105deg, var(--ek-marca-inicio) 12%, var(--ek-marca-fin) 88%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
    animation: ek-marca-texto 520ms 90ms ease-out both;
}
.ek-marca-ekklesia__nombre::after {
    content: ""; position: absolute; left: 0.06em; bottom: 0; width: 64%; height: 0.09em; border-radius: 999px;
    background: linear-gradient(90deg, var(--ek-marca-acento) 0%, color-mix(in srgb, var(--ek-marca-acento) 55%, transparent) 70%, transparent 100%);
    transform-origin: left center;
    animation: ek-marca-trazo 640ms 260ms cubic-bezier(0.3, 0.8, 0.3, 1) both;
}
.ek-marca-ekklesia__lema {
    font-size: 0.9rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--ek-texto-secundario);
}
@keyframes ek-marca-entrada { from { opacity: 0; transform: translateY(6px) scale(0.92); } to { opacity: 1; transform: none; } }
@keyframes ek-marca-texto { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes ek-marca-trazo { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
    .ek-marca-ekklesia__isotipo, .ek-marca-ekklesia__nombre, .ek-marca-ekklesia__nombre::after { animation: none; }
}
@media (forced-colors: active) {
    .ek-marca-ekklesia__nombre { background: none; -webkit-text-fill-color: CanvasText; }
    .ek-marca-ekklesia__nombre::after { background: CanvasText; }
}
@media (max-width: 480px) {
    .ek-marca-ekklesia--normal { --ek-marca-iso: 44px; --ek-marca-letra: 1.5rem; }
}

/* ---------- Objetivos táctiles en celular (sistema-diseno.md 3: 44 px; WCAG 2.5.8) ---------- */
@media (max-width: 767.98px) {
    .ek-migas a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 6px; margin: 0 -6px; }
    .ek-migas { margin-bottom: 0; }
    .ek-panel__enlace { min-height: 40px; padding: 0 10px; margin: -8px -10px; }
    .ek-tabla__enlace { min-height: 40px; }
    .ek-correccion__titulo, .ek-servicio-conteo__titulo { display: inline-flex; align-items: center; min-height: 40px; }
    .ek-correccion .ek-enlace-texto { display: inline-flex; align-items: center; min-height: 36px; }
    .ek-er__alternar { width: 40px; height: 40px; margin: -8px -4px -8px -10px; }
    .mud-alert .ek-enlace-texto { display: inline-flex; align-items: center; min-height: 32px; }
    .mud-input-numeric-spin { display: none; }
}

/* ---------- Roles y permisos en celular: un rol a la vez ---------- */
.ek-permisos-movil { display: none; }
@media (max-width: 767.98px) {
    .ek-matriz--escritorio { display: none; }
    .ek-permisos-movil { display: grid; gap: 12px; }
    .ek-permisos-movil__roles {
        display: flex; gap: 6px; overflow-x: auto; padding: 2px 16px 6px; margin: 0 -16px; scroll-snap-type: x proximity;
        scrollbar-width: none;
    }
    .ek-permisos-movil__roles::-webkit-scrollbar { display: none; }
    .ek-permisos-movil__roles .ek-chip-filtro { flex: none; scroll-snap-align: start; min-height: 40px; }
    .ek-permisos-movil__panel { padding: 16px; }
    .ek-permisos-movil__cabecera { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
    .ek-permisos-movil__nombre { font-size: 1.0625rem; font-weight: 600; }
    .ek-permisos-movil__grupo {
        margin: 16px 0 6px; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario);
    }
    .ek-permisos-movil__lista { list-style: none; margin: 0; padding: 0; display: grid; }
    .ek-permisos-movil__item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; border-top: 1px solid var(--ek-borde-sutil); font-size: 0.875rem; }
    .ek-permisos-movil__item--no .ek-permisos-movil__texto { color: var(--ek-texto-secundario); }
    .ek-permisos-movil__marca {
        display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 999px; background: var(--ek-hover); color: var(--ek-texto-secundario);
    }
    .ek-permisos-movil__marca--si { background: var(--ek-tinte-ingreso); color: var(--ek-ingreso); }
    .ek-permisos-movil__texto { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 2px; }
}

/* ---------- Estado de ingresos y egresos ---------- */
.ek-er { overflow: hidden; }
.ek-er__cabecera { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--ek-borde); }
.ek-er__titulo { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1rem; font-weight: 600; }
.ek-er__marca { width: 4px; height: 18px; border-radius: 2px; background: var(--ek-texto-terciario); }
.ek-er__marca--ingreso { background: var(--ek-ingreso); }
.ek-er__marca--egreso { background: var(--ek-egreso); }
.ek-er__total { font-size: 1.125rem; font-weight: 600; }
.ek-er__tabla { --ek-er-columnas: minmax(0, 1fr) 150px 180px; font-size: 0.875rem; }
.ek-er__tabla--comparada { --ek-er-columnas: minmax(0, 1fr) 150px 150px 110px 180px; }
.ek-er__fila {
    display: grid; grid-template-columns: var(--ek-er-columnas); align-items: center; gap: 16px;
    padding: 10px 20px; border-bottom: 1px solid var(--ek-borde-sutil); transition: background var(--ek-transicion);
}
.ek-er__fila:not(.ek-er__fila--encabezado):not(.ek-er__fila--total):hover { background: var(--ek-hover); }
.ek-er__fila--encabezado {
    background: var(--ek-hundido); border-bottom-color: var(--ek-borde); padding-top: 8px; padding-bottom: 8px;
    font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario);
}
.ek-er__fila--padre { font-weight: 500; }
.ek-er__fila--hija { background: color-mix(in srgb, var(--ek-hundido) 60%, transparent); font-size: 0.8125rem; }
.ek-er__fila--hija .ek-er__concepto { padding-left: 34px; color: var(--ek-texto-secundario); }
.ek-er__fila--total { font-weight: 600; background: var(--ek-hundido); border-bottom: 0; border-top: 1px solid var(--ek-borde); }
.ek-er__num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ek-er__concepto { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ek-er__nombre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-er__alternar {
    display: grid; place-items: center; width: 24px; height: 24px; margin: -2px -2px -2px -6px; padding: 0; border: 0; border-radius: 6px;
    background: transparent; color: var(--ek-texto-secundario); cursor: pointer;
}
.ek-er__alternar:hover { background: var(--ek-hover); color: var(--ek-texto); }
.ek-er__alternar:focus-visible { outline: none; box-shadow: var(--ek-anillo-foco); }
.ek-er__anterior { color: var(--ek-texto-secundario); }
.ek-er__participacion { display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-items: center; gap: 10px; font-size: 0.8125rem; color: var(--ek-texto-secundario); text-align: right; }
.ek-er__participacion-titulo { text-align: right; }
.ek-er__barra { height: 6px; border-radius: 999px; background: var(--ek-hundido); overflow: hidden; }
.ek-er__barra-relleno { display: block; height: 100%; border-radius: 999px; background: var(--ek-primario); transition: width 500ms cubic-bezier(0.2, 0, 0, 1); }
.ek-er__barra-relleno--ingreso { background: var(--ek-ingreso); }
.ek-er__barra-relleno--egreso { background: var(--ek-egreso); }
.ek-er__etiqueta-movil { display: none; }
.ek-er__vacio { padding: 20px; color: var(--ek-texto-secundario); }
.ek-er-resultado { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 24px; border-left: 4px solid var(--ek-texto-terciario); }
.ek-er-resultado--positivo { border-left-color: var(--ek-ingreso); }
.ek-er-resultado--negativo { border-left-color: var(--ek-egreso); }
.ek-er-resultado__etiqueta { font-size: 1rem; font-weight: 600; }
.ek-er-resultado__valor { font-size: 1.75rem; font-weight: 600; letter-spacing: -0.02em; }
@media (max-width: 899.98px) {
    .ek-er__fila--encabezado { display: none; }
    .ek-er__fila, .ek-er__tabla--comparada .ek-er__fila {
        grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 12px 16px;
    }
    .ek-er__concepto { grid-column: 1; }
    .ek-er__actual { grid-column: 2; grid-row: 1; font-weight: 600; }
    .ek-er__anterior { grid-column: 1; font-size: 0.75rem; text-align: left; }
    .ek-er__etiqueta-movil { display: inline; }
    .ek-er__participacion { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) 44px; }
    .ek-er__fila--total .ek-er__participacion { display: none; }
    .ek-er__fila--hija .ek-er__concepto { padding-left: 24px; }
    .ek-er__cabecera { padding: 14px 16px; }
    .ek-er-resultado { flex-direction: column; align-items: flex-start; padding: 16px; }
    .ek-er-resultado__valor { font-size: 1.5rem; }
}

/* ---------- Informes publicados a la congregación (Fase 7) ---------- */
/* Cuerpo del informe: el mismo en la vista del Miembro y en la vista previa del tesorero. Se adapta a su propio
   ancho (container queries), no al de la ventana: en la vista previa ocupa solo parte de la pantalla. */
.ek-informe { container: informe / inline-size; display: grid; gap: 20px; min-width: 0; }
/* Cada KPI mide su propia caja (no el ancho de la página): el mismo cuerpo cabe tanto a lo ancho como
   en la columna angosta de la vista previa de "Publicar informe". */
.ek-informe .ek-kpi { container: kpi-informe / inline-size; }
.ek-informe .ek-kpi__valor { font-size: clamp(1.125rem, 10cqi, 2rem); }
.ek-informe__detalle { gap: 20px; }
.ek-informe__vacio { padding: 8px 0 4px; }
@container informe (max-width: 560px) {
    .ek-informe .ek-rejilla-kpi--3 { grid-template-columns: 1fr; gap: 12px; }
}

.ek-informe__mensaje { position: relative; margin: 0; padding: 24px 28px 24px 68px; display: grid; gap: 10px; }
.ek-informe__comillas {
    position: absolute; left: 22px; top: 22px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px;
    background: var(--ek-tinte-primario); color: var(--ek-primario);
}
.ek-informe__cita { margin: 0; max-width: 70ch; font-size: 1.0625rem; line-height: 1.6; color: var(--ek-texto); white-space: pre-line; overflow-wrap: anywhere; }
.ek-informe__autor { font-size: 0.875rem; font-weight: 500; color: var(--ek-texto-secundario); }
.ek-informe__autor::before { content: "— "; }
@container informe (max-width: 560px) {
    .ek-informe__mensaje { padding: 64px 20px 20px; }
    .ek-informe__comillas { left: 20px; top: 20px; }
    .ek-informe__cita { font-size: 1rem; }
}

.ek-informe__fondos { list-style: none; margin: 0; padding: 0; display: grid; }
.ek-informe__fondo {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center;
    padding: 14px 0; border-top: 1px solid var(--ek-borde-sutil);
}
.ek-informe__fondo:first-child { border-top: 0; padding-top: 2px; }
.ek-informe__fondo:last-child { padding-bottom: 0; }
.ek-informe__fondo-nombre { grid-column: 1; font-weight: 600; overflow-wrap: anywhere; }
.ek-informe__fondo-periodo { grid-column: 1; display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-informe__fondo-periodo .mud-icon-root { color: var(--ek-ingreso); }
.ek-informe__fondo-acumulado { grid-column: 2; grid-row: 1 / span 2; display: grid; justify-items: end; gap: 2px; }
.ek-informe__fondo-etiqueta { font-size: 0.75rem; color: var(--ek-texto-secundario); }
.ek-informe__fondo-acumulado .ek-monto { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; }
@container informe (max-width: 420px) {
    .ek-informe__fondo { grid-template-columns: 1fr; }
    .ek-informe__fondo-acumulado { grid-column: 1; grid-row: auto; justify-items: start; }
}

.ek-informe__pie { display: flex; align-items: flex-start; gap: 8px; max-width: 75ch; margin: 24px 0 0; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-informe__pie .mud-icon-root { flex: none; margin-top: 1px; }

/* Lista de informes */
.ek-informe-tarjeta__cifras { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 4px; font-size: 0.875rem; }
.ek-informe-tarjeta__cifras .ek-monto { font-weight: 600; }
.ek-informe-tarjeta__fecha { font-size: 0.75rem; color: var(--ek-texto-secundario); }
.ek-informe-tarjeta--oculto { background: var(--ek-hundido); }
.ek-informe-tarjeta--oculto .ek-reporte-tarjeta__icono { background: var(--ek-hover); color: var(--ek-texto-secundario); }

/* Publicar informe: pasos a la izquierda y vista previa a la derecha; en celular, la vista previa va antes del
   mensaje y del botón, para ver lo que se publica antes de publicarlo. */
.ek-publicar {
    display: grid; gap: 20px; align-items: start; grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "periodo" "mostrar" "vista" "texto" "acciones";
}
.ek-publicar__periodo { grid-area: periodo; }
.ek-publicar__mostrar { grid-area: mostrar; }
.ek-publicar__texto-seccion { grid-area: texto; }
.ek-publicar__acciones { grid-area: acciones; }
.ek-publicar__vista { grid-area: vista; min-width: 0; display: grid; gap: 10px; align-content: start; }
@media (min-width: 1200px) {
    .ek-publicar {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: auto auto auto 1fr; column-gap: 28px;
        grid-template-areas: "periodo vista" "mostrar vista" "texto vista" "acciones vista";
    }
}
.ek-publicar__seccion { display: grid; gap: 14px; align-content: start; padding: 20px 24px; }
.ek-publicar__paso { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1rem; font-weight: 600; letter-spacing: -0.01em; }
.ek-publicar__numero {
    display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 999px;
    background: var(--ek-tinte-primario); color: var(--ek-primario); font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.ek-publicar__texto { margin: 0; max-width: 70ch; font-size: 0.875rem; color: var(--ek-texto-secundario); }
.ek-publicar__ayuda { margin: 0; }
.ek-publicar__meses .mud-input-control { margin: 0; }
.ek-publicar__atajo { display: grid; justify-items: start; gap: 1px; min-height: 52px; padding: 6px 14px; border-radius: 12px; text-align: left; line-height: 1.25; }
.ek-publicar__atajo-titulo { font-weight: 600; }
.ek-publicar__atajo-detalle { font-size: 0.75rem; font-weight: 400; color: var(--ek-texto-secundario); }
.ek-chip-filtro--activo .ek-publicar__atajo-detalle { color: inherit; }

.ek-publicar__categorias { list-style: none; margin: 0; padding: 0; display: grid; border: 1px solid var(--ek-borde-sutil); border-radius: var(--ek-radio); overflow: hidden; }
.ek-publicar__categoria {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px;
    padding: 6px 6px 6px 14px; border-top: 1px solid var(--ek-borde-sutil); transition: background var(--ek-transicion);
}
.ek-publicar__categoria:first-child { border-top: 0; }
.ek-publicar__categoria--oculta { background: var(--ek-hundido); }
.ek-publicar__categoria--oculta .ek-publicar__categoria-nombre { color: var(--ek-texto-secundario); }
.ek-publicar__categoria-textos { display: grid; gap: 2px; min-width: 0; }
.ek-publicar__categoria-nombre { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-publicar__categoria-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-publicar__interruptor { margin: 0; min-height: 44px; }
.ek-publicar__interruptor .mud-typography {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.ek-publicar__campos { display: grid; gap: 16px; }
.ek-publicar__campos .mud-input-control { margin: 0; }

.ek-publicar__acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 12px; }
.ek-publicar__error { flex: 1 1 100%; order: 0; }
.ek-publicar__cancelar { order: 1; }
.ek-publicar__confirmar { order: 2; }

.ek-publicar__vista-cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ek-publicar__vista-titulo { margin: 0; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ek-texto-secundario); }
.ek-publicar__vista-cabecera .ek-chip { gap: 4px; }
.ek-publicar__vista-cabecera .ek-chip .mud-icon-root { font-size: 0.9375rem !important; }
.ek-publicar__marco { display: grid; gap: 16px; padding: 20px; transition: opacity var(--ek-transicion); }
.ek-publicar__encabezado { display: grid; gap: 2px; }
.ek-publicar__encabezado p { margin: 0; font-size: 0.875rem; }
.ek-publicar__titulo-informe { margin: 0; font-size: 1.25rem; font-weight: 600; letter-spacing: -0.015em; overflow-wrap: anywhere; }
@media (max-width: 767.98px) {
    .ek-publicar { gap: 16px; }
    .ek-publicar__seccion { padding: 16px; }
    .ek-publicar__marco { padding: 12px; }
    .ek-publicar__acciones { flex-direction: column; align-items: stretch; }
    .ek-publicar__acciones .mud-button-root { width: 100%; min-height: 48px; }
    .ek-publicar__confirmar { order: 1; }
    .ek-publicar__cancelar { order: 2; }
    .ek-publicar__atajos { display: grid; grid-template-columns: 1fr 1fr; }
    .ek-publicar__atajo { min-height: 56px; }
}

/* Tarjeta del Inicio: el último informe en grande y los anteriores debajo */
.ek-widget-informe { display: grid; gap: 16px; }
.ek-widget-informe__cabecera { display: grid; gap: 2px; }
.ek-widget-informe__titulo { margin: 0; font-size: 1.25rem; font-weight: 600; letter-spacing: -0.015em; overflow-wrap: anywhere; }
.ek-widget-informe__cifras { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.ek-widget-informe__cifra {
    display: grid; gap: 4px; align-content: start; min-width: 0; padding: 14px 16px;
    border-radius: var(--ek-radio); background: var(--ek-hundido); border: 1px solid var(--ek-borde-sutil);
}
.ek-widget-informe__cifra dt { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; font-weight: 500; color: var(--ek-texto-secundario); }
.ek-widget-informe__cifra dd { margin: 0; font-size: clamp(1.25rem, 0.8rem + 1.1vw, 1.75rem); font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; }
.ek-widget-informe__cifra--ingreso dt .mud-icon-root { color: var(--ek-ingreso); }
.ek-widget-informe__cifra--egreso dt .mud-icon-root { color: var(--ek-egreso); }
.ek-widget-informe__mensaje { display: grid; gap: 6px; margin: 0; padding: 2px 0 2px 16px; border-left: 3px solid var(--ek-primario); }
.ek-widget-informe__mensaje span {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    max-width: 75ch; font-size: 0.9375rem; line-height: 1.55; white-space: pre-line;
}
.ek-widget-informe__mensaje cite { font-style: normal; font-size: 0.8125rem; color: var(--ek-texto-secundario); }
.ek-widget-informe__mensaje cite::before { content: "— "; }
.ek-widget-informe__ver { justify-self: start; }
.ek-widget-informe__anteriores { margin: 24px 0 4px; }
.ek-widget-informe__lista { margin: 0 -20px -20px; }
.ek-widget-informe__lista li:first-child .ek-reciente { border-top: 1px solid var(--ek-borde-sutil); }
.ek-widget-informe__fila { grid-template-columns: auto minmax(0, 1fr) auto; }
@media (max-width: 1100px) {
    .ek-widget-informe__cifra dd { font-size: 1.375rem; }
}
@media (max-width: 767.98px) {
    .ek-widget-informe__cifras { grid-template-columns: 1fr; gap: 8px; }
    .ek-widget-informe__cifra { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 12px 14px; }
    .ek-widget-informe__cifra dd { font-size: 1.25rem; }
    .ek-widget-informe__ver { justify-self: stretch; min-height: 48px; }
    .ek-widget-informe__lista { margin: 0 -16px -16px; }
}