/* =========================================================================
   Nebulae - Fuentes auto-alojadas + correccion del logo
   -------------------------------------------------------------------------
   Motivo: LiteSpeed Cache estaba eliminando la hoja de fonts.googleapis.com,
   por lo que Jost, Urbanist y Cormorant Garamond nunca llegaban al navegador
   y todo el sitio caia a tipografias de sistema. Al servirlas desde el propio
   dominio ya no dependen de Google ni de la optimizacion de LiteSpeed.
   Subset: latin (cubre todo el espanol e ingles). Formato: woff2 variable.
   Cargado desde: wp-content/mu-plugins/nebulae-fonts-local.php
   ========================================================================= */

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/jost-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Jost';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/jost-italic-latin.woff2') format('woff2');
}

@font-face {
  font-family: 'Urbanist';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/urbanist-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Urbanist';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/urbanist-italic-latin.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/cormorant-garamond-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url('/wp-content/themes/archy-child/fonts/cormorant-garamond-italic-latin.woff2') format('woff2');
}

/* -------------------------------------------------------------------------
   Logo: el <img> trae el atributo width="601", que actua como ancho
   presentacional. Con max-width:100% + max-height (y sin width:auto) el
   navegador aplicaba ambos limites a la vez y aplastaba el logo:
   316x46 px en vez de respetar su proporcion real de 3.11:1.
   width/height:auto lo devuelve a su proporcion original.
   Tamanos ajustados -25% a pedido de Eric (2026-07-29): 72->54, 56->42, 44->33.
   ------------------------------------------------------------------------- */
.site-title img,
.site-title-sticky img,
h1.site-title img,
.custom-logo {
  width: auto !important;
  height: auto !important;
}

.site-title img { max-height: 54px !important; }

@media screen and (max-width: 991px) {
  .site-title img { max-height: 42px !important; }
}
@media screen and (max-width: 600px) {
  .site-title img { max-height: 33px !important; }
}

/* =========================================================================
   Barra de reservas Cloudbeds (/book-us/) - rediseno 2026-07-29
   -------------------------------------------------------------------------
   La barra es un formulario propio (.nbl-cb-bar, HTML en Elementor) que
   redirige al motor de Cloudbeds; no es un iframe, asi que se estiliza
   integramente desde aqui. Pedido de Eric: ancho igual al contenido del
   menu (no de borde a borde), tipografia mas cuidada y transparencia.
   Vidrio oscuro con blur + acento dorado #c9a84c de la marca; se solapa
   levemente sobre el hero para que la translucidez se perciba.
   Ajustes 2026-07-29 (2): opacidad 80%, barra 15px mas cerca del menu,
   titulo "Book Direct..." via ::before (sin tocar Elementor).
   Ajustes 2026-07-29 (3): etiquetas Check-in/Check-out mas grandes (13.5px)
   e icono de calendario ampliado (26px) con hover dorado, por ser el paso
   prioritario para iniciar la reserva.
   Ajustes 2026-07-29 (4): barra ~15px mas compacta en vertical (padding y
   gaps reducidos, mismos tamanos de texto/campos) y esquinas mas redondas
   (radio 6px -> 10px).
   Ajustes 2026-10-11 (5): a pedido de Eric, barra bastante mas compacta para
   que no choque con el menu de arriba ni con el titulo del hero abajo.
   Alto ~168px -> ~105px. Se reducen padding, gaps y tamanos de texto, y se
   anula el margin-bottom que el tema le ponia al <label> (se duplicaba con
   el gap del campo). El solape sobre el hero baja de -56px a -30px y la
   barra deja de pegarse al menu (margin-top -15px -> 10px).
   Ajustes 2026-10-11 (6): el titulo "Book Direct..." quedaba pegado a las
   etiquetas de abajo (solo tenia aire arriba). Se le da margen inferior
   propio para que respire igual que Check-in/Check-out, y la barra entera
   baja 30px (margin-top 10px -> 40px).
   Ajustes 2026-10-11 (7): la "linea" que se veia bajo el titulo NO era de la
   barra: era el borde inferior de .header-wrap-inner (el encabezado), que al
   bajar la barra quedo por fuera. Moverlo afectaria el header de todo el
   sitio, asi que la barra ahora dibuja su propio separador: border-bottom en
   el ::before, centrado en el hueco entre el titulo y Check-in. Queda fijo
   aunque la barra se reposicione.
   Ajustes 2026-10-12 (8): la barra sube 20px (margin-top 40px -> 20px) y se
   oculta la linea del encabezado, que quedaba suelta justo encima del panel.
   Esa linea es el border-bottom de .header-wrap-inner y es parte del header
   transparente del tema (tambien esta en home y galeria), asi que se quita
   SOLO en las paginas que tienen la barra, via body:has(form.nbl-cb-bar).
   El resto del sitio la conserva.
   Sobrescribe con !important el <style> inline del widget de Elementor.
   Nota: el inset lateral vive en el propio form (width: min(...)) porque
   Elementor pisa el padding del section con mayor especificidad.
   ========================================================================= */

