/* Códice — capa de aplicación sobre el sitio institucional. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.codice-app {
  max-width: 68rem;
  margin-inline: auto;
  padding-block: 2rem 5rem;
}

.codice-app__intro h2,
.codice-app h1 {
  margin-block: 0.4rem 0.8rem;
}

.codice-app p {
  max-width: 62ch;
}

.buscador {
  display: flex;
  gap: 0.75rem;
  align-items: flex-end;
  margin-block: 1.5rem 1rem;
}

.campo-busqueda {
  flex: 1;
}

.campo-busqueda input,
.buscador input,
.anc input,
.panel-profesional input,
.panel-ia input,
.panel-profesional select,
.panel-ia select,
.accesibilidad select,
.campo-filtro input {
  width: 100%;
  min-height: 2.9rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--piedra);
  border-radius: 0.3rem;
  background: #fff;
  color: var(--pizarra);
  font: inherit;
}

.campo-busqueda input:focus-visible,
.buscador input:focus-visible,
.panel-profesional input:focus-visible,
.panel-ia input:focus-visible,
select:focus-visible,
.accesibilidad__boton:focus-visible,
.boton:focus-visible,
.volver:focus-visible {
  outline: 3px solid var(--verde-oliva);
  outline-offset: 2px;
}

.boton {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.65rem 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  font-family: var(--font-sans);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
}

.boton:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.boton--primario {
  background: var(--azul-noche);
  color: var(--marfil);
}

.boton--secundario {
  border-color: var(--azul-noche);
  color: var(--azul-noche);
  background: transparent;
}

.boton--texto {
  min-height: 2rem;
  padding-inline: 0.2rem;
  color: var(--azul-noche);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.fuentes-filtro {
  margin-block: 0.8rem 1.5rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--piedra);
  border-radius: 0.3rem;
}

.fuentes-filtro summary {
  cursor: pointer;
  font-weight: 600;
}

.fuentes-filtro__lista {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 0.5rem 1rem;
  margin-top: 0.8rem;
}

.fuentes-filtro__lista label {
  display: flex;
  gap: 0.45rem;
  align-items: flex-start;
  font-size: 0.92rem;
}

.nota {
  color: var(--pizarra);
  font-size: 0.92rem;
}

.nota--alerta {
  color: #7a2e1d;
}

.panel-error,
.panel-vacio {
  margin-block: 1.5rem;
  padding: 1.2rem;
  border-left: 4px solid var(--verde-oliva);
  background: #fff;
}

.panel-error {
  border-left-color: #8b2e22;
}

.resultados {
  margin-top: 2rem;
}

.resultados__meta {
  padding-block: 0.8rem;
  border-bottom: 1px solid var(--piedra);
  color: var(--pizarra);
  font-size: 0.92rem;
}

.resultados__lista {
  display: grid;
  gap: 1rem;
  margin: 1.2rem 0;
  padding: 0;
  list-style: none;
}

.result-card {
  padding: 1.1rem;
  border: 1px solid #d8d4c8;
  border-radius: 0.35rem;
  background: #fff;
}

.result-card h2,
.result-card h3 {
  margin-block: 0.5rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
}

.result-card p {
  margin-block: 0.5rem;
}

.result-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.8rem;
  align-items: center;
  color: var(--pizarra);
  font-size: 0.82rem;
}

.etiqueta {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  background: var(--marfil);
  color: var(--azul-noche);
  border: 1px solid var(--piedra);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
}

.etiqueta--alerta {
  border-color: #8b2e22;
  color: #8b2e22;
}

.result-card__acciones,
.resultados__acciones,
.detalle__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  margin-top: 0.8rem;
}

.resultados__acciones {
  margin-block: 1.2rem 2rem;
}

.volver {
  display: inline-block;
  margin-bottom: 1rem;
  color: var(--azul-noche);
  font-weight: 600;
}

.detalle__cabecera {
  margin-block: 1rem 1.5rem;
}

.detalle__ficha,
.detalle__texto {
  margin-block: 1.5rem;
  padding: 1.2rem;
  border: 1px solid #d8d4c8;
  background: #fff;
}

.detalle__ficha dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 1rem;
}

.detalle__ficha dt {
  color: var(--pizarra);
  font-size: 0.82rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.detalle__ficha dd {
  margin: 0.2rem 0 0;
}

.detalle__texto p {
  max-width: 72ch;
}

.panel-profesional,
.panel-ia {
  margin-block: 2rem;
  padding: 1.25rem;
  border: 1px solid #d8d4c8;
  background: #fff;
}

.panel-profesional__cabecera {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: flex-start;
}

.panel-profesional__cabecera h2 {
  margin-block: 0.3rem;
}

.interruptor {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  min-height: 2.75rem;
  font-weight: 600;
}

.interruptor input {
  width: 1.25rem;
  height: 1.25rem;
}

.panel-profesional__cuerpo,
.panel-ia__cuerpo {
  display: grid;
  gap: 1.25rem;
  margin-top: 1.25rem;
}

.panel-profesional__cuerpo {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
}

.historial,
.anc {
  min-width: 0;
}

.historial__cabecera {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: space-between;
}

.historial ul {
  padding: 0;
  list-style: none;
}

.historial__item {
  display: block;
  width: 100%;
  padding: 0.7rem 0;
  border: 0;
  border-bottom: 1px solid #e2ded3;
  background: none;
  color: var(--azul-noche);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.anc__campo {
  display: flex;
  gap: 0.6rem;
  align-items: flex-end;
}

.anc__campo label {
  flex: 1;
}

.anc__resultados {
  display: grid;
  gap: 0.8rem;
  padding: 0;
  list-style: none;
}

.anc__resultados li {
  padding: 0.8rem;
  border-left: 3px solid var(--verde-oliva);
  background: var(--marfil);
}

.anc__meta {
  font-size: 0.8rem;
  font-weight: 600;
}

.panel-ia__cuerpo {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.panel-ia__cuerpo > .nota,
.panel-ia__resultado,
.panel-ia__cuerpo > .boton {
  grid-column: 1 / -1;
}

.panel-ia__resultado {
  padding: 0.9rem;
  background: var(--marfil);
}

.aviso {
  margin-block: 1.2rem;
  padding: 0.9rem 1rem;
  border-left: 4px solid var(--verde-oliva);
  background: #fff;
}

.directorio__controles {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  margin-block: 1.2rem;
}

.campo-filtro {
  flex: 1;
}

.directorio__lista {
  display: grid;
  gap: 0;
  padding: 0;
  border-top: 1px solid var(--piedra);
  list-style: none;
}

.directorio__lista li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  align-items: center;
  justify-content: space-between;
  padding-block: 0.9rem;
  border-bottom: 1px solid #e2ded3;
}

.directorio__lista h2 {
  margin: 0 0 0.25rem;
  font-size: 1.3rem;
}

.directorio__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.accesibilidad {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  z-index: 80;
}

.accesibilidad__boton {
  min-height: 2.75rem;
  padding: 0.65rem 0.9rem;
  border: 1px solid var(--azul-noche);
  border-radius: 999px;
  background: var(--marfil);
  color: var(--azul-noche);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(27, 36, 51, 0.18);
}

.accesibilidad__panel {
  position: absolute;
  left: 0;
  bottom: 3.5rem;
  width: min(21rem, calc(100vw - 2rem));
  padding: 1rem;
  border: 1px solid var(--azul-noche);
  border-radius: 0.35rem;
  background: #fff;
  box-shadow: 0 12px 30px rgba(27, 36, 51, 0.25);
}

.accesibilidad__cabecera {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: space-between;
}

.accesibilidad__panel h2 {
  margin: 0;
  font-size: 1.35rem;
}

.accesibilidad__panel label {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.8rem;
  font-weight: 600;
}

html[data-letra="grande"] { font-size: 112.5%; }
html[data-letra="muy-grande"] { font-size: 125%; }
html[data-espaciado="amplio"] body { letter-spacing: 0.03em; word-spacing: 0.08em; line-height: 1.9; }
html[data-contraste="alto"] {
  --marfil: #ffffff;
  --pizarra: #111111;
  --piedra: #333333;
}
html[data-contraste="alto"] body { background: #fff; color: #111; }
html[data-contraste="alto"] a { text-decoration-thickness: 0.12em; }

@media (max-width: 760px) {
  .buscador,
  .anc__campo,
  .directorio__controles,
  .directorio__lista li {
    align-items: stretch;
    flex-direction: column;
  }
  .panel-profesional__cuerpo,
  .panel-ia__cuerpo {
    grid-template-columns: 1fr;
  }
  .accesibilidad {
    left: 0.7rem;
    bottom: 0.7rem;
  }
  .accesibilidad__panel {
    width: calc(100vw - 1.4rem);
  }
  .whatsapp-float {
    bottom: 5.2rem;
  }
}

.tabla-scroll {
  overflow-x: auto;
  margin-block: 1rem 2rem;
  border: 1px solid #d8d4c8;
  background: #fff;
}

.tabla {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.tabla th,
.tabla td {
  padding: 0.75rem;
  border-bottom: 1px solid #e2ded3;
  text-align: left;
  vertical-align: top;
}

.tabla th {
  background: var(--marfil);
  color: var(--azul-noche);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.tabla .nota {
  display: block;
  margin-top: 0.2rem;
}

.pendientes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1rem;
  margin-block: 1rem 2rem;
}

.pendiente {
  padding: 1rem;
  border-left: 4px solid var(--verde-oliva);
  background: #fff;
}

.pendiente h3 {
  margin-block: 0 0.4rem;
}

.lista-check {
  padding-left: 1.2rem;
}

.lista-check li {
  margin-block: 0.55rem;
}

/* El oliva de marca no alcanza 4.5:1 en texto pequeño; se usa una variante más oscura. */
.rotulo {
  color: #59603a;
}

