/* planilla.css
   Estilos compartidos de las planillas replicadas desde PDF (hoja de geometria fija).
   Unidades en pt: 1 pt del PDF = 1 pt en CSS, para que la impresion sea identica.
   Se carga despues de custom.css (reutiliza header, footer, card y botones).
   La posicion de cada campo vive en css/planillas/<slug>.css (generado por
   tools/pdf2planilla.py); este archivo se edita a mano.
*/

:root {
  --pjf-hoja-ancho: 612pt;
  --pjf-hoja-alto: 1008pt;
  --pjf-hoja-sep: 18pt;
  --pjf-tinta: #292929;
  --pjf-escala: 1;
  --pjf-hojas: 1;
}

/* ---------- Navegacion entre planillas ---------- */
.pjf-nav {
  background: var(--pjf-blanco);
  border-bottom: 1px solid #e1e4e9;
  padding: 0.5rem 0;
}
.pjf-nav .nav-link {
  color: var(--pjf-azul-marino);
  font-weight: 600;
  font-size: 0.9rem;
}
.pjf-nav .nav-link.active {
  background-color: var(--pjf-azul-marino);
  color: var(--pjf-blanco);
}

.pjf-selector {
  color: inherit;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.pjf-selector:hover,
.pjf-selector:focus {
  box-shadow: 0 6px 18px rgba(13, 35, 64, 0.16);
  transform: translateY(-2px);
  color: inherit;
}

/* ---------- Indice de fueros: tarjetas del mismo tamano, con los enlaces a cada planilla ---------- */
.pjf-fuero-grilla {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;          /* todas las filas (y por lo tanto todas las tarjetas) con la misma altura */
  gap: 1.5rem;
  max-width: 1000px;
  margin: 0 auto;
}
@media (max-width: 767.98px) {
  .pjf-fuero-grilla { grid-template-columns: minmax(0, 1fr); }
}
.pjf-fuero-tarjeta {
  display: flex;
  flex-direction: column;
  padding: 1.5rem;
}
.pjf-fuero-tarjeta__titulo {
  font-family: var(--pjf-font-display);
  font-size: 1.2rem;
  line-height: 1.3;
  min-height: 3.1rem;          /* reserva dos renglones: todos los titulos ocupan el mismo alto */
  margin: 0 0 0.75rem;
  color: var(--pjf-azul-marino);
}
.pjf-fuero-tarjeta__enlaces {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 2px solid var(--pjf-dorado-claro);
}
.pjf-fuero-tarjeta__enlaces li { border-bottom: 1px solid #e1e4e9; }
.pjf-fuero-tarjeta__enlaces a {
  display: block;
  padding: 0.55rem 0.25rem;
  color: var(--pjf-azul-marino);
  font-weight: 600;
  text-decoration: none;
}
.pjf-fuero-tarjeta__enlaces a:hover,
.pjf-fuero-tarjeta__enlaces a:focus-visible {
  background-color: var(--pjf-gris-claro);
  color: var(--pjf-azul-marino-oscuro);
}
/* ---------- Pantalla: las hojas se escalan para entrar en el ancho disponible ---------- */
.pjf-hoja-viewport {
  margin: 0 auto;
  width: calc(var(--pjf-hoja-ancho) * var(--pjf-escala));
  height: calc((var(--pjf-hojas) * var(--pjf-hoja-alto) + (var(--pjf-hojas) - 1) * var(--pjf-hoja-sep)) * var(--pjf-escala));
}

.pjf-hoja-escala {
  display: flex;
  flex-direction: column;
  gap: var(--pjf-hoja-sep);
  margin: 0;
  width: var(--pjf-hoja-ancho);
  transform: scale(var(--pjf-escala));
  transform-origin: top left;
}

.pjf-hoja {
  position: relative;
  flex: none;
  width: var(--pjf-hoja-ancho);
  height: var(--pjf-hoja-alto);
  background: #fff;
  box-shadow: 0 2px 14px rgba(13, 35, 64, 0.18);
  overflow: hidden;
  font-family: Arial, 'Liberation Sans', Helvetica, sans-serif;
  color: var(--pjf-tinta);
}

.pjf-hoja__svg {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
}

.pjf-t,
.pjf-t-b,
.pjf-t-i,
.pjf-t-bi,
.pjf-t-black {
  fill: var(--pjf-tinta);
  font-family: Arial, 'Liberation Sans', Helvetica, sans-serif;
  white-space: pre;
}
.pjf-t-b { font-weight: 700; }
.pjf-t-i { font-style: italic; }
.pjf-t-bi { font-weight: 700; font-style: italic; }
.pjf-t-black { font-family: 'Arial Black', Arial, 'Liberation Sans', Helvetica, sans-serif; font-weight: 900; }
/* Textos del PDF compuestos en Times New Roman (registros de juicios universales) */
.pjf-serif { font-family: 'Times New Roman', 'Liberation Serif', Times, serif; }

/* ---------- Campos de texto ---------- */
.pjf-campo {
  position: absolute;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #000;
  font-family: Arial, 'Liberation Sans', Helvetica, sans-serif;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  overflow: hidden;
  text-overflow: clip;
  white-space: nowrap;
}

.pjf-multi {
  resize: none;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

select.pjf-campo { padding-right: 12pt; cursor: pointer; }
.pjf-flecha { position: absolute; pointer-events: none; }

.pjf-campo::placeholder { color: #8a8f98; font-style: italic; opacity: 1; }
.pjf-campo:hover { background-color: rgba(184, 150, 63, 0.10); }
.pjf-campo:focus { background-color: rgba(184, 150, 63, 0.18); box-shadow: 0 1pt 0 var(--pjf-dorado); }

/* ---------- Casillas y botones de opcion: el recuadro ya esta dibujado en la hoja ---------- */
.pjf-marca {
  position: absolute;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 3pt;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80% 80%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.pjf-marca:hover { background-color: rgba(184, 150, 63, 0.14); }
.pjf-marca:focus-visible { outline: 2px solid var(--pjf-dorado); outline-offset: 1px; }
.pjf-marca:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3.5 10.5l4.2 4.6L16.8 4.6' fill='none' stroke='%23292929' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---------- Impresion: cada hoja ocupa una pagina completa, sin margenes ---------- */
@media print {
  @page {
    size: 612pt 1008pt;
    margin: 0;
  }

  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }

  main.container { margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; }

  .pjf-hoja-viewport {
    width: auto;
    height: auto;
    margin: 0;
  }

  .pjf-hoja-escala {
    display: block;
    gap: 0;
    transform: none;
  }

  .pjf-hoja {
    box-shadow: none;
    /* 1 pt menos que la pagina para evitar una hoja en blanco por redondeo */
    height: calc(var(--pjf-hoja-alto) - 1pt);
    break-after: page;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .pjf-hoja:last-child { break-after: auto; }

  .pjf-campo::placeholder { color: transparent; }

  .pjf-campo,
  .pjf-campo:hover,
  .pjf-campo:focus,
  .pjf-marca:hover {
    background-color: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 575.98px) {
  .pjf-nav .nav-link { padding: 0.35rem 0.6rem; font-size: 0.8rem; }
}