/*
 * Hub Regenerative Expeditions — modo claro, estilo panel. Nace del hub de
 * Colombian Origin (2026-10-11) con sus mismos criterios: sobrio, sin bordes
 * de color en las tarjetas ni iconos de librería; la estructura la dan el
 * espacio, líneas de un pixel muy suaves y la tipografía.
 *
 * Colores de regenerativeexpeditions.org y de su logo:
 *   azul noche #0b2239 (menú y texto fuerte) · acción #175466 (petróleo,
 *   8:1 sobre blanco) · oro del logo #e2b23c y coral #e8636f solo en
 *   acentos mínimos, nunca como fondo de texto ni como borde de tarjeta.
 *
 * Sin estilos en línea: la política CSP del hub los bloquea.
 */
:root {
  --tinta: #0b2239;
  --tinta-2: #12304d;
  --menu-texto: #b9c4cf;
  --menu-suave: #74879a;
  --marca: #e2b23c;
  --coral: #e8636f;
  --oliva: #a4b55e;
  --accion: #175466;
  --accion-hover: #10404e;
  --lienzo: #f4f4f1;
  --superficie: #ffffff;
  --superficie-2: #f7f7f4;
  --linea: #e7e8e3;
  --linea-2: #d6d9d2;
  --texto: #18222b;
  --texto-2: #55606a;
  --texto-3: #87909a;
  --ok-fondo: #edf5f0;   --ok-texto: #1d5140;
  --espera-fondo: #fbf5e8; --espera-texto: #6a4d14;
  --error-fondo: #fbeeec; --error-texto: #8c2a1d; --error-linea: #efd3ce;
  --radio: 14px;
  --radio-chico: 9px;
  --sombra: 0 1px 2px rgba(11, 34, 57, .04);
  --sombra-alta: 0 8px 24px rgba(11, 34, 57, .08);
  --ancho-menu: 248px;
  --fuente: "Quicksand", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/quicksand-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/quicksand-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--lienzo);
  color: var(--texto);
  font-family: var(--fuente);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

a { color: var(--accion); font-weight: 600; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--accion-hover); }
h1, h2, h3 { line-height: 1.25; margin: 0 0 12px; font-weight: 600; letter-spacing: -.005em; }
h1 { font-size: 1.6rem; letter-spacing: -.015em; }
h2 { font-size: 1.02rem; }
h3 { font-size: .95rem; margin-top: 20px; }
p { margin: 0 0 10px; }
strong { font-weight: 600; }

.icono { width: 19px; height: 19px; flex: none; }