.elementor-section:has(form.nbl-cb-bar) {
  position: relative;
  z-index: 8;
}

/* Solo en /book-us/ y /es/reservar/: el borde inferior del encabezado caia a
   5px del panel y se leia como un separador suelto. En el resto del sitio
   (home, galeria, etc.) la linea se mantiene intacta. */
body:has(form.nbl-cb-bar) .header-wrap-inner {
  border-bottom: 0 !important;
}

form.nbl-cb-bar {
  width: min(1170px, calc(100% - 32px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: flex-end !important;
  justify-content: center;
  gap: 7px 40px !important;
  padding: 14px 36px 14px !important;
  background: rgba(17, 18, 23, 0.80) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  backdrop-filter: blur(16px) saturate(1.2);
  border: 1px solid rgba(244, 240, 232, 0.16) !important;
  border-radius: 10px !important;
  box-shadow: 0 26px 60px -20px rgba(8, 8, 10, 0.5) !important;
  font-family: 'Jost', sans-serif !important;
  box-sizing: border-box;
}

form.nbl-cb-bar::before {
  content: "Book Direct and enjoy the best rate available!";
  flex: 1 1 100%;
  text-align: center;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  line-height: 1.45;
  text-transform: uppercase;
  color: #c9a84c;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(244, 240, 232, 0.22);
  margin-bottom: 4px; /* + los 7px de row-gap = 11px bajo la linea, ~10px encima */
}

form.nbl-cb-bar .nbl-cb-field {
  flex: 0 1 300px !important;
  min-width: 0 !important;
  gap: 4px !important;
}

form.nbl-cb-bar .nbl-cb-field label {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: 0.2em !important;
  line-height: 1.5 !important;
  margin: 0 !important; /* el tema le metia 8px abajo, duplicando el gap */
  text-transform: uppercase;
  color: #c9a84c !important;
}

form.nbl-cb-bar .nbl-cb-field input {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(244, 240, 232, 0.35) !important;
  border-radius: 0 !important;
  padding: 4px 2px 6px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 15.5px !important;
  letter-spacing: 0.05em;
  color: #f4f0e8 !important;
  color-scheme: dark; /* texto e icono de calendario claros en el picker nativo */
  transition: border-color 0.25s ease;
}

form.nbl-cb-bar .nbl-cb-field input::-webkit-calendar-picker-indicator {
  width: 21px;
  height: 21px;
  padding: 2px;
  cursor: pointer;
  opacity: 0.9;
  border-radius: 5px;
  transition: filter 0.2s ease, background-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

form.nbl-cb-bar .nbl-cb-field input::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
  transform: scale(1.12);
  background-color: rgba(201, 168, 76, 0.18);
  /* blanco -> dorado #c9a84c aprox */
  filter: sepia(1) saturate(3.2) hue-rotate(-6deg) brightness(1.02);
}

form.nbl-cb-bar .nbl-cb-field input:focus {
  outline: none !important;
  border-bottom-color: #c9a84c !important;
}

form.nbl-cb-bar .nbl-cb-btn {
  flex: 0 0 auto !important;
  width: auto !important;
  background: #c9a84c !important;
  color: #14151a !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase;
  padding: 11px 32px !important;
  border-radius: 3px !important;
  transition: background 0.25s ease, color 0.25s ease;
}

form.nbl-cb-bar .nbl-cb-btn:hover {
  background: #f4f0e8 !important;
  color: #14151a !important;
}

/* Solape suave sobre el hero + aire respecto al menu (escritorio) */
@media screen and (min-width: 992px) {
  .elementor-section:has(form.nbl-cb-bar) {
    margin-bottom: -30px;
  }
  form.nbl-cb-bar {
    margin-top: 20px !important;
  }
}

/* Movil: apilado, sin solape, boton a lo ancho */
@media screen and (max-width: 767px) {
  form.nbl-cb-bar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 13px 20px 15px !important;
  }
  form.nbl-cb-bar .nbl-cb-field {
    flex: 1 1 auto !important;
  }
  form.nbl-cb-bar .nbl-cb-btn {
    width: 100% !important;
  }
  form.nbl-cb-bar::before {
    font-size: 12px;
    letter-spacing: 0.14em;
    margin-bottom: 2px; /* + los 12px de gap movil */
  }
}