.elementor-kit-8{--e-global-color-primary:#222222;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#08DC97;--e-global-color-dd94ca7:#08DC97;--e-global-color-211713c:#272727;--e-global-color-d5e03a5:#6EC1E4;--e-global-color-1febe3d:#EB752C;--e-global-color-b9d8cce:#FAF8ED;--e-global-color-9557a46:#6EC1E4;--e-global-color-6b691a8:#00FFA7;--e-global-typography-primary-font-family:"DM Sans";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"DM Sans";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"DM Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"DM Sans";--e-global-typography-accent-font-weight:500;--e-global-typography-649eeff-font-family:"Neue Haas Grotesk DS Pro";--e-global-typography-649eeff-font-size:24px;--e-global-typography-649eeff-font-weight:bold;background-color:#FAF8ED;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1180px;}.e-con{--container-max-width:1180px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(min-width:1700px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1340px;}.e-con{--container-max-width:1340px;}}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* En Site Settings (global) */
:root .listing-features-nl > .feature-tag-nl { display:none !important; }
:root .listing-features-nl > .feature-tag-nl.main-detail-_uno { display:flex !important; }

/* Esconde por completo Contact + Social */
:root .contact-section-modern,
:root .social-section-modern {
  display: none !important;
}


.wppb-form-field:not(#select_user_to_edit_form .wppb-form-field, .wppb-checkbox-terms-and-conditions, .wppb-gdpr-checkbox, .wppb-subscription-plans) label:not(.wppb-checkboxes label, .wppb-radios label), #pms-subscription-plans-discount label, .pms-invite-code-name-field label, #wppb-login-wrap .login-username label, #wppb-login-wrap .login-password label, #wppb-login-wrap .login-auth label {
    width: 100% !important;
}

/* Oculta cualquier wrapper TRP mal impreso dentro del botón de submit */
.form-submit trp-gettext,
.form-submit [data-trpgettextoriginal],
trp-gettext {
  display: none !important;
}



/****************************************************
  WANDERLOOP DATEPICKER SKIN (sin clases extras)
  - Colores base: #00da8f
  - Funciona con el HTML default que me mandaste
****************************************************/

/* ====== CONTENEDOR POPUP ====== */
#ui-datepicker-div {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Inter", "Source Sans Pro", sans-serif;
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.07) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 48px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.06) !important;
  padding: 0 !important;
  overflow: hidden;
  min-width: 260px;
  color: #1a1a1a;
  z-index: 99999 !important;
}

/* jQuery UI mete estas clases, aseguramos que no reinyecte bordes feos */
#ui-datepicker-div.ui-widget,
#ui-datepicker-div.ui-widget-content {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* ====== HEADER (barra con mes/año y flechas) ====== */
#ui-datepicker-div .ui-datepicker-header {
  background: #00da8f !important;
  color: #ffffff !important;
  border: none !important;
  border-bottom: 1px solid rgba(0,0,0,0.05) !important;
  border-radius: 16px 16px 0 0 !important;
  padding: 12px 40px !important;
  position: relative;
  text-align: center;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.2;
  box-shadow: 0 8px 16px rgba(0,0,0,0.08) inset;
}

/* Bloque que contiene los select de mes y año */
#ui-datepicker-div .ui-datepicker-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #ffffff;
  font-size: 15px;
  font-weight: 600;
  margin: 0;
}

/* Select MES / AÑO dentro del header */
#ui-datepicker-div .ui-datepicker-title select {
  background: rgba(255,255,255,0.15) !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  padding: 4px 8px !important;
  appearance: none;
  outline: none;
  cursor: pointer;
}
#ui-datepicker-div .ui-datepicker-title select:focus {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.45) !important;
  outline: none;
}

/* Prev / Next (los botones de las flechas) */
#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(255,255,255,0.2) !important;
  border: 0 !important;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background 0.15s ease, box-shadow 0.15s ease;
  color: #fff !important;
  text-decoration: none !important;
}
#ui-datepicker-div .ui-datepicker-prev { left: 8px; }
#ui-datepicker-div .ui-datepicker-next { right: 8px; }

/* jQuery UI pone un <span class="ui-icon ui-icon-circle-triangle-w">Prev</span>
   Vamos a esconder el texto interno y dibujar nuestras flechas con ::after */
#ui-datepicker-div .ui-datepicker-prev span,
#ui-datepicker-div .ui-datepicker-next span {
  background-image: none !important;
  text-indent: 0 !important;
  color: #fff !important;
  font-size: 0 !important; /* oculta literal "Prev"/"Próximo" */
  line-height: 1 !important;
}

#ui-datepicker-div .ui-datepicker-prev span::after {
  content: "◀";
  font-size: 14px;
  color: #fff;
}
#ui-datepicker-div .ui-datepicker-next span::after {
  content: "▶";
  font-size: 14px;
  color: #fff;
}

