/* ==========================================================================
   Apartamentos - Estilo Booklium
   Paleta: Teal #13b0bb, Texto #3b4249, Titulos #17181a, Borde #ededed
   Fuente: Montserrat
   ========================================================================== */

/* ---------- Variables ---------- */
:root {
    --primary: #13b0bb;
    --primary-hover: #0f9aa4;
    --headings: #17181a;
    --text: #3b4249;
    --text-light: #767b80;
    --bg: #fafafa;
    --bg-white: #ffffff;
    --border: #ededed;
    --yellow: #ffce00;
    --navy: #252e59;
    --danger: #cf2e2e;
    --shadow: 0 2px 5px 0 rgba(50, 54, 72, 0.08);
    --shadow-lg: 0px 0px 40px 0px rgba(0, 0, 0, 0.09);
    --radius: 3px;
    --transition: .3s ease;
    --font: 'Montserrat', sans-serif;
    --container-width: 1350px;
}

/* ---------- Base ---------- */
html {
    font-size: 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

body {
    font-family: var(--font);
    font-size: 1rem;
    line-height: 1.75;
    color: var(--text);
    background: var(--bg);
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---------- Tipografia ---------- */
h1, h2, h3, h4, h5, h6 {
    color: var(--headings);
    font-weight: 600;
    line-height: 1.48;
    letter-spacing: -0.03em;
    margin-top: 1.5em;
    margin-bottom: .5em;
}

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
    margin-top: 0;
}

h1 { font-size: 1.9375rem; }
h2 { font-size: 1.5625rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1rem; }
h5 { font-size: 0.8125rem; }
h6 { font-size: 0.6875rem; text-transform: uppercase; }

p {
    margin-top: 0;
    margin-bottom: 1.5em;
    color: var(--text);
}

p:last-child { margin-bottom: 0; }

a {
    color: var(--primary);
    text-decoration: none;
    transition: var(--transition);
}

a:hover, a:focus {
    text-decoration: underline;
}

b, strong { font-weight: 600; }

/* ---------- Enlaces ---------- */
.skip-link {
    position: absolute;
    top: -100px;
    left: 0;
    background: var(--primary);
    color: #fff;
    padding: 10px 20px;
    z-index: 10000;
    transition: top 0.3s;
}

.skip-link:focus { top: 0; }

/* ==========================================================================
   HEADER - Estilo Booklium
   ========================================================================== */
/* Anular max-width:1140px de Hello Elementor theme.css (.site-header:not(.dynamic-header)) */
.site-header:not(.dynamic-header) {
    max-width: none !important;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--bg-white);
    border-bottom: 1px solid var(--border);
}

/* Header a lo ancho, con el menu centrado en la pantalla.
   - width: 100% es imprescindible: Hello Elementor pone .site-header en display: flex,
     asi que .header-container es un ITEM flex sin ancho propio; sin el width se ajusta
     a su contenido y queda centrado (el max-width de abajo nunca llegaba a aplicarse).
   - grid 1fr auto 1fr: el logo a la izquierda, el menu en la columna del medio y la
     tercera vacia (hoy .header-cta esta en display: none). Como las dos columnas de
     los costados miden lo mismo, el menu queda clavado en el centro de la pantalla.
   - Perilla de distancia al borde: el padding (1.5625rem = 25px). */
.site-header .header-container,
.site-header .header-inner {
    width: 100%;
    max-width: none !important;
    margin: 0 auto;
    padding: 1rem 1.5625rem;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1.25rem;
}

.header-logo, .site-branding {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.header-logo img,
.header-logo .custom-logo-link img,
.site-branding img {
    max-height: 50px;
    width: auto;
}

.header-logo a,
.site-title a {
    font-family: var(--font);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--headings);
    text-decoration: none;
    white-space: nowrap;
}

/* Navegacion */
.header-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
}

.header-menu,
.menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

.header-menu li,
.menu li {
    margin: 0;
    padding: 0;
    position: relative;
}

.header-menu a,
.menu > li > a {
    display: block;
    padding: .75rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--headings);
    text-decoration: none;
    transition: var(--transition);
}

.header-menu a:hover,
.header-menu .current-menu-item > a,
.menu > li > a:hover,
.menu .current-menu-item > a {
    color: var(--primary);
}

/* Submenu */
.menu .sub-menu {
    display: none;
    position: absolute;
    top: 120%;
    left: 0;
    background: var(--bg-white);
    box-shadow: var(--shadow-lg);
    border-radius: var(--radius);
    padding: 1.25rem 0;
    z-index: 10;
    list-style: none;
    min-width: 235px;
    opacity: 0;
    visibility: hidden;
    transition: var(--transition);
}

.menu li:hover > .sub-menu {
    display: block;
    top: 100%;
    opacity: 1;
    visibility: visible;
}

.sub-menu a {
    padding: .5rem 2.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Flecha submenu */
.menu-item-has-children > a:after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: .5rem;
    transition: var(--transition);
}

/* Boton CTA - oculto, el enlace esta en el menu */
.header-cta {
    display: none;
}

.btn-green, .btn-teal {
    display: inline-block;
    background: var(--primary);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 11px 24px;
    border-radius: var(--radius);
    border: 2px solid transparent;
    text-decoration: none;
    letter-spacing: 0.075em;
    transition: var(--transition);
    cursor: pointer;
    text-align: center;
}

.btn-green:hover, .btn-teal:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--headings);
    text-decoration: none;
}

/* Mobile menu */
.mobile-menu-toggle {
    display: none !important;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    margin-left: auto;
}

.mobile-menu-toggle:hover {
    background: none;
    transform: none;
}

.mobile-menu-bar {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--headings);
    transition: var(--transition);
}

.mobile-menu-toggle.active .mobile-menu-bar:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.mobile-menu-toggle.active .mobile-menu-bar:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active .mobile-menu-bar:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* Mobile dropdown menu - hidden by default */
.header-menu-dropdown {
    display: none;
}

@media (max-width: 991px) {
    /* Solo se oculta el menu horizontal. NO ocultar .header-nav: el boton
       hamburguesa es hermano suyo dentro del contenedor, asi que si se ocultaba el
       nav se ocultaba tambien el boton (un hijo no puede mostrarse si el padre esta
       en display: none) y el sitio quedaba sin ninguna forma de navegar. */
    .header-nav .header-menu {
        display: none;
    }

    .mobile-menu-toggle {
        display: flex !important;
    }

    .header-menu-dropdown {
        position: absolute;
        top: calc(100% + 1px);
        left: 0;
        right: 0;
        background: var(--bg-white);
        border-bottom: 1px solid var(--border);
        padding: 0;
        display: none;
    }

    .header-menu-dropdown:not([aria-hidden="true"]) {
        display: block;
    }

    .header-menu-dropdown .menu {
        flex-direction: column;
        padding: 1.875rem 0;
        max-width: 380px;
        margin: 0 auto;
    }

    .header-menu-dropdown .menu a {
        padding: .75rem 1.25rem;
        font-size: 0.875rem;
        font-weight: 600;
    }

    .header-menu-dropdown .sub-menu {
        position: static;
        box-shadow: none;
        padding: 0 0 0 1.25rem;
        opacity: 1;
        visibility: visible;
        display: none;
    }

    .header-menu-dropdown .sub-menu.toggled-on {
        display: block;
    }

    .header-cta {
        display: none;
    }
}

/* ==========================================================================
   HERO - Estilo Booklium
   ========================================================================== */
.hero-section {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.hero-section .elementor-background-overlay,
.wp-block-getwid-section__foreground {
    background-color: var(--navy) !important;
    opacity: 0.5;
    mix-blend-mode: multiply;
}

.hero-section h1,
.hero-section .elementor-heading-title {
    font-family: var(--font);
    font-weight: 400;
    font-size: 1rem;
    color: #fff;
    margin-bottom: .25em;
}

.hero-section h2,
.hero-section .wp-block-getwid-advanced-heading h2 {
    font-family: var(--font);
    font-size: 2.4375rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.03em;
}

.hero-section p {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.9);
}

