/* Colores provisionales: reemplazar con la paleta de RedRealty (Fase 4). */
:root {
  --brand: #c8102e;
  --text: #1f2328;
  --muted: #59636e;
  --bg: #ffffff;
  --line: #d0d7de;
  --panel: #f6f8fa;
  --brand-soft: #e8a0ab;
  --brand-bg: #fdf2f4;
  --fondo: #eef0f3;
  --side: #1f2328;
  --side-hover: #2b3036;
  --side-activo: #353b42;
  --side-texto: #c4c9d0;
  --side-linea: #3a4048;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--text);
  background: var(--bg);
}

.site-header {
  padding: 12px 16px;
  background: var(--side);
  color: #fff;
}

.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.15rem; color: #fff; text-decoration: none; }
.logo {
  display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 8px;
  background: var(--brand); color: #fff; font-size: 1rem;
}
.icono { width: 19px; height: 19px; flex-shrink: 0; }

/* Barra lateral */
body.con-lateral { display: flex; min-height: 100vh; background: var(--fondo); }
.lateral {
  position: sticky; top: 0; align-self: flex-start;
  display: flex; flex-direction: column; gap: 22px;
  width: 248px; flex-shrink: 0; height: 100vh; overflow-y: auto;
  padding: 20px 12px 16px; background: var(--side); color: #fff;
}
.lateral .brand { padding: 4px 10px 6px; }
.menu { display: flex; flex-direction: column; gap: 2px; }
.menu a {
  display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 8px;
  color: var(--side-texto); text-decoration: none; font-size: 0.95rem;
}
.menu a:hover { color: #fff; background: var(--side-hover); }
.menu a[aria-current="page"] { color: #fff; background: var(--side-activo); font-weight: 600; box-shadow: inset 3px 0 0 var(--brand); }
.submenu { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 4px 20px; padding-left: 8px; border-left: 1px solid var(--side-linea); }
.submenu a { padding: 7px 10px; font-size: 0.88rem; }
.submenu .icono { width: 16px; height: 16px; }
.lateral-pie { margin-top: auto; display: flex; flex-direction: column; gap: 12px; padding-top: 12px; border-top: 1px solid var(--side-linea); }
.sesion { display: flex; align-items: center; gap: 10px; padding: 4px 6px 0 10px; font-size: 0.9rem; color: var(--side-texto); }
.sesion-nombre { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avatar { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--side-activo); color: #fff; font-weight: 600; flex-shrink: 0; }
button.enlace { display: inline-grid; place-items: center; background: none; border: 0; color: var(--side-texto); padding: 6px; border-radius: 6px; }
button.enlace:hover { color: #fff; background: var(--side-hover); }
.con-lateral .container {
  flex: 1; min-width: 0; max-width: none; margin: 16px 16px 16px 0; padding: 32px 36px 48px;
  background: #fff; border-radius: 12px; box-shadow: 0 1px 3px rgba(16, 24, 40, 0.06);
}
.con-lateral .container > * { max-width: 960px; }
a { color: var(--brand); }

.container {
  max-width: 820px;
  margin: 0 auto;
  padding: 32px 16px;
}

h1 { margin: 0 0 4px; font-size: 1.6rem; }
h3 { margin: 24px 0 8px; font-size: 1rem; }
h3 small { color: var(--muted); font-weight: 400; }
.subtitulo, .nota, small { color: var(--muted); }
.subtitulo { margin: 0 0 24px; }
.nota { font-size: 0.9rem; }
[hidden] { display: none !important; }
.oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Pasos */
.pasos {
  display: flex; gap: 4px; padding: 0; margin: 0 0 24px;
  list-style: none; counter-reset: paso; overflow-x: auto;
}
.pasos li {
  flex: 1; min-width: 92px; padding: 8px 4px; cursor: pointer;
  border-top: 3px solid var(--line); color: var(--muted);
  font-size: 0.85rem; counter-increment: paso;
}
.pasos li::before { content: counter(paso) ". "; }
.pasos li.hecho { border-color: var(--brand-soft); color: var(--text); }
.pasos li.activo { border-color: var(--brand); color: var(--brand); font-weight: 600; }

/* Formulario */
fieldset { border: 0; padding: 0; margin: 0; }
legend { font-size: 1.2rem; font-weight: 600; margin-bottom: 16px; padding: 0; }
.rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.rejilla + .rejilla { margin-top: 14px; }
.campo { display: flex; flex-direction: column; gap: 4px; font-size: 0.9rem; }
.campo.ancho { grid-column: 1 / -1; }
.campo em { color: var(--brand); font-style: normal; }
.campo small { font-size: 0.8rem; }
input[type="text"], input[type="email"], input[type="tel"], input[type="date"], input[type="number"], input[type="password"] {
  width: 100%; padding: 9px 10px; font: inherit; color: var(--text);
  border: 1px solid var(--line); border-radius: 6px; background: #fff;
}
input:focus { outline: 2px solid var(--brand); outline-offset: 1px; border-color: transparent; }
input:user-invalid { border-color: var(--brand); }
.tipo, .checks { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 16px; }
.checks { flex-direction: column; }
.tipo label, .checks label { display: flex; gap: 8px; align-items: center; cursor: pointer; }

table.depositos { width: 100%; border-collapse: collapse; }
table.depositos th { text-align: left; font-size: 0.85rem; font-weight: 500; color: var(--muted); padding: 0 6px 4px 0; }
table.depositos td { padding: 0 6px 8px 0; }
table.depositos td:last-child { width: 40px; }

button {
  font: inherit; cursor: pointer; border-radius: 6px; padding: 10px 18px;
  border: 1px solid var(--brand); background: var(--brand); color: #fff; font-weight: 600;
}
button.sec { background: #fff; color: var(--brand); }
button.quitar { padding: 6px 10px; background: #fff; color: var(--muted); border-color: var(--line); }
button:disabled { opacity: 0.45; cursor: not-allowed; }
.acciones-secundarias { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.navegacion {
  display: flex; justify-content: space-between; gap: 12px;
  margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--line);
}
.navegacion #siguiente, .navegacion #generar { margin-left: auto; }

/* Resúmenes y revisión */
.resumen { margin-top: 8px; }
.cifras, .revision { display: grid; gap: 8px; margin: 0 0 12px; }
.cifras { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cifras div { background: var(--panel); border-radius: 6px; padding: 10px; }
.cifras dt, .revision dt { font-size: 0.8rem; color: var(--muted); }
.cifras dd { margin: 2px 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.revision div { display: grid; grid-template-columns: 180px 1fr; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.revision dd { margin: 0; }
.tabla-plan { width: 100%; border-collapse: collapse; font-size: 0.85rem; margin-top: 8px; font-variant-numeric: tabular-nums; }
.tabla-plan th, .tabla-plan td { text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--line); }
.tabla-plan td:last-child, .tabla-plan th:last-child { text-align: right; }
details summary { cursor: pointer; color: var(--brand); font-weight: 500; }
.errores, .error { color: var(--brand); }
.alerta { border: 1px solid var(--brand); background: var(--brand-bg); border-radius: 6px; padding: 12px 16px; margin-bottom: 24px; }
.alerta ul { margin: 6px 0 0; padding-left: 20px; }

/* Panel */
.tarjetas { display: grid; gap: 16px; }
.tarjeta {
  display: block; padding: 20px; border: 1px solid var(--line); border-radius: 8px;
  color: var(--text); text-decoration: none; background: #fff;
}
.tarjeta:hover { border-color: var(--brand); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); }
.tarjeta h2 { margin: 0 0 8px; font-size: 1.15rem; color: var(--brand); }
.tarjeta p { margin: 0 0 16px; color: var(--muted); }
.cifra { font-size: 1.5rem; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Clientes */
.buscar { display: flex; gap: 8px; margin-bottom: 16px; }
.buscar input { flex: 1; padding: 9px 10px; font: inherit; border: 1px solid var(--line); border-radius: 6px; }
table.lista { width: 100%; border-collapse: collapse; }
table.lista th { text-align: left; font-size: 0.85rem; font-weight: 500; color: var(--muted); padding: 6px; border-bottom: 1px solid var(--line); }
table.lista td { padding: 10px 6px; border-bottom: 1px solid var(--line); }
.etiqueta { font-size: 0.75rem; color: var(--muted); border: 1px solid var(--line); border-radius: 4px; padding: 0 5px; }
.avance { font-size: 0.85rem; font-weight: 600; padding: 2px 8px; border-radius: 10px; background: var(--brand-bg); color: var(--brand); }
.avance.completo { background: #e6f4ea; color: #1e7a3c; }
.vacio { color: var(--muted); padding: 24px 0; }
.alta { margin-top: 32px; border-top: 1px solid var(--line); padding-top: 16px; }
.alta summary { margin-bottom: 16px; }
.migas { margin: 0 0 8px; font-size: 0.9rem; }
.encabezado-cliente { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 12px; }
.boton {
  display: inline-block; padding: 10px 18px; border-radius: 6px; font-weight: 600;
  background: var(--brand); color: #fff; text-decoration: none;
}
h2 { font-size: 1.1rem; margin: 28px 0 6px; display: flex; align-items: center; gap: 10px; }
ul.documentos { list-style: none; padding: 0; margin: 12px 0 0; }
ul.documentos > li { padding: 12px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; }
ul.documentos > li.entregado { border-color: #b7dfc3; background: #fbfefc; }
.doc-cabecera { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.estado { width: 1.2em; text-align: center; color: var(--muted); }
.entregado .estado { color: #1e7a3c; font-weight: 700; }
ul.archivos { list-style: none; padding: 0; margin: 8px 0 0 28px; }
ul.archivos li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 3px 0; }
ul.archivos form { margin: 0; }
form.subir { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0 28px; }
form.subir input[type="file"] { font-size: 0.85rem; max-width: 100%; }
form.subir button { padding: 6px 14px; }
button.peligro { margin-top: 16px; background: #fff; color: #b42318; border-color: #b42318; }

/* Pantallas angostas: la barra sigue a la izquierda, solo con íconos */
@media (max-width: 900px) {
  .lateral { width: 64px; padding: 16px 8px; align-items: center; }
  .lateral .brand { padding: 0; }
  .texto-menu, .sesion-nombre { display: none; }
  .menu a { justify-content: center; padding: 10px; }
  .submenu { margin: 2px 0; padding: 0; border: 0; }
  .lateral-pie { align-items: center; }
  .sesion { flex-direction: column; padding: 0; gap: 6px; }
  .con-lateral .container { margin: 8px 8px 8px 0; padding: 24px 18px 40px; }
}

@media (max-width: 600px) {
  .tarjetas { grid-template-columns: 1fr; }
  ul.archivos, form.subir { margin-left: 0; }
  .rejilla, .cifras { grid-template-columns: 1fr; }
  .revision div { grid-template-columns: 1fr; gap: 2px; }
}

/* Sesión y configuración */
.acceso { max-width: 380px; margin: 24px auto; }
.acceso form { display: flex; flex-direction: column; gap: 14px; }
.tarjetas { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.pestanas { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin: 12px 0 20px; }
.pestanas a { padding: 8px 14px; text-decoration: none; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.pestanas a[aria-current="page"] { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.aviso { border: 1px solid #b7dfc3; background: #e6f4ea; color: #1e7a3c; border-radius: 6px; padding: 10px 14px; margin-bottom: 16px; }
.boton.sec { background: #fff; color: var(--brand); border: 1px solid var(--brand); padding: 6px 14px; font-size: 0.9rem; }
.campo.proyecto { margin-bottom: 18px; max-width: 420px; }
select { width: 100%; padding: 9px 10px; font: inherit; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
label.check { display: flex; gap: 8px; align-items: center; margin-top: 12px; cursor: pointer; }
details.editar summary { color: var(--brand); cursor: pointer; }
details.editar[open] { min-width: 320px; }
details.editar form { margin-top: 10px; }
table.marcadores td { font-size: 0.85rem; padding: 4px 6px; }
code { font-size: 0.85em; background: var(--panel); padding: 1px 4px; border-radius: 4px; }
ul.documentos .acciones-secundarias { margin: 8px 0 0 28px; }
.buscar select { width: auto; max-width: 220px; }
.asignacion { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 0 0 8px; font-size: 0.9rem; color: var(--muted); }
.asignacion strong { color: var(--text); font-weight: 600; }

/* Dashboard */
.tablero-cabecera { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 22px; }
.tablero-cabecera .subtitulo { margin: 0; }
.boton-grande { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; box-shadow: 0 4px 12px rgba(200, 16, 46, 0.25); }
.boton-grande:hover { filter: brightness(1.05); }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-bottom: 16px; }
.kpi {
  position: relative; display: flex; flex-direction: column; gap: 2px; padding: 18px 18px 16px; border-radius: 14px;
  border: 1px solid var(--line); background: #fff; color: var(--text); text-decoration: none;
  transition: transform 0.15s, box-shadow 0.15s;
}
.kpi:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(16, 24, 40, 0.08); }
.kpi-destacado { background: linear-gradient(135deg, #c8102e, #8f0b21); border-color: transparent; color: #fff; }
.kpi-destacado .kpi-etiqueta, .kpi-destacado .nota { color: rgba(255, 255, 255, 0.85); }
.kpi-icono {
  display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; margin-bottom: 10px;
  background: var(--brand-bg); color: var(--brand);
}
.kpi-destacado .kpi-icono { background: rgba(255, 255, 255, 0.18); color: #fff; }
.kpi-icono.verde { background: #e6f4ea; color: #1f9254; }
.kpi-icono.ambar { background: #fdf3e2; color: #b26f12; }
.kpi-etiqueta { font-size: 0.85rem; color: var(--muted); }
.kpi-valor { font-size: 2.2rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.kpi-valor small { font-size: 1.1rem; font-weight: 600; margin-left: 2px; }
.kpi-pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; min-height: 28px; font-size: 0.8rem; }
.tendencia { font-weight: 600; font-size: 0.8rem; padding: 2px 8px; border-radius: 10px; background: rgba(255, 255, 255, 0.2); }
.spark { width: 96px; height: 28px; overflow: visible; }
.spark path { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mini-pista { flex: 1; max-width: 120px; height: 6px; background: var(--panel); border-radius: 3px; overflow: hidden; }
.mini-pista span { display: block; height: 100%; background: #1f9254; border-radius: 3px; }

.rejilla-panel { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.caja { border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; background: #fff; min-width: 0; }
.caja.dos-tercios { grid-column: span 4; }
.caja.un-tercio { grid-column: span 2; }
.caja.mitad { grid-column: span 3; }
.caja.completa { grid-column: 1 / -1; }
.caja-cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 14px; }
.caja-cabecera h2 { margin: 0; font-size: 1rem; }
.caja-cabecera .nota { font-size: 0.8rem; text-decoration: none; }

/* Gráfica de área */
.grafica-area { position: relative; }
.grafica-area svg { display: block; width: 100%; height: 230px; overflow: visible; }
.grafica-area .guia { stroke: #e7eaee; stroke-width: 1; }
.grafica-area .eje { font-size: 11px; fill: var(--muted); }
.grafica-area .trazo { fill: none; stroke: #c8102e; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.grafica-area .punto { fill: #fff; stroke: #c8102e; stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.zonas { position: absolute; inset: 0; }
.zona { position: absolute; top: 0; bottom: 30px; cursor: default; }
.zona .cruz { position: absolute; top: 10px; bottom: 0; width: 1px; background: #c9ced6; opacity: 0; }
.zona .globo {
  position: absolute; left: 50%; transform: translate(-50%, calc(-100% - 12px)); opacity: 0; pointer-events: none;
  background: var(--side); color: #fff; padding: 6px 10px; border-radius: 8px; font-size: 0.8rem; white-space: nowrap;
  line-height: 1.35; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18); transition: opacity 0.12s;
}
.zona .globo span { color: var(--side-texto); }
.zona:hover .cruz, .zona:hover .globo { opacity: 1; }

/* Dona */
.dona { position: relative; width: 180px; margin: 4px auto 14px; }
.dona svg { display: block; width: 100%; transform: rotate(-90deg); }
.dona-fondo { fill: none; stroke: var(--panel); stroke-width: 18; }
.dona-arco { fill: none; stroke-width: 18; }
.dona-centro { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.dona-centro strong { font-size: 1.9rem; line-height: 1; }
.dona-centro span { font-size: 0.8rem; color: var(--muted); }
ul.leyenda { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
ul.leyenda li { display: grid; grid-template-columns: 12px 1fr auto 40px; align-items: center; gap: 10px; font-size: 0.88rem; }
ul.leyenda .muestra { width: 12px; height: 12px; border-radius: 3px; }
ul.leyenda .nota { text-align: right; }

/* Ranking de asesores */
ul.ranking { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 14px; }
ul.ranking li { display: flex; align-items: center; gap: 12px; }
.avatar-color { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; font-weight: 700; font-size: 0.85rem; flex-shrink: 0; }
.avatar-color.a0 { background: #fde8eb; color: #a50d26; }
.avatar-color.a1 { background: #e3effc; color: #1f5fa8; }
.avatar-color.a2 { background: #e6f4ea; color: #1b7a47; }
.avatar-color.a3 { background: #fdf3e2; color: #9a5d0c; }
.avatar-color.a4 { background: #efe7fb; color: #6534b0; }
.avatar-color.a5 { background: #e6f6f7; color: #17767d; }
.ranking-cuerpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.ranking-linea { display: flex; justify-content: space-between; gap: 8px; font-size: 0.9rem; }
.ranking-linea a { color: var(--text); font-weight: 600; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ranking-linea a:hover { color: var(--brand); }
.ranking-linea span { color: var(--muted); white-space: nowrap; font-size: 0.82rem; }
.ranking-linea strong { color: var(--text); }

/* Proyectos */
.proyectos-tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.proyecto-tarjeta {
  display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 12px; background: var(--panel);
  color: var(--text); text-decoration: none; border: 1px solid transparent;
}
.proyecto-tarjeta:hover { border-color: var(--brand); background: #fff; }
.proyecto-tarjeta.inactivo { opacity: 0.6; }
.proyecto-icono { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: #fff; color: var(--brand); }
.proyecto-cifras { display: flex; gap: 12px; font-size: 0.82rem; color: var(--muted); }
.proyecto-cifras b { color: var(--text); font-size: 1rem; }
.proyecto-tarjeta .mini-pista { flex: none; max-width: none; height: 6px; margin-top: 4px; background: #e3e7ec; }

/* Barras horizontales */
ul.barras-h { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
ul.barras-h li { display: grid; grid-template-columns: minmax(110px, 42%) 1fr 28px; align-items: center; gap: 10px; font-size: 0.88rem; }
ul.barras-h li > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
ul.barras-h strong { text-align: right; font-variant-numeric: tabular-nums; }
.pista { height: 8px; background: var(--panel); border-radius: 4px; overflow: hidden; }
.relleno { display: block; height: 100%; background: var(--brand); border-radius: 4px; }

/* Expedientes por completar */
ul.pendientes { list-style: none; margin: 0; padding: 0; }
ul.pendientes li { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
ul.pendientes li:last-child { border-bottom: 0; }
ul.pendientes a { flex: 1; min-width: 0; color: var(--text); text-decoration: none; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
ul.pendientes a:hover { color: var(--brand); }
.anillo {
  --pct: 0; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  background: conic-gradient(#d9902a calc(var(--pct) * 1%), var(--panel) 0);
}
.anillo span { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; font-size: 0.68rem; font-weight: 700; }
.ir { color: var(--muted); }

/* Actividad */
ul.actividad { list-style: none; margin: 0; padding: 0; }
ul.actividad li { display: grid; grid-template-columns: 40px 1fr auto 70px; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
ul.actividad li:last-child { border-bottom: 0; }
ul.actividad li > div { display: flex; flex-direction: column; min-width: 0; }
ul.actividad strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.actividad-icono { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--brand-bg); color: var(--brand); }
.actividad-quien { display: inline-flex; align-items: center; gap: 8px; font-size: 0.85rem; color: var(--muted); }
.avatar-chico { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--panel); color: var(--text); font-size: 0.68rem; font-weight: 700; }
.actividad-fecha { text-align: right; font-size: 0.82rem; color: var(--muted); }

@media (max-width: 1100px) {
  .caja.dos-tercios, .caja.un-tercio, .caja.mitad { grid-column: 1 / -1; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  ul.actividad li { grid-template-columns: 36px 1fr; }
  .actividad-quien, .actividad-fecha { display: none; }
}

/* Logo Red Realty */
.marca { width: 34px; height: 34px; flex-shrink: 0; }
.logotipo { display: inline-flex; flex-direction: column; line-height: 1; color: #fff; }
.logotipo-red { font-size: 1.35rem; font-weight: 500; letter-spacing: 0.06em; }
.logotipo-realty { font-size: 0.62rem; font-weight: 500; letter-spacing: 0.32em; margin-top: 3px; }
/* La columna de la barra lateral queda oscura aunque la página sea larga */
body.con-lateral { background: linear-gradient(to right, var(--side) 248px, var(--fondo) 248px); }
@media (max-width: 900px) {
  body.con-lateral { background: linear-gradient(to right, var(--side) 64px, var(--fondo) 64px); }
  .lateral .texto-menu { display: none; }
}

/* Documentos faltantes desplegables */
.faltantes { display: flex; flex-direction: column; }
.faltante summary {
  display: grid; grid-template-columns: minmax(110px, 40%) 1fr 26px 14px; align-items: center; gap: 10px;
  padding: 7px 4px; border-radius: 6px; cursor: pointer; list-style: none; font-size: 0.88rem;
}
.faltante summary::-webkit-details-marker { display: none; }
.faltante summary:hover { background: var(--panel); }
.faltante-nombre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.faltante summary strong { text-align: right; font-variant-numeric: tabular-nums; }
.chevron { width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg); transition: transform 0.15s; }
.faltante[open] .chevron { transform: rotate(45deg); }
.faltante[open] summary { background: var(--panel); }
.faltante ul { list-style: none; margin: 4px 0 8px; padding: 0 4px 0 14px; border-left: 2px solid var(--brand-bg); }
.faltante li { display: flex; justify-content: space-between; gap: 8px; padding: 5px 0; font-size: 0.86rem; border-bottom: 1px solid var(--line); }
.faltante li:last-child { border-bottom: 0; }
.faltante li a { color: var(--text); text-decoration: none; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.faltante li a:hover { color: var(--brand); }
.faltante > p { margin: 4px 0 8px 14px; }
.caja-cabecera { flex-wrap: wrap; }
.faltante summary { color: var(--text); font-weight: 400; }

/* Plantillas de contrato */
ul.plantillas > li { padding: 16px; }
.plantilla-actual { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 0 28px; font-size: 0.92rem; }
.plantilla-actual .icono { color: var(--brand); }
ul.plantillas .acciones-secundarias { align-items: center; }
ul.plantillas .acciones-secundarias form { margin: 0; }
button.chico { padding: 6px 14px; font-size: 0.9rem; margin: 0; }
form.cargar { margin-top: 14px; padding: 12px; border: 1px dashed var(--line); border-radius: 8px; background: #fff; }
.cargar-titulo { font-weight: 600; font-size: 0.9rem; margin-right: 4px; }
form.restaurar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 4px 0 8px; }

/* Roles de usuario */
fieldset.roles { margin: 14px 0 0; }
fieldset.roles legend { font-size: 0.9rem; font-weight: 500; margin-bottom: 8px; }
label.rol { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
label.rol:has(input:checked) { border-color: var(--brand); background: var(--brand-bg); }
label.rol input { margin-top: 3px; }
label.rol span { display: flex; flex-direction: column; gap: 2px; }
label.rol small { font-size: 0.82rem; }
.valor-fijo { padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); }
