/*
  Formulario de búsqueda (vía externa) — reusa las variables del Design
  System que ya define el tema (style.css): --lac-red, --lac-navy,
  --font-display, --font-body, --lac-gray-200. No se vuelven a declarar acá
  para no duplicar Typekit ni arriesgar un valor distinto al del tema.

  Los campos que se agregan DENTRO del formulario de contacto reusan la
  clase .lac-field del propio tema (label + input con el mismo tratamiento
  que ya tienen "Nombre"/"WhatsApp"/etc.) en vez de reinventarla acá: así
  quedan pixel a pixel iguales sin duplicar esa regla.
*/

/* ===================== Casillas — Design System, sin excepciones ===================== */
.lacb-consentimiento input[type=checkbox],
.lacb-form input[type=checkbox]{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  width:20px;
  height:20px;
  min-width:20px;
  margin:2px 0 0;
  border:1.5px solid var(--lac-gray-200,#D8D9DA);
  background:var(--lac-white,#fff);
  border-radius:0 !important;
  position:relative;
  cursor:pointer;
  flex:none;
}
.lacb-consentimiento input[type=checkbox]:hover,
.lacb-form input[type=checkbox]:hover{
  border-color:var(--lac-black,#2D2926);
}
.lacb-consentimiento input[type=checkbox]:checked,
.lacb-form input[type=checkbox]:checked{
  background:var(--lac-red,#D92D27);
  border-color:var(--lac-red,#D92D27);
}
.lacb-consentimiento input[type=checkbox]:checked::after,
.lacb-form input[type=checkbox]:checked::after{
  content:"";
  position:absolute;
  left:6px;
  top:2px;
  width:5px;
  height:10px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.lacb-consentimiento input[type=checkbox]:focus-visible,
.lacb-form input[type=checkbox]:focus-visible{
  outline:2px solid var(--lac-red,#D92D27);
  outline-offset:2px;
}

/* ===================== Bloque de consentimiento — ancho completo ===================== */
.lacb-consentimiento{
  display:flex;
  align-items:flex-start;
  gap:12px;
  width:100%;
  min-height:44px;
  padding:8px 0;
  cursor:pointer;
}
.lacb-consentimiento__texto{
  font-family:var(--font-body,Arial,sans-serif);
  font-size:13px;
  line-height:1.65;
  color:var(--lac-gray,#888B8D);
  flex:1;
  min-width:0;
}

/* ===================== Integración con el formulario de contacto ===================== */
/* Colapsa/expande sin librerías: grid-template-rows 0fr -> 1fr, con el
   contenido real envuelto en un div con overflow:hidden. Funciona a
   cualquier ancho porque nunca depende de una altura fija en px. */
.lacb-extra-campos-outer{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows 280ms ease;
  width:100%;
}
.lacb-extra-campos-outer.is-abierto{
  grid-template-rows:1fr;
}
.lacb-extra-campos-inner{
  overflow:hidden;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.lacb-extra-campos-outer:not(.is-abierto) .lacb-extra-campos-inner{
  visibility:hidden; /* además de la altura en 0, saca el tabindex del paso del teclado */
}
.lacb-extra-campos__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.lac-field.lacb-full{ grid-column:1 / -1; }
.lac-field.lacb-marca-otra{ grid-column:1 / -1; max-width:calc(50% - 8px); }
/* El [hidden] nativo pierde contra reglas de display más específicas
   (.lac-field del tema, .lacb-form label acá abajo): se refuerza con
   !important para que ocultar el campo "Otra" funcione siempre, sin
   depender del orden de carga de ninguna hoja de estilos. */
.lacb-marca-otra[hidden]{ display:none !important; }

/* ===================== Formulario independiente / shortcode / stock ===================== */
.lacb-form-wrap{
  border:2px solid var(--lac-black,#2D2926);
  padding:28px;
  margin:32px 0;
  background:var(--lac-white,#fff);
}
.lacb-form__titulo{
  font-family:var(--font-display,"brother-1816",Arial,sans-serif);
  font-weight:700;
  text-transform:uppercase;
  font-size:20px;
  margin:0 0 8px;
  letter-spacing:-0.01em;
}
.lacb-form__texto{ margin:0 0 20px; font-family:var(--font-body,Arial,sans-serif); }
.lacb-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.lacb-form label{
  display:block;
  font-family:var(--font-display,"brother-1816",Arial,sans-serif);
  font-weight:700;
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--lac-black,#2D2926);
}
.lacb-form input[type=text], .lacb-form input[type=tel], .lacb-form input[type=email], .lacb-form input[type=number], .lacb-form select, .lacb-form textarea{
  display:block;
  width:100%;
  min-height:44px;
  border:1px solid var(--lac-gray-200,#D8D9DA);
  border-bottom:2px solid var(--lac-black,#2D2926);
  padding:0 12px;
  margin-top:6px;
  font-family:var(--font-body,Arial,sans-serif);
  font-size:14px;
  border-radius:0;
  box-sizing:border-box;
  background:var(--lac-white,#fff);
}
.lacb-form select{ appearance:none; -webkit-appearance:none; }
.lacb-form textarea{ min-height:64px; padding:10px 12px; }
.lacb-form__campo-full{ display:block; margin-bottom:16px; grid-column:1 / -1; }
.lacb-marca-otra{ grid-column:1 / -1; }
.lacb-form__submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 28px;
  border:2px solid var(--lac-red,#D92D27);
  background:var(--lac-red,#D92D27);
  color:#fff;
  font-family:var(--font-display,"brother-1816",Arial,sans-serif);
  font-weight:700;
  letter-spacing:0.04em;
  text-transform:uppercase;
  font-size:15px;
  cursor:pointer;
  border-radius:0;
  margin-top:16px;
}
.lacb-form__submit:hover{ background:var(--lac-red-hover,#C0241F); border-color:var(--lac-red-hover,#C0241F); }
.lacb-form__ok{ border:2px solid var(--lac-navy,#1D2758); padding:20px; }
.lacb-form__ok strong{ font-family:var(--font-display,"brother-1816",Arial,sans-serif); text-transform:uppercase; }

@media (max-width:640px){
  .lacb-form__grid, .lacb-extra-campos__grid{ grid-template-columns:1fr; }
  .lac-field.lacb-marca-otra{ max-width:none; }
}