/* ==========================================================================
   BOTONES
   ========================================================================== */
button:not(.mobile-menu-toggle),
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.more-link {
    display: inline-block;
    background: var(--primary);
    color: #fff;
    font-size: 0.875rem;
    line-height: 1.143;
    font-weight: 600;
    letter-spacing: 0.075em;
    padding: 15px 30px;
    border: 2px solid transparent;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
    text-align: center;
    text-decoration: none;
}

button:not(.mobile-menu-toggle):hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.button:hover,
.more-link:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--headings);
    text-decoration: none;
}

.button-outlined {
    background: transparent !important;
    border-color: var(--primary) !important;
    color: var(--headings) !important;
}

.button-outlined:hover {
    background: var(--primary) !important;
    color: #fff !important;
}

/* ==========================================================================
   FORMULARIOS
   ========================================================================== */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="date"],
textarea,
select {
    width: 100%;
    padding: .75rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-family: var(--font);
    font-size: 0.875rem;
    color: var(--text);
    background: var(--bg-white);
    transition: var(--transition);
    display: block;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--primary);
    outline: none;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 50px;
    background: var(--bg-white) url("../img/angle-down-solid.svg") no-repeat top 1rem right 1.25rem;
    padding-right: 2.5rem;
}

label {
    font-size: 0.875rem;
    color: var(--headings);
    font-weight: 500;
    margin-bottom: .25rem;
    display: inline-block;
}

/* ==========================================================================
   BUSCADOR y CALENDARIO -> Ver booklium-hotel-booking.css
   ========================================================================== */

/* ==========================================================================
   TARJETAS DE PROPIEDADES
   ========================================================================== */

/* ---- GRID layout (homepage) ---- */
.home .rooms-wrapper,
.home .loop-rooms-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
    align-items: flex-start;
}

.home .mphb-room-type {
    flex: 1 0 100%;
    max-width: 100%;
    padding: 0 10px;
    background: transparent;
    box-shadow: none;
    border: none;
}

@media (min-width: 768px) {
    .home .mphb-room-type { flex: 1 0 50%; max-width: 50%; margin-top: 2rem; }
    .home .mphb-room-type:nth-child(1),
    .home .mphb-room-type:nth-child(2) { margin-top: 0; }
}
@media (min-width: 992px) {
    .home .mphb-room-type { flex: 1 0 25%; max-width: 25%; }
    .home .mphb-room-type:nth-child(1),
    .home .mphb-room-type:nth-child(2),
    .home .mphb-room-type:nth-child(3) { margin-top: 0; }
}
.home .mphb-room-type:nth-child(1) { margin-top: 0; }

.home .mphb_sc_rooms-wrapper .mphb-room-type:not(:first-of-type) {
    margin-top: 0 !important;
}

/* Home image: vertical card style */
.home .loop-room-images-wrapper {
    position: relative;
    margin-bottom: 1rem;
}

.home .loop-room-images-wrapper .post-thumbnail a {
    display: block;
    position: relative;
    border-radius: 3px;
    overflow: hidden;
}

.home .loop-room-images-wrapper .post-thumbnail a:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 50%;
    background: linear-gradient(to bottom, #34353e, transparent);
    z-index: 1;
    opacity: .3;
}

.home .loop-room-images-wrapper img {
    display: block;
    width: 100%;
    height: 220px;
    border-radius: 3px;
    object-fit: cover;
}

.home .loop-room-info-wrapper {
    padding: 0.5rem 0;
}

.home .loop-room-book-wrapper {
    padding-top: 0.5rem;
    border-top: 1px solid var(--border);
    border-left: 0;
    margin-top: 0.5rem;
}


/* ---- LIST layout (listing page / non-home) ---- */

/* Vertical stack, no grid */
body:not(.home) .rooms-wrapper,
body:not(.home) .loop-rooms-wrapper {
    display: block;
    margin: 0;
}

/* Space before footer */
body:not(.home) .site-main,
body:not(.home) #main {
    padding-bottom: 3rem;
}

body:not(.home) .mphb-room-type {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    margin-top: 1.5rem;
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    padding: 0;
    box-shadow: 0 2px 5px 0 rgba(50, 54, 72, 0.08);
}

body:not(.home) .mphb-room-type:first-child { margin-top: 0; }

/* Anular margen del plugin MotoPress */
body:not(.home) .mphb_sc_rooms-wrapper .mphb-room-type:not(:first-of-type),
body:not(.home) .mphb_sc_services-wrapper .mphb-service:not(:first-of-type) {
    margin-top: 1.5rem !important;
}

/* Imagen: ancho fijo, cuadrada */
body:not(.home) .loop-room-images-wrapper {
    flex: 0 0 307px;
    min-width: 307px;
    width: 307px;
    height: 307px;
    position: relative;
    overflow: hidden;
    align-self: flex-start;
    margin-bottom: 0;
}

body:not(.home) .loop-room-images-wrapper .post-thumbnail a {
    display: block;
    position: relative;
    border-radius: 0;
    overflow: hidden;
}

body:not(.home) .loop-room-images-wrapper .post-thumbnail a:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 50%;
    background: linear-gradient(to bottom, #34353e, transparent);
    z-index: 1;
    opacity: .3;
}

body:not(.home) .loop-room-images-wrapper img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0;
    object-fit: cover;
}

/* Flexslider in listing images */
body:not(.home) .loop-room-images-wrapper .flexslider {
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: 100% !important;
    min-height: 307px !important;
}

body:not(.home) .loop-room-images-wrapper .flex-viewport {
    height: 100% !important;
    min-height: 307px !important;
}

body:not(.home) .loop-room-images-wrapper .slides,
body:not(.home) .loop-room-images-wrapper .slides > li {
    height: 100% !important;
    min-height: 307px !important;
}

body:not(.home) .loop-room-images-wrapper .slides img {
    width: 100% !important;
    height: 100% !important;
    min-height: 307px !important;
    object-fit: cover !important;
}

/* Info wrapper - horizontal card */
body:not(.home) .loop-room-info-wrapper {
    flex: 1 1 auto;
    padding: 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.875rem;
}

/* Book wrapper - price section - right side */
body:not(.home) .loop-room-book-wrapper {
    padding: 1.5rem 2rem;
    border-top: 0;
    border-left: 1px solid var(--border);
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* 220px para que "Hacer reserva" y "Ver detalles" entren en una sola linea.
       Con 180px quedaban 116px de contenido (180 - 2x2rem de padding) y el texto
       se partia en dos lineas. En <=991px el card se apila y esto no aplica. */
    min-width: 220px;
}

/* Book wrapper buttons */
body:not(.home) .loop-room-book-wrapper .mphb-view-details-button-wrapper {
    margin-bottom: 0.5rem;
    width: 100%;
}

body:not(.home) .loop-room-book-wrapper .mphb-view-details-button-wrapper .button {
    width: 100%;
    display: block;
    text-align: center;
    white-space: nowrap;
    padding: 10px 20px;
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: 4px;
    transition: var(--transition);
    text-decoration: none;
    background: #f3f3f3;
    color: var(--headings);
    border: 1px solid var(--border);
}

body:not(.home) .loop-room-book-wrapper .mphb-view-details-button-wrapper .button:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}

body:not(.home) .loop-room-book-wrapper .mphb-to-book-btn-wrapper {
    margin-bottom: 0;
    width: 100%;
}

body:not(.home) .loop-room-book-wrapper .mphb-to-book-btn-wrapper .button,
body:not(.home) .loop-room-book-wrapper .mphb-to-book-btn-wrapper input[type="submit"] {
    width: 100%;
    display: block;
    text-align: center;
    white-space: nowrap;
    padding: 10px 20px;
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: 4px;
    transition: var(--transition);
    text-decoration: none;
    background: var(--primary);
    color: #fff;
    border: 2px solid transparent;
}

