/* Correo: cifras arriba, lista de correos con casilla, punto de prioridad y detalle en ventana. Solo tokens. */
.correo-cifras { margin-bottom: var(--e-4); }
.correo-kpi.tocable { cursor: pointer; transition: background var(--m); }
.correo-kpi.tocable:hover { background: var(--surface-2); }
.correo-panel { padding-top: var(--e-4); }
.correo-filtros { display: flex; align-items: center; justify-content: space-between; gap: var(--e-3); flex-wrap: wrap; margin-bottom: var(--e-3); }
.correo-filtros .segmentos { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.correo-filtros .segmentos::-webkit-scrollbar { display: none; }
.correo-filtros .segmentos button { white-space: nowrap; }
.correo-cuenta { width: auto; max-width: 100%; min-width: 180px; }

.correo-lista { display: flex; flex-direction: column; }
.correo-fila { display: grid; grid-template-columns: 22px 8px minmax(0, 1fr) auto; column-gap: 12px; align-items: start; min-height: 44px; padding: 16px 12px; margin: 0; border-top: 1px solid var(--line); border-radius: 0; cursor: pointer; transition: background var(--m); outline: none; }
.correo-fila.abierta { background: var(--sel-bg); box-shadow: inset 3px 0 0 var(--ink); }
.correo-fila:first-child { border-top: 0; }
.correo-fila:hover, .correo-fila:focus-visible { background: var(--hover); border-radius: var(--r-2); }
.correo-fila:hover + .correo-fila, .correo-fila:focus-visible + .correo-fila { border-top-color: transparent; }
.correo-fila.hecha { opacity: .55; }
.correo-fila.hecha .correo-asunto { text-decoration: line-through; }
.correo-fila .casilla { position: relative; margin-top: 1px; }
.correo-fila .casilla::after { content: ''; position: absolute; inset: -11px; } /* zona tocable de 44 px */
.correo-fila .casilla:hover { border-color: var(--ink-2); }
.correo-fila .punto { margin-top: 8px; }
.punto--gris { background: var(--ink-3); }
.punto--nada { background: var(--line-2); }

.correo-cuerpo { min-width: 0; }
.correo-de { display: flex; align-items: baseline; gap: 8px; min-width: 0; font-size: 13px; line-height: 1.3; }
.correo-de b { font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.correo-de small { color: var(--ink-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.correo-fila.sin-leer .correo-de b::after { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--azul); margin-left: 6px; vertical-align: middle; }
.correo-asunto { display: block; font-weight: 500; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.correo-resumen { color: var(--ink-2); font-size: 13px; line-height: 1.4; margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.correo-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.correo-meta:empty { display: none; }
.chip--mini { height: 20px; padding: 0 7px; font-size: 10px; letter-spacing: .03em; }
.correo-fin { font-size: 12px; color: var(--ink-3); white-space: nowrap; padding-top: 2px; text-align: right; }

/* ventana de detalle */
.correo-ventana .ventana__cab h2 { overflow-wrap: anywhere; font-size: 18px; }
.correo-detalle { display: grid; gap: var(--e-3); }
.correo-detalle__chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.correo-dato { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 10px; align-items: baseline; font-size: 13px; overflow-wrap: anywhere; }
.correo-dato .etiqueta { padding-top: 2px; }
.correo-detalle__texto { padding: var(--e-4); border-radius: var(--r-2); background: var(--surface-2); border: 1px solid var(--line); white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; }
.correo-gmail { justify-self: start; text-decoration: none; }

/* sin cuentas y prueba IMAP */
.correo-sin-cuentas .lista { margin-top: var(--e-4); }
.correo-sin-cuentas .fila { align-items: flex-start; } .correo-sin-cuentas .fila .punto { margin-top: 7px; }
.correo-sin-cuentas .fila__cuerpo small { white-space: normal; overflow-wrap: anywhere; }
.correo-form { display: grid; gap: var(--e-3); }
.correo-prueba { display: grid; gap: 8px; justify-items: start; }
.correo-prueba:empty { display: none; }
.correo-prueba p { font-size: 13px; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .correo-cifras { grid-template-columns: minmax(0, 1fr); gap: var(--e-3); }
  .correo-kpi { padding: var(--e-4); }
  .correo-kpi .cifra { font-size: var(--t2); letter-spacing: -.02em; }
  .correo-filtros { align-items: stretch; flex-direction: column; }
  .correo-cuenta { width: 100%; }
  .correo-fila { grid-template-columns: 22px 8px minmax(0, 1fr); padding: 12px 6px; margin: 0 -6px; }
  .correo-fin { grid-column: 3; text-align: left; padding-top: 4px; }
  .correo-de { flex-wrap: wrap; gap: 2px 8px; }
  .correo-dato { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

/* Correo completo, como en Mail */
.correo-ventana { width: min(860px, 100%); }
.correo-completo { border: 1px solid var(--line); border-radius: var(--r-2); overflow: hidden; background: #fff; min-height: 120px; }
.correo-marco { display: block; width: 100%; height: 480px; border: 0; background: #fff; }
.correo-texto { margin: 0; padding: 14px 16px; white-space: pre-wrap; word-break: break-word; font: 14px/1.5 var(--fuente); color: #1b1a17; background: #fff; }
.correo-adjuntos { display: flex; gap: 6px; flex-wrap: wrap; padding: 10px 12px; background: var(--surface-2); border-bottom: 1px solid var(--line); }

/* Dos paneles: lista a la izquierda, lector a la derecha. Al hacer scroll, las cifras se van y los paneles se quedan. */
.correo-dos { display: grid; grid-template-columns: minmax(340px, 420px) minmax(0, 1fr); gap: var(--e-3); align-items: start; }
.correo-dos .correo-panel { position: sticky; top: calc(var(--barra-margen) * 2 + var(--barra-alto)); height: calc(100dvh - var(--barra-alto) - var(--barra-margen) * 3); overflow: auto; padding: var(--e-3); }
.correo-dos .correo-filtros { position: sticky; top: calc(-1 * var(--e-3)); z-index: 2; background: var(--surface-1); padding: 4px 0 10px; margin-top: -4px; }
.correo-lector { position: sticky; top: calc(var(--barra-margen) * 2 + var(--barra-alto)); height: calc(100dvh - var(--barra-alto) - var(--barra-margen) * 3); overflow: auto; }
.correo-lector__vacio { height: 100%; display: grid; place-items: center; align-content: center; gap: 10px; color: var(--ink-3); }
.correo-lector__vacio svg { width: 36px; height: 36px; stroke: currentColor; fill: none; stroke-width: 1.4; }
.correo-lector__cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: var(--e-4); }
.correo-lector__cab h2 { font-size: 20px; line-height: 1.2; }
.correo-cifras .kpi .cifra { font-size: 30px; }
.correo-cifras .panel { padding: var(--e-4); }
@media (max-width: 900px) {
  .correo-dos { grid-template-columns: minmax(0, 1fr); }
  .correo-dos .correo-panel, .correo-lector { position: static; height: auto; }
  .correo-lector { display: none; }
}