/* Cabecera: 5 ítems + Códice + CTA, sin envolver etiquetas. */
.header-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
}

.codice-link {
  color: var(--azul-noche);
  font-family: var(--font-sans);
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 1px solid var(--verde-oliva);
  padding-bottom: 0.15rem;
}

.codice-link:hover {
  color: var(--verde-oliva);
}

.nav-link {
  white-space: nowrap;
}

@media (max-width: 900px) {
  .header-actions {
    margin-left: auto;
    gap: 0.6rem;
  }
  .header-cta {
    display: none;
  }
  .codice-link {
    font-size: 0.78rem;
  }
}

@media (max-width: 560px) {
  .brand-logo img {
    width: clamp(150px, 42vw, 190px);
  }
  .codice-link {
    font-size: 0.72rem;
  }
}

/* Buscador prominente en la portada. */
.hero-search {
  display: flex;
  gap: 0.5rem;
  align-items: stretch;
  max-width: 44rem;
  margin-block: 1.8rem 0.7rem;
  padding: 0.45rem;
  background: #fff;
  border-radius: 0.3rem;
}

.hero-search label {
  flex: 1;
  display: flex;
  align-items: center;
}

.hero-search input {
  width: 100%;
  min-height: 3rem;
  padding: 0.65rem 0.8rem;
  border: 0;
  background: transparent;
  color: var(--pizarra);
  font: inherit;
}