body:not(.home) .loop-room-book-wrapper .mphb-to-book-btn-wrapper .button:hover,
body:not(.home) .loop-room-book-wrapper .mphb-to-book-btn-wrapper input[type="submit"]:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}

/* Category badge on image — listing */
body:not(.home) .loop-room-categories {
    display: block !important;
    position: absolute;
    z-index: 2;
    bottom: 10px;
    left: 10px;
    max-width: calc(100% - 20px);
}

body:not(.home) .loop-room-categories a {
    display: inline-block;
    border-radius: 3px;
    background: #17181a;
    color: #ebebec;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.075em;
    padding: 2px 8px;
    margin-right: 5px;
    text-decoration: none;
    transition: var(--transition);
}

body:not(.home) .loop-room-categories a:hover {
    background: var(--primary);
    color: #fff;
}

/* Attributes: 2-column grid with icons — listing */
body:not(.home) .mphb-loop-room-type-attributes {
    list-style: none !important;
    margin: 0.5rem 0 0 !important;
    padding: 0 !important;
    font-size: 0.8125rem;
    color: var(--text);
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 1.5rem !important;
}

body:not(.home) .mphb-loop-room-type-attributes li {
    display: flex !important;
    align-items: flex-start !important;
    padding: 0.375rem 0 !important;
    border-bottom: none !important;
}

body:not(.home) .mphb-loop-room-type-attributes .mphb-attribute-title {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 100px !important;
    font-weight: 400 !important;
    color: var(--primary) !important;
    flex-shrink: 0 !important;
}

body:not(.home) .mphb-loop-room-type-attributes .mphb-attribute-title::before {
    display: inline-flex !important;
    width: 1.4em !important;
    justify-content: center !important;
    margin-right: 6px !important;
    color: var(--primary) !important;
    font-size: 0.75rem !important;
}

/* Icons for listing attributes */
body:not(.home) .mphb-adults-title::before { content: '\f0c0'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-children-title::before { content: '\f1b2'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-size-title::before { content: '\f31e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-view-title::before { content: '\f06e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-bed-type-title::before { content: '\f236'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-categories-title::before { content: '\f02b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-bedrooms-title::before { content: '\f1ad'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-bathrooms-title::before { content: '\f7cd'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-locations-title::before { content: '\f3c5'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-facilities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body:not(.home) .mphb-amenities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }

body:not(.home) .mphb-loop-room-type-attributes .mphb-attribute-value {
    color: var(--headings);
    font-weight: 500;
}

body:not(.home) .mphb-loop-room-type-attributes .mphb-attribute-value a {
    color: var(--primary);
    text-decoration: none;
}

body:not(.home) .mphb-loop-room-type-attributes .mphb-attribute-value a:hover {
    text-decoration: underline;
}

/* Title size in listing */
body:not(.home) .mphb-room-type-title {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}

/* Excerpt in listing */
body:not(.home) .loop-room-info-wrapper > .loop-room-excerpt {
    color: var(--text-light);
    line-height: 1.6;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
}

/* Details title */
body:not(.home) .mphb-room-type-details-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--headings);
    margin: 0.75rem 0 0.25rem;
}

/* Titulo */
.mphb-room-type-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    margin-top: 0;
}

.mphb-room-type-title a {
    color: var(--headings);
    text-decoration: none;
    transition: var(--transition);
}

.mphb-room-type-title a:hover {
    color: var(--primary);
    text-decoration: none;
}

/* Precio - Booklium style */
.loop-room-book-wrapper .mphb-regular-price {
    margin: 0;
    font-size: 0.875rem;
    color: var(--text-light);
}

.loop-room-book-wrapper .mphb-regular-price strong {
    font-weight: 600;
    color: var(--headings);
    margin-right: 0.25rem;
}

.loop-room-book-wrapper .mphb-price {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--headings);
}

.loop-room-book-wrapper .mphb-price-period {
    font-size: 0.8125rem;
    color: var(--text-light);
    font-weight: 400;
}

/* Short attributes: una linea con bullets (rating, guests, size) */
.loop-room-short-attributes {
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    margin: 3px 0 2px;
    padding: 0;
    font-size: 12px;
    font-size: 0.75rem;
    color: #767b80;
}

.loop-room-short-attributes li {
    position: relative;
    margin: 0 1.25em 0 0;
    font-weight: 400;
}

.loop-room-short-attributes li:last-child { margin: 0; }

.loop-room-short-attributes li:after {
    content: '\2022';
    position: absolute;
    right: -.8em;
    color: #767b80;
}

.loop-room-short-attributes li:last-child:after { display: none; }

.loop-room-short-attributes .mphb-attribute-title {
    display: inline;
    color: #767b80;
}

.loop-room-short-attributes .mphb-room-type-rating {
    color: #17181a;
    font-weight: 500;
    margin-right: 7px;
}

.loop-room-short-attributes .mphb-room-type-rating:before {
    display: inline-block;
    width: 1.4em;
    font-size: 10px;
    content: '\2605';
}

.loop-room-short-attributes .mphb-room-type-rating:after {
    display: none;
}

/* Ocultar atributos largos solo en homepage grid cards */
.home .mphb_sc_rooms-wrapper .mphb-loop-room-type-attributes,
.home .mphb_sc_rooms-wrapper .mphb-room-type-details-title,
.home .mphb_sc_rooms-wrapper .mphb-room-type-view,
.home .mphb_sc_rooms-wrapper .mphb-room-type-facilities,
.home .mphb_sc_rooms-wrapper .mphb-room-type-bedrooms,
.home .mphb_sc_rooms-wrapper .mphb-room-type-bathrooms,
.home .mphb_sc_rooms-wrapper .mphb-room-type-locations,
.home .mphb_sc_rooms-wrapper .mphb-room-type-bed-type {
    display: none !important;
}

/* Botones - ocultar solo en homepage grid */
.home .mphb-room-type-buttons {
    display: none !important;
}

/* Ocultar controles del flexslider solo en homepage grid */
.home .mphb_sc_rooms-wrapper .loop-room-images-wrapper .flex-direction-nav,
.home .mphb_sc_rooms-wrapper .loop-room-images-wrapper .flex-control-nav {
    display: none !important;
}
.home .mphb_sc_rooms-wrapper .loop-room-images-wrapper .flexslider {
    display: none !important;
}

/* Mostrar flexslider en resultados de búsqueda y listado */
.mphb_sc_search_results-wrapper .loop-room-images-wrapper .flexslider {
    display: block !important;
}

/* Ocultar paginador en homepage */
.home .mphb-pagination {
    display: none !important;
}

/* Botón Ver más */
.ver-mas-wrapper {
    text-align: center;
    margin: 3rem 0;
}

.ver-mas-btn {
    display: inline-block;
    padding: 12px 40px;
    background: var(--primary);
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.ver-mas-btn:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}

/* Mostrar flexslider en página de detalle */
.single-room-type-wrapper .single-room-gallery .flexslider {
    display: block !important;
}

/* Hero section min-height */
.elementor-element-d9680ad {
    min-height: 650px;
    display: flex;
    align-items: center;
}

/* ==========================================================================
   PAGINA INDIVIDUAL DE PROPIEDAD - Booklium Style
   ========================================================================== */

/* Anular max-width:1140px de Hello Elementor theme.css para páginas no-Elementor */
body:not([class*=elementor-page-]) .site-main {
    max-width: var(--container-width) !important;
}

.single-room-type-wrapper {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 20px;
}

/* Header */
.single-room-type-wrapper .entry-header {
    text-align: center;
    padding: 30px 0 20px;
}

.single-room-type-wrapper .entry-title {
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--headings);
}