/* ---------- Menú lateral ---------- */
.lateral {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--ancho-menu);
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 18px 14px 10px;
  background: var(--tinta);
  color: var(--menu-texto);
  overflow-y: auto;
  /* Si en una pantalla baja el menú no cabe, la barra es fina y oscura. */
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .14) transparent;
  z-index: 20;
}
.marca {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 10px 12px;
  color: #fff;
  text-decoration: none;
}
.marca:hover { color: #fff; }
.marca-texto { display: flex; flex-direction: column; font-weight: 600; font-size: .98rem; line-height: 1.2; }
.marca-texto small {
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--marca);
  margin-top: 3px;
}
.menu { display: flex; flex-direction: column; gap: 2px; }
.menu-grupo {
  margin: 11px 12px 3px;
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--menu-suave);
}
.menu a, .lateral-pie a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 7px 12px;
  border-radius: var(--radio-chico);
  color: var(--menu-texto);
  text-decoration: none;
  font-weight: 500;
  font-size: .92rem;
  transition: background-color .15s, color .15s;
}
.menu a .icono, .lateral-pie a .icono { color: var(--menu-suave); transition: color .15s; }
.menu a:hover, .lateral-pie a:hover { background: rgba(255, 255, 255, .05); color: #fff; }
.menu a:hover .icono, .lateral-pie a:hover .icono { color: #d6e0dc; }
.menu a.activa, .lateral-pie a.activa { background: rgba(255, 255, 255, .08); color: #fff; }
.menu a.activa .icono, .lateral-pie a.activa .icono { color: var(--marca); }
.contador {
  margin-left: auto;
  min-width: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(226, 178, 60, .18);
  color: #f0cf7a;
  font-size: .72rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.7;
}
.lateral-pie {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .07);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.quien { margin: 0 12px 8px; color: #e7ede9; font-weight: 600; font-size: .9rem; line-height: 1.3; overflow-wrap: anywhere; }
.quien small { display: block; color: var(--menu-suave); font-weight: 500; font-size: .76rem; margin-top: 2px; }

/* Móvil: barra superior y menú desplegable sin JavaScript. */
.menu-interruptor { position: absolute; opacity: 0; pointer-events: none; }
.barra-movil { display: none; }

/* ---------- Contenido ---------- */
.principal { margin-left: var(--ancho-menu); min-height: 100vh; display: flex; flex-direction: column; }
.contenido { flex: 1; width: 100%; max-width: 1120px; padding: 40px 48px 56px; }
.titulo-pagina { margin-bottom: 22px; }
.subtitulo { margin-top: 36px; }
.subtitulo-cerca { margin-top: 10px; }
.texto-suave { color: var(--texto-2); }
.opcional { color: var(--texto-3); font-weight: 400; font-size: .85em; }
.ayuda { color: var(--texto-3); font-size: .84rem; margin: 2px 0 6px; }
.texto-largo { white-space: pre-line; overflow-wrap: anywhere; }

.pie {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  padding: 18px 48px 24px;
  color: var(--texto-3);
  font-size: .8rem;
}
.pie a { color: var(--texto-2); font-weight: 500; }

/* ---------- Tarjetas ---------- */
.tarjeta {
  background: var(--superficie);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  box-shadow: var(--sombra);
  padding: 22px 24px;
  min-width: 0;
}
.tarjeta > h2:first-child, .tarjeta > h3:first-child { margin-top: 0; }
section.tarjeta + section.tarjeta, section.tarjeta + form, form + .rejilla-2, .tarjeta + .lista-tarjetas { margin-top: 18px; }
.tarjeta-enlace {
  display: block;
  color: var(--texto);
  text-decoration: none;
  font-weight: 400;
  transition: box-shadow .2s, border-color .2s, transform .2s;
}
.tarjeta-enlace:hover { color: var(--texto); border-color: var(--linea-2); box-shadow: var(--sombra-alta); transform: translateY(-1px); }
.tarjeta-apagada { opacity: .6; }
.tarjeta-proximo { margin-top: 24px; }
.tarjeta-proximo ul { margin: 0; padding-left: 18px; color: var(--texto-2); }
.tarjeta-garantia { background: var(--superficie-2); box-shadow: none; margin-bottom: 18px; }
.tarjeta-empresa { margin-bottom: 18px; }
.tarjeta-estrecha { max-width: 580px; }
.tarjeta-plaza { box-shadow: none; background: var(--superficie-2); padding: 18px 20px; }
.tarjeta-alerta { background: var(--espera-fondo); border-color: transparent; }
.tarjeta-alerta .cifra { color: var(--espera-texto); }
.cifra { font-size: 2.1rem; font-weight: 600; letter-spacing: -.02em; color: var(--texto); margin: 2px 0 4px; line-height: 1.1; }

.rejilla-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.rejilla-2 > .tarjeta + .tarjeta { margin-top: 0; }
.lista-tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }

.etiqueta {
  display: inline-block;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--texto-2);
  background: var(--superficie-2);
  border-radius: 999px;
  padding: 2px 9px;
  vertical-align: 2px;
  white-space: nowrap;
}
.etiqueta-socia { color: var(--accion); background: var(--ok-fondo); }

.datos { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 16px; margin: 0 0 14px; font-size: .93rem; }
.datos dt { color: var(--texto-3); font-size: .84rem; }
.datos dd { margin: 0; overflow-wrap: anywhere; }

.mensaje {
  margin: 0 0 16px;
  padding: 12px 16px;
  background: var(--superficie-2);
  border-radius: var(--radio-chico);
  color: var(--texto-2);
  overflow-wrap: anywhere;
}

.actividad { list-style: none; padding: 0; margin: 0; }
.actividad li { padding: 10px 0; border-bottom: 1px solid var(--linea); font-size: .92rem; }

.lista-simple { list-style: none; margin: 0 0 12px; padding: 0; }
.lista-simple li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 10px; padding: 9px 0; border-bottom: 1px solid var(--linea); }
.lista-simple li:last-child { border-bottom: 0; }
.lista-simple li > span { min-width: 0; overflow-wrap: anywhere; }
.lista-simple li > .texto-suave { flex-basis: 100%; font-size: .86rem; }
.lista-simple form { margin: 0; }

.lista-turno { margin: 0 0 12px; padding-left: 20px; }
.lista-turno li { padding: 8px 0; border-bottom: 1px solid var(--linea); }
.lista-turno li > span { display: block; overflow-wrap: anywhere; }
.lista-turno form { margin: 6px 0 0; }

/* ---------- Avisos ---------- */
.aviso { border-radius: var(--radio-chico); padding: 13px 16px; margin: 0 0 18px; font-size: .93rem; }
.aviso p:last-child { margin-bottom: 0; }
.aviso-ok { background: var(--ok-fondo); color: var(--ok-texto); }
.aviso-espera { background: var(--espera-fondo); color: var(--espera-texto); }
.aviso-error { background: var(--error-fondo); color: var(--error-texto); }
.aviso a { color: inherit; }
.aviso-con-accion { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.aviso-con-accion p { margin: 0; flex: 1 1 260px; }
.aviso-con-accion form { margin: 0; }

/* ---------- Formularios ---------- */
.formulario { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0 0 12px; }
.formulario label:not(.opcion) { display: block; font-weight: 600; font-size: .86rem; margin-top: 8px; color: var(--texto); }
.formulario button { margin-top: 14px; align-self: flex-start; }
.formulario .tarjeta input, .formulario .tarjeta select, .formulario .tarjeta textarea { margin-top: 4px; }
.formulario > .rejilla-2 { margin-bottom: 18px; }
.formulario .tarjeta { margin-bottom: 18px; }
.formulario .rejilla-2 .tarjeta { margin-bottom: 0; }

input[type=text], input[type=email], input[type=password], input[type=tel], input[type=date], input[type=number], input[type=search], input[type=url], input[type=month], select, textarea {
  width: 100%;
  min-width: 0;
  font: inherit;
  font-size: .95rem;
  color: var(--texto);
  background: var(--superficie);
  border: 1px solid var(--linea-2);
  border-radius: var(--radio-chico);
  padding: 9px 12px;
  transition: border-color .15s, box-shadow .15s;
}
input:hover, select:hover, textarea:hover { border-color: #c3c8c0; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accion); box-shadow: 0 0 0 3px rgba(23, 84, 102, .14); }
.btn:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid var(--accion); outline-offset: 2px; }
select:disabled { background: var(--superficie-2); color: var(--texto-3); }
fieldset { border: 1px solid var(--linea); border-radius: var(--radio-chico); padding: 12px 16px 14px; margin: 12px 0 4px; min-width: 0; }
legend { font-weight: 600; font-size: .86rem; padding: 0 6px; }
.opcion { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: .92rem; margin: 8px 0 0; }
.opcion input { margin-top: 5px; flex: none; accent-color: var(--accion); }
.casillas { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0 12px; }

.formulario-busqueda { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; gap: 6px 12px; align-items: end; margin-bottom: 22px; }
.formulario-busqueda label:not(.opcion) { grid-row: 1; margin: 0; }
.formulario-busqueda input, .formulario-busqueda select { grid-row: 2; }
.formulario-busqueda button { grid-row: 2; margin: 0; }

/* ---------- Botones ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font: inherit;
  font-size: .9rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  min-height: 40px;
  padding: 8px 18px;
  border-radius: var(--radio-chico);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.btn-principal { background: var(--accion); color: #fff; }
.btn-principal:hover { background: var(--accion-hover); color: #fff; }
.btn-secundario { background: var(--superficie); color: var(--texto); border-color: var(--linea-2); }
.btn-secundario:hover { background: var(--superficie-2); color: var(--texto); border-color: #c3c8c0; }
.btn-peligro { background: transparent; color: var(--error-texto); border-color: var(--error-linea); }
.btn-peligro:hover { background: var(--error-fondo); color: var(--error-texto); }
.btn-ancho { width: 100%; align-self: stretch !important; }
.btn-chico { min-height: 32px; padding: 4px 12px; font-size: .83rem; }
.botones-fila { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.botones-fila form { margin: 0; }

.rechazo { margin-top: 10px; }
.rechazo summary { cursor: pointer; color: var(--texto-2); font-weight: 600; font-size: .88rem; list-style-position: inside; }
.rechazo summary:hover { color: var(--texto); }
.rechazo[open] summary { margin-bottom: 6px; }

.barra-acciones { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: -8px 0 22px; }
.barra-acciones p { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.barra-acciones form { margin: 0; }

/* ---------- Pestañas: control segmentado ---------- */
.pestanas {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 3px;
  margin: 0 0 22px;
  background: #eaebe6;
  border-radius: 11px;
}
.pestanas a {
  text-decoration: none;
  color: var(--texto-2);
  font-weight: 600;
  font-size: .86rem;
  padding: 6px 14px;
  border-radius: 8px;
  transition: background-color .15s, color .15s;
}
.pestanas a:hover { color: var(--texto); }
.pestanas a.activa { background: var(--superficie); color: var(--texto); box-shadow: 0 1px 3px rgba(11, 34, 57, .1); }
.pestanas .cuenta { color: var(--texto-3); font-weight: 600; margin-left: 4px; }

/* ---------- Tablas ---------- */
.tabla-envoltorio { overflow-x: auto; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); }
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabla th, .tabla td { text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--linea); vertical-align: top; }
.tabla tr:last-child td { border-bottom: 0; }
.tabla th { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-3); }
.fila-vencida td { background: var(--error-fondo); }