.hero-search input:focus-visible {
  outline: 2px solid var(--verde-oliva);
  outline-offset: 2px;
}

.hero-search .btn {
  flex-shrink: 0;
}

.hero-search__ayuda {
  max-width: 44rem;
  color: var(--marfil);
  opacity: 0.82;
  font-size: 0.88rem;
  margin-bottom: 1.3rem;
}

@media (max-width: 560px) {
  .hero-search {
    flex-direction: column;
  }
  .hero-search .btn {
    width: 100%;
  }
}

/* Enlace de salto: invisible hasta recibir foco por teclado. */
.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  z-index: 100;
  padding: 0.75rem 1rem;
  background: var(--marfil);
  color: var(--azul-noche);
  border: 2px solid var(--azul-noche);
  font-weight: 700;
  text-decoration: none;
}
.skip-link:focus {
  top: 0.75rem;
}

.buscador__ayuda {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem 1.2rem;
  margin-block: 0.7rem 1.2rem;
  color: var(--pizarra);
  font-size: 0.88rem;
  line-height: 1.45;
}
.buscador__ayuda strong {
  color: var(--azul-noche);
}
@media (max-width: 720px) {
  .buscador__ayuda {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }
}

/* Las páginas de aplicación no necesitan el aire de una sección editorial. */
.section--app {
  padding-block: 2.25rem 4.5rem;
}

/* Corrección WCAG 2.2 AA: las tintas auxiliares de marca no alcanzaban 4.5:1
   sobre marfil. Se conserva la paleta y se oscurece solo el texto pequeño. */
:root {
  --verde-oliva-texto: #59603A;
  --tinta-auxiliar: #5F635C;
}

.rotulo,
.numeral,
.num,
.paso .num,
.etapa .num,
.valor .numeral,
.area-card .numeral,
.socio-body .cargo,
.socio-cols .bloque h4,
.area-card .ofrece .mini-rotulo {
  color: var(--verde-oliva-texto);
}

.norma,
.meta,
.fuente,
.nota,
.area-card .norma,
.escrito-item .meta,
.articulo .meta,
.articulo-body .fuente {
  color: var(--tinta-auxiliar);
}

/* En móvil, el WhatsApp flotante tapaba el botón Buscar. Se conserva el
   enlace de WhatsApp en el pie; el acceso directo queda en escritorio. */
@media (max-width: 900px) {
  .whatsapp-float {
    display: none;
  }
  .section--app {
    padding-bottom: 5.5rem;
  }
}

.ejemplos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-block: 0.8rem 1.2rem;
  color: var(--tinta-auxiliar);
  font-size: 0.9rem;
}
.ejemplos button {
  min-height: 2.25rem;
  padding: 0.25rem 0.6rem;
  border: 1px solid var(--piedra);
  border-radius: 999px;
  background: #fff;
  color: var(--azul-noche);
  font: inherit;
  font-size: 0.86rem;
  cursor: pointer;
}
.ejemplos button:hover {
  border-color: var(--verde-oliva-texto);
  background: var(--marfil-soft);
}
.ejemplos button:focus-visible {
  outline: 3px solid var(--verde-oliva);
  outline-offset: 2px;
}