.single-room-type-wrapper .room-description {
    max-width: 700px;
    margin: 0 auto;
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Galería */
.single-room-type-wrapper .single-room-gallery {
    margin: 0 auto 40px;
    width: 100%;
    max-width: 1350px;
    position: relative;
    overflow: visible;
    padding: 0;
    box-sizing: border-box;
}

/* Resetear wrappers del shortcode [mphb_room] que heredan flex:25% del listado */
.single-room-type-wrapper .single-room-gallery .mphb_sc_room-wrapper,
.single-room-type-wrapper .single-room-gallery .mphb-room-type,
.single-room-type-wrapper .single-room-gallery .loop-room-wrapper,
.single-room-type-wrapper .single-room-gallery .loop-room-images-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.single-room-type-wrapper .single-room-gallery .mphb-room-type-images {
    max-width: 100%;
    margin: 0;
    width: 100%;
    overflow: visible !important;
}

.single-room-type-wrapper .single-room-gallery .mphb-flexslider-gallery-wrapper,
.single-room-type-wrapper .single-room-gallery .flexslider {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    overflow: visible !important;
    border: none;
    box-shadow: none;
    background: transparent;
    position: static !important;
}

.single-room-type-wrapper .single-room-gallery .flex-viewport {
    overflow: hidden;
    width: 100%;
    max-height: none !important;
}

/* Imágenes: altura completa para que no se corten */
.single-room-type-wrapper .single-room-gallery .slides li {
    overflow: hidden;
}

.single-room-type-wrapper .single-room-gallery .slides img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    display: block !important;
}

/* Flexslider arrows — global teal style for all galleries */
.flex-direction-nav {
    display: block !important;
}

.flex-direction-nav a {
    opacity: 1 !important;
    width: 40px !important;
    height: 40px !important;
    background-color: #13b0bb !important;
    color: #fff !important;
    -webkit-transition: all .3s ease !important;
    -o-transition: all .3s ease !important;
    transition: all .3s ease !important;
    border-radius: 3px !important;
    border: 2px solid transparent !important;
    padding: 0 !important;
    line-height: 36px !important;
    font-size: 1rem !important;
    text-align: center !important;
}

/* Center arrows vertically in listing gallery (307x307 container) */
.mphb_sc_rooms-wrapper .loop-room-images-wrapper .flex-direction-nav a,
.mphb_sc_search_results-wrapper .loop-room-images-wrapper .flex-direction-nav a {
    top: 50% !important;
    -webkit-transform: translateY(-50%) !important;
    -ms-transform: translateY(-50%) !important;
    transform: translateY(-50%) !important;
2}

/* Center arrows in single room gallery */
.single-room-type-wrapper .single-room-gallery .flex-direction-nav a {
    top: 70% !important;
}

.flex-direction-nav a:hover {
    background-color: #0e8f99 !important;
}

.flex-direction-nav a::before {
    color: #fff !important;
    font-size: 0.9rem !important;
    font-weight: 300 !important;
}

/* Puntos de navegación */
.single-room-type-wrapper .single-room-gallery .flex-control-nav {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 10px;
    position: relative;
}

.single-room-type-wrapper .single-room-gallery .flex-control-nav li {
    display: inline-block;
    margin: 0 5px;
}

.single-room-type-wrapper .single-room-gallery .flex-control-nav a {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ccc;
    border: none;
    text-indent: -9999px;
    display: block;
}

.single-room-type-wrapper .single-room-gallery .flex-control-nav a.flex-active {
    background: var(--primary);
}

/* Contenido: 2 columnas como Booklium */
.single-room-type-wrapper .single-room-content {
    display: flex;
    gap: 3.75rem;
    margin-top: 10rem;
    margin-bottom: 3.75rem;
    position: relative;
}

.single-room-type-wrapper .single-room-main {
    flex: 1;
    padding-right: 2rem;
}

.single-room-type-wrapper .single-room-sidebar {
    width: 35%;
    flex-shrink: 0;
}

/* Descripción - card */
.single-room-type-wrapper .room-content-text {
    margin-bottom: 25px;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #444;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 25px;
}

.single-room-type-wrapper .room-content-text p {
    margin-bottom: 15px;
}

