/* ============================================================
   Casa Nana — WordPress-only adjustments.
   app.css stays a faithful port of the static site; anything
   WP-specific (menu output shape, admin bar, CF7 forms) lives here.
   ============================================================ */

/* Language switcher rendered as <a> instead of the original <button> */
.lang a{
  background:none;border:none;color:var(--playa);opacity:.7;
  font-size:.66rem;letter-spacing:.12em;font-weight:400;
  padding:5px 11px;border-radius:30px;transition:.3s;text-decoration:none;line-height:1;
}
.site-header.scrolled .lang a{color:var(--ink)}
.lang a.on{background:var(--terracota);color:#fff;opacity:1}

/* Fixed header must clear the WP admin bar when logged in */
body.admin-bar .site-header{top:32px}
body.admin-bar .mobile-panel{top:32px}
@media(max-width:782px){
  body.admin-bar .site-header{top:46px}
  body.admin-bar .mobile-panel{top:46px}
}

/* ---------- Contact Form 7 → match the design's .field styling ---------- */
.wpcf7-form p{margin:0}
.wpcf7-form .field{margin-bottom:22px}
.wpcf7-form label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wild);margin-bottom:8px}
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=date],
.wpcf7-form input[type=number],
.wpcf7-form textarea,
.wpcf7-form select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--hair);
  color:var(--ink);font-family:inherit;font-size:1rem;padding:12px 0;font-weight:300;
}
.wpcf7-form input:focus,.wpcf7-form textarea:focus,.wpcf7-form select:focus{outline:none;border-color:var(--terracota)}
.wpcf7-form select option{background:#fff;color:var(--ink)}
.wpcf7-form .btn.solid,.wpcf7-form input[type=submit]{width:100%;justify-content:center}
.wpcf7-form .wpcf7-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%;
  font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400;
  padding:15px 30px;border-radius:40px;border:1px solid var(--terracota);
  background:var(--terracota);color:#fff;transition:.4s var(--ease);cursor:pointer;
}
.wpcf7-form .wpcf7-submit:hover{background:var(--wild);border-color:var(--wild)}
.wpcf7 .wpcf7-response-output{margin:16px 0 0;border:none;padding:0;font-size:.95rem;color:var(--muted)}
.wpcf7-not-valid-tip{color:var(--wild);font-size:.8rem;letter-spacing:0;text-transform:none}
.wpcf7-form .honeypot,.wpcf7-form .cn-hp{position:absolute!important;left:-9999px!important}

/* Gutenberg alignment safety inside our containers */
.wrap .alignwide,.wrap .alignfull{max-width:100%}

