/*
 * Functional additions required by a working backend. These style the
 * interactive replacements for static template elements (native selects,
 * range inputs, rating radios, drop zone, validation output, flash notice)
 * so they render identically to the frozen design.
 */

/* visually hidden but available to assistive tech */
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* native select rendered as the template's .sel button */
.selw { position: relative; display: block; width: 100%; }
.selw select { -webkit-appearance: none; appearance: none; padding-right: 44px; text-align: left; }
.selw select::-ms-expand { display: none; }
.selw > svg.chev { position: absolute; right: 20px; top: 50%; margin-top: -7px; pointer-events: none; color: #555; }
.selw.sm > svg.chev { right: 14px; color: #777; }
.selw > svg.lead { position: absolute; left: 20px; top: 50%; margin-top: -8px; pointer-events: none; color: #555; }
.selw.has-lead select { padding-left: 46px; }
.selw select.sel { margin-bottom: 24px; }
.selw.sm select.sel { margin-bottom: 0; }
.selw.sm > svg.chev { margin-top: -7px; }
.fh .sel:focus { border-color: #ec4c60; box-shadow: 0 0 0 3px rgba(236, 76, 96, .15); outline: 0; }

/* sort control rendered as the template's inline text + chevron */
.sortw { display: inline-flex; align-items: center; gap: 8px; color: #2d2d2d; position: relative; }
.fh .sortsel { -webkit-appearance: none; appearance: none; border: 0; background: none; padding: 0 20px 0 0; font-family: Lato, Arial, sans-serif; font-size: 16px; color: #2d2d2d; cursor: pointer; }
.sortw > svg { position: absolute; right: 0; top: 50%; margin-top: -6px; pointer-events: none; }

/* dual range inputs laid over the template's slider track */
.slider { touch-action: none; }
.slider input[type="range"] { position: absolute; left: -10px; top: -9px; width: calc(100% + 20px); height: 20px; margin: 0; padding: 0; background: none; -webkit-appearance: none; appearance: none; pointer-events: none; opacity: 0; }
.slider input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; pointer-events: auto; cursor: pointer; }
.slider input[type="range"]::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; border: 0; pointer-events: auto; cursor: pointer; }
.slider input[type="range"]:focus-visible + i, .slider input[type="range"]:focus-visible ~ i.focus { box-shadow: 0 0 0 3px rgba(236, 76, 96, .25); }

/* rating radios rendered as the template's star row */
.stars.rate { flex-direction: row-reverse; justify-content: flex-end; }
.stars.rate label { display: inline-flex; cursor: pointer; }
.stars.rate input { position: absolute; opacity: 0; width: 0; height: 0; }
.stars.rate label:hover svg, .stars.rate label:hover ~ label svg, .stars.rate input:checked ~ svg, .stars.rate label:has(input:checked) svg, .stars.rate label:has(input:checked) ~ label svg { color: #f3b61c; }

/* drop zone */
.dropzone { cursor: pointer; transition: background .25s ease, border-color .25s ease; }
.dropzone.over { background: #f3fbf8; border-color: #1f9a73; }
.dropzone .picked { font-size: 14px; color: #2fb38a; }
.dropzone .picked:empty { display: none; }

/* validation and notices (accent colour, body font, no size changes to fields) */
.err { display: block; color: #ec4c60; font-size: 14px; line-height: 1.4; margin: -10px 0 14px; }
.err-top { margin: 0 0 16px; }
.flash { background: #fff; border: 1px solid #e8ebf0; border-left: 3px solid #ec4c60; padding: 14px 20px; color: #2d2d2d; font-size: 15px; margin-bottom: 24px; animation: fhUp .4s cubic-bezier(.2, .7, .2, 1) both; }
.flash.ok { border-left-color: #4bb563; }

/* inline forms around template buttons: keep the button where it was */
.iform { display: inline; margin: 0; padding: 0; }
.iform-flex { display: inline-flex; margin: 0; padding: 0; }
.acts .iform { display: inline-flex; }

/* favourite state */
.fav-on svg { fill: #ec4c60; color: #ec4c60; }

/* keep interaction feedback within 150-400ms */
.fh .flash, .fh .dropzone { transition-duration: .25s; }
@media (prefers-reduced-motion: reduce) {
  .flash, .dropzone { animation: none !important; transition: none !important; }
}

/* home hero select fields rendered inside the template's .fld label */
.fld select.fldsel { -webkit-appearance: none; appearance: none; border: 0; background: transparent; font-family: Lato, Arial, sans-serif; font-size: 17px; color: #555; width: 100%; padding: 0; cursor: pointer; outline: 0; }
/* advanced features panel on the listing filter */
.adv { display: flex; flex-wrap: wrap; margin: -20px 0 30px; }
.adv label { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; color: #555; margin: 0 24px 14px 0; cursor: pointer; }
.adv label input { width: 16px; height: 16px; margin: 0; }
/* payment method rows as buttons */
button.pm { width: 100%; background: #fff; cursor: pointer; font: inherit; text-align: left; }
button.pm:focus-visible { outline: 2px solid #ec4c60; outline-offset: 2px; }
/* sidebar avatar link keeps the template layout */
a.me { text-decoration: none; }
/* existing image list on the edit form */
.imgs-existing { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }
.imgs-existing img { width: 96px; height: 72px; object-fit: cover; display: block; }
.fld select.fldsel { width: auto; flex: 1; min-width: 0; }
/* list view on the listing page reuses the home page's wide card values */
.plist .pcard { display: flex; background: #fff; border: 1px solid #e5e8ee; min-height: 285px; }
.plist .pimg { position: relative; width: 380px; flex: 0 0 380px; height: auto; overflow: hidden; }
.plist .pbody { flex: 1; padding: 22px 22px 18px; display: flex; flex-direction: column; min-width: 0; }
.plist .pbody h3 { font-size: 20px; }
.plist .price { font-family: Montserrat, sans-serif; font-weight: 700; font-size: 20px; color: #2d2d2d; }
.plist .pfoot { font-size: 15px; }
.plist .pfoot .acts { display: flex; gap: 26px; color: #888; }
.plist .pfoot .acts button { background: none; border: 0; color: #888; cursor: pointer; padding: 0; display: inline-flex; }
@media (max-width: 900px) { .plist .pcard { flex-direction: column; } .plist .pimg { width: 100%; flex: 0 0 240px; } }
.vh input { width: 1px; height: 1px; opacity: 0; }
/* let the city card text panel shrink so long names wrap instead of clipping */
.city div { min-width: 0; }

/* custom CMS pages: body typography in the site's fonts */
.page-body h2, .page-body h3, .page-body h4 { margin: 28px 0 12px; }
.page-body h2 { font-size: 24px; } .page-body h3 { font-size: 20px; } .page-body h4 { font-size: 17px; }
.page-body p, .page-body li { font-size: 15px; line-height: 1.75; }
.page-body p { margin: 0 0 18px; }
.page-body ul, .page-body ol { margin: 0 0 18px 22px; padding: 0; }
.page-body img { max-width: 100%; height: auto; display: block; margin: 18px 0; }
.page-body blockquote { margin: 18px 0; padding: 12px 20px; border-left: 3px solid #ec4c60; background: #f5f7fb; }
.page-body table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 15px; }
.page-body th, .page-body td { text-align: left; padding: 10px; border-bottom: 1px solid #eef0f4; }
.page-body pre { background: #f5f7fb; padding: 14px; overflow: auto; font-size: 13px; }

/* brand logo in the header, dashboard sidebar and admin sidebar */
.brand-logo { height: 44px; width: auto; max-width: 220px; object-fit: contain; display: block; }
.side .top .brand-logo { height: 40px; }
.side .top span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* header cart link with live count */
.hcart { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: inherit; }
.hcart b { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--brand-primary); color: #fff; font: 700 11px/18px Lato, sans-serif; text-align: center; }
.hcart b[hidden] { display: none; }

/* toast shown after cart and wishlist actions */
.toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 10px); background: #2d2d2d; color: #fff; padding: 12px 20px; border-radius: 4px; font: 15px Lato, sans-serif; opacity: 0; transition: opacity .25s ease, transform .25s ease; z-index: 60; max-width: calc(100% - 32px); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast[hidden] { display: none; }

/* cart page */
.cart-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 30px; align-items: start; }
.cart-tbl-wrap { overflow-x: auto; background: #fff; border: 1px solid #e8ebf0; }
.cart-tbl { width: 100%; border-collapse: collapse; font-size: 15px; }
.cart-tbl th { text-align: left; font-weight: 400; color: #2d2d2d; padding: 16px 14px; border-bottom: 1px solid #eef0f4; font-family: Montserrat, sans-serif; }
.cart-tbl td { padding: 16px 14px; border-bottom: 1px solid #eef0f4; color: #2d2d2d; vertical-align: middle; }
.cart-tbl img { width: 90px; height: 70px; object-fit: cover; display: block; }
.cart-tbl .qty { display: inline-flex; gap: 8px; align-items: center; }
.cart-tbl .qty input { width: 70px; height: 44px; border: 1px solid #dfe3ea; border-radius: 3px; padding: 0 10px; font-size: 15px; }
.cart-tbl .upd { height: 44px; padding: 0 14px; border: 1px solid #dfe3ea; background: #fff; border-radius: 3px; cursor: pointer; color: #2d2d2d; font: 15px Lato, sans-serif; }
.cart-tbl .rm { width: 44px; height: 44px; border: 0; background: none; color: var(--brand-primary); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.cart-sum { background: #fff; border: 1px solid #e8ebf0; padding: 26px 24px; }
.cart-sum h3 { font-size: 20px; padding-bottom: 18px; border-bottom: 1px solid #e9ecf1; margin-bottom: 18px; }
.cart-sum .line { display: flex; justify-content: space-between; padding: 10px 0; font-size: 15px; color: #555; }
.cart-sum .line.total { color: #2d2d2d; font-weight: 700; font-size: 17px; border-top: 1px solid #eef0f4; margin: 8px 0 14px; padding-top: 16px; }
.cart-empty { background: #fff; border: 1px solid #e8ebf0; padding: 40px; text-align: center; }
.cart-empty p { margin: 0 0 20px; font-size: 17px; }
.muted { color: #777; font-size: 13px; }

/* rent / purchase toggle on the listing filters */
.stoggle { display: flex; border: 1px solid #dfe3ea; border-radius: 3px; overflow: hidden; margin-bottom: 24px; }
.stoggle a { flex: 1; text-align: center; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; color: #2d2d2d; background: #fff; transition: background .2s ease, color .2s ease; }
.stoggle a + a { border-left: 1px solid #dfe3ea; }
.stoggle a.on { background: var(--brand-primary); color: #fff; }

/* book a viewing link on listing cards */
.bookv { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 14px; color: var(--brand-primary); font-family: Lato, sans-serif; }
.bookv:hover { color: var(--brand-primary-dark); }

/* WhatsApp chat button (enabled from Brand Settings) */
.wa-btn { position: fixed; left: 24px; bottom: 24px; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(0, 0, 0, .2); z-index: 50; transition: transform .25s ease; }
.wa-btn:hover { transform: translateY(-2px); color: #fff; }

/* dashboard: notification counts, status pills, small links */
.menu .pill, .bell b { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--brand-primary); color: #fff; font: 700 11px/20px Lato, sans-serif; }
.menu .pill { margin-left: auto; }
.bell { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: #2d2d2d; }
.bell b { position: absolute; top: 0; right: 0; }
.pill-s { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 13px; background: #eef0f4; color: #2d2d2d; white-space: nowrap; }
.pill-s.st-confirmed, .pill-s.st-verified, .pill-s.st-signed, .pill-s.st-completed { background: #e3f5e8; color: #1e7e3a; }
.pill-s.st-cancelled, .pill-s.st-rejected, .pill-s.st-void { background: #fde8eb; color: #b3263b; }
.pill-s.st-pending, .pill-s.st-awaiting_verification, .pill-s.st-sent { background: #fff4e0; color: #9a5b00; }
.lnk { color: var(--brand-primary); }
.lnk-red { background: none; border: 0; color: var(--brand-primary); cursor: pointer; font: inherit; padding: 0; min-height: 44px; }
.sign-box { border: 1px solid #e3e6ec; padding: 20px; margin-top: 24px; background: #fafbfd; }

/* payments: method details under each option */
.pm-opt { cursor: pointer; }
.pm-opt input { margin: 0 10px 0 0; width: 18px; height: 18px; }
.method-panel { border: 1px solid #e3e6ec; border-top: 0; padding: 16px; margin: -22px 0 22px; background: #fafbfd; font-size: 15px; }
.method-panel[hidden] { display: none; }
.method-panel dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 10px; }
.method-panel dt { color: #777; }
.method-panel dd { margin: 0; color: #2d2d2d; word-break: break-all; }
.method-panel p { margin: 0; color: #555; line-height: 1.7; }
.hist th, .hist td { white-space: nowrap; }

/* notifications */
.notif { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid #eef0f4; align-items: flex-start; }
.notif.unread { background: #fafbfd; }
.notif .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--brand-primary); margin-top: 8px; flex: 0 0 auto; }
.notif b { display: block; font-weight: 400; color: #2d2d2d; font-size: 16px; }
.notif p { margin: 4px 0 0; color: #555; font-size: 15px; line-height: 1.6; }
.notif time { color: #999; font-size: 13px; }

/* conditional admin fields */
[data-when][hidden] { display: none; }

@media (max-width: 900px) {
  .cart-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .cart-tbl thead { display: none; }
  .cart-tbl tr { display: block; padding: 12px 0; border-bottom: 1px solid #eef0f4; }
  .cart-tbl td { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 0; padding: 6px 14px; }
  .cart-tbl td::before { content: attr(data-label); color: #777; font-size: 13px; }
  .wa-btn { left: 16px; bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .toast, .wa-btn, .stoggle a, .bookv { transition: none !important; }
}
@media (max-width: 768px) {
  .cart-tbl td[data-label=""]::before { content: none; }
  .cart-tbl td:first-child { justify-content: flex-start; }
  .cart-tbl td:last-child { justify-content: flex-end; }
}

/* booking form: the time-slot select must not widen the sidebar on small screens */
.scard .tour-row label { min-width: 0; }
.scard .tour-row .inp { min-width: 0; max-width: 100%; }
.fh .pd-acts .acts button { width: 44px; height: 44px; }

/* cookie consent */
.cookie-bar { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 70; background: #fff; border: 1px solid #e8ebf0; box-shadow: 0 10px 30px rgba(0, 0, 0, .18); padding: 18px 22px; display: flex; gap: 20px; align-items: center; flex-wrap: wrap; font-size: 15px; color: #2d2d2d; animation: fhUp .4s cubic-bezier(.2, .7, .2, 1) both; }
.cookie-bar p { margin: 0; flex: 1 1 320px; line-height: 1.6; }
.cookie-bar .acts, .cookie-dlg .acts { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.cookie-bar .btn-red, .cookie-dlg .btn-red { height: 44px; padding: 0 20px; font-size: 15px; }
.btn-ghost { height: 44px; padding: 0 18px; border: 1px solid #cfd3da; border-radius: 3px; background: #fff; color: #2d2d2d; font: 15px Lato, sans-serif; cursor: pointer; transition: border-color .2s ease, color .2s ease; }
.btn-ghost:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.cookie-bar .lnk, .cookie-dlg .lnk { background: none; border: 0; cursor: pointer; font: inherit; min-height: 44px; }
.cookie-dlg { border: 0; border-radius: 4px; padding: 0; max-width: 560px; width: calc(100% - 32px); box-shadow: 0 20px 50px rgba(0, 0, 0, .25); font-family: Lato, sans-serif; color: #2d2d2d; }
.cookie-dlg::backdrop { background: rgba(20, 20, 20, .55); }
.cookie-dlg form { padding: 28px 28px 24px; }
.cookie-dlg h3 { font-size: 22px; margin: 0 0 12px; }
.cookie-dlg p { margin: 0 0 18px; font-size: 15px; line-height: 1.65; color: #555; }
.cookie-dlg .opt { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; border-top: 1px solid #eef0f4; cursor: pointer; min-height: 44px; }
.cookie-dlg .opt input { width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; }
.cookie-dlg .opt b { display: block; font-size: 15px; }
.cookie-dlg .opt small { display: block; font-size: 13px; color: #777; line-height: 1.5; margin-top: 2px; }
.cookie-dlg .acts { margin-top: 20px; }
.lnk-light { background: none; border: 0; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; min-height: 44px; padding: 0 6px; }

/* language switcher and the Google Translate widget it drives */
.lang { position: relative; display: inline-flex; }
.lang-btn { display: inline-flex; align-items: center; gap: 8px; background: none; border: 0; color: inherit; font: inherit; cursor: pointer; min-height: 44px; padding: 0 4px; }
.lang-menu { position: absolute; top: 100%; left: 0; margin: 6px 0 0; padding: 8px 0; list-style: none; background: #fff; border: 1px solid #e8ebf0; box-shadow: 0 10px 30px rgba(0, 0, 0, .12); min-width: 180px; z-index: 40; max-height: 60vh; overflow: auto; }
.lang-menu[hidden] { display: none; }
.lang-menu button { display: block; width: 100%; text-align: left; background: none; border: 0; padding: 0 18px; min-height: 44px; font: 15px Lato, sans-serif; color: #2d2d2d; cursor: pointer; }
.lang-menu button:hover, .lang-menu button.on { background: #f5f7fb; color: var(--brand-primary); }
.goog-te-banner-frame, .goog-te-balloon-frame, #goog-gt-tt, .goog-tooltip, .goog-te-gadget, .goog-te-spinner-pos, .skiptranslate iframe, .VIpgJd-ZVi9od-ORHb-OEVmcd, .VIpgJd-ZVi9od-aZ2wEe-wOHMyf, .VIpgJd-ZVi9od-aZ2wEe-OiiCO { display: none !important; visibility: hidden !important; }
body { top: 0 !important; position: static !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
font[style] { background: none !important; box-shadow: none !important; }

/* mobile menu toggle; the panel is display: contents on wide screens so the
   header keeps its original flex layout */
.hmenu { display: contents; }
.nav-toggle, .side-toggle { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 44px; border: 1px solid #dfe3ea; border-radius: 3px; background: #fff; cursor: pointer; padding: 0; flex: 0 0 auto; }
.nav-toggle span, .side-toggle span { display: block; width: 20px; height: 2px; background: #2d2d2d; border-radius: 1px; transition: transform .25s ease, opacity .2s ease; }
.hero-hdr .nav-toggle { background: rgba(255, 255, 255, .92); }
.side-toggle { border-color: rgba(255, 255, 255, .35); background: transparent; margin-left: auto; }
.side-toggle span { background: #fff; }
.nav-toggle[aria-expanded="true"] span:nth-child(1), .side-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2), .side-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3), .side-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.sub-toggle { display: none; }

/* header dropdowns (menus from the CMS) */
.nav-item { position: relative; display: inline-flex; align-items: center; }
.nav-item > a svg { transition: transform .25s ease; }
.nav-item.open > a svg { transform: rotate(180deg); }
.sub { position: absolute; top: 100%; left: -18px; margin: 0; padding: 10px 0; list-style: none; background: #fff; border: 1px solid #e8ebf0; box-shadow: 0 10px 30px rgba(0, 0, 0, .12); min-width: 220px; z-index: 30; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
.nav-item:hover > .sub, .nav-item:focus-within > .sub, .nav-item.open > .sub { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.sub li a { display: flex; align-items: center; min-height: 44px; padding: 0 20px; font-size: 15px; color: #2d2d2d !important; white-space: nowrap; }
.sub li a:hover { color: var(--brand-primary) !important; background: #f5f7fb; }
.hero-hdr .sub li a { color: #2d2d2d !important; }

/* add to cart button states */
/* cart button outside the shop pages (checkout) - same declaration as the shop stylesheet */
.cart { display: inline-flex; align-items: center; gap: 8px; background: #ec4c60; color: #fff; border: 0; border-radius: 4px; height: 46px; padding: 0 18px; font-size: 15px; cursor: pointer; }
.cart .ic { display: inline-flex; align-items: center; }
.cart .ic-check, .cart .ic-spin { display: none; }
.cart.is-added .ic-cart { display: none; }
.cart.is-added .ic-check { display: inline-flex; }
.cart.is-loading .ic-cart, .cart.is-loading .ic-check { display: none; }
.cart.is-loading .ic-spin { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; border-radius: 50%; animation: fhSpin .6s linear infinite; }
.cart:disabled { cursor: progress; opacity: .85; transform: none; }
.cart.is-added { background: #3f9d63; }
@keyframes fhSpin { to { transform: rotate(360deg); } }
.hcart b.bump { animation: fhBump .4s cubic-bezier(.2, .7, .2, 1); }
@keyframes fhBump { 0% { transform: scale(1); } 40% { transform: scale(1.45); } 100% { transform: scale(1); } }

/* hero typing cursor */
.type-cursor { display: inline-block; width: 3px; height: .85em; background: #fff; margin-left: 4px; vertical-align: -0.08em; animation: fhBlink 1s steps(2, start) infinite; }
.type-cursor[hidden] { display: none; }
@keyframes fhBlink { to { visibility: hidden; } }

/* avatar cropper */
.avatar-edit { display: flex; align-items: flex-start; gap: 18px; margin-bottom: 22px; flex-wrap: wrap; }
.avatar-edit .crop { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; margin-top: 14px; }
.avatar-edit .crop[hidden] { display: none; }
.avatar-edit canvas { width: 240px; height: 240px; border-radius: 50%; border: 2px solid #dfe3ea; background: #f5f7fb; cursor: grab; touch-action: none; display: block; }
.avatar-edit canvas:active { cursor: grabbing; }
.avatar-edit input[type="range"] { width: 220px; height: 44px; }

/* contact page */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 30px; align-items: start; }
.contact-side { display: flex; flex-direction: column; gap: 30px; }
.contact-list { list-style: none; margin: 0; padding: 0; font-size: 15px; line-height: 1.7; }
.contact-list li { display: flex; gap: 14px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid #eef0f4; }
.contact-list li:last-child { border-bottom: 0; }
.contact-list svg { flex: 0 0 auto; margin-top: 4px; color: var(--brand-primary); }
.map-card { padding: 0; overflow: hidden; }
.map-card iframe { display: block; width: 100%; height: 320px; border: 0; }
.map-blocked { padding: 30px 24px; text-align: center; font-size: 15px; line-height: 1.7; color: #555; }
.hp { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .cookie-bar { left: 0; right: 0; bottom: 0; border-radius: 0; padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .cookie-bar, .sub, .nav-item > a svg, .cart .ic-spin, .hcart b.bump, .type-cursor, .hmenu, .nav-toggle span, .side-toggle span, .sub-toggle svg { animation: none !important; transition: none !important; }
}

/* rented and sold listings */
.badge.s.off { background: #8a8f99; }
.mini-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin: 0; }
.mini-facts div { background: #f5f7fb; padding: 14px 16px; }
.mini-facts dt { font-size: 13px; color: #777; margin-bottom: 4px; }
.mini-facts dd { margin: 0; font-family: Montserrat, sans-serif; font-weight: 600; font-size: 16px; color: #2d2d2d; }

/* checkout */
.co-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 30px; align-items: start; }
.co-main { display: flex; flex-direction: column; gap: 30px; min-width: 0; }
.co .pm { display: flex; justify-content: space-between; align-items: center; border: 1px solid #e3e6ec; padding: 18px 16px; margin-bottom: 22px; font-size: 15px; }
.co .pm b { font-family: Montserrat, sans-serif; font-size: 17px; font-weight: 600; color: #2d2d2d; }
.co .method-panel { margin-top: -22px; }
.co-sum .line span:last-child { text-align: right; }
@media (max-width: 900px) {
  .co-grid { grid-template-columns: 1fr; }
}

/* header logo variants: the dark-background version shows on the dark mobile header */
.logo .logo-dark { display: none; }
.logo .logo-text { color: #2d2d2d; }

/* language menu: searchable */
.lang-menu { min-width: 240px; padding: 8px; }
.lang-menu ul { list-style: none; margin: 0; padding: 0; max-height: 50vh; overflow: auto; }
.lang-search input { width: 100%; height: 44px; border: 1px solid #dfe3ea; border-radius: 3px; padding: 0 12px; font: 15px Lato, sans-serif; color: #2d2d2d; margin-bottom: 6px; }
.lang-empty { padding: 10px 12px; margin: 0; }
.lang-menu li[hidden] { display: none; }

/* dashboard and admin: the footer stays at the bottom even when the page is short */
.dash-main, .adm-content { flex: 1 0 auto; }
.dfoot { margin-top: auto; }

/* email verification reminder in the dashboard */
.verify-note { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin: 30px 30px 0; }

/* booking progress: book, pay, verify, confirmed */
.bprog { display: flex; list-style: none; margin: 0 0 22px; padding: 0; }
.bprog li { flex: 1; position: relative; text-align: center; font-size: 13px; line-height: 1.3; color: #777; padding: 32px 4px 0; }
.bprog li .dot { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 24px; height: 24px; border-radius: 50%; background: #e8ebf0; color: #555; font-size: 12px; line-height: 24px; font-weight: 700; box-sizing: border-box; }
.bprog li::before { content: ''; position: absolute; top: 11px; left: -50%; width: 100%; height: 2px; background: #e8ebf0; }
.bprog li:first-child::before { display: none; }
.bprog li.done { color: #2d2d2d; }
.bprog li.done .dot, .bprog li.done::before { background: var(--brand-primary); color: #fff; }
.bprog li.now .dot { background: #fff; color: var(--brand-primary); border: 2px solid var(--brand-primary); line-height: 20px; box-shadow: 0 0 0 4px rgba(236, 76, 96, .15); }
.bprog li.now { color: #2d2d2d; font-weight: 700; }
.bprog li.skip { opacity: .55; }
.bprog li small { display: block; font-size: 11px; font-weight: 400; }
.bprog.is-cancelled li .dot, .bprog.is-cancelled li::before { background: #ccc; color: #fff; }
.bprog.sm { margin: 8px 0 0; max-width: 260px; }
.bprog.sm li { font-size: 10px; padding-top: 20px; }
.bprog.sm li .dot { width: 16px; height: 16px; line-height: 16px; font-size: 9px; }
.bprog.sm li.now .dot { line-height: 12px; }
.bprog.sm li::before { top: 7px; }
.bprog.sm li small { display: none; }

/* fee notice shown before booking and before paying */
.fee-note { border: 1px solid #e8ebf0; background: #f5f7fb; padding: 14px 16px; margin: 0 0 22px; font-size: 14px; line-height: 1.6; color: #555; }
.fee-note b { display: block; color: #2d2d2d; font-size: 16px; margin-bottom: 6px; }
.fee-note p { margin: 0 0 6px; }
.fee-note p:last-child { margin-bottom: 0; }

/* payment state pills */
.pill-s.st-pay-none { background: #eef0f4; color: #555; }
.pill-s.st-pay-unpaid, .pill-s.st-awaiting_payment { background: #fdecc8; color: #8a5a00; }
.pill-s.st-pay-submitted { background: #dbe9fb; color: #1d4f91; }
.pill-s.st-pay-rejected, .pill-s.st-refund_due { background: #fde0e4; color: #a3242f; }
.pill-s.st-pay-paid { background: #d8f3e3; color: #1e7a45; }
.pill-s.st-pay-refund_due { background: #fde0e4; color: #a3242f; }
.pill-s.st-pay-refunded, .pill-s.st-refunded { background: #e8ebf0; color: #444; }

/* empty states */
.empty-state { text-align: center; padding: 28px 16px; color: #555; }
.empty-state b { display: block; font-size: 18px; color: #2d2d2d; margin-bottom: 8px; }
.empty-state p { margin: 0 auto 18px; max-width: 420px; line-height: 1.6; }

/* busy buttons while a form is on its way */
@keyframes fhBusy { to { transform: rotate(360deg); } }
.is-busy { position: relative; pointer-events: none; opacity: .8; }
.is-busy::after { content: ''; position: absolute; right: 12px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; border-radius: 50%; animation: fhBusy .7s linear infinite; }
.btn-line.is-busy::after, .lnk-red.is-busy::after, .lnk.is-busy::after { border-color: rgba(45, 45, 45, .25); border-top-color: #2d2d2d; }

/* live validation */
.inp-invalid { border-color: var(--brand-primary) !important; }
.err.live { display: block; }
@media (prefers-reduced-motion: reduce) { .is-busy::after { animation: none; } }