/* Card de detalles - Booklium style */
.single-room-type-wrapper .single-room-attributes-wrapper {
    background: #fff !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    padding: 30px !important;
    display: flex !important;
    gap: 40px !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper > h2.mphb-details-title {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    color: var(--headings) !important;
    margin: 0 !important;
    min-width: 80px !important;
    flex-shrink: 0 !important;
    align-self: flex-start !important;
    padding-top: 12px !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper > ul.mphb-single-room-type-attributes {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 1 !important;
    width: 100% !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper .mphb-single-room-type-attributes li {
    display: flex !important;
    align-items: flex-start !important;
    padding: 12px 0 !important;
    border-bottom: none !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper .mphb-single-room-type-attributes li:last-child {
    padding-bottom: 0 !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper .mphb-single-room-type-attributes .mphb-attribute-title {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 140px !important;
    font-weight: 400 !important;
    color: var(--primary) !important;
    flex-shrink: 0 !important;
}

.single-room-type-wrapper .single-room-attributes-wrapper .mphb-single-room-type-attributes .mphb-attribute-title::before {
    display: inline-flex !important;
    width: 1.4em !important;
    justify-content: center !important;
    margin-right: 10px !important;
    color: var(--primary) !important;
    font-size: 0.9rem !important;
}

.single-room-type-wrapper .mphb-adults-title::before { content: '\f0c0'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-children-title::before { content: '\f1b2'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-size-title::before { content: '\f31e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-view-title::before { content: '\f06e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-bed-type-title::before { content: '\f236'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-categories-title::before { content: '\f02b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-bedrooms-title::before { content: '\f1ad'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-bathrooms-title::before { content: '\f7cd'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-locations-title::before { content: '\f3c5'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-facilities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.single-room-type-wrapper .mphb-amenities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }

.single-room-type-wrapper .mphb-single-room-type-attributes .mphb-attribute-value {
    color: var(--headings);
    font-weight: 500;
}

.single-room-type-wrapper .mphb-single-room-type-attributes .mphb-attribute-value a {
    color: var(--primary);
    text-decoration: none;
}

.single-room-type-wrapper .mphb-single-room-type-attributes .mphb-attribute-value a:hover {
    text-decoration: underline;
}

/* Sidebar: sticky */
.single-room-type-wrapper .single-room-sidebar {
    position: sticky;
    top: 90px;
    align-self: flex-start;
}

/* Card unificada sidebar */
.single-room-type-wrapper .room-sidebar-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    padding: 25px;
}

/* Card de precio */
.single-room-type-wrapper .room-price-box {
    margin-bottom: 0;
}

.single-room-type-wrapper .room-price-box .mphb-regular-price {
    margin: 0;
}

.single-room-type-wrapper .room-price-box .mphb-regular-price strong {
    display: none;
}

.single-room-type-wrapper .room-price-box .mphb-price {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--headings);
}

.single-room-type-wrapper .room-price-box .mphb-price-period {
    font-size: 0.9rem;
    color: #666;
    font-weight: 400;
}

/* Divider */
.single-room-type-wrapper .room-sidebar-divider {
    border: none;
    border-top: 1px solid #e8e8e8;
    margin: 18px 0;
}

/* Note */
.single-room-type-wrapper .room-booking-note {
    font-size: 0.8rem;
    color: #888;
    margin-bottom: 15px;
}

.single-room-type-wrapper .room-booking-note abbr {
    text-decoration: none;
    color: #888;
}

/* Card de reserva */
.single-room-type-wrapper .room-booking-box {
    margin: 0;
}

.single-room-type-wrapper .room-booking-box label {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--headings);
    margin-bottom: 4px;
}

.single-room-type-wrapper .room-booking-box input[type="text"] {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid #f0ad4e;
    border-radius: 4px;
    font-size: 0.9rem;
    margin-bottom: 12px;
    outline: none;
}

.single-room-type-wrapper .room-booking-box input[type="text"]:focus {
    border-color: #ec971f;
}

.single-room-type-wrapper .room-booking-box .mphb-reserve-btn {
    width: 100%;
    padding: 14px;
    background: #1abc9c;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    margin-top: 5px;
    text-transform: none;
}

.single-room-type-wrapper .room-booking-box .mphb-reserve-btn:hover {
    background: #16a085;
}

/* Calendario: card blanca - Booklium style */
.single-room-type-wrapper .room-calendar-section {
    background: #fff !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    padding: 30px !important;
    margin-bottom: 40px !important;
    display: flex !important;
    gap: 40px !important;
}

.single-room-type-wrapper .room-calendar-section h2 {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    margin: 0 !important;
    color: var(--headings) !important;
    min-width: 110px !important;
    flex-shrink: 0 !important;
    align-self: flex-start !important;
}

.single-room-type-wrapper .room-calendar-section .mphb_sc_availability_calendar-wrapper {
    flex: 1 !important;
    width: 100% !important;
}

/* Responsive */
@media (max-width: 768px) {
    .single-room-type-wrapper .single-room-content {
        flex-direction: column;
    }

    .single-room-type-wrapper .single-room-sidebar {
        width: 100%;
        position: static;
    }

    .single-room-type-wrapper .single-room-attributes-wrapper {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .single-room-type-wrapper .room-calendar-section {
        flex-direction: column !important;
        gap: 10px !important;
    }
}

/* Precio en single (globales) */
.mphb-regular-price .mphb-price-period {
    font-size: 1rem;
    border-bottom: 0;
    font-weight: 500;
}

/* Rating */
.mphb-room-type-rating {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ==========================================================================
   MotoPress Checkout
   ========================================================================== */
.mphb_sc_checkout-wrapper {
    max-width: var(--container-width);
    margin: 0 auto;
}

.mphb_sc_checkout-wrapper .mphb-checkout-section {
    background: var(--bg-white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 2.5rem;
    margin-bottom: 2rem;
}

.mphb_sc_checkout-wrapper .mphb-checkout-section > h2 {
    font-size: 1.25rem;
    margin-bottom: 1.25rem;
}

/* ==========================================================================
   Search Results - Estilo Booklium
   ========================================================================== */
.mphb_sc_search_results-wrapper {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 2rem 1.5rem;
}

/* Título de la página */
.page-header {
    text-align: center;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 2rem;
}

.page-header .entry-title {
    font-size: 2rem;
    font-weight: 600;
    color: var(--headings);
    margin: 0;
}

/* Info de resultados */
.mphb_sc_search_results-info {
    font-size: 0.95rem;
    color: var(--text-light);
    margin-bottom: 2rem;
}

/* Título de recomendación */
.mphb-recommendation-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--headings);
    margin-bottom: 1.5rem;
    margin-top: 2rem;
}

/* Card de recomendación */
.mphb-recommendation {
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 2rem;
    margin-bottom: 3rem;
    box-shadow: 0 2px 5px 0 rgba(50, 54, 72, 0.08);
}

.mphb-recommendation-details-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
}

.mphb-recommendation-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--border);
}

.mphb-recommendation-item:last-child {
    border-bottom: none;
}

.mphb-recommedation-item-subtotal {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--headings);
    min-width: 100px;
}

.mphb-recommendation-item-count {
    font-size: 0.95rem;
    color: var(--text);
}

.mphb-recommendation-item-link {
    font-size: 0.95rem;
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
}

.mphb-recommendation-item-link:hover {
    text-decoration: underline;
}

.mphb-recommendation-item-guests {
    display: block;
    font-size: 0.875rem;
    color: var(--text-light);
    margin-top: 0.25rem;
}

.mphb-recommendation-item-guests-label {
    font-weight: 500;
}

/* Total y botón */
.mphb-recommendation-total {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1.5rem 0;
    padding-top: 1.5rem;
    border-top: 1px solid var(--border);
}

.mphb-recommendation-total-title {
    font-size: 1rem;
    color: var(--text);
}

.mphb-recommendation-total-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--headings);
}

.mphb-recommendation-reserve-button {
    display: inline-block;
    background: var(--primary);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 12px 32px;
    border: 2px solid transparent;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
    text-transform: none;
    letter-spacing: 0.075em;
}

.mphb-recommendation-reserve-button:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--headings);
}

/* Carrito de reserva.
   Con alojamientos reservados se pinta como una tarjeta mas del listado (mismos
   valores que body:not(.home) .mphb-room-type), asi no queda como un bloque
   suelto arriba de los resultados. Vacio se deja como estaba: solo el aviso. */
.mphb-reservation-cart {
    margin-bottom: 3rem;
}

.mphb-reservation-cart:not(.mphb-empty-cart) {
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 2px 5px 0 rgba(50, 54, 72, 0.08);
    padding: 1.5rem 2rem;
    margin-bottom: 1.5rem;
}

.mphb-empty-cart-message {
    font-size: 0.95rem;
    color: var(--text-light);
    margin-bottom: 1rem;
}

/* Lista de alojamientos reservados que agrega sisbokapa.js dentro del carrito */
.apartamentos-cart-rooms {
    list-style: disc;
    margin: 0 0 1rem 1.25rem;
    padding: 0;
}

.apartamentos-cart-room {
    font-size: 0.95rem;
    color: var(--text);
}

.apartamentos-cart-room-qty {
    color: var(--text-light);
}

.mphb-cart-total-price {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.mphb-cart-total-price-title {
    font-size: 1rem;
    color: var(--text);
}

.mphb-cart-total-price-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--headings);
}

.mphb-confirm-reservation {
    display: inline-block;
    background: var(--primary);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 12px 32px;
    border: 2px solid transparent;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
    text-transform: none;
    letter-spacing: 0.075em;
}

.mphb-confirm-reservation:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--headings);
}

/* ==========================================================================
   Checkout — quitar un alojamiento / cancelar la reserva
   Los links los imprime el plugin bluumi-hotel-booking-extensions
   (includes/checkout-remove-room.php). Mismo cuerpo que el boton de reserva,
   en rojo para que se lean como una salida y no como otra confirmacion.
   ========================================================================== */

.bluumi-remove-room-link-wrapper,
.bluumi-cancel-reservation-link-wrapper {
    margin: 1.5rem 0;
    text-align: center;
}

.bluumi-remove-room-link,
.bluumi-cancel-reservation-link {
    display: inline-block;
    background: var(--danger);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 12px 32px;
    border: 2px solid transparent;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
    text-transform: none;
    letter-spacing: 0.075em;
    text-decoration: none;
}

.bluumi-remove-room-link:hover,
.bluumi-cancel-reservation-link:hover {
    background: transparent;
    border-color: var(--danger);
    color: var(--danger);
    text-decoration: none;
}

/* ==========================================================================
   Search Results — Booklium horizontal card style
   Uses the plugin's native classes (loop-room-wrapper, loop-room-*-wrapper)
   ========================================================================== */

/* Reset search results to vertical stack of horizontal cards */
.mphb_sc_search_results-wrapper .loop-rooms-wrapper {
    display: block;
    margin: 0;
}

/* Each room type = one horizontal card */
.mphb_sc_search_results-wrapper .type-mphb_room_type {
    margin-top: 1.5rem;
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    padding: 2rem;
    box-shadow: 0 2px 5px 0 rgba(50, 54, 72, 0.08);
}

.mphb_sc_search_results-wrapper .type-mphb_room_type:first-child {
    margin-top: 0;
}