/* ---------- MotoPress Hotel Booking — match the Casa Nana design ---------- */
.mphb_sc_search-form{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.mphb_sc_search-form > p{grid-column:1/-1;font-size:.78rem;color:var(--muted);margin:0 0 6px;letter-spacing:0;text-transform:none}
.mphb_sc_search-form label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wild);margin-bottom:8px}
.mphb_sc_search-check-in-date,.mphb_sc_search-check-out-date,.mphb_sc_search-adults,.mphb_sc_search-children,
.mphb_sc_search-form .mphb-search-field{margin-bottom:22px}
.mphb_sc_search-form input[type=text],.mphb_sc_search-form input.mphb-datepick,
.mphb_sc_search-form select,.mphb_sc_search-form input[type=number]{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--hair);
  color:var(--ink);font-family:inherit;font-size:1rem;padding:12px 0;font-weight:300;border-radius:0;
}
.mphb_sc_search-form select{padding:10px 0}
.mphb_sc_search-form select option{background:#fff;color:var(--ink)}
.mphb_sc_search-form input:focus,.mphb_sc_search-form select:focus{outline:none;border-color:var(--terracota)}
.mphb_sc_search-button-wrapper{grid-column:1/-1}
.mphb_sc_search-form input[type=submit],.mphb_sc_search-form button[type=submit],
.mphb-button,.button.mphb-button,input.mphb-button{
  grid-column:1/-1;width:100%;margin-top:8px;
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400;
  padding:15px 30px;border-radius:40px;border:1px solid var(--terracota);
  background:var(--terracota);color:#fff;cursor:pointer;transition:.4s var(--ease);text-decoration:none;
}
.mphb_sc_search-form input[type=submit]:hover,.mphb_sc_search-form button[type=submit]:hover,
.mphb-button:hover,.button.mphb-button:hover,input.mphb-button:hover{background:var(--wild);border-color:var(--wild);color:#fff}
/* Search results + checkout: on-brand type & spacing */
.mphb_sc_search-results .mphb-room-type-title,.mphb-price{font-family:var(--font-display)}
.mphb_room-type__wrapper,.mphb-booking,.mphb_sc_search-results{color:var(--ink)}
.mphb-datepicker,.ui-datepicker{font-family:var(--font-body)!important}

/* ---- Search results: room-type cards on-brand ---- */
.mphb_sc_search_results-wrapper{max-width:var(--maxw);margin:0 auto}
.mphb_sc_search_results-info{font-size:.95rem;color:var(--muted);letter-spacing:0;text-transform:none;margin:0 0 8px}
/* Card = image pinned as a full-height LEFT rail (absolute), so every text/
   price/button element flows in a single RIGHT column instead of scattering
   below the image. The card height is driven by the content; the image rail
   stretches to match it (top/bottom pinned). */
.mphb-room-type{position:relative;display:block;padding:clamp(30px,4vw,54px) 0;border-top:1px solid var(--hair)}
.mphb-room-type:first-of-type{border-top:none}
.mphb-room-type > :not(.mphb-room-type-images){margin-left:calc(clamp(240px,28vw,320px) + clamp(28px,4vw,54px));max-width:none}
/* left image rail */
.mphb-room-type-images{position:absolute!important;left:0;top:clamp(30px,4vw,54px);bottom:clamp(30px,4vw,54px);width:clamp(240px,28vw,320px);min-height:300px;border-radius:6px;overflow:hidden;background:#ece6da}
/* flatten the flexslider so one cover image fills the rail */
.mphb-room-type-images .flexslider,.mphb-room-type-images .flex-viewport,.mphb-room-type-images .mphb-flexslider-gallery-wrapper{height:100%!important;overflow:hidden!important;background:transparent!important;border:none!important;margin:0!important;box-shadow:none!important;position:static}
.mphb-room-type-images ul.slides,.mphb-room-type-images .slides{margin:0!important;padding:0!important;list-style:none!important;transform:none!important;width:100%!important;height:100%!important;display:block!important}
.mphb-room-type-images ul.slides>li:first-child,.mphb-room-type-images .slides>li:first-child{display:block!important;float:none!important;width:100%!important;height:100%!important;opacity:1!important;position:absolute!important;inset:0!important}
.mphb-room-type-images ul.slides>li:not(:first-child),.mphb-room-type-images .slides>li:not(:first-child),
.mphb-room-type-images .flex-direction-nav,.mphb-room-type-images .flex-control-nav,.mphb-room-type-images .flex-control-thumbs,
.mphb-room-type-gallery-thumbnails,.mphb-gallery-thumbnails-slider,.mphb-room-type-images .gallery-icon:after{display:none!important}
.mphb-room-type-images .gallery-item,.mphb-room-type-images .gallery-icon,.mphb-room-type-images li,.mphb-room-type-images a,.mphb-room-type-images span{margin:0!important;width:100%!important;height:100%!important;display:block;position:absolute;inset:0}
.mphb-room-type-images img{opacity:1!important;visibility:visible!important;width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;border-radius:6px;max-width:none;position:absolute!important;inset:0!important}
@media(max-width:820px){
  .mphb-room-type-images{position:relative!important;left:auto;top:auto;bottom:auto;width:100%;height:clamp(260px,60vw,380px);min-height:0}
  .mphb-room-type > :not(.mphb-room-type-images){margin-left:0}
}
.mphb-room-type-details,.mphb-room-type-content{min-width:0}
.mphb-room-type-title{font-family:var(--font-display);font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:400;line-height:1.08;margin:0 0 14px}
.mphb-room-type-title a{color:var(--ink)}
.mphb-loop-room-type-attributes,.mphb-room-type-attributes{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:6px 20px}
.mphb-loop-room-type-attributes li{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.mphb-attribute-title{color:var(--wild)}
/* price block ("Precio desde: $540 por 3 noches") — NOT struck through */
.mphb-regular-price,.mphb-room-type .mphb-price,.mphb-price *{text-decoration:none!important}
.mphb-regular-price{color:var(--muted);font-size:.92rem;letter-spacing:.02em;margin:4px 0 18px;line-height:1.7}
.mphb-price,.mphb-regular-price .mphb-price{font-family:var(--font-display);color:var(--terracota);font-size:1.5rem;display:inline-block;margin:0 2px}
.mphb-price-period{font-size:.82rem;color:var(--muted);font-family:var(--font-body);letter-spacing:.02em}
.mphb-currency{color:var(--terracota)}

/* ---- MotoPress buttons ---- */
.mphb-book-button,.mphb-view-details-button,.mphb-button,input.mphb-button,button.mphb-button,
.mphb-recommendation-reserve-button,.mphb-confirm-reservation,.mphb_sc_checkout button,.mphb_sc_checkout input[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400;line-height:1;
  padding:14px 28px;border-radius:40px;border:1px solid var(--terracota);
  background:var(--terracota);color:#fff!important;cursor:pointer;transition:.4s var(--ease);text-decoration:none;
}
.mphb-book-button:hover,.mphb-button:hover,.mphb-recommendation-reserve-button:hover,.mphb-confirm-reservation:hover,.mphb_sc_checkout button:hover{background:var(--wild);border-color:var(--wild);color:#fff!important}
.mphb-view-details-button{background:transparent;color:var(--ink)!important;border-color:var(--ink);margin-right:10px}
.mphb-view-details-button:hover{background:var(--ink);color:var(--bg)!important}
.mphb-view-details-button-wrapper{display:inline-block}

/* ---- checkout: "price is an estimate, confirmed by us" notice above Book Now ---- */
.cn-price-notice{
  display:flex;align-items:center;gap:14px;margin:8px 0 22px;padding:16px 20px;
  background:linear-gradient(0deg,rgba(191,148,69,.12),rgba(191,148,69,.12)),var(--paper);
  border:1px solid rgba(142,86,58,.30);border-left:4px solid var(--terracota);
  border-radius:12px;box-shadow:0 8px 26px -16px rgba(94,43,37,.55)}
.cn-price-notice__icon{flex:0 0 auto;font-size:1.4rem;line-height:1.15;color:var(--terracota)}
.cn-price-notice__text{min-width:0;color:var(--ink);font-size:1rem;line-height:1.5}

/* ---- reservation cart / recommendation sidebar ---- */
.mphb-reservation-cart,.mphb-recommendation,.mphb-rooms-reservation-message-wrapper,.mphb-reservation-details{
  background:var(--paper);border:1px solid var(--hair);border-radius:12px;padding:clamp(22px,2.5vw,30px);margin:24px 0}
.mphb-empty-cart-message,.mphb-cart-message,.mphb-rooms-reservation-message{color:var(--muted)}
.mphb-cart-total-price,.mphb-recommendation-total,.mphb-recommendation-total-value,.mphb-cart-total-price-value{font-family:var(--font-display);font-size:1.25rem;color:var(--ink)}
.mphb-recommendation-title,.mphb-cart-total-price-title,.mphb-recommendation-total-title{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wild)}
.mphb-recommendation-title{display:block;margin:0 0 clamp(16px,1.8vw,24px)}
.mphb-recommendation-item{border-top:1px solid var(--hair);padding:14px 0}

/* ---- checkout / confirmation forms ---- */
.mphb_sc_checkout,.mphb-checkout,.mphb-booking-confirmation,.mphb_sc_booking_confirmation{color:var(--ink)}
.mphb_sc_checkout .mphb-checkout-section-title,.mphb-checkout h2,.mphb-booking-confirmation h2{font-family:var(--font-display);font-weight:400}
.mphb_sc_checkout label,.mphb-checkout label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wild);margin-bottom:8px}
.mphb_sc_checkout input[type=text],.mphb_sc_checkout input[type=email],.mphb_sc_checkout input[type=tel],.mphb_sc_checkout input[type=number],.mphb_sc_checkout textarea,.mphb_sc_checkout select,
.mphb-checkout input[type=text],.mphb-checkout input[type=email],.mphb-checkout input[type=tel],.mphb-checkout textarea,.mphb-checkout select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--hair);color:var(--ink);font-family:inherit;font-size:1rem;padding:12px 0;font-weight:300;border-radius:0}
.mphb_sc_checkout input:focus,.mphb_sc_checkout textarea:focus,.mphb_sc_checkout select:focus{outline:none;border-color:var(--terracota)}
.mphb_sc_checkout table,.mphb-checkout table{width:100%;border-collapse:collapse}
.mphb_sc_checkout th,.mphb_sc_checkout td,.mphb-checkout th,.mphb-checkout td{padding:12px 8px;border-bottom:1px solid var(--hair);text-align:left;font-size:.95rem}

