/* FirmaSimple · herramienta de DAS LATAM (daslatam.org/firmasimple/).
   Paleta y tipografías de daslatam.org (assets/estilo.css de /home/hpp/daslatam):
   índigo #3e4aed como acento, texto pizarra, Sora en títulos e Inter en el cuerpo.
   Todo cuelga de .fes-* (nombre interno); el pie de DAS LATAM trae su das-pie.css. */
@font-face { font-family: "Inter"; src: url(fuentes/inter-latin.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Sora"; src: url(fuentes/sora-latin.woff2) format("woff2"); font-weight: 100 800; font-display: swap; }
:root {
  --fes-acento: #3e4aed; --fes-acento-2: #2f37c4; --fes-suave: #dfe3ff; --fes-fondo-acento: #eef0ff;
  --fes-tinta: #0f172a; --fes-gris: #475569; --fes-gris-2: #64748b; --fes-borde: #e2e8f0;
  --fes-fondo: #f6f7fb; --fes-grad: linear-gradient(90deg, #5900d1, #3e4aed 55%, #008cea); --fes-blanco: #fff; --fes-rojo: #b91c1c; --fes-ambar: #b45309;
  --fes-radio: 12px; --fes-sombra: 0 1px 2px rgba(0,0,0,.05), 0 4px 18px rgba(28,25,23,.06);
}
.fes-body { margin: 0; background: var(--fes-fondo); color: var(--fes-tinta);
  font: 16px/1.6 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
.fes-body h1, .fes-body h2, .fes-body h3 { font-family: Sora, Inter, system-ui, sans-serif; color: var(--fes-tinta); font-weight: 650; letter-spacing: -.015em; }
.fes-body *, .fes-body *::before, .fes-body *::after { box-sizing: border-box; }
.fes-body { --fes-lado: 16px; }
@media (min-width: 761px) { .fes-body { --fes-lado: 24px; } }
/* UN solo contenedor para todo (cabecera, contenido de cada página, pie de la app y
   pie de DAS LATAM): mismo ancho máximo, el de daslatam.org, y el mismo margen lateral
   mínimo. Nada de columnas más angostas adentro: la página no cambia de ancho al bajar
   (pedido de Ariel, 2026-10-26). Los fondos van a sangre completa por fuera. */
.fes-ancho, .fes-body .dl-pie-cont { max-width: 72rem; margin: 0 auto; padding: 0 var(--fes-lado); }

/* cabecera de la app */
.fes-top { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--fes-borde); }
.fes-top::after { content: ""; display: block; height: 3px; background: var(--fes-grad); }
.fes-top-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; flex-wrap: wrap; padding-top: 6px; padding-bottom: 6px; }
.fes-marca { display: flex; align-items: center; gap: 12px; color: var(--fes-tinta); text-decoration: none; }
.fes-das { line-height: 0; }
.fes-das img { width: 150px; height: auto; display: block; }
.fes-nombre { font: 650 18px/1.1 Sora, Inter, sans-serif; color: var(--fes-tinta); text-decoration: none; padding-left: 12px; border-left: 1px solid var(--fes-borde); }
.fes-nombre small { display: block; font: 500 12px/1.3 Inter, sans-serif; color: var(--fes-gris-2); letter-spacing: .02em; }
.fes-nav { display: flex; align-items: center; gap: 4px 16px; flex-wrap: wrap; font-size: 15px; }
.fes-nav a, .fes-link { color: var(--fes-gris); text-decoration: none; }
.fes-nav a:hover, .fes-link:hover { color: var(--fes-acento); }
.fes-nav a[aria-current] { color: var(--fes-acento); font-weight: 600; }
.fes-link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
[hidden] { display: none !important; }

/* botones y formularios */
.fes-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--fes-acento); color: #fff !important;
  border: 1px solid var(--fes-acento); border-radius: 9px; padding: 11px 18px; font: 600 15px/1.2 inherit; font-family: inherit;
  text-decoration: none; cursor: pointer; min-height: 44px; }