/* Horizontal card layout at desktop */
.mphb_sc_search_results-wrapper .loop-room-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    background: transparent;
    box-shadow: none;
    border: 0;
    padding: 0;
    border-radius: 0;
}

/* Image column: fixed width, always square */
.mphb_sc_search_results-wrapper .loop-room-images-wrapper {
    flex: 0 0 307px;
    min-width: 307px;
    width: 307px;
    height: 307px;
    position: relative;
    overflow: hidden;
    align-self: flex-start;
}

.mphb_sc_search_results-wrapper .loop-room-images-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
}

/* Info column: flexible */
.mphb_sc_search_results-wrapper .loop-room-info-wrapper {
    flex: 1 1 auto;
    padding: 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.875rem;
}

/* Bloque de detalles de la tarjeta de resultados, en dos columnas:
   izquierda Huespedes con Servicios debajo; derecha Tipo de cama y Vista.
   Tamaño y Categorias no se muestran, y tampoco el titulo "Detalles".

   OJO CON EL !important: esta hoja ya trae "display:grid !important" y
   "grid-template-columns: 1fr 1fr !important" sobre esta misma lista, mas abajo. Un
   !important le gana a cualquier regla sin !important aunque tenga mas
   especificidad, y por eso la primera version de esto no se veia. Aca se usa
   !important + mas especificidad (se mete .loop-room-info-wrapper en el selector),
   asi gana sin depender del orden del archivo. */
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-loop-room-type-attributes {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px 24px !important;
    align-items: start !important;
}
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-total-capacity {
    grid-area: 1 / 1 !important;
}
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-bed-type {
    grid-area: 1 / 2 !important;
}
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-facilities {
    grid-area: 2 / 1 / span 3 / auto !important;
}
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-view {
    grid-area: 2 / 2 !important;
}
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-size,
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-categories,
.mphb_sc_search_results-wrapper .loop-room-info-wrapper .mphb-room-type-details-title {
    display: none !important;
}

/* Misma disposicion en la tarjeta del listado de Propiedades, tambien en todos los
   anchos. Mismo motivo del !important; aca la especificidad es 0,4,1. */
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-loop-room-type-attributes {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px 24px !important;
    align-items: start !important;
}
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-total-capacity {
    grid-area: 1 / 1 !important;
}
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-bed-type {
    grid-area: 1 / 2 !important;
}
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-facilities {
    grid-area: 2 / 1 / span 3 / auto !important;
}
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-view {
    grid-area: 2 / 2 !important;
}
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-size,
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-categories,
body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper .mphb-room-type-details-title {
    display: none !important;
}

.mphb_sc_search_results-wrapper .mphb-room-type-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    margin-top: 0;
}

.mphb_sc_search_results-wrapper .mphb-room-type-title a {
    color: var(--headings);
    text-decoration: none;
}

.mphb_sc_search_results-wrapper .mphb-room-type-title a:hover {
    color: var(--primary);
}

/* Short attributes list (Booklium style) */
.mphb_sc_search_results-wrapper .loop-room-short-attributes {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0 0 1rem;
    padding: 0 0 1rem;
    list-style: none;
    border-bottom: 1px solid #ededed;
}

