/*
Theme Name: Astra Child
Description: Tema hijo de Astra
Author: Tu Nombre
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

/* =========================
   TIPOGRAFÍAS GLOBALES
   ========================= */

/* Ivy Presto (encabezados) */
@font-face {
  font-family: 'IvyPresto';
  src: url('fonts/IvyPrestoDisplay.woff2') format('woff2'),
       url('fonts/IvyPrestoDisplay.woff') format('woff'),
       url('fonts/IvyPrestoDisplay.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Poppins (cuerpo) – carga desde Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* Variables de fuente (por si luego las reutilizas) */
:root{
  --font-heading: 'IvyPresto', serif;
  --font-body: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

/* Cuerpo del sitio (texto base, inputs, etc.) */
body,
button, input, select, textarea {
  font-family: var(--font-body);
  font-weight: 400;
}

/* Encabezados en TODO el sitio (Astra + Elementor + Gutenberg) */
h1, h2, h3, h4, h5, h6,
.elementor-widget-heading .elementor-heading-title,
.ast-site-title, .ast-archive-title, .entry-title,
.wp-block-heading, .widget-title, .wpforms-title {
  font-family: var(--font-heading) !important;
  font-weight: 400;
  line-height: 1.2;
}

/* =========================
   FORM CONTACTO (ID 1693)
   ========================= */

/* Etiquetas */
#wpforms-1693 label.wpforms-field-label,
#wpforms-1693 .wpforms-field-label-inline {
  font-size: 16px;
  font-weight: 500;
  color: #704f37;
}

/* Foco */
#wpforms-1693 input:focus,
#wpforms-1693 textarea:focus,
#wpforms-1693 select:focus {
  border-color: #a57054;
  outline: none;
}

/* Botón enviar */
#wpforms-1693 button[type="submit"] {
  background-color: #a57054;
  color: #fff;
  padding: 12px 24px;
  border: none;
  border-radius: 24px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease;
  display: block;
  margin: 0 auto;
}
#wpforms-1693 button[type="submit"]:hover {
  background-color: #d7b48f;
}

/* Confirmación */
#wpforms-confirmation-1693 {
  max-width: 600px;
  margin: 20px auto;
  padding: 20px;
  border: 1px solid #a57054;
  border-radius: 8px;
  background-color: #fdf6f0;
  text-align: center;
  box-sizing: border-box;
}
#wpforms-confirmation-1693 p {
  font-size: 16px;
  font-weight: 600;
  color: #704f37 !important;
  margin: 0;
}

/* =========================
   HELP LIBRARY – MENÚ
   ========================= */

.help-toc {
  position: sticky;
  top: 100px; /* ajusta según header */
  max-height: calc(100vh - 120px);
  overflow: auto;
  padding: .5rem 1rem;
  border-left: none;
}
.help-toc ul { list-style: none; margin: 0; padding: 0; }
.help-toc li { margin: .4rem 0; }

/* enlaces del índice (color de marca + hover más oscuro) */
.help-toc a {
  color: #a57054;
  text-decoration: none;
  transition: color 0.2s ease;
}
.help-toc a:hover {
  color: #704f37;
  text-decoration: none;
}

/* =========================
   TEMA REUSABLE DE FORMULARIOS (brand-form)
   Aplica a cualquier WPForms con clase "brand-form"
   ========================= */

.brand-form .wpforms-form .wpforms-field-label,
.brand-form .wpforms-form .wpforms-field-label-inline {
  font-size: 16px;
  font-weight: 500;
  color: #704f37;
  font-family: var(--font-body);
}