/* ---------- Pantallas de acceso ---------- */
.pantalla-acceso { display: flex; justify-content: center; align-items: center; padding: 32px 16px; background: var(--tinta); }
.caja-acceso { width: 100%; max-width: 460px; background: var(--superficie); border-radius: 18px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.cabecera-acceso { background: var(--tinta-2); color: var(--menu-texto); text-align: center; padding: 26px 16px 18px; }
.cabecera-acceso p { margin: 10px 0 0; font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--marca); }
.cuerpo-acceso { padding: 28px 30px 24px; }
.cuerpo-acceso h1 { font-size: 1.35rem; }
.nota-centrada { text-align: center; font-size: .88rem; margin-top: 16px; color: var(--texto-2); }

/* Campo trampa del formulario público: fuera de la vista, sin display:none
   (algunos programas lo detectan y lo saltan). */
.trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Móvil y tableta ---------- */
@media (max-width: 900px) {
  .barra-movil {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 30;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    padding: 0 16px;
    background: var(--tinta);
  }
  .marca-movil { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 600; font-size: .95rem; }
  .boton-menu { display: flex; align-items: center; gap: 8px; color: var(--menu-texto); font-weight: 600; font-size: .88rem; cursor: pointer; padding: 8px 4px; }
  .lateral { top: 56px; width: min(300px, 86vw); transform: translateX(-100%); transition: transform .22s ease; box-shadow: none; }
  .lateral .marca { display: none; }
  .menu-interruptor:checked ~ .lateral { transform: none; box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }
  .principal { margin-left: 0; }
  .contenido { padding: 24px 16px 40px; }
  .pie { padding: 16px; }
}
@media (max-width: 720px) {
  h1 { font-size: 1.35rem; }
  .rejilla-2 { grid-template-columns: minmax(0, 1fr); }
  .cuerpo-acceso { padding: 22px 18px 18px; }
  .datos { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .datos dd { margin-bottom: 8px; }
  .tarjeta { padding: 18px; }
  .formulario-busqueda { grid-template-columns: minmax(0, 1fr); }
  .formulario-busqueda label:not(.opcion), .formulario-busqueda input, .formulario-busqueda select, .formulario-busqueda button { grid-row: auto; }
}

/* ======================================================================
   v0.6 · Tablero, calendario, documentos vivos y alianzas
   Mismo criterio: color solo en puntos pequeños y apagados; la estructura
   la dan el espacio y las líneas finas.
   ====================================================================== */
.contenido-ancho { max-width: none; padding-left: 32px; padding-right: 32px; }
.solo-lectores { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fila-dos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.meta { color: var(--texto-3); font-size: .82rem; margin: 6px 0 0; }

/* Puntos de tipo: tonos apagados que se distinguen sin gritar. */
.punto { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 7px; vertical-align: 1px; background: #a3aca7; flex: none; }
.punto-certamen, .punto-evento-certamen { background: #3d6d8c; }
.punto-empresa { background: #b08a4c; }
.punto-informe, .punto-evento-informe { background: #a36b4f; }
.punto-alianza, .punto-evento-alianza { background: #8a5c7c; }
.punto-evento-acompanamiento { background: #b07d2b; }
.punto-documento { background: #7b7ba3; }
.punto-evento-tarea { background: var(--accion); }

/* ---------- Tablero ---------- */
.filtro-etiquetas { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.filtro-etiquetas a { display: inline-flex; align-items: center; color: var(--texto-2); font-weight: 500; font-size: .85rem; text-decoration: none; padding: 4px 0; border-bottom: 1px solid transparent; }
.filtro-etiquetas a:hover { color: var(--texto); }
.filtro-etiquetas a.activa { color: var(--texto); border-bottom-color: var(--texto); }

.kanban {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  gap: 14px;
  align-items: start;
  overflow-x: auto;
  padding-bottom: 8px;
}
.kanban-columna {
  background: #ecede8;
  border-radius: var(--radio);
  padding: 12px;
  min-height: 240px;
  transition: background-color .15s;
}
.kanban-columna.sobre { background: #e3e6df; }
.kanban-cabecera { display: flex; align-items: center; justify-content: space-between; padding: 4px 6px 10px; }
.kanban-cabecera h2 { margin: 0; font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2); }
.kanban-cuenta { font-size: .78rem; font-weight: 600; color: var(--texto-3); }
.kanban-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; min-height: 12px; }
.kanban-tarjeta { background: var(--superficie); border: 1px solid var(--linea); border-radius: 11px; box-shadow: var(--sombra); cursor: grab; transition: box-shadow .15s, border-color .15s; }
.kanban-tarjeta:hover { border-color: var(--linea-2); box-shadow: 0 4px 14px rgba(11, 34, 57, .07); }
.kanban-tarjeta.arrastrando { opacity: .45; cursor: grabbing; }
.kanban-enlace { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; color: var(--texto); text-decoration: none; font-weight: 400; }
.kanban-enlace:hover { color: var(--texto); }
.kanban-etiqueta { display: flex; align-items: center; font-size: .72rem; font-weight: 600; color: var(--texto-3); letter-spacing: .02em; }
.kanban-titulo { font-weight: 600; font-size: .93rem; line-height: 1.35; overflow-wrap: anywhere; }
.kanban-vinculo { font-size: .8rem; color: var(--texto-2); overflow-wrap: anywhere; }
.kanban-pie { display: flex; align-items: center; gap: 10px; min-height: 24px; font-size: .76rem; color: var(--texto-3); }
.kanban-fecha.vencida { color: var(--error-texto); font-weight: 600; }
.kanban-pie .avatar { margin-left: auto; }
.avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--tinta); color: #e7ede9;
  font-size: .66rem; font-weight: 700; letter-spacing: .03em;
}
.kanban-vacia { margin: 6px 0 0; padding: 18px 8px; text-align: center; color: var(--texto-3); font-size: .82rem; border: 1px dashed var(--linea-2); border-radius: 11px; }
.kanban-nueva { margin: 0 0 10px; }
.kanban-nueva summary { list-style: none; cursor: pointer; padding: 8px 10px; border-radius: 9px; color: var(--texto-2); font-weight: 600; font-size: .85rem; }
.kanban-nueva summary::-webkit-details-marker { display: none; }
.kanban-nueva summary::before { content: "+"; display: inline-block; width: 16px; font-weight: 500; }
.kanban-nueva summary:hover { background: rgba(255, 255, 255, .6); color: var(--texto); }
.kanban-nueva .formulario { background: var(--superficie); border: 1px solid var(--linea); border-radius: 11px; padding: 12px; margin: 6px 0 0; }
.kanban-nueva .formulario button { margin-top: 6px; }

.rejilla-ficha { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 18px; align-items: start; }
.mover-rapido { display: flex; gap: 8px; align-items: center; }
.mover-rapido select { width: auto; }
.conversacion { list-style: none; margin: 0 0 14px; padding: 0; }
.conversacion li { padding: 12px 0; border-bottom: 1px solid var(--linea); }
.conversacion-quien { margin: 0 0 4px; font-weight: 600; font-size: .86rem; }
.conversacion-quien span { color: var(--texto-3); font-weight: 400; margin-left: 6px; font-size: .78rem; }
.conversacion .texto-largo { margin: 0; font-size: .92rem; color: var(--texto-2); }

/* ---------- Calendario ---------- */
.calendario-marco { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 22px; align-items: start; }
.calendario { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 20px 22px 22px; }
.calendario-cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.calendario-mes { margin: 0; font-size: 1.2rem; text-transform: capitalize; letter-spacing: -.01em; }
.calendario-nav { display: flex; gap: 6px; }
.calendario-nav .btn { min-width: 36px; }
.leyenda { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0 0 14px; padding: 0; font-size: .78rem; color: var(--texto-3); }
.leyenda li { display: flex; align-items: center; }
.mes { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--linea); border-left: 1px solid var(--linea); }
.mes-dia-semana { padding: 8px 10px; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); border-right: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.mes-dia { min-height: 108px; padding: 6px 6px 8px; border-right: 1px solid var(--linea); border-bottom: 1px solid var(--linea); display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mes-dia.fuera { background: var(--superficie-2); }
.mes-dia.fuera .mes-numero { color: #b7bdb9; }
.mes-numero { font-size: .8rem; font-weight: 600; color: var(--texto-2); padding: 2px 4px; align-self: flex-start; }
.mes-dia.hoy .mes-numero { background: var(--tinta); color: #fff; border-radius: 999px; min-width: 24px; text-align: center; }
.evento {
  display: block; font-size: .74rem; line-height: 1.35; padding: 2px 6px; border-radius: 5px;
  color: var(--texto); text-decoration: none; font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.evento:hover { background: var(--superficie-2); color: var(--texto); }
.evento::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; background: #a3aca7; }
.evento-tarea::before { background: var(--accion); }
.evento-informe::before { background: #a36b4f; }
.evento-alianza::before { background: #8a5c7c; }
.evento-acompanamiento::before { background: #b07d2b; }
/* El certamen es una banda suave que se continúa de un día a otro. */
.evento-certamen { background: rgba(61, 109, 140, .11); color: #294b61; border-radius: 0; margin: 0 -7px; padding-left: 13px; }
.evento-certamen::before { display: none; }
.evento-certamen.inicio { border-radius: 5px 0 0 5px; margin-left: 0; padding-left: 6px; }
.evento-certamen.final { border-radius: 0 5px 5px 0; margin-right: 0; }
.evento-certamen.inicio.final { border-radius: 5px; }
.evento-certamen:hover { background: rgba(61, 109, 140, .18); color: #294b61; }
.evento-mas { font-size: .72rem; color: var(--texto-3); padding: 0 6px; }

.agenda { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 20px 22px; position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow-y: auto; }
.agenda h2 { font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2); margin-bottom: 14px; }
.agenda-dia { padding: 10px 0; border-top: 1px solid var(--linea); }
.agenda-fecha { margin: 0 0 6px; font-size: .78rem; font-weight: 600; color: var(--texto-3); }
.agenda-fecha::first-letter { text-transform: uppercase; }
.agenda-dia ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.agenda-dia li a { display: flex; align-items: center; color: var(--texto); text-decoration: none; font-weight: 600; font-size: .88rem; }
.agenda-dia li a:hover { color: var(--accion); }
.agenda-dia li .texto-suave { display: block; font-size: .8rem; margin-left: 14px; overflow-wrap: anywhere; }

/* ---------- Documentos vivos ---------- */
.tarjeta-documento h2 { margin: 10px 0 6px; }
.extracto { font-size: .88rem; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rejilla-documento { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; align-items: start; }
.documento { padding: 36px 44px; }
.documento-cuerpo { max-width: 72ch; font-size: 1rem; line-height: 1.75; color: #26302b; overflow-wrap: anywhere; }
.documento-cuerpo h2 { font-size: 1.3rem; margin: 32px 0 12px; }
.documento-cuerpo h3 { font-size: 1.08rem; margin: 26px 0 10px; }
.documento-cuerpo h4 { font-size: .98rem; margin: 22px 0 8px; }
.documento-cuerpo > :first-child { margin-top: 0; }
.documento-cuerpo p { margin: 0 0 14px; }
.documento-cuerpo ul, .documento-cuerpo ol { margin: 0 0 14px; padding-left: 22px; }
.documento-cuerpo li { margin: 4px 0; }
.documento-cuerpo li.casilla { list-style: none; margin-left: -22px; display: flex; gap: 10px; align-items: baseline; }
.marca-casilla { flex: none; width: 13px; height: 13px; border: 1.5px solid var(--linea-2); border-radius: 3px; transform: translateY(1px); }
.casilla.hecha { color: var(--texto-3); text-decoration: line-through; }
.casilla.hecha .marca-casilla { background: var(--accion); border-color: var(--accion); }
.documento-cuerpo blockquote { margin: 0 0 14px; padding: 4px 0 4px 18px; border-left: 2px solid var(--linea-2); color: var(--texto-2); font-style: italic; }
.documento-cuerpo code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .88em; background: var(--superficie-2); padding: 1px 5px; border-radius: 4px; }
.documento-cuerpo hr { border: 0; border-top: 1px solid var(--linea); margin: 26px 0; }
.documento-lado h2 { font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2); }
.historial { list-style: none; margin: 0 0 16px; padding: 0; }
.historial li { padding: 8px 10px; border-radius: 8px; }
.historial li.actual { background: var(--superficie-2); }
.historial a { display: block; font-size: .88rem; color: var(--texto); text-decoration: none; }
.historial a:hover { color: var(--accion); }
.historial span { display: block; font-size: .76rem; color: var(--texto-3); }
.entrada-titulo { font-size: 1.15rem !important; font-weight: 600; }
.editor { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9rem !important; line-height: 1.65; min-height: 420px; resize: vertical; }
.editor-bajo { min-height: 160px; }
.guia-formato { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 12px; margin: 0; font-size: .8rem; }
.guia-formato dt { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--texto-2); }
.guia-formato dd { margin: 0; color: var(--texto-3); }

/* ---------- Alianzas ---------- */
.estado-alianza { display: inline-flex; align-items: center; font-size: .72rem; font-weight: 600; color: var(--texto-2); }
.estado-alianza::before { content: ""; width: 7px; height: 7px; border-radius: 50%; margin-right: 7px; background: #a3aca7; }
.estado-conversacion::before { background: #3d6d8c; }
.estado-acuerdo::before { background: #b08a4c; }
.estado-activa::before { background: var(--accion); }
.estado-pausada { color: var(--texto-3); }
.tarjeta-enlace h2 { margin-top: 8px; }
.proximo-paso { margin: 12px 0 0; padding: 10px 12px; background: var(--superficie-2); border-radius: 9px; font-size: .88rem; color: var(--texto); }
.proximo-paso span { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 2px; }
.proximo-paso.vencido span { color: var(--error-texto); }

@media (max-width: 1100px) {
  .calendario-marco { grid-template-columns: minmax(0, 1fr); }
  .agenda { position: static; max-height: none; }
  .rejilla-documento { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .rejilla-ficha { grid-template-columns: minmax(0, 1fr); }
  .kanban { grid-template-columns: repeat(4, minmax(250px, 82vw)); scroll-snap-type: x mandatory; }
  .kanban-columna { scroll-snap-align: start; }
  .documento { padding: 24px 20px; }
  .calendario { padding: 14px 10px 16px; }
  .mes-dia { min-height: 64px; padding: 4px 2px; }
  .evento { font-size: 0; padding: 0; height: 6px; border-radius: 3px; margin: 1px 2px; }
  .evento::before { display: none; }
  .evento-tarea { background: var(--accion); }
  .evento-informe { background: #a36b4f; }
  .evento-alianza { background: #8a5c7c; }
  .evento-acompanamiento { background: #b07d2b; }
  .evento-certamen, .evento-certamen.inicio, .evento-certamen.final { margin: 1px 0; padding: 0; border-radius: 0; background: rgba(61, 109, 140, .45); }
  .evento-mas { font-size: .62rem; padding: 0 2px; }
  .mes-dia-semana { padding: 6px 2px; text-align: center; font-size: .62rem; letter-spacing: .04em; }
}

.rejilla-semana { margin: 18px 0 0; }
.lista-simple li > a { display: inline-flex; align-items: center; min-width: 0; overflow-wrap: anywhere; }

.lateral::-webkit-scrollbar { width: 6px; }
.lateral::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .14); border-radius: 3px; }

/* ======================================================================
   v0.7 · Archivos
   ====================================================================== */
.subida { padding: 0; margin-bottom: 22px; }
.subida > summary {
  display: flex; align-items: center; gap: 10px; cursor: pointer; list-style: none;
  padding: 16px 22px; font-weight: 600; font-size: .95rem;
}
.subida > summary::-webkit-details-marker { display: none; }
.subida > summary:hover { color: var(--accion); }
.subida[open] > summary { border-bottom: 1px solid var(--linea); }
.subida > .formulario { padding: 18px 22px 22px; margin: 0; }

.zona-subida {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  min-height: 150px; padding: 26px 18px; text-align: center;
  border: 1.5px dashed var(--linea-2); border-radius: var(--radio);
  background: var(--superficie-2); color: var(--texto-2);
  cursor: pointer; transition: border-color .15s, background-color .15s;
}
.formulario .zona-subida { margin: 0 0 6px; font-weight: 400; }
.zona-subida:hover, .zona-subida.encima { border-color: var(--accion); background: var(--ok-fondo); }
.zona-subida.con-archivos { border-style: solid; border-color: var(--accion); }
.zona-subida.con-error { border-color: var(--error-linea); background: var(--error-fondo); }
/* El input cubre todo el recuadro: soltar encima funciona sin JavaScript. */
.zona-subida input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.zona-subida input[type=file]:focus-visible + .icono-grande { outline: 2px solid var(--accion); outline-offset: 4px; border-radius: 6px; }
.icono-grande { width: 28px; height: 28px; color: var(--texto-3); }
.zona-titulo { font-weight: 600; color: var(--texto); font-size: .95rem; }
.zona-detalle { font-size: .8rem; color: var(--texto-3); }
.zona-elegidos { font-size: .84rem; color: var(--accion); font-weight: 600; overflow-wrap: anywhere; }
.zona-subida.con-error .zona-elegidos { color: var(--error-texto); }

.rejilla-subida { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }

.formato {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 20px; padding: 0 6px; margin-right: 10px;
  border-radius: 5px; background: var(--superficie-2); border: 1px solid var(--linea);
  color: var(--texto-2); font-size: .64rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  vertical-align: 1px; flex: none;
}
.formato-pdf { color: #8c3b2e; }
.formato-docx, .formato-odt { color: #34588a; }
.formato-xlsx, .formato-ods, .formato-csv { color: #2f6b4b; }
.formato-pptx, .formato-odp { color: #95592a; }
.archivo-nombre { display: inline-flex; align-items: center; color: var(--texto); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
a.archivo-nombre:hover { color: var(--accion); }
.archivo-desc { display: block; font-size: .82rem; margin: 3px 0 0 48px; }
.tabla-archivos td:nth-child(5) { white-space: nowrap; color: var(--texto-2); }

.barra-archivos { margin-top: 0; }
.buscador input { min-width: 260px; }
.huella { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .72rem; color: var(--texto-2); word-break: break-all; }
.archivos-vinculados { margin-top: 18px; }
.archivos-vinculados .barra-acciones { margin: 0 0 8px; }
.archivos-vinculados h2 { margin: 0; }

@media (max-width: 720px) {
  .rejilla-subida { grid-template-columns: minmax(0, 1fr); }
  .buscador, .buscador input { width: 100%; min-width: 0; }
  .archivo-desc { margin-left: 0; }
}

/* Pie del menú: cuenta y salida en una sola fila, para que el menú quepa
   entero en pantallas de 800 px de alto. */
.pie-enlaces { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.pie-enlaces a { gap: 8px; padding: 7px 10px; font-size: .86rem; }
.quien { margin-bottom: 6px; }
.tabla-archivos td:nth-child(4) { white-space: nowrap; }

/* La regla general «.formulario label» (display: block) pisaba la zona. */
.formulario label.zona-subida { display: flex; margin: 0 0 6px; font-weight: 400; font-size: inherit; }
.pie-enlaces a { white-space: nowrap; padding: 7px 8px; }

/* Salir es un formulario (POST) con aspecto de enlace del menú. */
.form-salir { margin: 0; }
.form-salir button { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 8px; border: 0; background: none; border-radius: var(--radio-chico);
  color: var(--menu-texto); font: inherit; font-weight: 500; font-size: .86rem; cursor: pointer; white-space: nowrap; transition: background-color .15s, color .15s; }
.form-salir button .icono { color: var(--menu-suave); }
.form-salir button:hover { background: rgba(255, 255, 255, .05); color: #fff; }
.formulario label.casilla-confirmar { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; font-size: .84rem; color: var(--texto-2, inherit); }
.formulario label.casilla-confirmar input { width: auto; margin-top: 3px; }

/* ── Acompañamiento (v0.8) ─────────────────────────────────────────── */
.semaforo { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; background: #a3aca7; }
.semaforo-verde { background: #3f8f6b; }
.semaforo-ambar { background: #c49a3a; }
.semaforo-rojo { background: #b5543c; }
progress.avance { width: 90px; height: 6px; vertical-align: middle; margin-right: 6px; border: 0; border-radius: 3px; background: var(--linea); appearance: none; -webkit-appearance: none; overflow: hidden; }
progress.avance::-webkit-progress-bar { background: var(--linea); border-radius: 3px; }
progress.avance::-webkit-progress-value { background: var(--accion); border-radius: 3px; }
progress.avance::-moz-progress-bar { background: var(--accion); border-radius: 3px; }

.ruta { list-style: none; margin: 0 0 24px; padding: 0; position: relative; }
.ruta-fase { position: relative; padding: 0 0 18px 40px; }
.ruta-fase::before { content: ''; position: absolute; left: 13px; top: 28px; bottom: 0; width: 1px; background: var(--linea); }
.ruta-fase:last-child::before { display: none; }
.ruta-cabecera { display: flex; align-items: baseline; gap: 10px; min-height: 28px; }
.ruta-cabecera h3, .ruta-cabecera h4 { margin: 0; font-size: 1rem; font-weight: 600; }
.ruta-numero { position: absolute; left: 0; top: 0; width: 27px; height: 27px; border-radius: 50%; display: grid; place-items: center;
  font-size: .78rem; font-weight: 600; color: var(--texto-3); background: var(--superficie); border: 1px solid var(--linea-2, var(--linea)); }
.ruta-fase.actual .ruta-numero { color: #fff; background: var(--accion); border-color: var(--accion); }
.ruta-fase.completa .ruta-numero { color: var(--accion); background: var(--ok-fondo); border-color: transparent; }
.ruta-hitos { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.hito { padding: 12px 14px; border-radius: var(--radio-chico, 8px); background: var(--superficie-2, rgba(0,0,0,.025)); }
.hito-cabecera { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.hito-titulo { font-weight: 500; }
.hito-detalle { margin: 8px 0 0; font-size: .9rem; overflow-wrap: anywhere; }
.hito-revision { color: var(--texto-2); }
.hito .rechazo, .hito .formulario-revision { margin-top: 10px; }
.formulario-revision .acciones { display: flex; gap: 8px; flex-wrap: wrap; }
.etiqueta-hito-entregado { color: #8a6418; background: #f7efdc; }
.etiqueta-hito-devuelto { color: #93432f; background: #f6e7e2; }
.etiqueta-hito-validado { color: var(--ok-texto); background: var(--ok-fondo); }
.ruta-compacta .ruta-fase { padding-bottom: 10px; }
.lista-sesiones { list-style: none; margin: 12px 0 0; padding: 0; }
.lista-sesiones li { padding: 12px 0; border-bottom: 1px solid var(--linea); }
.lista-sesiones li:last-child { border-bottom: 0; }
.lista-sesiones p { margin: 0 0 4px; }
.nota-interna { font-size: .88rem; color: var(--texto-2); border-left: 2px solid var(--linea-2, var(--linea)); padding-left: 10px; }
.formulario-compacto { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.formulario-compacto select, .formulario-compacto input { width: auto; min-width: 0; flex: 1 1 140px; margin: 0; }

/* ── Tablero: arrastre con punteros y tarjetas con vínculos ───────── */
.kanban-tarjeta { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kanban-enlace { -webkit-user-drag: none; }
.kanban-tarjeta.guardando { opacity: .7; }
.kanban-fantasma { position: fixed; top: 0; left: 0; z-index: 1000; pointer-events: none; margin: 0; list-style: none;
  box-shadow: 0 14px 34px rgba(11, 34, 57, .18); border-color: var(--linea-2); cursor: grabbing; opacity: .96; }
body.arrastrando-tarjeta, body.arrastrando-tarjeta * { cursor: grabbing !important; }
.kanban-columna.sobre { background: var(--ok-fondo); }
.kanban-chips { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.kanban-chip { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 2px 7px; border-radius: 6px;
  background: var(--superficie-2); color: var(--texto-2); font-size: .72rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.kanban-chip .icono { width: 12px; height: 12px; flex: none; }
.avatares { display: inline-flex; margin-left: auto; }
.avatares .avatar + .avatar { margin-left: -6px; }
.avatar-participa { background: var(--superficie); color: var(--texto); box-shadow: inset 0 0 0 1px var(--linea-2); }
.avatar-mas { background: var(--superficie-2); color: var(--texto-2); font-size: .66rem; }
.kanban-mas summary { font-size: .8rem; color: var(--texto-2); cursor: pointer; margin: 2px 0 4px; }
.casilla-linea { display: flex !important; align-items: center; gap: 6px; font-weight: 400 !important; font-size: .86rem; margin: 2px 0 !important; }
.casilla-linea input { width: auto !important; margin: 0 !important; }
.enlaces-vinculos { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84rem; margin: 2px 0 10px; }
.columna-ficha { display: grid; gap: 20px; align-content: start; min-width: 0; }

/* ── Fichas técnicas (v0.10) ───────────────────────────────────────── */
.fichas-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; margin: 0 0 18px; }
.ficha-tarjeta { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ficha-miniatura { display: grid; place-items: center; aspect-ratio: 4 / 3; background: var(--superficie-2); color: var(--texto-3); font-size: .82rem; text-decoration: none; }
.ficha-miniatura img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ficha-cuerpo { padding: 14px 16px 16px; display: grid; gap: 4px; }
.ficha-cuerpo h2 { margin: 0; font-size: 1rem; line-height: 1.3; overflow-wrap: anywhere; }
.ficha-cuerpo h2 a { color: var(--texto); text-decoration: none; }
.ficha-cuerpo p { margin: 0; }
.ficha-pie { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 8px !important; }
.ficha-seccion { border: 0; border-top: 1px solid var(--linea); margin: 18px 0 0; padding: 14px 0 0; }
.ficha-seccion legend { padding: 0 10px 0 0; font-weight: 600; font-size: .95rem; }
.ficha-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.ficha-campos .campo-ancho { grid-column: 1 / -1; }
.ficha-fotos { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 12px; }
.ficha-fotos li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: center; }
.ficha-fotos img { width: 96px; height: 72px; object-fit: cover; border-radius: var(--radio-chico); border: 1px solid var(--linea); background: var(--superficie-2); }
.ficha-fotos .acciones, .barra-acciones .acciones { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ficha-fotos form { margin: 0; }
@media (max-width: 720px) { .ficha-campos { grid-template-columns: minmax(0, 1fr); } }

.modelos-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.modelo-tarjeta h2 { margin: 0 0 6px; font-size: 1.02rem; }
.modelo-tarjeta p { margin: 0 0 8px; font-size: .9rem; }

/* ── Catálogo (v0.12): un color por categoría ───────────────────────── */
.cat-cafe_cacao { --cat: #7b5133; } .cat-fruta { --cat: #b98117; }
.cat-superalimentos { --cat: #4f8a3c; } .cat-procesados { --cat: #2f7f7a; } .cat-bebidas { --cat: #3a6ea5; }
.cat-cosmetica { --cat: #8b5aa8; } .cat-textil { --cat: #b04a73; } .cat-artesania { --cat: #7d7a3a; }
.cat-servicios { --cat: #4b5a6b; } .cat-otro { --cat: #8a948f; }
.cat-punto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--cat, #8a948f); margin-right: 7px; vertical-align: 1px; flex: none; }
.cat-etiqueta { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: .74rem; font-weight: 600;
  color: var(--cat, var(--texto-2)); background: color-mix(in srgb, var(--cat, #8a948f) 11%, var(--superficie)); white-space: nowrap; }

.catalogo-categorias { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 14px; }
.catalogo-categorias a { display: inline-flex; align-items: center; gap: 2px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--linea);
  background: var(--superficie); color: var(--texto-2); font-size: .84rem; font-weight: 500; text-decoration: none; }
.catalogo-categorias a span:last-child { color: var(--texto-3); margin-left: 6px; font-size: .78rem; }
.catalogo-categorias a:hover { border-color: var(--linea-2); color: var(--texto); }
.catalogo-categorias a.activa { border-color: var(--cat, var(--texto)); color: var(--cat, var(--texto)); background: color-mix(in srgb, var(--cat, #8a948f) 9%, var(--superficie)); }
.catalogo-filtros { margin-bottom: 16px; }

.catalogo-lista { list-style: none; margin: 0 0 16px; padding: 0; background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; overflow: hidden; }
.catalogo-cabecera, .catalogo-fila { display: grid; grid-template-columns: minmax(0, 2.3fr) minmax(0, 1.7fr) minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, .9fr); gap: 16px; align-items: center; padding: 12px 18px; }
.catalogo-cabecera { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-3); border-bottom: 1px solid var(--linea); padding-left: 22px; }
.catalogo-fila { border-bottom: 1px solid var(--linea); box-shadow: inset 4px 0 0 var(--cat, #8a948f); padding-left: 22px; font-size: .9rem; }
.catalogo-fila:last-child { border-bottom: 0; }
.catalogo-fila:hover { background: color-mix(in srgb, var(--cat, #8a948f) 4%, var(--superficie)); }
.catalogo-fila.pausado { opacity: .62; }
.catalogo-producto, .catalogo-empresa { display: grid; gap: 4px; min-width: 0; justify-items: start; }
.catalogo-nombre { font-weight: 600; color: var(--texto); text-decoration: none; overflow-wrap: anywhere; }
.catalogo-nombre:hover { color: var(--accion); }
.catalogo-empresa > span:first-child { overflow-wrap: anywhere; }
.enlace-web { font-size: .8rem; color: var(--accion); text-decoration: none; overflow-wrap: anywhere; }
.enlace-web:hover { text-decoration: underline; }
.catalogo-ficha { font-size: .86rem; }
.catalogo-ficha .texto-suave { display: block; font-size: .78rem; }
.estado-producto { display: inline-block; padding: 2px 9px; border-radius: 6px; font-size: .74rem; font-weight: 600; background: var(--superficie-2); color: var(--texto-2); white-space: nowrap; }
.estado-catalogo { background: var(--ok-fondo); color: var(--ok-texto); }
.estado-listo { background: #e9f0f7; color: #2f5f8a; }
.estado-pausado { background: #f3eee6; color: #8a6418; }
.solo-movil { display: none; }
@media (max-width: 900px) {
  .catalogo-cabecera { display: none; }
  .catalogo-fila { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
  .catalogo-producto { grid-column: 1 / -1; }
  .catalogo-empresa { grid-column: 1 / 2; }
  .catalogo-estado { grid-column: 2 / 3; grid-row: 2; justify-self: end; }
  .catalogo-responsable, .catalogo-ficha { grid-column: 1 / -1; font-size: .84rem; }
  .solo-movil { display: inline; }
}

.etiquetas-producto h2 { margin-bottom: 10px; }
.chips-producto { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips-producto li { display: inline-flex; align-items: center; gap: 2px; padding: 5px 6px 5px 11px; border-radius: 999px; font-size: .84rem;
  background: color-mix(in srgb, var(--cat, #8a948f) 9%, var(--superficie)); border: 1px solid color-mix(in srgb, var(--cat, #8a948f) 25%, transparent); }
.chips-producto a { color: var(--texto); text-decoration: none; font-weight: 600; }
.chips-producto form { margin: 0; }
.quitar-chip { border: 0; background: none; color: var(--texto-3); font-size: 1rem; line-height: 1; padding: 2px 6px; border-radius: 50%; cursor: pointer; }
.quitar-chip:hover { background: var(--superficie-2); color: var(--texto); }
.subtitulo-chico { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-3); margin: 12px 0 2px; }
/* Filtros del catálogo en una sola fila; en el móvil se apilan. */
.catalogo-filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.catalogo-filtros input, .catalogo-filtros select { width: auto; margin: 0; flex: 1 1 180px; }
.catalogo-filtros input[type=search] { flex: 2 1 260px; }
.catalogo-filtros .btn { flex: none; }
.catalogo-filtros { margin: 0 0 16px; }
.catalogo-filtros input, .catalogo-filtros select { flex: 1 1 180px; height: auto; }

/* ── Roles y permisos (v0.13) ──────────────────────────────────────── */
.roles-resumen { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; margin: 14px 0 6px; }
.roles-resumen .tarjeta { padding: 14px 16px; }
.roles-resumen h2 { font-size: .95rem; margin: 0 0 4px; }
.roles-resumen p { margin: 0; font-size: .84rem; color: var(--texto-2); }
.tabla-permisos td, .tabla-permisos th { vertical-align: middle; }
.tabla-permisos th:not(:first-child), .celda-permiso { text-align: center; width: 110px; }
.tabla-permisos .texto-suave { font-size: .8rem; }
.permiso-casilla { display: inline-flex; padding: 6px; cursor: pointer; }
.permiso-casilla input { width: 17px; height: 17px; margin: 0; accent-color: var(--accion); cursor: pointer; }
.permiso-fijo { color: var(--accion); font-weight: 700; }
.permiso-no { color: var(--texto-3); }
.personas-permisos { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.personas-permisos > li { padding: 16px 18px; }
.persona-cabecera { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.persona-cabecera h3 { margin: 0; font-size: 1rem; }
.persona-cabecera p { margin: 2px 0 0; font-size: .84rem; overflow-wrap: anywhere; }
.persona-rol { display: flex; gap: 6px; align-items: center; margin: 0; }
.persona-rol select { width: auto; margin: 0; }
.secciones-ve { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.secciones-ve li { padding: 3px 10px; border-radius: 999px; font-size: .78rem; background: var(--ok-fondo); color: var(--ok-texto); }
.secciones-ve li.restringida { background: var(--superficie-2); color: var(--texto-3); text-decoration: line-through; }
.casilla-linea.desactivada { color: var(--texto-3); }

/* ── Directorio de ferias (v0.14) ─────────────────────────────────── */
.sec-alimentos { --cat: #5b7f3a; } .sec-organico { --cat: #4f8a3c; } .sec-cafe_cacao { --cat: #7b5133; }
.sec-fruta { --cat: #b98117; } .sec-horeca { --cat: #2f7f7a; } .sec-textil { --cat: #b04a73; }
.sec-hogar { --cat: #7d7a3a; } .sec-artesania { --cat: #9a6a3c; } .sec-cosmetica { --cat: #8b5aa8; }
.sec-turismo { --cat: #3a6ea5; } .sec-comercio_justo { --cat: #a8553a; }
.directorio-mes { margin: 22px 0 10px; }
.feria { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 16px 18px 16px 22px; margin: 0 0 10px;
  background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; box-shadow: inset 4px 0 0 var(--cat, #8a948f); }
.feria h3 { margin: 0 0 2px; font-size: 1.02rem; }
.feria p { margin: 0 0 6px; }
.feria-lugar { font-size: .88rem; }
.feria-fecha { font-size: .9rem; }
.feria-texto { font-size: .88rem; color: var(--texto-2); max-width: 70ch; }
.feria-etiquetas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px !important; }
.feria-acciones { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 10px; }
.feria-acciones form { margin: 0; }
.feria-anadida { background: color-mix(in srgb, var(--ok-fondo) 55%, var(--superficie)); }
.publico { font-size: .74rem; font-weight: 600; padding: 2px 9px; border-radius: 6px; background: var(--superficie-2); color: var(--texto-2); }
.publico-publico { background: #e9f0f7; color: #2f5f8a; }
.publico-mixto { background: #efeaf5; color: #5f477a; }
.verificacion { font-size: .72rem; color: var(--texto-3); }
.verificacion-oficial::before { content: '● '; color: var(--accion); }
.verificacion-secundaria::before { content: '● '; color: #c49a3a; }
.verificacion-por_confirmar::before { content: '○ '; color: var(--texto-3); }
@media (max-width: 720px) {
  .feria { grid-template-columns: minmax(0, 1fr); }
  .feria-acciones { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* ── Showroom (v0.15) ─────────────────────────────────────────────── */
.lista-faltan { margin: 6px 0 12px; padding-left: 18px; color: var(--texto-2); font-size: .9rem; }
.lista-faltan li { margin: 3px 0; }
.botones-linea { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.botones-linea .btn { margin-top: 0; }
.verificacion { border: 0; padding: 8px 0; margin: 0; border-bottom: 1px solid var(--linea); }
.verificacion:last-of-type { border-bottom: 0; }
.logo-vista { display: block; max-width: 140px; max-height: 140px; object-fit: contain; background: #fff; border: 1px solid var(--linea); border-radius: 12px; padding: 8px; margin-bottom: 10px; }
.texto-preformateado { white-space: pre-wrap; overflow-wrap: anywhere; }

/* Registro: los datos de la empresa solo se piden si se elige «Empresa».
   Sin JavaScript (la CSP no deja scripts en línea); si el navegador no
   entiende :has(), el bloque se ve siempre y no pasa nada. */
@supports selector(:has(*)) {
  .formulario .solo-participante { display: none; }
  .formulario:has(input[name="rol"][value="participante"]:checked) .solo-participante { display: block; }
}

/* Mi empresa: vista previa del logo. */
.logo-empresa-vista { width: 120px; height: 120px; object-fit: contain; background: #fff; border: 1px solid var(--linea); border-radius: var(--radio-chico); padding: 8px; }


/* ── Regenerative Expeditions (v0.1) ─────────────────────────────── */
.rejilla-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.rejilla-3 > .tarjeta + .tarjeta { margin-top: 0; }
@media (max-width: 900px) { .rejilla-3 { grid-template-columns: minmax(0, 1fr); } }
.rejilla-semana { margin-top: 18px; }
.punto-participante { background: #b08a4c; }
.punto-experiencia { background: var(--oliva); }
.punto-solicitud, .punto-evento-viaje { background: var(--coral); }
.punto-recursos { background: #7b7ba3; }
.evento-viaje { background: rgba(232, 99, 111, .12); color: #8a2f38; border-radius: 0; margin: 0 -7px; padding-left: 13px; }
.evento-viaje::before { display: none; }
.evento-viaje.inicio { border-radius: 5px 0 0 5px; margin-left: 0; padding-left: 6px; }
.evento-viaje.final { border-radius: 0 5px 5px 0; margin-right: 0; }
.evento-viaje.inicio.final { border-radius: 5px; }
.evento-viaje:hover { background: rgba(232, 99, 111, .2); color: #8a2f38; }
.logo-ficha { max-width: 160px; max-height: 120px; border-radius: var(--radio-chico); border: 1px solid var(--linea); padding: 6px; background: #fff; }
.fotos-experiencia { list-style: none; padding: 0; margin: 0 0 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.fotos-experiencia li { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fotos-experiencia img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radio-chico); background: var(--superficie-2); }
.fotos-experiencia .texto-suave { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; }
.fotos-experiencia .btn { white-space: normal; height: auto; min-height: 30px; }
.casillas-meses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 12px; }
@media (max-width: 520px) { .casillas-meses { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.acciones-fila { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.acciones-fila form { margin: 0; }
.pestanas-secundarias { margin-top: -6px; }
.cabecera-acceso img { width: 200px; height: 200px; margin: -24px 0 -30px; }
.cabecera-acceso { background: var(--tinta); }