.mphb_sc_search_results-wrapper .loop-room-short-attributes li {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

.mphb_sc_search_results-wrapper .loop-room-short-attributes .mphb-attribute-title {
    font-weight: 400;
    color: var(--text-light);
}

.mphb_sc_search_results-wrapper .loop-room-short-attributes .mphb-attribute-value {
    font-weight: 600;
    color: var(--headings);
}

/* Excerpt */
.mphb_sc_search_results-wrapper .loop-room-info-wrapper > p {
    color: var(--text-light);
    line-height: 1.6;
    margin-bottom: 0.75rem;
}

/* Attributes: Booklium style 2-column grid like single room detail */
.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes {
    list-style: none !important;
    margin: 0.5rem 0 0 !important;
    padding: 0 !important;
    font-size: 0.8125rem;
    color: var(--text);
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 1.5rem !important;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes li {
    display: flex !important;
    align-items: flex-start !important;
    padding: 0.375rem 0 !important;
    border-bottom: none !important;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes li:last-child {
    padding-bottom: 0 !important;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes .mphb-attribute-title {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 100px !important;
    font-weight: 400 !important;
    color: var(--primary) !important;
    flex-shrink: 0 !important;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes .mphb-attribute-title::before {
    display: inline-flex !important;
    width: 1.4em !important;
    justify-content: center !important;
    margin-right: 6px !important;
    color: var(--primary) !important;
    font-size: 0.75rem !important;
}

/* Icons for search results attributes */
.mphb_sc_search_results-wrapper .mphb-adults-title::before { content: '\f0c0'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-children-title::before { content: '\f1b2'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-size-title::before { content: '\f31e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-view-title::before { content: '\f06e'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-bed-type-title::before { content: '\f236'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-categories-title::before { content: '\f02b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-bedrooms-title::before { content: '\f1ad'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-bathrooms-title::before { content: '\f7cd'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-locations-title::before { content: '\f3c5'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-facilities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.mphb_sc_search_results-wrapper .mphb-amenities-title::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; }

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes .mphb-attribute-value {
    color: var(--headings);
    font-weight: 500;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes .mphb-attribute-value a {
    color: var(--primary);
    text-decoration: none;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes .mphb-attribute-value a:hover {
    text-decoration: underline;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes dt,
.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes dd {
    margin: 0;
}

.mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes dt {
    font-weight: 600;
    color: var(--headings);
}

/* Book column: fixed width, right side */
.mphb_sc_search_results-wrapper .loop-room-book-wrapper {
    flex: 0 0 220px;
    min-width: 220px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-top: 0;
    margin-top: 0;
    background: var(--bg-white);
}

/* Price */
.mphb_sc_search_results-wrapper .mphb-regular-price {
    font-size: 0.875rem;
    color: var(--text-light);
    margin-bottom: 1rem;
}

.mphb_sc_search_results-wrapper .mphb-regular-price strong {
    font-weight: normal;
    display: block;
}

.mphb_sc_search_results-wrapper .mphb-price {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--headings);
}

.mphb_sc_search_results-wrapper .mphb-price-period {
    font-size: 0.8125rem;
    color: var(--text-light);
    font-weight: 400;
    border: 0;
}

.mphb_sc_search_results-wrapper .mphb-price-period::before {
    content: '/';
    margin-right: 0.25em;
}

/* Buttons */
.mphb_sc_search_results-wrapper .mphb-view-details-button-wrapper .button,
.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper .button {
    width: 100%;
    display: block;
    text-align: center;
    padding: 10px 20px;
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: 4px;
    transition: var(--transition);
    text-decoration: none;
}

.mphb_sc_search_results-wrapper .mphb-view-details-button-wrapper .button {
    background: #f3f3f3;
    color: var(--headings);
    border: 1px solid var(--border);
    margin-bottom: 0.5rem;
}

.mphb_sc_search_results-wrapper .mphb-view-details-button-wrapper .button:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}

.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper {
    margin-bottom: 0;
}

.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper .button,
.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper input[type="submit"] {
    background: var(--primary);
    color: #fff;
    border: 2px solid transparent;
}

.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper .button:hover,
.mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper input[type="submit"]:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary);
}

/* ==========================================================================
   Listado — acciones de reserva del alojamiento
   MotoPress imprime, en este orden: [Borrar + mensaje] [Hacer reserva]
   [Confirmar reserva]. Se reordena con flex para dejar Borrar debajo de
   Confirmar reserva, se separan los tres y se alinean al ancho de la tarjeta.
   ========================================================================== */

/* La tarjeta del listado y la de resultados comparten la columna de reserva:
   `body:not(.home) .loop-room-book-wrapper` (0,2,1) le gana a
   `.mphb_sc_search_results-wrapper .loop-room-book-wrapper` (0,2,0), asi que el
   padding que manda aca es 1.5rem 2rem y el contenido util es ~156px de los 220px
   de la columna. Si se cambia ese ancho, hay que revisar los tres botones de abajo. */
.mphb_sc_search_results-wrapper .mphb-reserve-room-section {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    width: 100%;
}

/* Orden visual: cantidad, reservar, confirmar, borrar */
.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-rooms-quantity-wrapper {
    order: 1;
}

.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-book-button {
    order: 2;
}

.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-confirm-reservation {
    order: 3;
}

.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-rooms-reservation-message-wrapper {
    order: 4;
    display: flex;
    justify-content: center;
    margin: 0;
}

/* Estado del bloque. MotoPress pone .mphb-rooms-added en la seccion al agregar al
   carrito y la saca al pulsar Borrar (mphb.js, MPHB.RoomBookSection), asi que el
   toggle es CSS puro: "Hacer reserva" solo se ve mientras el alojamiento NO esta en
   la reserva. En el estado agregado ya se muestran Confirmar reserva y Borrar. */
.mphb_sc_search_results-wrapper .mphb-reserve-room-section.mphb-rooms-added .mphb-book-button {
    display: none;
}

/* Cuerpo comun de los tres botones (dos son <button>, Borrar es un <a>).
   La columna es de 220px con padding 1.5rem 2rem — ver la nota de especificidad
   mas abajo — asi que quedan ~156px de contenido. Con el padding y el
   letter-spacing del resto de los botones de la tarjeta, "Confirmar reserva" no
   entra en una linea; con estos valores si, y ninguno se parte. */
.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-book-button,
.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-confirm-reservation,
.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-remove-from-reservation {
    width: 100%;
    display: block;
    text-align: center;
    padding: 10px 14px;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: normal;
    border: 2px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    transition: var(--transition);
    text-decoration: none;
}

/* Borrar en rojo: es una salida, no una accion de reserva */
.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-remove-from-reservation {
    /* MotoPress le pone float:right (mphb.css:463), pero el wrapper pasa a ser flex
       y los floats no aplican a flex items. Queda por si el flex se saca despues. */
    float: none;
    background: var(--danger);
    color: #fff;
}

.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-remove-from-reservation:hover {
    background: transparent;
    border-color: var(--danger);
    color: var(--danger);
}

/* ==========================================================================
   PARCHE TEMPORAL — "Hacer reserva" oculto en la pagina de resultados
   Este boton es la unica via para llenar el carrito (mphb.js, RoomBookSection),
   asi que ocultarlo desactiva la reserva de varios alojamientos: cada reserva
   se hace de a una desde la ficha. Ojo: el carrito de abajo queda siempre vacio.
   Va DESPUES del bloque compartido de arriba, que define display:block con la
   misma especificidad; si se mueve mas arriba, deja de aplicar.
   Revertir: borrar este bloque.
   ========================================================================== */

.mphb_sc_search_results-wrapper .mphb-reserve-room-section .mphb-book-button {
    display: none;
}

/* ==========================================================================
   Aviso "se ha añadido a tu reserva" — toast flotante que se va solo
   MotoPress escribe el texto en .mphb-rooms-reservation-message; la clase
   .bluumi-toast-visible la pone y la saca assets/js/sisbokapa.js.
   ========================================================================== */

.mphb_sc_search_results-wrapper .mphb-rooms-reservation-message {
    position: fixed;
    left: 50%;
    bottom: 2rem;
    z-index: 9999;
    margin: 0;
    padding: 14px 24px;
    max-width: min(90vw, 420px);
    background: var(--headings);
    color: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    font-size: 0.875rem;
    line-height: 1.4;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 1rem);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
    pointer-events: none;
}

.mphb_sc_search_results-wrapper .mphb-rooms-reservation-message.bluumi-toast-visible {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

/* Category badge on image */
.mphb_sc_search_results-wrapper .loop-room-categories {
    display: block !important;
    position: absolute;
    z-index: 2;
    bottom: 10px;
    left: 10px;
    max-width: calc(100% - 20px);
}

.mphb_sc_search_results-wrapper .loop-room-categories a {
    display: inline-block;
    border-radius: 3px;
    background: #17181a;
    color: #ebebec;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.075em;
    padding: 2px 8px;
    margin-right: 5px;
    text-decoration: none;
    transition: var(--transition);
}

.mphb_sc_search_results-wrapper .loop-room-categories a:hover {
    background: var(--primary);
    color: #fff;
}

/* Hide navigation dots in search results gallery */
.mphb_sc_search_results-wrapper .flex-control-nav,
body:not(.home) .mphb_sc_rooms-wrapper .flex-control-nav {
    display: none !important;
}

/* Responsive: stack vertically on mobile */
@media (max-width: 991px) {
    .mphb_sc_search_results-wrapper .loop-room-wrapper {
        flex-direction: column;
        /* En desktop align-items:center centra las columnas en vertical. Apiladas,
           ese mismo valor centra cada bloque en horizontal y los deja del ancho de
           su contenido, asi que la tarjeta queda despareja. Con stretch cada bloque
           ocupa el ancho de la tarjeta. */
        align-items: stretch;
    }

    .mphb_sc_search_results-wrapper .loop-room-images-wrapper {
        flex: 0 0 auto;
        /* El desktop fija width:307px y height:307px, y el bloque de mobile solo
           reseteaba el min-width. Sin estos tres valores la columna de imagen se
           queda en 307px y la tarjeta no se reduce: en un telefono se desborda.
           width:100% hace que la imagen ocupe el ancho de la tarjeta y min-width:0
           permite encogerse por debajo del tamano intrinseco de la foto. */
        width: 100%;
        min-width: 0;
        height: auto;
    }

    .mphb_sc_search_results-wrapper .loop-room-images-wrapper img {
        min-height: 200px;
        max-height: 250px;
    }

    .mphb_sc_search_results-wrapper .loop-room-book-wrapper {
        flex: 0 0 auto;
        min-width: auto;
        border-left: 0;
        border-top: 1px solid var(--border);
        flex-direction: row;
        gap: 1rem;
        padding: 1rem 1.5rem;
    }

    .mphb_sc_search_results-wrapper .mphb-view-details-button-wrapper,
    .mphb_sc_search_results-wrapper .mphb-to-book-btn-wrapper {
        flex: 1;
        margin-bottom: 0;
    }

    .mphb_sc_search_results-wrapper .loop-room-info-wrapper {
        padding: 1rem 1.5rem;
    }

    /* (El bloque "Detalles" de la tarjeta de resultados se reordena en dos columnas
       mas arriba, junto a las reglas de escritorio.) */

    .mphb_sc_search_results-wrapper .mphb-loop-room-type-attributes {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   FOOTER - Estilo Booklium
   ========================================================================== */

/* Anular max-width:1140px de Hello Elementor theme.css (.site-footer:not(.dynamic-footer)) */
.site-footer:not(.dynamic-footer) {
    max-width: none !important;
}

.site-footer {
    background: var(--bg-white);
    border-top: 1px solid var(--border);
    padding: 0;
}

.site-footer .footer-container,
.site-footer .footer-inner {
    max-width: var(--container-width) !important;
    margin: 0 auto;
    padding: 3rem 1.5625rem;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 2.5rem;
    margin-bottom: 2rem;
}

@media (max-width: 992px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .footer-grid {
        grid-template-columns: 1fr;
    }
}

.footer-col {
    font-size: 0.875rem;
}

.footer-logo {
    margin-bottom: 1rem;
}

.footer-logo img {
    max-height: 40px;
    width: auto;
}

.footer-logo a {
    font-weight: 700;
    color: var(--headings);
    font-size: 1.125rem;
    text-decoration: none;
}

.footer-description {
    color: var(--text-light);
    font-size: 0.875rem;
    line-height: 1.7;
}

.footer-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--headings);
    margin-bottom: 1.25rem;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: .75rem;
}

.footer-links a {
    color: var(--text);
    text-decoration: none;
    font-size: 0.875rem;
    transition: var(--transition);
}

.footer-links a:hover {
    color: var(--primary);
    text-decoration: none;
}

.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-contact li {
    margin-bottom: .75rem;
    color: var(--text);
    display: flex;
    align-items: flex-start;
    gap: .625rem;
}

.footer-contact i {
    color: var(--primary);
    font-size: 0.875rem;
    margin-top: 5px;
    width: 16px;
    text-align: center;
}

.footer-contact a {
    color: var(--text);
    text-decoration: none;
}

.footer-contact a:hover {
    color: var(--primary);
    text-decoration: none;
}

.footer-bottom {
    border-top: 1px solid var(--border);
    padding-top: 1.5rem;
    text-align: center;
}

.footer-bottom p {
    color: var(--text-light);
    font-size: 0.8125rem;
    margin: 0;
}

/* Footer menu horizontal */
.footer-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
}

.footer-menu li {
    padding: 0;
    margin: 0;
}

.footer-menu li:after {
    content: '/';
    margin: 0 12px;
    color: var(--text-light);
}

.footer-menu li:last-child:after {
    display: none;
}

.footer-menu a {
    color: var(--text);
    text-decoration: none;
}

.footer-menu a:hover {
    color: var(--primary);
    text-decoration: none;
}

/* ==========================================================================
   SCROLL TO TOP
   ========================================================================== */
.scroll-to-top-button {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 44px;
    height: 44px;
    background: var(--primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    box-shadow: var(--shadow);
    transition: var(--transition);
    opacity: 0;
    visibility: hidden;
}

.scroll-to-top-button.visible {
    opacity: 1;
    visibility: visible;
}

.scroll-to-top-button:hover {
    background: var(--headings);
    transform: translateY(-2px);
}

.scroll-to-top-button svg {
    fill: #fff;
    width: 14px;
    height: 14px;
}

/* ==========================================================================
   ELEMENTOR OVERRIDES
   ========================================================================== */
.elementor-widget-heading .elementor-heading-title {
    font-family: var(--font);
    font-weight: 600;
    color: var(--headings);
    letter-spacing: -0.03em;
}

.elementor-widget-text-editor {
    font-family: var(--font);
    color: var(--text);
}

.elementor-button {
    font-family: var(--font);
    font-weight: 600;
    letter-spacing: 0.075em;
    border-radius: var(--radius);
    background: var(--primary);
    border: 2px solid transparent;
}

.elementor-button:hover {
    background: transparent;
    border-color: var(--primary);
    color: var(--headings);
}

.elementor-icon {
    color: var(--primary);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 991px) {
    html { font-size: 15px; }
    h1 { font-size: 1.5625rem; }
    h2 { font-size: 1.25rem; }

    /* Tarjetas del listado de Propiedades (pagina "Propiedades").
       OJO: este template arma la tarjeta con .mphb-room-type como contenedor, NO con
       .loop-room-wrapper (esa clase solo la usa la variante del home). Las reglas que
       habia aca apuntaban a .loop-room-wrapper, nunca matcheaban, y por eso en mobile
       seguia el layout horizontal de escritorio.
       Ademas las reglas de escritorio son "body:not(.home) .loop-room-*-wrapper", o
       sea mas especificas: hay que igualar esa especificidad o no ganan. */
    body:not(.home) .mphb_sc_rooms-wrapper .mphb-room-type {
        flex-direction: column;
        align-items: stretch;
    }

    /* La imagen en escritorio es un cuadrado fijo de 307px. */
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
        height: 220px;
    }

    /* El slider de la galeria trae min-height:307px !important desde escritorio; con
       el alto de 220px de arriba, esto lo deja entrar y lo recorta. */
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper .flexslider,
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper .flex-viewport,
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper .slides,
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper .slides > li,
    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-images-wrapper .slides img {
        min-height: 0 !important;
    }

    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-info-wrapper {
        padding: 1rem 1.5rem;
    }

    body:not(.home) .mphb_sc_rooms-wrapper .loop-room-book-wrapper {
        border-left: 0;
        border-top: 1px solid var(--border);
        padding: 1.5rem 2rem;
    }

    /* En mobile el bloque de detalles no se muestra: ni la grilla de dos columnas ni
       el titulo "Detalles". La tarjeta queda con lo esencial: foto, nombre, linea de
       huespedes (que es otro elemento), extracto, precio y botones.
       Se agrega .mphb-room-type al selector para superar por especificidad (0,4,0 /
       0,5,1) a las reglas de escritorio que arman la grilla, que tambien usan
       !important. */
    .mphb_sc_search_results-wrapper .mphb-room-type .loop-room-info-wrapper .mphb-loop-room-type-attributes,
    .mphb_sc_search_results-wrapper .mphb-room-type .loop-room-info-wrapper .mphb-room-type-details-title,
    body:not(.home) .mphb_sc_rooms-wrapper .mphb-room-type .loop-room-info-wrapper .mphb-loop-room-type-attributes,
    body:not(.home) .mphb_sc_rooms-wrapper .mphb-room-type .loop-room-info-wrapper .mphb-room-type-details-title {
        display: none !important;
    }
}

@media (max-width: 480px) {
    h1 { font-size: 1.375rem; }
    h2 { font-size: 1.125rem; }
}

/* ==========================================================================
   ANIMACIONES
   ========================================================================== */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    *, *:before, *:after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================================
   CONTACT FORM
   ========================================================================== */
.contact-form-container {
    display: flex;
    flex-wrap: wrap;
    gap: 3rem;
    margin-top: 2rem;
}

.contact-info {
    flex: 0 0 300px;
    min-width: 250px;
}

.contact-info h4 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--headings);
    margin-bottom: 1rem;
    margin-top: 0;
}

.contact-info p {
    margin-bottom: 0.75rem;
    color: var(--text);
    font-size: 0.9375rem;
}

.contact-info p strong {
    color: var(--headings);
}

.contact-form-wrapper {
    flex: 1 1 auto;
    min-width: 300px;
    max-width: 600px;
}

.contact-form-wrapper h4 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--headings);
    margin-bottom: 1.5rem;
    margin-top: 0;
}

/* CF7 form styling */
.wpcf7-form label {
    display: block;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: var(--text);
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: 4px;
    font-family: var(--font);
    font-size: 0.9375rem;
    color: var(--text);
    background: var(--bg-white);
    transition: var(--transition);
    margin-top: 0.25rem;
}

.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(19, 176, 187, 0.1);
}

.wpcf7-form textarea {
    min-height: 120px;
    resize: vertical;
}

.wpcf7-form input[type="submit"],
.wpcf7-form .wpcf7-submit {
    display: inline-block;
    padding: 0.75rem 2rem;
    background: var(--primary);
    color: #fff;
    border: 2px solid var(--primary);
    border-radius: 4px;
    font-family: var(--font);
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    margin-top: 0.5rem;
}

.wpcf7-form input[type="submit"]:hover,
.wpcf7-form .wpcf7-submit:hover {
    background: transparent;
    color: var(--primary);
}

.wpcf7-form .wpcf7-response-output {
    margin: 1rem 0 0;
    padding: 0.75rem 1rem;
    border-radius: 4px;
    font-size: 0.875rem;
}

.wpcf7-form .wpcf7-response-output.wpcf7-validation-errors {
    border-color: #e74c3c;
    color: #e74c3c;
    background: #fdf2f2;
}

.wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ok {
    border-color: #27ae60;
    color: #27ae60;
    background: #f0faf4;
}

@media (max-width: 768px) {
    .contact-form-container {
        flex-direction: column;
        gap: 2rem;
    }

    .contact-info {
        flex: 1 1 auto;
    }

    .contact-form-wrapper {
        max-width: 100%;
    }
}