/* Campos + foco */
.brand-form .wpforms-form input[type="text"],
.brand-form .wpforms-form input[type="email"],
.brand-form .wpforms-form input[type="url"],
.brand-form .wpforms-form input[type="tel"],
.brand-form .wpforms-form textarea,
.brand-form .wpforms-form select {
  width: 100%;
  border: 1px solid #e0d6cf;
  border-radius: 6px;
  padding: 12px 16px;
  background: #fff;
  font-family: var(--font-body);
  box-shadow: 0 1px 0 rgba(0,0,0,.02) inset;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.brand-form .wpforms-form input:focus,
.brand-form .wpforms-form textarea:focus,
.brand-form .wpforms-form select:focus {
  border-color: #a57054;
  outline: none;
  box-shadow: 0 0 0 3px rgba(165,112,84,.12);
}

/* Placeholder y asterisco */
.brand-form .wpforms-form ::placeholder { color: #9b8f88; }
.brand-form .wpforms-form .wpforms-required-label { color: #a57054; }

/* Botón */
.brand-form .wpforms-form .wpforms-submit-container { text-align: center; }
.brand-form .wpforms-form button.wpforms-submit,
.brand-form .wpforms-form .wpforms-submit {
  background-color: #a57054 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 24px !important;
  padding: 12px 24px !important;
  font-size: 16px;
  font-weight: 600;
  font-family: var(--font-body);
  cursor: pointer;
  transition: background-color .3s ease, transform .06s ease;
  display: inline-block;
}
.brand-form .wpforms-form button.wpforms-submit:hover,
.brand-form .wpforms-form .wpforms-submit:hover {
  background-color: #704f37 !important;
}
.brand-form .wpforms-form button.wpforms-submit:active,
.brand-form .wpforms-form .wpforms-submit:active {
  transform: translateY(1px);
}

/* Confirmación */
.brand-form .wpforms-confirmation-container-full {
  max-width: 600px;
  margin: 20px auto;
  padding: 20px;
  border: 1px solid #a57054;
  border-radius: 8px;
  background-color: #fdf6f0;
  text-align: center;
  box-sizing: border-box;
  font-family: var(--font-body);
}
.brand-form .wpforms-confirmation-container-full p {
  font-size: 16px;
  font-weight: 600;
  color: #704f37 !important;
  margin: 0;
}

/* ===== Newsletter Footer (HFE) – FINAL (gap solo desktop) ===== */
.newsletter-footer{
  --footer-bg:#cda680;
  --footer-text:#fff;
  --field-bg:rgba(255,255,255,.10);
  --field-border:rgba(0,0,0,.22);
  --btn-bg:#a57054;
  --btn-bg-hover:#704f37;
  --height:52px;
  --radius:28px;
  --gap:0px;                         /* ← móvil/tablet sin hueco lateral */
  --focus-border:#e3c4a7;
  --focus-ring:rgba(227,196,167,.45);

  background:var(--footer-bg);
  color:var(--footer-text);
  text-align:center;
  padding:40px 16px;
}

.newsletter-footer .elementor-widget-heading .elementor-heading-title{
  color:#fff; margin-bottom:8px;
}
.newsletter-footer .newsletter-lead{
  color:#fff; opacity:.92; max-width:680px; margin:0 auto 14px;
}

/* Layout del formulario */
.newsletter-footer .wpforms-form{
  display:flex !important;
  align-items:center; justify-content:center;
  flex-wrap:wrap; gap:0 !important;   /* el espacio lo da el email */
  margin:0 auto;
}
.newsletter-footer .wpforms-field-container{
  display:flex !important; width:auto !important; margin:0 !important;
}
.newsletter-footer .wpforms-field{ width:auto !important; margin:0 !important; }

/* 👉 espacio entre email y botón controlado por la variable */
.newsletter-footer .wpforms-field-email{ margin-right:var(--gap) !important; }

.newsletter-footer .wpforms-submit-container{
  display:flex !important; width:auto !important; margin:0 !important;
}

/* Input */
.newsletter-footer .wpforms-form input[type="email"],
.newsletter-footer .wpforms-form input[type="text"]{
  height:var(--height); line-height:calc(var(--height) - 2px);
  min-width:clamp(240px,36vw,420px);
  padding:0 18px; border-radius:var(--radius);
  background:var(--field-bg); border:1.5px solid var(--field-border);
  color:#fff; box-shadow:0 1px 0 rgba(0,0,0,.05) inset;
}
.newsletter-footer .wpforms-form input::placeholder{ color:rgba(255,255,255,.85); }

/* Focus beige */
.newsletter-footer .wpforms-form input[type="email"]:focus,
.newsletter-footer .wpforms-form input[type="text"]:focus{
  outline:none !important; border-color:var(--focus-border) !important;
  box-shadow:0 0 0 3px var(--focus-ring);
}

/* Autofill Chrome */
.newsletter-footer .wpforms-form input:-webkit-autofill{
  -webkit-text-fill-color:#fff;
  box-shadow:0 0 0 1000px rgba(255,255,255,.10) inset;
  border-color:var(--focus-border);
  transition:background-color 9999s ease-in-out 0s;
}

/* Botón */
.newsletter-footer .wpforms-form .wpforms-submit{
  height:var(--height); line-height:calc(var(--height) - 2px);
  padding:0 22px; border-radius:var(--radius);
  background:var(--btn-bg) !important; color:#fff !important;
  border:none !important; font-weight:600; letter-spacing:.02em;
  transition:background .2s, transform .06s;
}
.newsletter-footer .wpforms-form .wpforms-submit:hover{ background:var(--btn-bg-hover) !important; }
.newsletter-footer .wpforms-field-label{ display:none; }

/* Desktop: aplica el hueco y mantiene 1 línea */
@media (min-width:768px){
  .newsletter-footer{ --gap:40px; }   /* ← ajusta aquí la separación en desktop */
  .newsletter-footer .wpforms-form{ flex-wrap:nowrap; }
}

/* Mobile: apilar */
@media (max-width:767px){
  .newsletter-footer .wpforms-form{ flex-direction:column; gap:10px; }
  .newsletter-footer .wpforms-form input[type="email"],
  .newsletter-footer .wpforms-form .wpforms-submit{ width:100%; }
}
/* Desktop: separa el campo del botón desde el contenedor correcto */
@media (min-width: 768px){
  .newsletter-footer .wpforms-form{ flex-wrap: nowrap !important; } /* 1 sola línea */
  .newsletter-footer .wpforms-field-container{
    margin-right: 28px !important;   /* <-- cambia 28px por lo que quieras */
    width: auto !important;
  }
  .newsletter-footer .wpforms-submit-container{
    margin-left: 0 !important;       /* por si WPForms mete márgenes */
    width: auto !important;
  }
}