/* =========================================================================
   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).
   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;
}

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: 12px 44px !important;
  padding: 15px 40px 22px !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: 15px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #c9a84c;
  margin-bottom: 2px;
}

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

form.nbl-cb-bar .nbl-cb-field label {
  font-family: 'Jost', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500;
  letter-spacing: 0.24em !important;
  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: 7px 2px 9px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 17px !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: 26px;
  height: 26px;
  padding: 3px;
  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: 15px 40px !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;
}

/* Solapar la barra sobre el hero solo en escritorio + acercarla al menu (-15px) */
@media screen and (min-width: 992px) {
  .elementor-section:has(form.nbl-cb-bar) {
    margin-bottom: -56px;
  }
  form.nbl-cb-bar {
    margin-top: -15px !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: 16px !important;
    padding: 17px 22px 19px !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: 0;
  }
}