.header-a11y {
  display: none;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--azul-noche);
  border-radius: 50%;
  background: var(--marfil);
  color: var(--azul-noche);
  font: inherit;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
}

@media (max-width: 900px) {
  .header-a11y {
    display: inline-flex;
  }
  .accesibilidad__boton {
    display: none;
  }
}

/* Directorio judicial */
.judicial__filtros {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 1rem;
  margin-block: 0.8rem 1.2rem;
}
.judicial__filtros label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--pizarra);
  font-weight: 600;
}
.judicial__filtros select {
  min-height: 2.75rem;
  padding: 0.45rem 0.7rem;
  border: 1px solid var(--piedra);
  border-radius: 0.3rem;
  background: #fff;
  color: var(--azul-noche);
  font: inherit;
}
.judicial__lista {
  display: grid;
  gap: 1rem;
  margin-block: 1.2rem;
  list-style: none;
}
.judicial__card h2 {
  margin-block: 0.5rem 0.2rem;
}
.judicial__especialidad {
  color: var(--verde-oliva-texto);
  font-weight: 600;
}
.judicial__datos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem 1.5rem;
  margin-block: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--piedra);
}
.judicial__datos dt {
  color: var(--tinta-auxiliar);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.judicial__datos dd {
  margin: 0.15rem 0 0;
  overflow-wrap: anywhere;
  color: var(--pizarra);
  font-size: 0.92rem;
}
@media (max-width: 640px) {
  .judicial__datos {
    grid-template-columns: 1fr;
  }
}

.aviso-directorio {
  margin-block: 1.2rem;
  padding: 1rem 1.1rem;
  border-left: 4px solid var(--azul-noche);
  background: #fff;
  color: var(--pizarra);
}

/* Evita que la cabecera móvil desborde por acumular logo, Códice, Aa y menú. */
@media (max-width: 900px) {
  .header-inner {
    gap: 0.5rem;
  }
  .header-actions {
    gap: 0.35rem;
  }
  .menu-toggle {
    flex-shrink: 0;
  }
}

/* Mi carpeta */
.carrito-boton {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}
.carrito-boton .nota {
  flex-basis: 100%;
  margin: 0;
  font-size: 0.8rem;
}
.carrito-acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 1rem 0;
}
.carrito-lista {
  display: grid;
  gap: 0.8rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}
.carrito-item {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid #d8d4c8;
  border-radius: 0.35rem;
  background: #fff;
}
.carrito-item h2,
.carrito-item h3 {
  margin: 0.15rem 0 0.35rem;
}
.carrito-item__acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.4rem;
}
.detalle__carrito {
  margin: 0.8rem 0;
}
@media (max-width: 700px) {
  .carrito-item {
    flex-direction: column;
  }
}

@media (max-width: 900px) {
  /* El contador no cabe junto a Códice, Aa y el CTA; queda en el pie. */
  .header-actions .carrito-header { display: none; }
}

/* Accesos directos de la home del buscador */
.section--accesos { padding-top: 1.2rem; }
.accesos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .8rem; margin-top: 1.2rem; }
.acceso-card { display: block; padding: 1rem; border: 1px solid #d8d4c8; border-radius: .4rem; background: #fff; color: inherit; text-decoration: none; }
.acceso-card:hover, .acceso-card:focus-visible { border-color: #6E7443; box-shadow: 0 4px 14px rgba(27,36,51,.08); }
.acceso-card h3 { margin: .3rem 0 .35rem; }
.acceso-card p { margin: 0; color: #5F635C; }
.acceso-card span:last-child { display: inline-block; margin-top: .6rem; color: #6E7443; }
.selector-inicial { display: flex; flex-wrap: wrap; gap: .35rem; margin: 1rem 0 .6rem; }
.selector-inicial__opcion { border: 1px solid #d8d4c8; background: #fff; color: #1B2433; padding: .45rem .8rem; border-radius: 999px; font: inherit; cursor: pointer; }
.selector-inicial__opcion--activa { background: #1B2433; border-color: #1B2433; color: #F3F1EA; }
.modo-toggle { display: inline-flex; align-items: center; gap: .4rem; margin-top: .4rem; font-size: .86rem; }
.filtro-campo { display: grid; gap: .3rem; margin-bottom: .8rem; font-size: .9rem; }
.ia-enlaces { max-width: 900px; margin: 1rem auto; padding: 1rem; border: 1px solid #d8d4c8; border-radius: .4rem; background: #fff; }
.ia-enlaces__acciones { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
@media (max-width: 600px) { .selector-inicial { display: grid; grid-template-columns: 1fr; } }