#ui-datepicker-div .ui-datepicker-prev:hover,
#ui-datepicker-div .ui-datepicker-next:hover {
  background: rgba(255,255,255,0.28) !important;
  box-shadow: 0 4px 8px rgba(0,0,0,0.12);
}

#ui-datepicker-div .ui-datepicker-prev:focus,
#ui-datepicker-div .ui-datepicker-next:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.45) !important;
}

/* ====== CABECERA DE LOS DÍAS (Su Mo Tu...) ====== */
#ui-datepicker-div table.ui-datepicker-calendar thead tr th {
  background: #ffffff !important;
  color: #6b7280 !important; /* gris medio */
  font-size: 13px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: -0.02em;
  text-align: center;
  padding: 10px 0 8px !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
#ui-datepicker-div table.ui-datepicker-calendar thead span {
  text-transform: none !important;
}

/* ====== BODY DEL CALENDARIO ====== */
#ui-datepicker-div table.ui-datepicker-calendar {
  width: 100%;
  border-radius: 0 0 16px 16px !important;
  background: #fff !important;
  border-collapse: separate;
  border-spacing: 0;
}

#ui-datepicker-div table.ui-datepicker-calendar tbody tr td {
  background: #ffffff !important;
  border: none !important;
  padding: 0 !important;
  text-align: center !important;
  width: auto;
}

/* Día clickable normal */
#ui-datepicker-div table.ui-datepicker-calendar tbody tr td a,
#ui-datepicker-div table.ui-datepicker-calendar tbody tr td span {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 36px !important;
  height: 36px !important;
  margin: 4px auto !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  background: #fff !important;
  color: #1a1a1a !important;
  cursor: pointer !important;
  transition: all 0.15s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
  text-decoration: none !important;
}

/* Hover día normal */
#ui-datepicker-div table.ui-datepicker-calendar tbody tr td a:hover {
  border-color: #00da8f !important;
  box-shadow: 0 4px 10px rgba(0,218,143,0.18) !important;
  color: #00a870 !important; /* un verde un poquito más oscuro para texto */
}

/* Día seleccionado (ui-state-active) */
#ui-datepicker-div .ui-state-active,
#ui-datepicker-div .ui-state-active:hover,
#ui-datepicker-div .ui-state-active:focus {
  background: #00da8f !important;
  border-color: #00da8f !important;
  color: #ffffff !important;
  box-shadow: 0 6px 16px rgba(0,218,143,0.4) !important;
  font-weight: 600 !important;
  outline: none !important;
}

/* "Hoy" (ui-state-highlight) cuando NO es el que está seleccionado */
#ui-datepicker-div .ui-state-highlight:not(.ui-state-active),
#ui-datepicker-div .ui-state-highlight:not(.ui-state-active):hover {
  border-color: #00da8f !important;
  background: rgba(0,218,143,0.08) !important;
  color: #00a870 !important;
  box-shadow: 0 4px 10px rgba(0,218,143,0.18) !important;
}

/* Días deshabilitados o de otro mes */
#ui-datepicker-div .ui-state-disabled,
#ui-datepicker-div .ui-datepicker-other-month .ui-state-default,
#ui-datepicker-div .ui-datepicker-unselectable .ui-state-default {
  background: #f9fafb !important;
  border-color: rgba(0,0,0,0.05) !important;
  color: #c7c7c7 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* ====== INPUT DEL FORMULARIO (campo Cumpleaños) ======
   Esto targetea cualquier <input> que jQuery UI convierte en datepicker
   porque le agrega .hasDatepicker */
input.hasDatepicker {
  padding: 16px 20px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: #000 !important;
  background: #fff !important;
  outline: none !important;
  width: 100%;
  max-width: 400px; /* opcional */
}

input.hasDatepicker:focus {
  box-shadow:
    0 16px 32px rgba(0,218,143,0.22),
    0 4px 8px rgba(0,0,0,0.08) !important;
  border-color: #00da8f !important;
  outline: none !important;
}

input.hasDatepicker::placeholder {
  color: #9ca3af !important;
  font-weight: 400 !important;
}

#ui-datepicker-div .ui-datepicker-title {
    flex-direction: inherit !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Neue Haas Grotesk DS Pro';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Bold.woff2') format('woff2'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Bold.woff') format('woff'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Neue Haas Grotesk DS Pro';
	font-style: normal;
	font-weight: 100;
	font-display: auto;
	src: url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Light.woff2') format('woff2'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Light.woff') format('woff'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplayLight.ttf') format('truetype');
}
@font-face {
	font-family: 'Neue Haas Grotesk DS Pro';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Mediu.woff2') format('woff2'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplay-Mediu.woff') format('woff'),
		url('https://limegreen-viper-352076.hostingersite.com/wp-content/uploads/2025/04/NeueHaasDisplayMediu.ttf') format('truetype');
}
/* End Custom Fonts CSS */