.fes-btn:hover { background: var(--fes-acento-2); }
.fes-btn:disabled { opacity: .5; cursor: not-allowed; }
.fes-btn-2 { background: var(--fes-blanco); color: var(--fes-tinta) !important; border-color: var(--fes-borde); }
.fes-btn-2:hover { background: #f1f5f9; }
.fes-btn-rojo { background: var(--fes-blanco); color: var(--fes-rojo) !important; border-color: #fecaca; }
.fes-btn-rojo:hover { background: #fef2f2; }
.fes-btn-chico { padding: 7px 13px; min-height: 36px; font-size: 14px; }
.fes label { display: block; font-weight: 600; font-size: 14px; margin: 14px 0 5px; }
.fes .fes-ayuda { font-weight: 400; color: var(--fes-gris-2); font-size: 13px; }
.fes input[type=text], .fes input[type=email], .fes input[type=tel], .fes input[type=number], .fes select, .fes textarea {
  width: 100%; font: inherit; font-size: 16px; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 9px; background: #fff; color: inherit; }
.fes input:focus, .fes select:focus, .fes textarea:focus, .fes-editor:focus { outline: 2px solid var(--fes-suave); border-color: var(--fes-acento); }
.fes .fes-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 15px; margin: 10px 0; }
.fes .fes-check input { margin-top: 4px; width: 18px; height: 18px; flex: none; accent-color: var(--fes-acento); }
.fes-fila { display: grid; gap: 0 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.fes-acciones { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; align-items: center; }

/* bloques */
.fes { display: block; padding: 26px 0 44px; }
.fes h1 { font-size: clamp(26px, 4.2vw, 38px); line-height: 1.15; margin: 0 0 12px; letter-spacing: -.01em; }
.fes h2 { font-size: 22px; line-height: 1.25; margin: 30px 0 10px; }
.fes h3 { font-size: 17px; margin: 18px 0 6px; }
.fes p, .fes li { color: #334155; }
/* todo el texto corrido justificado; lo que tiene clase propia (centrado, etc.) gana por especificidad */
:where(.fes) p, :where(.fes) li, :where(.fes) dd { text-align: justify; hyphens: auto; }
.fes-subir p { text-align: center; }
.fes-caja { background: var(--fes-blanco); border: 1px solid var(--fes-borde); border-radius: var(--fes-radio); padding: 20px; box-shadow: var(--fes-sombra); }
.fes-caja + .fes-caja { margin-top: 18px; }
.fes-nota { background: var(--fes-fondo-acento); border: 1px solid var(--fes-suave); border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.fes-alerta { background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.fes-error { background: #fef2f2; border: 1px solid #fecaca; color: var(--fes-rojo); border-radius: 10px; padding: 10px 14px; font-size: 14.5px; margin-top: 12px; }
.fes-ok { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; border-radius: 10px; padding: 10px 14px; font-size: 14.5px; margin-top: 12px; }
.fes-chip { display: inline-block; font-size: 12.5px; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: #f1f5f9; color: var(--fes-gris); border: 1px solid var(--fes-borde); white-space: nowrap; }
.fes-chip.firmado { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.fes-chip.pendiente { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.fes-chip.rechazado, .fes-chip.anulado, .fes-chip.vencido { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.fes-chip.borrador, .fes-chip.en_espera { background: #f1f5f9; }
/* texto de la declaración jurada de domicilio electrónico */
.fes-ddjj { white-space: pre-line; text-align: justify; hyphens: auto; font-size: 14.5px; line-height: 1.55; color: #334155; background: #f8fafc; border: 1px solid var(--fes-borde); border-radius: 10px; padding: 12px 14px; margin: 10px 0 4px; max-height: 300px; overflow: auto; }
.fes-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; word-break: break-all; }
.fes-gris { color: var(--fes-gris-2); }
.fes-chico { font-size: 14px; }
.fes-cargando { color: var(--fes-gris-2); padding: 30px 0; text-align: center; }

/* portada */
.fes-hero { display: grid; gap: 28px; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; padding: 18px 0 8px; }
.fes-hero .fes-bajada { font-size: 18.5px; color: var(--fes-gris); margin: 0 0 20px; }
.fes-sello { display: inline-flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.fes-muestra { background: var(--fes-blanco); border: 1px solid var(--fes-borde); border-radius: 16px; padding: 18px; box-shadow: var(--fes-sombra); }
.fes-muestra .hoja { background: #f8fafc; border: 1px solid var(--fes-borde); border-radius: 10px; padding: 14px; font-size: 13.5px; }
.fes-muestra .renglon { height: 8px; background: #e2e8f0; border-radius: 4px; margin: 8px 0; }
.fes-muestra .firma { font: italic 600 22px/1 "Brush Script MT", "Segoe Script", cursive; color: #1e3a8a; padding: 10px 0 4px; border-bottom: 1px solid #94a3b8; }
.fes-pasos { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin-top: 8px; }
.fes-paso { background: var(--fes-blanco); border: 1px solid var(--fes-borde); border-radius: var(--fes-radio); padding: 16px; }
.fes-paso b { display: block; font-size: 16px; margin-bottom: 4px; }
.fes-paso .num { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--fes-suave); color: var(--fes-acento-2); font-weight: 700; margin-bottom: 8px; }
.fes-dos { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.fes-faq details { background: var(--fes-blanco); border: 1px solid var(--fes-borde); border-radius: 10px; padding: 12px 16px; margin: 8px 0; }
.fes-faq summary { font-weight: 600; cursor: pointer; }
.fes-tabla { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.fes-tabla th, .fes-tabla td { text-align: left; padding: 9px 8px; border-bottom: 1px solid var(--fes-borde); vertical-align: top; }
.fes-tabla th { font-size: 13px; color: var(--fes-gris); font-weight: 600; }

/* panel */
.fes-cabeza { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.fes-lista { list-style: none; margin: 0; padding: 0; }
.fes-lista li { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 13px 4px; border-bottom: 1px solid var(--fes-borde); flex-wrap: wrap; }
.fes-lista li:last-child { border-bottom: 0; }
.fes-lista a.titulo { font-weight: 600; color: var(--fes-tinta); text-decoration: none; }
.fes-lista a.titulo:hover { color: var(--fes-acento); }
.fes-pestanias { display: flex; gap: 6px; margin: 4px 0 16px; border-bottom: 1px solid var(--fes-borde); }
.fes-pestanias button { background: none; border: 0; border-bottom: 3px solid transparent; padding: 10px 14px; font: 600 15px inherit; font-family: inherit; color: var(--fes-gris); cursor: pointer; }
.fes-pestanias button[aria-selected=true] { color: var(--fes-acento); border-bottom-color: var(--fes-acento); }

/* editor */
.fes-barra-ed { display: flex; gap: 6px; flex-wrap: wrap; padding: 8px; border: 1px solid #cbd5e1; border-bottom: 0; border-radius: 9px 9px 0 0; background: #f1f5f9; }
.fes-barra-ed button, .fes-barra-ed select { font: 600 13px inherit; font-family: inherit; padding: 6px 10px; border: 1px solid var(--fes-borde); border-radius: 7px; background: #fff; cursor: pointer; min-height: 34px; }
.fes-editor { min-height: 360px; max-height: 70vh; overflow: auto; border: 1px solid #cbd5e1; border-radius: 0 0 9px 9px; background: #fff; padding: 22px 26px; font: 15.5px/1.6 Georgia, "Times New Roman", serif; }
.fes-editor h1 { font-size: 21px; text-align: center; margin: 4px 0 12px; }
.fes-editor h2 { font-size: 17px; margin: 14px 0 6px; }
.fes-editor p { text-align: justify; margin: 0 0 8px; }
.fes-subir { border: 2px dashed #cbd5e1; border-radius: var(--fes-radio); padding: 26px; text-align: center; background: #fff; }
.fes-subir.encima { border-color: var(--fes-acento); background: var(--fes-fondo-acento); }

/* firma */
.fes-visor { width: 100%; height: 70vh; min-height: 420px; border: 1px solid var(--fes-borde); border-radius: 10px; background: #f1f5f9; }
.fes-lienzo-caja { position: relative; border: 1px solid #94a3b8; border-radius: 10px; background: #fff; touch-action: none; }
.fes-lienzo-caja canvas { display: block; width: 100%; height: 190px; border-radius: 10px; cursor: crosshair; }
.fes-lienzo-caja .linea { position: absolute; left: 7%; right: 7%; bottom: 44px; border-top: 1px dashed #94a3b8; pointer-events: none; }
.fes-lienzo-caja .rotulo { position: absolute; left: 7%; bottom: 22px; font-size: 12px; color: var(--fes-gris-2); pointer-events: none; }

.fes-pie { border-top: 1px solid var(--fes-borde); background: var(--fes-blanco); padding: 18px 0 22px; font-size: 13.5px; color: var(--fes-gris); }
.fes-pie + .dl-pie { margin-top: 0; }
.fes-pie p { margin: 6px 0; text-align: justify; }
.fes-pie a { color: var(--fes-gris); }
.fes-pie .fes-pie-links { text-align: left; }

@media (max-width: 760px) {
  .fes-hero { grid-template-columns: 1fr; }
  .fes-nav { font-size: 14.5px; gap: 2px 12px; }
  .fes-das img { width: 118px; }
  .fes-nombre { font-size: 16px; padding-left: 10px; }
  .fes-caja { padding: 16px; }
  .fes-editor { padding: 16px; }
  .fes-visor { height: 60vh; min-height: 340px; }
  .fes-tabla.apila thead { display: none; }
  .fes-tabla.apila tr { display: block; border-bottom: 1px solid var(--fes-borde); padding: 6px 0; }
  .fes-tabla.apila td { display: block; border: 0; padding: 3px 4px; }
  .fes-tabla.apila td[data-t]::before { content: attr(data-t) ": "; font-weight: 600; color: var(--fes-gris); }
}
@media print { .fes-top, .fes-pie, .dl-pie { display: none; } }