/* ============================================================
   ESTÁNDAR VISUAL (todas las pantallas)

   Lo que hace que todas las pantallas se vean y se sientan igual. Va
   después de base, layout y componentes, para pulir lo de ellos.

     - casillas y opciones bien alineadas en cualquier lugar
     - ligas, barras de desplazamiento y foco con el color del sistema
     - tablas con números alineados y encabezado fijo
     - piezas comunes: barra de filtros, segmentos (Activos/Concluidos…),
       aviso suave, celda secundaria, fichas, avatares
   ============================================================ */

/* Tipografía: un poco más de aire y números que no "bailan" */
body { font-size: 14px; line-height: 1.45; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { letter-spacing: -0.01em; }
table, .tb-totales, .tb-mes-monto, .segmento-n { font-variant-numeric: tabular-nums; }

/* Casillas y opciones: nunca a todo el ancho (eso las dejaba flotando en
   medio de la fila) y alineadas con su texto en cualquier etiqueta */
input[type="checkbox"], input[type="radio"] {
  width: auto; flex: 0 0 auto; margin: 0; padding: 0; accent-color: var(--purple);
}
/* :where() deja la especificidad en cero: cualquier clase (p. ej. las
   fichas .rp-chip) gana sobre esta regla general */
:where(label:has(> input[type="checkbox"]), label:has(> input[type="radio"])) {
  display: flex; align-items: center; gap: 0.5rem;
}

/* Ligas con el color del sistema, sin el azul subrayado del navegador */
a { color: #b69cff; text-decoration: none; }
a:hover { text-decoration: underline; }
table.data-table a { color: var(--text); }
table.data-table a:hover { color: #b69cff; text-decoration: none; }

/* Foco visible y del mismo color */
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible {
  outline: 2px solid rgba(139, 92, 246, 0.6); outline-offset: 2px;
}

/* Barras de desplazamiento oscuras (antes salían blancas en los modales) */
* { scrollbar-width: thin; scrollbar-color: #34345a transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #2c2c4d; border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: #3d3d68; background-clip: padding-box; }

/* Tablas */
table.data-table th { position: sticky; top: 0; background: var(--bg-panel); z-index: 1; }
table.data-table td { vertical-align: middle; }
.celda-secundaria { font-size: 0.76rem; color: var(--text-muted); }

/* Modales: un poco más amplios y con el cuerpo cómodo */
.modal-box { border-radius: 16px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45); }

/* ---- Piezas comunes -------------------------------------------- */
.barra-filtros { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; margin-bottom: 0.6rem; }
.barra-filtros > select, .barra-filtros > input { flex: 1; min-width: 170px; }

/* Segmentos: Activos | Concluidos | Inactivos | Todos */
.segmentos { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.segmento {
  background: transparent; border: 0; color: var(--text-muted); padding: 0.45rem 0.9rem; cursor: pointer;
  font-size: 0.82rem; display: inline-flex; gap: 0.4rem; align-items: center;
}
.segmento + .segmento { border-left: 1px solid var(--border); }
.segmento:hover { color: var(--text); background: var(--bg-hover); }
.segmento.activo { background: var(--gradient); color: #fff; font-weight: 600; }
.segmento-n { font-size: 0.7rem; padding: 0.05rem 0.4rem; border-radius: 999px; background: rgba(255, 255, 255, 0.12); }

.aviso-suave {
  font-size: 0.82rem; padding: 0.7rem 0.9rem; border-radius: 12px; margin-bottom: 1rem;
  background: rgba(245, 158, 11, 0.08); border: 1px solid rgba(245, 158, 11, 0.35);
}

/* ---- Tablero ------------------------------------------------------ */
.tb-contrato { border: 1px solid var(--border); border-radius: 14px; padding: 0.9rem 1rem; margin-bottom: 0.7rem; background: var(--bg-card); }
.tb-cab { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; }
.tb-nombre { font-weight: 700; font-size: 0.9rem; display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.tb-sub { font-size: 0.72rem; color: var(--text-muted); display: block; }
.tb-totales { display: flex; gap: 1.2rem; align-items: center; }
.tb-totales b { font-size: 0.95rem; }
.tb-meses { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.45rem; margin-top: 0.8rem; }
.tb-mes { border: 1px solid var(--border); border-radius: 10px; padding: 0.45rem 0.6rem; background: var(--bg-panel); }
.tb-mes-nombre { display: block; font-size: 0.72rem; color: var(--text-muted); }
.tb-mes-monto { display: block; font-weight: 600; font-size: 0.85rem; }

/* ---- Unidades de negocio ------------------------------------------ */
.un-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.8rem; }
.un-tarjeta {
  display: flex; flex-direction: column; gap: 0.6rem; border: 1px solid var(--border); border-radius: 14px;
  padding: 0.9rem 1rem; background: var(--bg-card); transition: border-color 0.15s;
}
.un-tarjeta:hover { border-color: rgba(139, 92, 246, 0.5); }
.un-tarjeta .btn { align-self: flex-start; }
.un-inactiva { opacity: 0.6; }
.un-cab { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.un-nombre { font-weight: 700; font-size: 0.95rem; }
.un-cifras { display: flex; gap: 0.9rem; flex-wrap: wrap; font-size: 0.78rem; color: var(--text-muted); }
.un-cifras b { color: var(--text); font-size: 0.9rem; }
.un-ficha-cab { display: flex; justify-content: space-between; align-items: center; margin: -0.4rem 0 0.6rem; }
.un-fichas { max-height: 46vh; overflow-y: auto; padding: 0.1rem; }

/* ---- Contratos: origen de los datos ------------------------------- */
.origenes { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.6rem; margin-bottom: 0.8rem; }
.origen {
  display: flex; gap: 0.7rem; align-items: center; text-align: left; cursor: pointer; color: var(--text);
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 0.6rem 0.8rem;
}
.origen b { display: block; font-size: 1.15rem; }
.origen-txt { font-size: 0.76rem; color: var(--text-muted); }
.origen-ico { font-size: 1.2rem; width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 10px; }
.origen-validado .origen-ico { background: rgba(34, 197, 94, 0.15); color: #4ade80; }
.origen-ia .origen-ico { background: rgba(200, 100, 59, 0.15); color: #e8a07a; }
.origen-manual .origen-ico { background: rgba(151, 151, 184, 0.15); color: var(--text-muted); }
.origen.activo { border-color: var(--purple); box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.4) inset; }

/* ---- Calidad de datos --------------------------------------------- */
.cal-grupo { border: 1px solid var(--border); border-radius: 12px; padding: 0.7rem 0.8rem; margin-bottom: 0.7rem; background: var(--bg-card); }
.cal-opcion { display: flex; gap: 0.6rem; align-items: center; padding: 0.35rem 0; border-top: 1px dashed var(--border); }
.cal-opcion:first-of-type { border-top: 0; }
.cal-opcion > span { flex: 1; }
.cal-error { color: #f87171; font-size: 0.76rem; }
.cal-aviso { color: #f5c26b; font-size: 0.76rem; }

/* ---- Resultado de leer la constancia de situación fiscal --------- */
.csf-resultado { margin-top: 0.7rem; padding: 0.7rem 0.8rem; border-radius: 12px; font-size: 0.8rem; }
.csf-resultado.ok { background: rgba(34, 197, 94, 0.08); border: 1px solid rgba(34, 197, 94, 0.35); }
.csf-resultado.no { background: rgba(245, 158, 11, 0.08); border: 1px solid rgba(245, 158, 11, 0.35); }
.csf-cambio { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.25rem; }
.csf-cambio > span:first-child { min-width: 130px; color: var(--text-muted); }
.csf-antes { text-decoration: line-through; color: var(--text-muted); }
.csf-despues { font-weight: 600; }

/* ---- Carga masiva de facturas -------------------------------------- */
.cf-pasos { display: flex; flex-direction: column; gap: 0.8rem; }
.cf-paso { display: flex; gap: 0.8rem; align-items: flex-start; }
.cf-num { flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center; background: var(--gradient); color: #fff; font-weight: 700; font-size: 0.8rem; }
.cf-zona {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.3rem; cursor: pointer;
  margin-top: 0.5rem; padding: 1.4rem; border: 2px dashed var(--border); border-radius: 14px; background: var(--bg-card);
  font-size: 0.85rem; color: var(--text-muted); transition: border-color 0.15s, background 0.15s;
}
.cf-zona:hover, .cf-zona.cf-encima { border-color: var(--purple); background: rgba(139, 92, 246, 0.08); color: var(--text); }
.cf-zona.cf-cargando { opacity: 0.7; pointer-events: none; }
.cf-zona-ico { font-size: 1.6rem; }
.cf-tarjetas { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.6rem; margin-bottom: 0.9rem; }
.cf-tarjeta { display: flex; flex-direction: column; gap: 0.1rem; padding: 0.7rem 0.8rem; border-radius: 12px; border: 1px solid var(--border); background: var(--bg-card); }
.cf-tarjeta b { font-size: 1.4rem; }
.cf-tarjeta span { font-size: 0.8rem; }
.cf-tarjeta small { font-size: 0.72rem; color: var(--text-muted); }
.cf-tarjeta.ok { border-color: rgba(34, 197, 94, 0.45); background: rgba(34, 197, 94, 0.07); }
.cf-tarjeta.alerta { border-color: rgba(245, 158, 11, 0.45); background: rgba(245, 158, 11, 0.07); }
.cf-tarjeta.mal { border-color: rgba(248, 113, 113, 0.45); background: rgba(248, 113, 113, 0.07); }
.cf-seccion { border: 1px solid var(--border); border-radius: 12px; padding: 0.7rem 0.8rem; margin-bottom: 0.7rem; }
.cf-seccion-cab { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.3rem; }
.cf-tabla { max-height: 260px; overflow: auto; }
.cf-final { text-align: center; padding: 1rem 0.5rem; }
.cf-final-ico { width: 3rem; height: 3rem; margin: 0 auto 0.5rem; border-radius: 50%; display: grid; place-items: center; font-size: 1.5rem; background: rgba(34, 197, 94, 0.15); color: #4ade80; }

/* ---- Buscador con sugerencias (crearBuscadorEnSelect) --------------- */
.buscador { position: relative; }
.buscador > input { width: 100%; padding-right: 2rem; }
.buscador.con-valor > input { font-weight: 600; }
.buscador-limpiar {
  position: absolute; right: 0.4rem; top: 0.45rem; width: 1.5rem; height: 1.5rem; border: 0; border-radius: 50%;
  background: transparent; color: var(--text-muted); font-size: 1.1rem; line-height: 1; cursor: pointer;
}
.buscador-limpiar:hover { background: var(--bg-hover, rgba(255, 255, 255, 0.08)); color: var(--text); }
.buscador-lista {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 60; max-height: 320px; overflow-y: auto;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}
.buscador-opcion { display: flex; flex-direction: column; gap: 0.1rem; padding: 0.5rem 0.75rem; cursor: pointer; border-bottom: 1px solid var(--border); }
.buscador-opcion:last-of-type { border-bottom: 0; }
.buscador-opcion small { color: var(--text-muted); font-size: 0.72rem; }
.buscador-opcion.activa { background: rgba(139, 92, 246, 0.14); }
.buscador-opcion.elegida .buscador-et::after { content: ' ✓'; color: #4ade80; }
.buscador-opcion mark { background: rgba(250, 204, 21, 0.35); color: inherit; border-radius: 3px; padding: 0 1px; }
.buscador-vacio, .buscador-pie { padding: 0.55rem 0.75rem; font-size: 0.75rem; color: var(--text-muted); }
.buscador-pie { position: sticky; bottom: 0; background: var(--bg-card); border-top: 1px solid var(--border); }
.buscador-elegido { font-size: 0.74rem; color: var(--text-muted); margin-top: 0.25rem; min-height: 0.9rem; }

/* Leyenda de facturas canceladas ante el SAT (filas en rojo) */
.leyenda-cancelada { display: inline-block; width: 0.8rem; height: 0.8rem; border-radius: 3px; vertical-align: -1px; background: rgba(239, 68, 68, 0.35); }

/* ---- Asignador masivo: acuse de entrega ---------------------------- */
.afm-acuse-panel { margin-top: 0.9rem; padding: 0.8rem 0.9rem; border: 1px solid var(--border); border-radius: 12px; }
.afm-acuse-panel.obligatorio { border-color: rgba(248, 113, 113, 0.45); }
.afm-acuse-cab { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.6rem; }
.afm-acuse-campos { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: flex-end; margin-bottom: 0.4rem; }
.afm-acuse-archivo { display: inline-flex; align-items: center; cursor: pointer; padding: 0.2rem 0.5rem; border: 1px dashed var(--border); border-radius: 8px; font-size: 0.72rem; margin-right: 0.3rem; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.afm-acuse-archivo.grande { padding: 0.45rem 0.7rem; font-size: 0.8rem; max-width: 280px; }
.afm-acuse-archivo:hover { border-color: var(--purple); }

/* ==================================================================
   RESUMEN FACTURADO DE UN CONTRATO (ui/resumen-facturado.js)
   ================================================================== */
.rf { display: flex; flex-direction: column; gap: 0.9rem; }
.rf-titulo { font-weight: 700; font-size: 1rem; display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.rf-tenue { color: var(--text-muted); font-size: 0.74rem; }
.rf-subtitulo { font-weight: 600; font-size: 0.82rem; margin-top: 0.2rem; }
.rf-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.6rem; }
.rf-kpi { display: flex; flex-direction: column; gap: 0.15rem; padding: 0.75rem 0.85rem; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); }
.rf-kpi > span { font-size: 0.72rem; color: var(--text-muted); }
.rf-kpi b { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.rf-kpi small { font-size: 0.7rem; color: var(--text-muted); }
.rf-kpi.principal { background: linear-gradient(135deg, rgba(139, 92, 246, 0.18), rgba(59, 130, 246, 0.12)); border-color: rgba(139, 92, 246, 0.45); }
.rf-kpi.principal b { font-size: 1.35rem; }
.rf-kpi.alerta { border-color: rgba(248, 113, 113, 0.45); }
.rf-kpi .rojo, .tb-rojo { color: #f87171; }
.rf-avance { grid-column: span 2; }
.rf-barra { height: 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); overflow: hidden; margin: 0.3rem 0 0.1rem; }
.rf-barra i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #8b5cf6, #3b82f6); }
.rf-barra i.excedido { background: linear-gradient(90deg, #f59e0b, #ef4444); }
.rf-meses { display: flex; gap: 0.45rem; overflow-x: auto; padding-bottom: 0.3rem; }
.rf-mes { flex: 0 0 auto; min-width: 86px; display: flex; flex-direction: column; align-items: center; gap: 0.2rem; padding: 0.45rem 0.4rem;
  border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); color: inherit; cursor: pointer; font: inherit; }
.rf-mes:hover { border-color: var(--purple); }
.rf-mes-valor { font-size: 0.7rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.rf-mes-col { height: 70px; width: 26px; display: flex; align-items: flex-end; gap: 2px; }
.rf-mes-col i { flex: 1; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #8b5cf6, #3b82f6); }
.rf-mes-col i.nc { background: #f87171; }
.rf-mes-nombre { font-size: 0.72rem; font-weight: 600; }
.rf-grupos { display: flex; flex-direction: column; gap: 0.45rem; }
.rf-grupo { border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.rf-grupo > summary { cursor: pointer; padding: 0.55rem 0.8rem; display: flex; align-items: center; gap: 0.6rem; list-style: none; }
.rf-grupo-n { margin-left: auto; }
.rf-grupo > summary::-webkit-details-marker { display: none; }
.rf-grupo > summary::before { content: '▸'; margin-right: 0.4rem; color: var(--text-muted); }
.rf-grupo[open] > summary::before { content: '▾'; }
  padding: 0.45rem 0.8rem; border-top: 1px solid var(--border); font-size: 0.8rem; }
.rf-doc { border: 1px solid var(--border); background: transparent; color: inherit; border-radius: 8px; padding: 0.15rem 0.45rem; font-size: 0.7rem; cursor: pointer; }
.rf-doc:hover { border-color: var(--purple); }

/* Tablero: la tarjeta entera abre el resumen */
.tb-contrato[data-resumen] { cursor: pointer; transition: border-color 0.15s, transform 0.15s; }
.tb-contrato[data-resumen]:hover { border-color: var(--purple); transform: translateY(-1px); }

/* ==================================================================
   ASIGNADOR DE FACTURAS (vistas/asignador-facturas.js)
   ================================================================== */
.as-pasos { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.as-num { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--gradient); color: #fff; font-size: 0.75rem; margin-right: 0.35rem; }
.as-periodo { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
.as-zona { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.35rem; padding: 1.6rem; cursor: pointer;
  border: 2px dashed var(--border); border-radius: 14px; color: var(--text-muted); font-size: 0.85rem; text-align: center; }
.as-zona:hover, .as-zona.encima { border-color: var(--purple); background: rgba(139, 92, 246, 0.08); color: var(--text); }
.as-zona-ico { font-size: 1.7rem; }
.as-revision { margin-bottom: 1rem; }
.as-lote-cab { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: center; margin-bottom: 0.7rem; }
.as-lote-titulo { font-weight: 700; }
.as-lote-total { display: flex; flex-direction: column; align-items: flex-end; }
.as-lote-total b { font-size: 1.2rem; }
.as-chips { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.8rem; }
.as-chip { border: 1px solid var(--border); background: var(--bg-card); color: inherit; border-radius: 999px; padding: 0.3rem 0.75rem; font-size: 0.76rem; cursor: pointer; }
.as-chip.activo { border-color: var(--purple); background: rgba(139, 92, 246, 0.15); }
.as-chip.ok b { color: #4ade80; } .as-chip.confirmar b { color: #fbbf24; } .as-chip.error b { color: #f87171; }
.as-entrega { border: 1px solid var(--border); border-radius: 12px; padding: 0.75rem 0.9rem; margin-bottom: 0.8rem; }
.as-entrega.obligatoria { border-color: rgba(248, 113, 113, 0.4); }
.as-entrega-cab { display: flex; flex-direction: column; gap: 0.15rem; margin-bottom: 0.5rem; }
.as-entrega-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.7rem; align-items: end; }
.as-entrega-campos .field { margin: 0; }
.as-archivo { display: inline-flex; align-items: center; cursor: pointer; padding: 0.45rem 0.7rem; border: 1px dashed var(--border); border-radius: 10px;
  font-size: 0.78rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as-archivo:hover { border-color: var(--purple); }
.as-lista { display: flex; flex-direction: column; gap: 0.45rem; }
.as-item { border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.as-item.error { border-color: rgba(248, 113, 113, 0.45); }
.as-item.confirmar { border-color: rgba(251, 191, 36, 0.5); }
.as-item > summary { display: grid; grid-template-columns: 1.8rem 1fr auto minmax(110px, auto) 1.8rem; gap: 0.6rem; align-items: center; padding: 0.5rem 0.7rem; cursor: pointer; list-style: none; }
.as-item > summary::-webkit-details-marker { display: none; }
.as-item-id small { display: block; color: var(--text-muted); font-size: 0.7rem; }
.as-item-monto { font-weight: 600; font-variant-numeric: tabular-nums; }
.as-item-acuse { font-size: 0.72rem; color: var(--text-muted); }
.as-falta { color: #f87171; }
.as-estado { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; font-size: 0.8rem; font-weight: 700; }
.as-estado.ok { background: rgba(74, 222, 128, 0.18); color: #4ade80; }
.as-estado.confirmar { background: rgba(251, 191, 36, 0.18); color: #fbbf24; }
.as-estado.igual { background: rgba(148, 163, 184, 0.18); color: #94a3b8; }
.as-estado.error { background: rgba(248, 113, 113, 0.18); color: #f87171; }
.as-quitar { border: 0; background: transparent; color: var(--text-muted); cursor: pointer; font-size: 0.9rem; border-radius: 50%; }
.as-quitar:hover { color: #f87171; }
.as-item-cuerpo { border-top: 1px solid var(--border); padding: 0.7rem 0.9rem; display: flex; flex-direction: column; gap: 0.6rem; }
.as-motivos ul { margin: 0.2rem 0 0; padding-left: 1.1rem; font-size: 0.78rem; }
.as-motivos.error b { color: #f87171; } .as-motivos.confirmar b { color: #fbbf24; } .as-motivos.aviso b { color: var(--text-muted); }
.as-confirmo { display: flex; gap: 0.5rem; align-items: center; font-size: 0.8rem; font-weight: 600; }
.as-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0.4rem 1rem; font-size: 0.78rem; }
.as-datos span { display: block; color: var(--text-muted); font-size: 0.7rem; }
.as-datos code { font-size: 0.72rem; }
.as-ok { color: #4ade80; font-style: normal; } .as-mal { color: #f87171; font-style: normal; }
.as-conceptos { font-size: 0.76rem; border: 1px solid var(--border); border-radius: 10px; padding: 0.4rem 0.6rem; max-height: 180px; overflow: auto; }
.as-conceptos > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.15rem 0; }
.as-propio { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: center; }
.as-propio input[type=date] { width: auto; padding: 0.25rem 0.4rem; margin-left: 0.3rem; }
.as-pie { display: flex; justify-content: space-between; gap: 1rem; align-items: center; flex-wrap: wrap; margin-top: 0.9rem; }

/* Facturas: contrato y periodo en la lista y la ficha */
.fx-asig { display: flex; flex-direction: column; gap: 0.1rem; }
.fx-asig-ct { font-size: 0.76rem; font-weight: 600; }
.fx-asig-mes { font-size: 0.7rem; color: var(--text-muted); }
.fx-ficha-cab { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0.6rem; margin-bottom: 0.8rem; }
.fx-ficha-cab > div { border: 1px solid var(--border); border-radius: 12px; padding: 0.55rem 0.7rem; display: flex; flex-direction: column; gap: 0.15rem; }
.fx-ficha-cab span { font-size: 0.7rem; color: var(--text-muted); }
.fx-ficha-cab small { font-size: 0.7rem; color: var(--text-muted); }
.fx-ficha-cab.asignada > div:first-child { border-color: rgba(139, 92, 246, 0.45); }

/* Resumen facturado: cada factura como tarjeta desplegable */
.rf-fact { border-top: 1px solid var(--border); }
.rf-fact > summary { display: grid; grid-template-columns: minmax(150px, 1fr) auto 130px 100px; gap: 0.6rem; align-items: center;
  padding: 0.55rem 0.8rem; cursor: pointer; list-style: none; }
.rf-fact > summary::-webkit-details-marker { display: none; }
.rf-fact > summary:hover { background: rgba(139, 92, 246, 0.06); }
.rf-fact[open] > summary { background: rgba(139, 92, 246, 0.09); }
.rf-fact-id small { display: block; font-size: 0.7rem; color: var(--text-muted); }
.rf-fact-pills { display: flex; gap: 0.3rem; flex-wrap: wrap; justify-content: flex-end; }
.rf-fact-monto { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.rf-fact.nota .rf-fact-monto { color: #f87171; }
.rf-fact.cancelada .rf-fact-monto { text-decoration: line-through; opacity: 0.6; }
.rf-fact-cuerpo { padding: 0.4rem 0.9rem 0.9rem; display: flex; flex-direction: column; gap: 0.7rem; }
.rf-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.6rem; }
.rf-dato, .rf-importes > div, .rf-ingreso > div { display: flex; flex-direction: column; gap: 0.1rem; }
.rf-dato span, .rf-importes span, .rf-ingreso span { font-size: 0.68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.rf-dato b, .rf-ingreso b { font-size: 0.82rem; font-weight: 600; }
.rf-dato small, .rf-ingreso small { font-size: 0.72rem; color: var(--text-muted); font-family: monospace; }
.rf-importes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; padding: 0.6rem 0.8rem; border-radius: 12px; background: var(--bg-panel); }
.rf-importes b { font-variant-numeric: tabular-nums; }
.rf-importes .total b { font-size: 1.05rem; }
.rf-ingreso { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0.6rem; padding: 0.6rem 0.8rem; border-radius: 12px;
  border: 1px dashed var(--border); }
.rf-fact-docs { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; }
.rf-fact-docs .rf-doc { padding: 0.35rem 0.7rem; font-size: 0.76rem; }
.rf-doc.ausente { opacity: 0.45; cursor: default; border-style: dashed; }
.rf-uuid { margin-left: auto; font-size: 0.68rem; color: var(--text-muted); }
@media (max-width: 760px) { .rf-fact > summary { grid-template-columns: 1fr auto; } .rf-fact-pills { grid-column: 1 / -1; justify-content: flex-start; } .rf-importes { grid-template-columns: 1fr; } }

/* La factura se abre solo si se quiere ver el detalle */
.rf-fact-ver { justify-self: end; font-size: 0.72rem; color: var(--purple); border: 1px solid rgba(139, 92, 246, 0.4); border-radius: 999px; padding: 0.15rem 0.6rem; white-space: nowrap; }
.rf-fact-ver::after { content: ' ▾'; }
.rf-fact[open] .rf-fact-ver::after { content: ' ▴'; }
.rf-fact[open] .rf-fact-ver { background: rgba(139, 92, 246, 0.15); }
.as-motivo-corto { display: block; font-size: 0.72rem !important; margin-top: 0.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60ch; }
.as-motivo-corto.error { color: #f87171 !important; }
.as-motivo-corto.confirmar { color: #fbbf24 !important; }
@media (max-width: 760px) { .rf-fact-ver { display: none; } }

/* ID del contrato (ui/id-contrato.js): etiqueta #123 que se copia */
.id-contrato { display: inline-flex; align-items: center; padding: 0.12rem 0.55rem; border-radius: 999px; cursor: copy;
  border: 1px solid rgba(139, 92, 246, 0.45); background: rgba(139, 92, 246, 0.12); color: var(--text);
  font: 600 0.74rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
.id-contrato:hover { background: rgba(139, 92, 246, 0.28); border-color: var(--purple); }

/* Asignación de personal: quién sale y quién entra al reasignar */
.ap-cambio { display: flex; align-items: center; gap: 0.3rem; flex-wrap: wrap; }
.ap-sale .ap-chip { opacity: 0.55; text-decoration: line-through; }
.ap-flecha { color: var(--purple); font-weight: 700; }
.ap-reasigna { color: #fbbf24; font-weight: 600; }

/* ==================================================================
   SEGUIMIENTO DE TIMBRADO (vistas/seguimiento-timbrado.js)
   ================================================================== */
.st-filtros { display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: flex-end; }
.st-campo { margin: 0 !important; flex: 1 1 150px; min-width: 150px; }
.st-buscar { flex: 2 1 220px; }
.st-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; margin: 1rem 0 0.8rem; }
.st-kpi { display: flex; flex-direction: column; gap: 0.2rem; padding: 1rem 1.1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); }
.st-kpi span, .st-kpi small { font-size: 0.74rem; color: var(--text-muted); }
.st-kpi b { font-size: 1.8rem; font-variant-numeric: tabular-nums; }
.st-kpi.ok b { color: #4ade80; } .st-kpi.pend b { color: #fdba74; }
.st-meses { display: flex; gap: 0.7rem; flex-wrap: wrap; margin-bottom: 1rem; }
.st-mes { flex: 1 1 180px; display: flex; flex-direction: column; gap: 0.45rem; padding: 0.8rem 0.95rem; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.st-mes-cab { display: flex; justify-content: space-between; gap: 0.5rem; }
.st-mes-cab span, .st-mes small { color: var(--text-muted); font-size: 0.76rem; }
.st-barra { height: 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
.st-barra i { display: block; height: 100%; background: #8b7cf6; }
.st-tabla-caja { overflow-x: auto; }
.st-tabla { width: 100%; border-collapse: collapse; font-size: 0.8rem; min-width: 1300px; }
.st-tabla th { text-align: left; padding: 0.6rem; color: var(--text-muted); font-weight: 600; border-bottom: 1px solid var(--border); white-space: nowrap; }
.st-tabla td { padding: 0.55rem 0.6rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.st-contrato { font-weight: 600; }
.st-tenue { color: var(--text-muted); }
.st-nw { white-space: nowrap; }
.st-centro { text-align: center !important; } .st-der { text-align: right !important; font-variant-numeric: tabular-nums; }
.st-etq { padding: 0.1rem 0.45rem; border-radius: 6px; background: rgba(255, 255, 255, 0.07); font-size: 0.72rem; white-space: nowrap; }
.st-folio { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.75rem; max-width: 180px; }
.st-dias { display: inline-block; min-width: 2.4rem; text-align: center; padding: 0.15rem 0.5rem; border-radius: 999px; font-weight: 700; font-variant-numeric: tabular-nums; }
.st-dias.ok { background: rgba(74, 222, 128, 0.16); color: #4ade80; }
.st-dias.medio { background: rgba(251, 191, 36, 0.16); color: #fbbf24; }
.st-dias.alto { background: rgba(248, 113, 113, 0.16); color: #f87171; }
.st-comentario { min-width: 200px; max-width: 280px; }
.st-coment { font-size: 0.76rem; }
.st-editar { border: 0; background: transparent; color: var(--text-muted); cursor: pointer; padding: 0.2rem 0.35rem; border-radius: 6px; }
.st-editar:hover { color: var(--text); background: rgba(255, 255, 255, 0.08); }
.st-editor { display: flex; gap: 0.35rem; }
.st-editor input { flex: 1; min-width: 0; }
.st-pie { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 0.8rem; font-size: 0.76rem; }
.st-paginas { display: flex; gap: 0.5rem; align-items: center; }
@media (max-width: 900px) { .st-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Seguimiento de timbrado: leyenda de proyectos excluidos (migración 84) */
.st-leyenda { display: inline-flex; align-items: center; gap: 0.45rem; margin-top: 1rem; padding: 0.4rem 0.85rem; border-radius: 999px;
  border: 1px solid rgba(139, 92, 246, 0.4); background: rgba(139, 92, 246, 0.1); font-size: 0.8rem; font-weight: 600; }
.st-leyenda-ico { color: #a78bfa; }

/* Usuarios: acceso al sistema (dar / quitar) */
.us-acceso { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.7rem; padding: 0.75rem 0.9rem; border-radius: 12px; border: 1px solid var(--border); }
.us-acceso.con { border-color: rgba(74, 222, 128, 0.4); flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.us-acceso.sin { border-style: dashed; }
.us-acceso-botones { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.us-acceso-dar { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.us-acceso-dar input { flex: 1 1 240px; }

/* ==================================================================
   FORMATOS DE FACTURACIÓN (vistas/formatos-factura.js)
   ================================================================== */
.ff-filtros { display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: flex-end; }
.ff-campo { margin: 0 !important; flex: 1 1 160px; min-width: 160px; }
.ff-buscar { flex: 2 1 220px; }
.ff-conteos { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 1rem 0 0.6rem; }
.ff-tabla-caja { overflow-x: auto; }
.ff-tabla { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.ff-lista { min-width: 1100px; }
.ff-tabla th { text-align: left; padding: 0.6rem; color: var(--text-muted); font-weight: 600; border-bottom: 1px solid var(--border); white-space: nowrap; }
.ff-tabla td { padding: 0.55rem 0.6rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.ff-tabla tr.con-error td { background: rgba(248, 113, 113, 0.06); }
.ff-der { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ff-tenue { color: var(--text-muted); font-size: 0.74rem; margin-top: 0.15rem; }
.ff-persona { display: flex; flex-direction: column; gap: 0.1rem; }
.ff-persona code { font-size: 0.74rem; color: #c4b5fd; }
.ff-persona span { font-size: 0.76rem; }
.ff-acciones { white-space: nowrap; text-align: right; }
.ff-acciones .btn + .btn { margin-left: 0.35rem; }
.ff-var { display: inline-block; padding: 0 0.4rem; border-radius: 6px; background: rgba(139, 92, 246, 0.2); color: #c4b5fd; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.74rem; }
.ff-error { color: #f87171; font-size: 0.74rem; margin-top: 0.2rem; }
.ff-cab { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: 0.9rem; }
.ff-cab-ct { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.ff-cab-partes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0.6rem; }
.ff-cab-partes > div { border: 1px solid var(--border); border-radius: 12px; padding: 0.6rem 0.8rem; }
.ff-cab-partes > div > span { font-size: 0.7rem; color: var(--text-muted); }
.ff-seccion { font-weight: 600; font-size: 0.85rem; margin: 1rem 0 0.45rem; }
.ff-obs { border: 1px solid var(--border); border-radius: 12px; padding: 0.7rem 0.9rem; line-height: 1.8; font-size: 0.85rem; }
.ff-obs-final { display: flex; gap: 0.8rem; align-items: flex-start; }
.ff-obs-final span { flex: 1; }
.ff-descarga { margin-top: 1rem; padding-top: 0.4rem; border-top: 1px solid var(--border); }
.ff-descarga-fila { display: flex; gap: 0.8rem; align-items: flex-end; flex-wrap: wrap; margin: 0.6rem 0; }
.ff-archivo { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; border: 2px dashed var(--border); border-radius: 12px; cursor: pointer; font-weight: 600; }
.ff-archivo:hover { border-color: var(--purple); }
.ff-avisos { display: flex; gap: 0.4rem; flex-wrap: wrap; margin: 0.6rem 0; }
.ff-listo { margin-top: 0.6rem; color: #4ade80; font-weight: 600; font-size: 0.85rem; }
.ff-historial { margin-top: 1rem; font-size: 0.8rem; }
.ff-historial > div { padding: 0.3rem 0; display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* Formatos de facturación: método y forma de pago (migración 86) */
.ff-pago { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: center; margin: 0.4rem 0 0.6rem; }
.ff-pago > div { display: flex; flex-direction: column; gap: 0.1rem; border: 1px solid var(--border); border-radius: 12px; padding: 0.5rem 0.8rem; min-width: 220px; }
.ff-pago span { font-size: 0.7rem; color: var(--text-muted); }
.ff-pago b { font-size: 0.85rem; }

/* ---- Modal "Fianzas del contrato": ingresar fianza ------------------
   Mismas variables y piezas del resto (cf-zona, segmentos, pill,
   aviso-suave). Solo presentación. */
.fz-ingresar { border-top: 1px solid var(--border); padding-top: 1.1rem; }
.fz-ingresar-cab { display: flex; justify-content: space-between; align-items: center; gap: 0.8rem; flex-wrap: wrap; margin-bottom: 0.9rem; }
.fz-modos .segmento { padding: 0.55rem 1rem; font-size: 0.85rem; }
.fz-modos .segmento:not(.activo) .segmento-n { color: var(--text-muted); }
.fz-subtitulo { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-muted); margin: 0.2rem 0 0.5rem; }
.fz-tenue { color: var(--text-muted); }
.fz-chico { font-size: 0.75rem; }
.fz-req { color: #fca5a5; font-weight: 700; }
.fz-vacio { margin-top: 0.9rem; padding: 1rem; border: 1px dashed var(--border); border-radius: 12px; color: var(--text-muted); font-size: 0.84rem; text-align: center; }
.fz-nota { font-size: 0.8rem; padding: 0.6rem 0.8rem; border-radius: 10px; margin-bottom: 0.8rem; background: rgba(79, 124, 255, 0.1); border: 1px solid rgba(79, 124, 255, 0.35); }
/* .cf-zona usa display:flex, que le gana al atributo hidden */
.fz-ingresar [hidden], .fz-archivo [hidden] { display: none !important; }

/* Documentos: XML y PDF juntos (una columna en pantallas angostas) */
.fz-documentos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; }
.fz-documentos > :only-child, .fz-documentos > [hidden] + div { grid-column: 1 / -1; }
.fz-archivo-titulo { font-size: 0.78rem; color: var(--text-muted); font-weight: 500; }
.fz-zona { margin-top: 0.35rem; min-height: 112px; text-align: center; }
.fz-zona small { font-size: 0.72rem; color: var(--text-muted); }
.fz-tarjeta {
  display: flex; align-items: center; gap: 0.7rem; margin-top: 0.35rem; min-height: 112px; padding: 0.8rem 0.9rem;
  border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); transition: border-color 0.15s, background 0.15s;
}
.fz-tarjeta.fz-tarjeta-ok { border-color: rgba(34, 197, 94, 0.45); }
.fz-tarjeta.fz-tarjeta-error { border-color: rgba(248, 113, 113, 0.6); background: rgba(248, 113, 113, 0.07); }
.fz-tarjeta.fz-encima { border-color: var(--purple); background: rgba(139, 92, 246, 0.08); }
.fz-tarjeta-ico { font-size: 1.6rem; flex: none; }
.fz-tarjeta-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.15rem; }
.fz-tarjeta-info b { font-size: 0.85rem; overflow-wrap: anywhere; }
.fz-tarjeta-info small { font-size: 0.74rem; color: var(--text-muted); }
.fz-tarjeta .pill { flex: none; }

/* Formularios en rejilla de 2 columnas */
.fz-rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem 1rem; }
.fz-ancho { grid-column: 1 / -1; }
.fz-campo label { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; }
.fz-campo-falta input, .fz-campo-falta select { border-color: rgba(248, 113, 113, 0.55); }
.fz-campo [aria-invalid="true"] { border-color: var(--red); }
.fz-error-campo { font-size: 0.75rem; color: #fca5a5; margin-top: 0.25rem; min-height: 0; }
.fz-error-campo:empty { display: none; }
.fz-destacado { padding: 0.8rem 0.9rem; border-radius: 12px; background: rgba(245, 158, 11, 0.08); border: 1px solid rgba(245, 158, 11, 0.45); }
.fz-destacado label { color: #fcd34d; font-weight: 600; }

/* "Otro": el campo del nombre se despliega suave */
.fz-desplegable { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 0.22s ease, opacity 0.22s ease, margin-top 0.22s ease; }
.fz-desplegable > div { overflow: hidden; min-height: 0; }
.fz-desplegable.abierto { grid-template-rows: 1fr; opacity: 1; margin-top: 0.5rem; }
.fz-sublabel { margin-bottom: 0.25rem; }

/* Previsualización del XML */
.fz-estado-grande { display: flex; gap: 0.8rem; align-items: center; margin-top: 0.9rem; padding: 0.85rem 1rem; border-radius: 14px; border: 1px solid var(--border); }
.fz-estado-ico { font-size: 1.6rem; flex: none; }
.fz-estado-titulo { font-size: 1rem; font-weight: 800; }
.fz-estado-motivo { font-size: 0.83rem; margin-top: 0.1rem; }
.fz-estado-ok { background: rgba(34, 197, 94, 0.1); border-color: rgba(34, 197, 94, 0.5); }
.fz-estado-ok .fz-estado-titulo { color: #4ade80; }
.fz-estado-alerta { background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.5); }
.fz-estado-alerta .fz-estado-titulo { color: #fcd34d; }
.fz-estado-mal { background: rgba(239, 68, 68, 0.1); border-color: rgba(239, 68, 68, 0.55); }
.fz-estado-mal .fz-estado-titulo { color: #fca5a5; }
.fz-bloque { margin-top: 0.9rem; padding: 0.9rem 1rem; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.fz-grupo + .fz-grupo { margin-top: 0.9rem; padding-top: 0.9rem; border-top: 1px solid var(--border); }
.fz-grupo-titulo { font-size: 0.82rem; font-weight: 700; margin-bottom: 0.55rem; }
.fz-dato { display: flex; flex-direction: column; gap: 0.15rem; }
.fz-dato-etiqueta { font-size: 0.75rem; color: var(--text-muted); }
.fz-dato-valor { font-size: 0.86rem; overflow-wrap: anywhere; }
.pill.fz-pill-chica { font-size: 0.64rem; padding: 0.08rem 0.45rem; font-weight: 700; }
.fz-avisos { margin: 0.7rem 0 0; padding-left: 1.1rem; font-size: 0.82rem; display: flex; flex-direction: column; gap: 0.25rem; }
.fz-fila-accion { display: flex; justify-content: space-between; gap: 0.5rem; align-items: center; flex-wrap: wrap; margin-top: 0.4rem; }
.fz-resultado { padding: 0.4rem 0; border-bottom: 1px solid var(--border); font-size: 0.82rem; }
.fz-confirmacion { display: flex; gap: 0.55rem; align-items: flex-start; margin-top: 0.8rem; font-size: 0.85rem; color: var(--text); }
.fz-confirmacion input { width: auto; margin-top: 0.2rem; flex: none; }

/* Pie fijo: Cerrar a la izquierda, acción principal a la derecha */
.modal-actions.fz-pie { justify-content: space-between; align-items: center; flex-wrap: wrap; }
.fz-pie-derecha { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; justify-content: flex-end; margin-left: auto; }
.fz-ayuda { font-size: 0.78rem; color: var(--text-muted); max-width: 420px; text-align: right; }
.fz-ayuda.fz-ayuda-aviso { color: #fcd34d; }

/* Foco visible con teclado (zonas, pestañas, botones del modal) */
.modal-fianzas .fz-zona:focus-visible,
.modal-fianzas .segmento:focus-visible,
.modal-fianzas .btn:focus-visible,
.modal-fianzas .modal-close:focus-visible,
.modal-fianzas input[type="checkbox"]:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }

/* Alturas cómodas a 1366x768 y una columna en móvil */
.modal-box.modal-fianzas { max-height: 94vh; }
@media (max-width: 640px) {
  .fz-documentos, .fz-rejilla { grid-template-columns: 1fr; }
  .fz-ingresar-cab { flex-direction: column; align-items: stretch; }
  .fz-modos { display: flex; }
  .fz-modos .segmento { flex: 1; justify-content: center; }
  .fz-pie-derecha { width: 100%; }
  .fz-pie-derecha .btn { width: 100%; }
  .fz-ayuda { text-align: left; max-width: none; }
}
.fz-paginacion { display: flex; justify-content: center; align-items: center; gap: 0.8rem; margin-top: 0.8rem; font-size: 0.82rem; color: var(--text-muted); }

/* ==================================================================
   ASIGNADOR · pestañas Completar entrega y Sin asignar
   (vistas/asignador-pendientes.js)
   ================================================================== */
.ap-pestanas { display: flex; gap: 0.3rem; border-bottom: 1px solid var(--border); margin-bottom: 1rem; flex-wrap: wrap; }
.ap-pestana { min-height: 44px; padding: 0 1rem; background: transparent; border: 0; border-bottom: 3px solid transparent; color: var(--text-muted);
  font: inherit; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 0.45rem; }
.ap-pestana.activa { color: var(--text); border-bottom-color: var(--purple); }
.ap-conteo { padding: 0.05rem 0.5rem; border-radius: 999px; background: rgba(139, 92, 246, 0.18); color: #c4b5fd; font-size: 0.72rem; }
.ap-filtros { display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: flex-end; }
.ap-filtros-extra { display: contents; }
.ap-campo { margin: 0 !important; flex: 1 1 150px; min-width: 150px; }
.ap-buscar { flex: 2 1 220px; }
.ap-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0.8rem; margin: 1rem 0 0.8rem; }
.ap-kpi { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.9rem 1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); }
.ap-kpi span, .ap-kpi small { font-size: 0.74rem; color: var(--text-muted); }
.ap-kpi b { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.ap-kpi.pend b { color: #fdba74; } .ap-kpi.ok b { color: #4ade80; }
.ap-tabla-caja { overflow-x: auto; }
.ap-tabla { width: 100%; border-collapse: collapse; font-size: 0.8rem; min-width: 900px; }
.ap-tabla th { text-align: left; padding: 0.6rem; color: var(--text-muted); font-weight: 600; border-bottom: 1px solid var(--border); white-space: nowrap; }
.ap-tabla td { padding: 0.55rem 0.6rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.ap-tabla tr.ap-marcada td { background: rgba(139, 92, 246, 0.08); }
.ap-tabla input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--purple); }
.ap-der { text-align: right !important; font-variant-numeric: tabular-nums; }
.ap-nw { white-space: nowrap; }
.ap-tenue { color: var(--text-muted); font-size: 0.76rem; }
.ap-folio { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: nowrap; }
.ap-cab { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; margin: 0.8rem 0; }
.ap-entrega { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1rem; align-items: start; }
.ap-sel { display: flex; gap: 0.8rem; align-items: center; margin-bottom: 0.6rem; }
.ap-sel label { display: flex; gap: 0.5rem; align-items: center; }
.ap-panel { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: 0.7rem; }
.ap-panel h2 { margin: 0; font-size: 1.05rem; }
.ap-panel .field { margin: 0; }
.ap-panel .btn-primary { min-height: 44px; }
.ap-check { display: flex; gap: 0.5rem; align-items: center; font-size: 0.82rem; }
.ap-archivo { display: inline-flex; align-items: center; min-height: 36px; padding: 0 0.8rem; border: 1px dashed var(--border); border-radius: 10px; cursor: pointer; font-size: 0.8rem; }
.ap-archivo:hover { border-color: var(--purple); }
.ap-archivo-grande { min-height: 48px; width: 100%; border-width: 2px; font-weight: 600; }
.ap-barra { display: flex; justify-content: space-between; align-items: center; gap: 0.8rem; flex-wrap: wrap; margin-bottom: 0.8rem;
  padding: 0.7rem 1rem; border-radius: 14px; border: 1px solid rgba(139, 92, 246, 0.6); background: rgba(139, 92, 246, 0.12); }
.ap-barra-acciones { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.ap-barra select { min-height: 40px; }
.ap-pie { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 0.8rem; }
.ap-paginas { display: flex; gap: 0.5rem; align-items: center; font-size: 0.8rem; }
@media (max-width: 900px) { .ap-entrega { grid-template-columns: 1fr; } .ap-panel { position: static; } }

/* ==================================================================
   CONTRATO ANUAL POR CLIENTE (vistas/contratos-anuales.js)
   ================================================================== */
.ca-ayuda { color: var(--text-muted); font-size: 0.8rem; margin: 0 0 0.8rem; }
.ca-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.2rem 0.9rem; }
.ca-vista { margin-top: 0.6rem; }
.ca-nombre { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.8rem 1rem; border-radius: 12px; border: 1px solid rgba(139, 92, 246, 0.6); background: rgba(139, 92, 246, 0.1); }
.ca-nombre span, .ca-nombre small { font-size: 0.75rem; color: var(--text-muted); }
.ca-nombre b { font-size: 1rem; }
.ca-existe { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; padding: 0.8rem 1rem; border-radius: 12px; border: 1px solid rgba(251, 191, 36, 0.6); background: rgba(251, 191, 36, 0.08); }
.ca-renovar-cab { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: 0.8rem; }

/* ==================================================================
   FACTURACIÓN DEL GRUPO (vistas/facturacion-grupo.js)
   ================================================================== */
.fg-filtros { display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: flex-end; }
.fg-campo { margin: 0 !important; flex: 1 1 170px; min-width: 160px; }
.fg-campo-modo { flex: 0 1 auto; }
.fg-etq { display: block; font-size: 0.78rem; color: var(--text-muted); margin-bottom: 0.35rem; }
.fg-fechas { display: flex; gap: 0.4rem; }
.fg-fechas input { min-width: 0; flex: 1; }
.fg-segmento { display: inline-flex; gap: 0.2rem; padding: 0.2rem; border: 1px solid var(--border); border-radius: 10px; flex-wrap: wrap; }
.fg-segmento button { min-height: 40px; padding: 0 0.9rem; border: 0; border-radius: 8px; background: transparent; color: var(--text-muted); font: inherit; font-weight: 600; font-size: 0.82rem; cursor: pointer; }
.fg-segmento button.activo { background: var(--purple); color: #fff; }
.fg-exportar { min-height: 44px; }
.fg-cab-empresa { display: flex; gap: 0.7rem; align-items: center; flex-wrap: wrap; margin: 1rem 0 0.2rem; }
.fg-cab-empresa h2 { margin: 0; font-size: 1.25rem; }
.fg-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0.8rem; margin: 1rem 0; }
.fg-kpi { display: flex; flex-direction: column; gap: 0.25rem; padding: 1rem 1.1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-card); }
.fg-kpi span, .fg-kpi small { font-size: 0.76rem; color: var(--text-muted); }
.fg-kpi b { font-size: 1.65rem; font-variant-numeric: tabular-nums; }
.fg-kpi .pill { align-self: flex-start; margin-top: 0.3rem; }
.fg-kpi-principal { border-color: rgba(139, 92, 246, 0.7); }
.fg-kpi-principal b { color: #c4b5fd; }
.fg-kpi-aparte b { color: var(--text-muted); }
.fg-resta { color: #fdba74 !important; }
.fg-h2 { margin: 0 0 0.7rem; font-size: 1.05rem; }
.fg-tenue { color: var(--text-muted); font-size: 0.78rem; }
.fg-der { text-align: right !important; font-variant-numeric: tabular-nums; }
.fg-graf-cab { display: flex; justify-content: space-between; gap: 0.8rem; flex-wrap: wrap; align-items: center; }
.fg-leyenda { display: inline-flex; gap: 0.4rem; align-items: center; font-size: 0.76rem; color: var(--text-muted); }
.fg-cuadro { display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: #7aa7ff; margin-left: 0.4rem; }
.fg-cuadro-ant { background: #4a4870; }
.fg-graf { width: 100%; height: auto; }
.fg-graf .fg-barra { fill: #7aa7ff; } .fg-graf .fg-barra-ant { fill: #4a4870; }
.fg-graf .fg-valor { font-size: 11px; fill: var(--text); } .fg-graf .fg-mes { font-size: 12px; fill: var(--text-muted); }
.fg-graf .fg-eje { stroke: var(--border); }
.fg-aviso { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin: 1rem 0;
  padding: 0.9rem 1.1rem; border-radius: 14px; border: 1px solid rgba(251, 146, 60, 0.5); background: rgba(251, 146, 60, 0.08); }
.fg-tabla-caja { overflow-x: auto; }
.fg-tabla { width: 100%; border-collapse: collapse; font-size: 0.84rem; min-width: 760px; }
.fg-tabla th { text-align: left; padding: 0.6rem; color: var(--text-muted); font-weight: 600; border-bottom: 1px solid var(--border); white-space: nowrap; }
.fg-tabla td { padding: 0.55rem 0.6rem; border-bottom: 1px solid var(--border); }
.fg-enlace { background: none; border: 0; padding: 0.3rem 0; color: var(--text); font: inherit; font-weight: 600; text-align: left; cursor: pointer; min-height: 32px; }
.fg-enlace:hover { color: #c4b5fd; text-decoration: underline; }
.fg-dos { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 1rem; margin: 1rem 0; }
.fg-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.15rem 0.8rem; align-items: center; padding: 0.45rem 0; }
.fg-item-titulo { font-size: 0.86rem; }
.fg-item-barra { grid-column: 1 / -1; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, 0.06); }
.fg-item-barra i { display: block; height: 6px; border-radius: 3px; background: #7aa7ff; }

/* ==================================================================
   COBRANZA · INGRESOS Y APLICACIÓN (vistas/cobranza-aplicacion.js)
   ================================================================== */
.ca-fila { display: flex; gap: 0.7rem; flex-wrap: wrap; align-items: flex-end; }
.ca-entre { justify-content: space-between; align-items: center; margin: 0.6rem 0; }
.ca-campo { margin: 0 !important; flex: 1 1 200px; min-width: 180px; }
.ca-campo-ancho { flex: 2 1 340px; }
.ca-campo select + select, .ca-campo input + select { margin-top: 0.35rem; }
.ca-tabla { min-width: 1250px; }
.ca-monto, .ca-tc { width: 130px; min-height: 38px; text-align: right; }
.ca-tc { margin-top: 0.3rem; display: block; margin-left: auto; }
.ca-resta { color: #fdba74; }
.ca-aviso { margin: 0.6rem 0; padding: 0.7rem 1rem; border-radius: 12px; border: 1px solid rgba(139, 92, 246, 0.6); background: rgba(139, 92, 246, 0.1); }

/* Fianzas: aviso de fianza de convenio modificatorio */
.fz-aviso-convenio { margin: 0.5rem 0 0.8rem; padding: 0.7rem 1rem; border-radius: 12px; border: 1px solid rgba(251, 146, 60, 0.6); background: rgba(251, 146, 60, 0.08); }

/* ==================================================================
   EXPEDIENTE DEL CONTRATO (ui/expediente.js)
   ================================================================== */
.ex-tenue { color: var(--text-muted); font-size: 0.78rem; margin: 0 0 0.6rem; }
.ex-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.ex-item { display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto; gap: 0.7rem; align-items: center;
  padding: 0.6rem 0.8rem; border: 1px solid var(--border); border-radius: 12px; }
.ex-marca { width: 2rem; height: 2rem; border-radius: 999px; display: grid; place-items: center; font-weight: 700; }
.ex-tiene .ex-marca { background: rgba(74, 222, 128, 0.15); color: #4ade80; }
.ex-falta .ex-marca { background: rgba(248, 113, 113, 0.15); color: #f87171; }
.ex-sin_permiso .ex-marca { background: rgba(255, 255, 255, 0.06); color: var(--text-muted); }
.ex-nombre { display: flex; flex-wrap: wrap; gap: 0.2rem 0.5rem; align-items: center; }
.ex-nombre small { flex-basis: 100%; color: var(--text-muted); font-size: 0.76rem; overflow: hidden; text-overflow: ellipsis; }
.ex-acciones { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.ex-acciones .btn { min-height: 36px; }
.ex-version { max-width: 220px; }
.ex-visor { height: min(75vh, 820px); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: #fff; }
.ex-visor iframe { width: 100%; height: 100%; border: 0; }
@media (max-width: 640px) { .ex-item { grid-template-columns: 2rem minmax(0, 1fr); } .ex-acciones { grid-column: 1 / -1; justify-content: flex-start; } }

.fz-check-vencidos { display: inline-flex; gap: 0.45rem; align-items: center; font-size: 0.82rem; color: var(--text-muted); min-height: 40px; }

/* Expediente en la lista de contratos */
.ex-celda { min-width: 190px; max-width: 250px; }
.ex-chips { display: flex; flex-wrap: wrap; gap: 0.25rem; }
button.ex-chip-falta:hover, button.ex-chip-opcional:hover { border-color: #a78bfa; color: var(--text); }
.ex-chip { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem 0.45rem; border-radius: 999px; font-size: 0.7rem; font-weight: 600;
  border: 1px solid transparent; white-space: nowrap; font-family: inherit; line-height: 1.4; }
button.ex-chip { cursor: pointer; min-height: 26px; }
.ex-chip-tiene { background: rgba(74, 222, 128, 0.14); color: #4ade80; border-color: rgba(74, 222, 128, 0.35); }
button.ex-chip-tiene:hover { background: rgba(74, 222, 128, 0.28); }
.ex-chip-falta { background: rgba(248, 113, 113, 0.14); color: #fca5a5; border-color: rgba(248, 113, 113, 0.35); }
.ex-chip-opcional { background: rgba(255, 255, 255, 0.05); color: var(--text-muted); border-color: var(--border); }
.ex-chip-sin { background: transparent; color: var(--text-muted); border-color: var(--border); }
.ex-cargando { color: var(--text-muted); }
/* El nombre largo del contrato ya no estira el renglón: 3 líneas y el resto en el título */
.celda-recortada { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-width: 260px; }

.fz-origen { min-height: 40px; max-width: 220px; }