/* ---- MotoPress checkout / confirmation forms (rendered inside page.php) ---- */
.cn-page-content input[type=text],.cn-page-content input[type=email],.cn-page-content input[type=tel],.cn-page-content input[type=password],
.cn-page-content input[type=number],.cn-page-content input[type=date],.cn-page-content textarea,.cn-page-content select{
  width:100%;max-width:440px;background:transparent;border:none;border-bottom:1px solid var(--hair);
  color:var(--ink);font-family:inherit;font-size:1rem;padding:11px 0;font-weight:300;border-radius:0;box-shadow:none}
.cn-page-content select{max-width:300px}
.cn-page-content input:focus,.cn-page-content textarea:focus,.cn-page-content select:focus{outline:none;border-color:var(--terracota)}
.cn-page-content input[type=submit],.cn-page-content button[type=submit],.cn-page-content button.mphb-button,
.cn-page-content .button,.cn-page-content .mphb-book-button,.cn-page-content .mphb-confirm-reservation{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;width:auto;
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400;line-height:1;
  padding:15px 32px;border-radius:40px;border:1px solid var(--terracota);background:var(--terracota);
  color:#fff!important;cursor:pointer;transition:.4s var(--ease);margin-top:16px;text-decoration:none}
.cn-page-content input[type=submit]:hover,.cn-page-content button[type=submit]:hover,.cn-page-content .button:hover{background:var(--wild);border-color:var(--wild)}

/* ---- date picker calendar (Keith Wood datepick + MotoPress wrapper) ---- */
.mphb-datepick-popup,.datepick.mphb-datepick-popup,div.datepick{
  background:var(--paper)!important;border:1px solid var(--hair)!important;border-radius:12px!important;
  box-shadow:0 26px 60px -30px rgba(38,32,26,.55)!important;padding:8px!important;font-family:var(--font-body)!important;color:var(--ink)!important;width:auto!important;z-index:99999}
.mphb-datepick-popup .datepick-nav,.datepick .datepick-nav,.mphb-datepick-popup .datepick-ctrl,.datepick .datepick-ctrl{
  background:transparent!important;border:none!important;border-top:1px solid var(--hair)!important;color:var(--ink)!important;padding:6px 8px!important}
.mphb-datepick-popup .datepick-nav{border-top:none!important;border-bottom:1px solid var(--hair)!important}
.datepick .datepick-cmd,.mphb-datepick-popup a.datepick-cmd,.datepick a{color:var(--terracota)!important;background:transparent!important;border:none!important;text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;font-weight:400}
.datepick .datepick-cmd-clear{color:var(--wild)!important}
.datepick .datepick-month-header,.mphb-datepick-popup .datepick-month-header{background:transparent!important;color:var(--ink)!important;font-family:var(--font-display)!important;font-size:1.02rem!important;border:none!important;padding-bottom:6px}
.datepick .datepick-month table,.datepick .datepick-month th,.datepick .datepick-month td{border:none!important;background:transparent!important}
.datepick .datepick-month th{color:var(--wild)!important;font-size:.6rem!important;text-transform:uppercase;font-weight:400;padding:5px 0}
.datepick .datepick-month td{padding:1px!important}
.datepick .datepick-month td a,.datepick .datepick-month td span{border:none!important;background:transparent!important;color:var(--ink)!important;border-radius:50%!important;text-align:center;padding:7px 0!important;display:block;font-size:.84rem}
.datepick .datepick-month td a:hover{background:var(--playa)!important;color:var(--ink)!important}
.datepick .datepick-selected a,.datepick td.datepick-selected a{background:var(--terracota)!important;color:#fff!important}
.datepick .datepick-highlight a,.datepick .datepick-today a{background:var(--playa)!important;color:var(--ink)!important}
.datepick .datepick-other-month a,.datepick .datepick-other-month span{opacity:.4}
.datepick .datepick-disabled span{opacity:.3}
.datepick .datepick-weekend a{color:var(--ink)!important}

/* ---- tighter top spacing for banner'd generic/MotoPress pages ---- */
.cn-page-section{padding-top:clamp(40px,4vw,60px)!important}
.cn-page-content > *:first-child{margin-top:0}
.mphb_sc_search_results-info{margin-bottom:clamp(24px,3vw,40px)}
/* trim MotoPress's own vertical gaps that create big empty areas */
.mphb_sc_search_results-wrapper > *{margin-top:0}
.mphb-recommendation,.mphb-reservation-cart{margin:0 0 clamp(24px,3vw,40px)}
.mphb-room-type-details .mphb-room-type-details-title,.mphb-room-type h2{margin-top:0}

/* ---- checkout: two columns on desktop (form left, price summary right) ---- */
@media(min-width:900px){
  .mphb_sc_checkout-form{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:0 clamp(32px,4vw,60px);align-items:start}
  .mphb_sc_checkout-form > *{grid-column:1;min-width:0}
  .mphb_sc_checkout-form > .mphb-room-price-breakdown-wrapper{
    grid-column:2;grid-row:1 / 60;position:sticky;top:100px;
    background:var(--paper);border:1px solid var(--hair);border-radius:12px;padding:clamp(22px,2vw,28px);margin:0}
}
.mphb-room-price-breakdown-wrapper .mphb-price,.mphb-checkout-total-price,.mphb-booking-details h2,.mphb-customer-details h2,.mphb-room-price-breakdown-wrapper h2{font-family:var(--font-display)}
.mphb-checkout-section{margin-bottom:clamp(26px,3vw,40px)}

/* Checkout booking details: show just the room name (drop the "Tipo de alojamiento:"/
   "Accommodation Type:" label span). */
.mphb-booking-details .mphb-room-type-title > span{display:none}
.mphb-booking-details .mphb-room-type-title{font-family:var(--font-display);font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.12;margin:2px 0 20px}
.mphb-booking-details .mphb-room-type-title a{color:var(--ink);text-decoration:none}

/* Checkout price breakdown: clean 2-column table — label left, price right, tidy total. */
.mphb-room-price-breakdown-wrapper .mphb-price-breakdown-title{font-family:var(--font-display);font-weight:400;font-size:1.15rem;margin:0 0 16px}
.mphb-price-breakdown{width:100%;border-collapse:collapse;font-size:.95rem;margin:0}
.mphb-price-breakdown tr{border:none}
.mphb-price-breakdown td,.mphb-price-breakdown th{border:none!important;padding:8px 0;text-align:left;font-weight:400;color:var(--ink);vertical-align:baseline;background:none}
.mphb-price-breakdown .mphb-table-price-column{width:1%;white-space:nowrap;text-align:right;font-family:var(--font-display);color:var(--terracota)}
.mphb-price-breakdown .mphb-price-breakdown-booking > td:first-child{padding-right:16px}
/* detail rows (adults / children / nights / dates), shown when expanded */
.mphb-price-breakdown tr[class*="price-breakdown-adults"] td,.mphb-price-breakdown tr[class*="price-breakdown-children"] td,.mphb-price-breakdown tr[class*="price-breakdown-nights"] td,.mphb-price-breakdown tr[class*="price-breakdown-date"] td{color:var(--muted);font-size:.88rem;padding:4px 0}
.mphb-price-breakdown tr[class*="price-breakdown-dates"] th{border-top:1px solid var(--hair)!important;padding-top:10px;color:var(--wild);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
/* total row */
.mphb-price-breakdown tfoot .mphb-price-breakdown-total th{border-top:1px solid var(--hair)!important;padding-top:14px;font-family:var(--font-display);font-size:1.05rem;color:var(--ink)}
.mphb-price-breakdown tfoot .mphb-price-breakdown-total .mphb-table-price-column{font-size:1.35rem}
/* expand/collapse toggle [+] */
.mphb-price-breakdown .mphb-price-breakdown-toggle,.mphb-price-breakdown a[class*="toggle"]{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-right:8px;border:1px solid var(--hair);border-radius:4px;color:var(--muted);text-decoration:none;font-size:.8rem;line-height:1}
/* Hide the empty reservation-cart placeholder box on search results — MotoPress
   tags it `.mphb-empty-cart` only while empty and drops that class once a room is
   added via "Hacer reserva", so the populated cart still shows. Removes a large
   empty panel ("Elija entre alojamientos disponibles.") above the results. */
.mphb-reservation-cart.mphb-empty-cart{display:none!important}

/* Search cart: render each selected room as a card with a remove button
   (replaces MotoPress's plain "N alojamientos seleccionados" line — hidden). */
.mphb-reservation-cart .mphb-cart-message{display:none!important}
/* Cart layout: MotoPress floats the details narrow-left + confirm button right;
   make it a full-width column so the room cards are wide and the confirm button
   sits at the bottom-right, under the cards. */
.mphb-reservation-cart{display:flex;flex-direction:column;align-items:stretch}
.mphb-reservation-cart .mphb-reservation-details{float:none!important;width:100%!important;max-width:none!important}
.mphb-reservation-cart .mphb-confirm-reservation{float:none!important;align-self:flex-end;margin-top:12px}
.mphb-reservation-cart .mphb-cart-total-price{margin-top:14px;text-align:right}
.cn-cart-rooms{display:flex;flex-direction:column;gap:14px;margin:0 0 18px}
.cn-cart-room{display:flex;align-items:flex-start;gap:18px;padding:16px 18px;border:1px solid var(--hair);border-radius:10px;background:var(--bg)}
.cn-cart-room-img{flex:0 0 88px;width:88px;height:88px;border-radius:8px;background:#ece6da center/cover no-repeat}
.cn-cart-room-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.cn-cart-room-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.cn-cart-room-title{font-family:var(--font-display);font-size:1.2rem;line-height:1.15;color:var(--ink)}
.cn-cart-room-price{font-family:var(--font-display);font-size:1.15rem;color:var(--terracota);white-space:nowrap}
.cn-cart-room-desc{margin:0;color:var(--muted);font-size:.92rem;line-height:1.5}
.cn-cart-room-cap{margin:2px 0 0!important}
.cn-cart-room-remove{flex:0 0 auto;align-self:center;width:32px;height:32px;padding:0;border-radius:50%;border:1px solid var(--hair);background:transparent;color:var(--muted);font-size:1.2rem;line-height:1;cursor:pointer;transition:.25s var(--ease)}
.cn-cart-room-remove:hover{background:var(--wild);border-color:var(--wild);color:#fff}

/* ============================================================
   MotoPress customer account ([mphb_account]) — login / dashboard /
   booking history / account details, styled to match Casa Nana.
   ============================================================ */
.mphb-account{max-width:var(--maxw);margin:0 auto}
/* login form (wp_login_form) */
.cn-page-content #loginform{max-width:440px;margin:0}
.cn-page-content #loginform p{margin:0 0 20px}
.cn-page-content #loginform label{display:block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wild);margin-bottom:8px;font-weight:400}
.cn-page-content #loginform .login-remember{display:flex;align-items:center;gap:10px}
.cn-page-content #loginform .login-remember label{margin:0;text-transform:none;letter-spacing:.02em;font-size:.9rem;color:var(--muted)}
.cn-page-content #loginform .login-remember input{width:auto;margin:0}
.cn-page-content #loginform .login-submit{margin-top:6px}
.cn-page-content .mphb-lost-password,.cn-page-content #loginform + p a,.cn-page-content .mphb-account a.mphb-lostpassword-link{font-size:.9rem;color:var(--terracota);text-decoration:none}
.cn-page-content .mphb-lost-password:hover{text-decoration:underline}
/* dashboard greeting + tab links */
.cn-page-content .mphb-account > p{color:var(--muted);line-height:1.8;max-width:640px}
.cn-page-content .mphb-account a{color:var(--terracota);text-decoration:none}
.cn-page-content .mphb-account a:hover{text-decoration:underline}
/* account sub-nav <nav class="mphb-account-menu"><ul>… (Dashboard/Bookings/Account/Logout)
   — override MotoPress's float so it's a full-width top tab bar, content below */
.mphb-account-menu{float:none!important;width:100%!important;max-width:none!important;clear:both;margin:0 0 clamp(24px,3vw,38px)!important;border-bottom:1px solid var(--hair)}
.mphb-account-menu ul{list-style:none;margin:0!important;padding:0!important;display:flex;flex-wrap:wrap;gap:4px 28px;width:100%}
.mphb-account-menu + *,.mphb-account-menu ~ p,.mphb-account-bookings,.mphb-account-details{clear:both}
/* MotoPress floats the account content right at a fixed width; make it full width under the top tab bar */
.mphb-account-content{float:none!important;width:100%!important;max-width:none!important;clear:both}
.mphb-account-menu li{margin:0}
.mphb-account-menu a{display:inline-block;padding:0 0 13px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;text-decoration:none}
.mphb-account-menu a:hover{color:var(--ink);border-bottom-color:var(--terracota)}
/* empty-state message (no bookings yet) */
.mphb-account .mphb-data-message,.mphb-account .mphb-no-bookings,.cn-page-content .mphb-account > p.mphb-data-success{color:var(--muted)}
/* bookings history table */
.mphb-account-bookings{width:100%;border-collapse:collapse;font-size:.95rem}
.mphb-account-bookings caption{text-align:left;font-family:var(--font-display);font-size:1.3rem;margin-bottom:14px}
.mphb-account-bookings th{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--wild);font-weight:400;text-align:left;padding:0 14px 12px;border-bottom:1px solid var(--hair)}
.mphb-account-bookings td{padding:16px 14px;border-bottom:1px solid var(--hair);color:var(--ink);vertical-align:middle}
.mphb-account-bookings .booking-number{font-family:var(--font-display);color:var(--ink)}
.mphb-account-bookings .booking-price{font-family:var(--font-display);color:var(--terracota)}
.mphb-account-bookings tr:hover td{background:rgba(0,0,0,.015)}
/* status pill — color by booking state */
.mphb-account-bookings .booking-status{white-space:nowrap}
.booking-status .mphb-booking-status,.booking-status > span,.mphb-booking-status{display:inline-block;padding:5px 12px;border-radius:30px;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;background:var(--playa);color:var(--ink);line-height:1}
.mphb-booking-status.confirmed,.status-confirmed .mphb-booking-status{background:#e5efe3;color:#3f6b3a}
.mphb-booking-status.pending,.status-pending .mphb-booking-status{background:#f6ead2;color:#9a6a1f}
.mphb-booking-status.cancelled,.mphb-booking-status.abandoned,.status-cancelled .mphb-booking-status,.status-abandoned .mphb-booking-status{background:#efe0dc;color:var(--wild)}
/* row action buttons (view / cancel) */
.mphb-account-bookings .booking-actions{white-space:nowrap;text-align:right}
.mphb-account-bookings .booking-actions a,.mphb-account-bookings .booking-actions button{
  display:inline-block;padding:9px 18px;border-radius:30px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--ink);color:var(--ink)!important;background:transparent;text-decoration:none;transition:.3s var(--ease);margin-left:8px}
.mphb-account-bookings .booking-actions a:hover{background:var(--ink);color:var(--bg)!important}
.mphb-account-bookings .booking-actions a.mphb-cancel-booking,.mphb-account-bookings .booking-actions a[href*=cancel]{border-color:var(--wild);color:var(--wild)!important}
.mphb-account-bookings .booking-actions a.mphb-cancel-booking:hover,.mphb-account-bookings .booking-actions a[href*=cancel]:hover{background:var(--wild);color:#fff!important}
/* pagination */
.mphb-pagination{margin-top:26px;display:flex;gap:8px}
.mphb-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;border-radius:50%;border:1px solid var(--hair);color:var(--ink);text-decoration:none;font-size:.9rem}
.mphb-pagination .page-numbers.current,.mphb-pagination .page-numbers:hover{background:var(--terracota);color:#fff;border-color:var(--terracota)}
/* responsive: stack the bookings table on small screens */
@media(max-width:680px){
  .mphb-account-bookings,.mphb-account-bookings thead,.mphb-account-bookings tbody,.mphb-account-bookings tr,.mphb-account-bookings td{display:block;width:100%}
  .mphb-account-bookings thead{display:none}
  .mphb-account-bookings tr{border:1px solid var(--hair);border-radius:10px;padding:8px 14px;margin-bottom:14px}
  .mphb-account-bookings td{border:none;padding:6px 0;display:flex;justify-content:space-between;gap:16px}
  .mphb-account-bookings td::before{content:attr(data-title);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--wild)}
  .mphb-account-bookings .booking-actions{text-align:left}
  .mphb-account-bookings .booking-actions a{margin:6px 8px 0 0}
}
/* shorter hero on the account / cancellation utility pages (marketing pages keep 66svh) */
.cn-compact-hero .page-hero{min-height:clamp(280px,40vh,400px)}
/* header utility "My account" link */
.cn-account-link{display:inline-flex;align-items:center;gap:6px;color:var(--playa);opacity:.75;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:5px 4px;transition:.3s}
.cn-account-link:hover{opacity:1}
.site-header.scrolled .cn-account-link{color:var(--ink)}

/* Pages with NO hero banner (single room, gallery, search, 404): the fixed header
   has no dark image to sit over, so the light nav/logo become unreadable on the
   light background. Give the header its solid "scrolled" look from the top. */
body.cn-no-hero .site-header{background:rgba(251,249,243,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
body.cn-no-hero .site-header .brand .mark{color:var(--ink)}
body.cn-no-hero .site-header .brand-logo{display:block;filter:brightness(0) invert(.42) sepia(.62) saturate(3) hue-rotate(337deg) brightness(.92);opacity:.95}
body.cn-no-hero .site-header .brand-icon{display:none}
body.cn-no-hero .site-header .nav a{color:var(--ink)}
body.cn-no-hero .site-header .lang{border-color:var(--hair)}
body.cn-no-hero .site-header .lang a,body.cn-no-hero .site-header .lang button{color:var(--ink)}
body.cn-no-hero .site-header .lang a.on,body.cn-no-hero .site-header .lang button.on{color:#fff}
body.cn-no-hero .site-header .cn-account-link{color:var(--ink)}
body.cn-no-hero .site-header .burger span{background:var(--ink)}
