/* =========================================================
   IRISMA MOBILE FINAL LOCKED 9.2
   Approved mobile design — mobile only.
   Load AFTER public/css/irisma-hero.css
   ========================================================= */

@media (max-width: 760px) {
  :root {
    --irisma-mobile-black: #070707;
    --irisma-mobile-gold: #c99a43;
    --irisma-mobile-gold-light: #f3d27e;
    --irisma-mobile-white: #ffffff;
  }

  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    background: var(--irisma-mobile-black) !important;
  }

  body.irisma-mobile-final-92 {
    padding-top: 0 !important;
  }

  /* Hide the previous top bar only when the final mobile bars are ready. */
  body.irisma-mobile-final-92 #irisma-global-topbar,
  body.irisma-mobile-final-92 .irisma-global-topbar {
    display: none !important;
  }

  /* =======================================================
     TOP BAR 1 — CONTACT
     ======================================================= */

  #irisma-mobile-contact-92 {
    position: relative !important;
    z-index: 2147482000 !important;
    display: grid !important;
    grid-template-columns: 1.2fr .85fr 1.15fr !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border-bottom: 1px solid rgba(201,154,67,.30) !important;
  }

  #irisma-mobile-contact-92 a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 3px !important;
    color: #171717 !important;
    text-decoration: none !important;
    font: 900 10.5px/1 Arial, Helvetica, sans-serif !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  #irisma-mobile-contact-92 svg {
    flex: 0 0 17px !important;
    width: 17px !important;
    height: 17px !important;
    fill: none !important;
    stroke: var(--irisma-mobile-gold) !important;
    stroke-width: 1.9 !important;
  }

  /* =======================================================
     TOP BAR 2 — OFFICIAL WEBSITE
     Same total width as the first bar.
     ======================================================= */

  #irisma-mobile-official-92 {
    position: relative !important;
    z-index: 2147481990 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 132px !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 7px 13px !important;
    box-sizing: border-box !important;
    background:
      linear-gradient(90deg,#e1b85f 0%,#f3d27e 46%,#c69038 100%) !important;
    border-bottom: 1px solid rgba(0,0,0,.16) !important;
  }

  #irisma-mobile-official-92 span {
    min-width: 0 !important;
    color: #15100a !important;
    font: 800 14px/1.15 Arial, Helvetica, sans-serif !important;
    white-space: nowrap !important;
  }

  #irisma-mobile-official-92 a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 41px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(243,210,126,.42) !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg,#151515,#030303) !important;
    color: var(--irisma-mobile-gold-light) !important;
    text-decoration: none !important;
    font: 900 14px/1 Arial, Helvetica, sans-serif !important;
    letter-spacing: .04em !important;
    box-shadow: 0 7px 18px rgba(0,0,0,.22) !important;
  }

  /* =======================================================
     HEADER OVER THE SLIDESHOW
     No separate black header background.
     ======================================================= */

  body.irisma-mobile-final-92:has(#irisma-custom-hero) header,
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header.is-sticky,
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header[class*="sticky"] {
    position: absolute !important;
    top: 50px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10040 !important;
    display: flex !important;
    align-items: flex-start !important;
    width: 100% !important;
    min-height: 132px !important;
    height: 132px !important;
    margin: 0 !important;
    padding: 9px 20px 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    border: 0 !important;
    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,.27) 0%,
        rgba(0,0,0,.08) 72%,
        rgba(0,0,0,0) 100%
      ) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  body.irisma-mobile-final-92:has(#irisma-custom-hero) header > div,
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header [class*="container"],
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header [class*="wrapper"] {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Smaller logo */
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header img[alt*="Irisma" i],
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header img[src*="logo" i],
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header img[src*="irisma" i] {
    width: auto !important;
    max-width: 142px !important;
    height: auto !important;
    max-height: 106px !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter:
      brightness(1.40)
      saturate(1.34)
      contrast(1.06)
      drop-shadow(0 5px 15px rgba(0,0,0,.62)) !important;
  }

  /* Hamburger button: black background with gold lines */
  body.irisma-mobile-final-92 header [data-irisma-hamburger="92"],
  body.irisma-mobile-final-92 header button[aria-label*="menu" i],
  body.irisma-mobile-final-92 header button[aria-label*="navigation" i],
  body.irisma-mobile-final-92 header [class*="hamburger"],
  body.irisma-mobile-final-92 header [class*="menuButton"],
  body.irisma-mobile-final-92 header [class*="menu-button"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 7px 0 0 auto !important;
    padding: 0 !important;
    border: 1px solid rgba(201,154,67,.58) !important;
    border-radius: 15px !important;
    background: #050505 !important;
    color: var(--irisma-mobile-gold-light) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.26) !important;
  }

  body.irisma-mobile-final-92 header [data-irisma-hamburger="92"] *,
  body.irisma-mobile-final-92 header button[aria-label*="menu" i] *,
  body.irisma-mobile-final-92 header button[aria-label*="navigation" i] * {
    color: var(--irisma-mobile-gold-light) !important;
    stroke: var(--irisma-mobile-gold-light) !important;
    fill: var(--irisma-mobile-gold-light) !important;
    border-color: var(--irisma-mobile-gold-light) !important;
  }

  /* =======================================================
     MOBILE MENU / DRAWER — WHITE ON ALL PAGES
     ======================================================= */

  body.irisma-mobile-final-92
  :is(
    [role="menu"],
    [role="dialog"],
    [class*="drawer"],
    [class*="Drawer"],
    [class*="mobileMenu"],
    [class*="MobileMenu"],
    [class*="menuPanel"],
    [class*="MenuPanel"],
    [class*="navigation-menu"],
    [class*="offcanvas"],
    [class*="Offcanvas"]
  ) {
    background: #fff !important;
    color: #111 !important;
  }

  body.irisma-mobile-final-92
  :is(
    [role="menu"],
    [role="dialog"],
    [class*="drawer"],
    [class*="Drawer"],
    [class*="mobileMenu"],
    [class*="MobileMenu"],
    [class*="menuPanel"],
    [class*="MenuPanel"],
    [class*="navigation-menu"],
    [class*="offcanvas"],
    [class*="Offcanvas"]
  )
  :is(a,button,span,p,li,strong) {
    color: #111 !important;
  }

  body.irisma-mobile-final-92
  :is(
    [role="menu"],
    [role="dialog"],
    [class*="drawer"],
    [class*="Drawer"],
    [class*="mobileMenu"],
    [class*="MobileMenu"],
    [class*="menuPanel"],
    [class*="MenuPanel"],
    [class*="navigation-menu"],
    [class*="offcanvas"],
    [class*="Offcanvas"]
  )
  svg {
    color: #111 !important;
    stroke: #111 !important;
    fill: #111 !important;
  }

  /* =======================================================
     HERO
     ======================================================= */

  body.irisma-mobile-final-92 main,
  body.irisma-mobile-final-92 [role="main"],
  body.irisma-mobile-final-92 main > :first-child,
  body.irisma-mobile-final-92 [role="main"] > :first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  #irisma-custom-hero {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 100svh !important;
    height: 100svh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #080808 !important;
    isolation: isolate !important;
  }

  #irisma-custom-hero .irisma-custom-slides,
  #irisma-custom-hero .irisma-custom-slide {
    width: 100% !important;
    height: 100% !important;
  }

  #irisma-custom-hero .irisma-custom-slide {
    position: absolute !important;
    inset: 0 !important;
    background-size: cover !important;
    background-position: center center !important;
    filter: brightness(.80) saturate(1.05) contrast(1.03) !important;
  }

  #irisma-custom-hero .irisma-custom-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,.01) 0%,
        rgba(0,0,0,.04) 20%,
        rgba(0,0,0,.18) 53%,
        rgba(0,0,0,.52) 80%,
        rgba(0,0,0,.90) 100%
      ) !important;
  }

  #irisma-custom-hero .irisma-custom-content {
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  /* Titles higher and centered */
  #irisma-custom-hero .irisma-custom-copy {
    position: absolute !important;
    top: 34.5% !important;
    left: 50% !important;
    width: calc(100% - 34px) !important;
    max-width: 430px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%,-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-align: center !important;
  }

  #irisma-custom-hero .irisma-custom-kicker,
  #irisma-custom-hero .irisma-custom-eyebrow {
    display: block !important;
    margin: 0 0 13px !important;
    color: var(--irisma-mobile-gold-light) !important;
    font: 900 13px/1.2 Arial, Helvetica, sans-serif !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    text-align: center !important;
    text-shadow: 0 3px 15px rgba(0,0,0,.78) !important;
  }

  #irisma-custom-hero .irisma-custom-title {
    display: block !important;
    width: 100% !important;
    max-width: 430px !important;
    margin: 0 auto !important;
    color: #fff !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(44px,12.6vw,59px) !important;
    font-weight: 500 !important;
    line-height: .97 !important;
    letter-spacing: -.05em !important;
    text-align: center !important;
    text-wrap: balance !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: 0 5px 22px rgba(0,0,0,.90) !important;
  }

  #irisma-custom-hero .irisma-custom-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 430px !important;
    margin: 16px auto 0 !important;
    color: var(--irisma-mobile-gold-light) !important;
    font: 800 12.5px/1.42 Arial, Helvetica, sans-serif !important;
    letter-spacing: .012em !important;
    text-align: center !important;
    text-shadow: 0 3px 14px rgba(0,0,0,.84) !important;
  }

  #irisma-custom-hero .irisma-custom-description,
  #irisma-custom-hero .irisma-custom-dots {
    display: none !important;
  }

  /* =======================================================
     BOOKING SEARCH AT THE BOTTOM OF THE SCREEN
     ======================================================= */

  #irisma-custom-hero > #irisma-custom-search,
  #irisma-custom-hero > .irisma-booking-bar.irisma-booking-bar-fixed {
    position: absolute !important;
    left: 16px !important;
    right: 16px !important;
    top: auto !important;
    bottom: 14px !important;
    z-index: 100 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: auto !important;
    max-width: none !important;
    min-height: 284px !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
    overflow: visible !important;
    border: 2px solid var(--irisma-mobile-gold) !important;
    border-radius: 22px !important;
    background:
      radial-gradient(circle at 88% 0%,rgba(201,154,67,.07),transparent 32%),
      linear-gradient(145deg,#141414 0%,#050505 100%) !important;
    box-shadow:
      0 22px 52px rgba(0,0,0,.52),
      inset 0 1px 0 rgba(255,255,255,.04) !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 101px !important;
    height: 101px !important;
    padding: 17px 20px !important;
    box-sizing: border-box !important;
    border-right: 1px solid rgba(201,154,67,.58) !important;
    border-bottom: 1px solid rgba(201,154,67,.58) !important;
    background: transparent !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field:nth-child(2) {
    border-right: 0 !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field:nth-child(3) {
    grid-column: 1 / -1 !important;
    min-height: 82px !important;
    height: 82px !important;
    border-right: 0 !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field-label {
    display: block !important;
    margin: 0 0 11px !important;
    color: var(--irisma-mobile-gold-light) !important;
    font: 900 11.5px/1 Arial, Helvetica, sans-serif !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-date-button,
  #irisma-custom-hero > #irisma-custom-search .irisma-date-input,
  #irisma-custom-hero > #irisma-custom-search .irisma-guests-button {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 33px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font: 650 16px/1.2 Arial, Helvetica, sans-serif !important;
    text-align: left !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-date-icon {
    color: #fff !important;
    font-size: 18px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-search-button {
    grid-column: 1 / -1 !important;
    min-height: 68px !important;
    height: 68px !important;
    margin: 9px 11px 11px !important;
    padding: 0 13px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background:
      linear-gradient(135deg,#f5d786 0%,#c9963d 100%) !important;
    color: #171008 !important;
    font: 950 15px/1 Arial, Helvetica, sans-serif !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.65),
      0 10px 24px rgba(0,0,0,.24) !important;
  }

  .irisma-booking-placeholder {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
  }

  /* Calendar and guests open as safe bottom sheets. */
  #irisma-custom-hero > #irisma-custom-search .irisma-date-popover,
  #irisma-custom-hero > #irisma-custom-search .irisma-guests-popover {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: 10px !important;
    z-index: 2147483647 !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 20px) !important;
    margin: 0 !important;
    padding: 14px !important;
    overflow-y: auto !important;
    transform: none !important;
    box-sizing: border-box !important;
    border: 1px solid var(--irisma-mobile-gold) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg,#18140e,#070706) !important;
    box-shadow: 0 25px 70px rgba(0,0,0,.72) !important;
  }

  .irisma-date-popover[hidden],
  .irisma-guests-popover[hidden] {
    display: none !important;
  }

  /* Floating desktop offer card is not used on mobile. */
  #irisma-offer-card {
    display: none !important;
  }
}

@media (max-width: 390px) {
  #irisma-mobile-contact-92 a {
    font-size: 8.7px !important;
  }

  #irisma-mobile-official-92 {
    grid-template-columns: minmax(0,1fr) 116px !important;
  }

  #irisma-mobile-official-92 span {
    font-size: 12px !important;
  }

  #irisma-custom-hero .irisma-custom-title {
    font-size: 43px !important;
  }

  #irisma-custom-hero > #irisma-custom-search,
  #irisma-custom-hero > .irisma-booking-bar.irisma-booking-bar-fixed {
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
  }
}


/* =========================================================
   IRISMA MOBILE FINAL 9.2.5 — HAMBURGER LOCK
   ========================================================= */
@media (max-width: 760px) {
  button[data-testid="sliding-menu-hamburger-button"] {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 7px 0 0 auto !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1.5px solid #C9A96A !important;
    border-radius: 16px !important;
    background: #050505 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.30) !important;
  }

  button[data-testid="sliding-menu-hamburger-button"] svg,
  button[data-testid="sliding-menu-hamburger-button"] > span:not(.irisma-hamburger-lines-92) {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  button[data-testid="sliding-menu-hamburger-button"] .irisma-hamburger-lines-92 {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
  }

  button[data-testid="sliding-menu-hamburger-button"] .irisma-hamburger-lines-92 i {
    display: block !important;
    width: 23px !important;
    height: 2.5px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #F3D27E !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}


/* =========================================================
   IRISMA MOBILE FINAL 9.2.6
   FINAL HAMBURGER + COMPACT BOOKING SEARCH
   ========================================================= */
@media (max-width: 760px) {

  /* -------------------------------------------------------
     MENU BUTTON: THREE LINES DRAWN DIRECTLY WITH CSS
     Independent of Lodgify SVG / React re-rendering.
     ------------------------------------------------------- */
  button[data-testid="sliding-menu-hamburger-button"] {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1.5px solid #C9A96A !important;
    border-radius: 16px !important;
    background: #050505 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.30) !important;
  }

  button[data-testid="sliding-menu-hamburger-button"] > * {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  button[data-testid="sliding-menu-hamburger-button"]::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 24px !important;
    height: 18px !important;
    transform: translate(-50%, -50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    background:
      linear-gradient(#F3D27E, #F3D27E) top center / 24px 2.5px no-repeat,
      linear-gradient(#F3D27E, #F3D27E) center center / 24px 2.5px no-repeat,
      linear-gradient(#F3D27E, #F3D27E) bottom center / 24px 2.5px no-repeat !important;
    border-radius: 999px !important;
  }

  /* -------------------------------------------------------
     COMPACT BOOKING SEARCH
     First row: Check-in | Check-out | Guests
     Second row: Search
     ------------------------------------------------------- */
  #irisma-custom-hero > #irisma-custom-search,
  #irisma-custom-hero > .irisma-booking-bar.irisma-booking-bar-fixed {
    left: 26px !important;
    right: 26px !important;
    bottom: 10px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: 72px 52px !important;
    min-height: 124px !important;
    height: 124px !important;
    border-radius: 18px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field {
    min-height: 72px !important;
    height: 72px !important;
    padding: 10px 11px !important;
    border-bottom: 1px solid rgba(201,154,67,.58) !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field:nth-child(2) {
    border-right: 1px solid rgba(201,154,67,.58) !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field:nth-child(3) {
    grid-column: auto !important;
    min-height: 72px !important;
    height: 72px !important;
    border-right: 0 !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field-label {
    margin-bottom: 7px !important;
    font-size: 9.5px !important;
    letter-spacing: .055em !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-date-button,
  #irisma-custom-hero > #irisma-custom-search .irisma-date-input,
  #irisma-custom-hero > #irisma-custom-search .irisma-guests-button {
    min-height: 25px !important;
    font-size: 12.5px !important;
    line-height: 1.1 !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-date-icon {
    font-size: 15px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-search-button {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 4px 7px 6px !important;
    padding: 0 10px !important;
    border-radius: 11px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 390px) {
  #irisma-custom-hero > #irisma-custom-search,
  #irisma-custom-hero > .irisma-booking-bar.irisma-booking-bar-fixed {
    left: 18px !important;
    right: 18px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-field-label {
    font-size: 8.8px !important;
  }

  #irisma-custom-hero > #irisma-custom-search .irisma-date-button,
  #irisma-custom-hero > #irisma-custom-search .irisma-date-input,
  #irisma-custom-hero > #irisma-custom-search .irisma-guests-button {
    font-size: 11.5px !important;
  }
}


/* =========================================================
   IRISMA MOBILE FINAL 9.2.7
   GLOBAL FIXED SEARCH + STABLE MENU + GOLD CONTENTS
   ========================================================= */

@media (max-width: 760px) {
  :root {
    --irisma-content-gold: #FFF3CF;
    --irisma-content-gold-soft: #FFF8E5;
  }

  /* -------------------------------------------------------
     ALL INNER-PAGE CONTENTS: LIGHT GOLD
     The hero, popup and fixed booking bar keep their own design.
     ------------------------------------------------------- */
  body.irisma-mobile-final-92,
  body.irisma-mobile-final-92 main,
  body.irisma-mobile-final-92 [role="main"] {
    background-color: var(--irisma-content-gold) !important;
  }

  body.irisma-mobile-final-92 main > section:not(#irisma-custom-hero),
  body.irisma-mobile-final-92 main > div:not(#irisma-custom-hero),
  body.irisma-mobile-final-92 [role="main"] > section:not(#irisma-custom-hero),
  body.irisma-mobile-final-92 [role="main"] > div:not(#irisma-custom-hero),
  body.irisma-mobile-final-92
  [data-testid^="component-resolver-"]:not([data-testid*="HomeHero"]) {
    background-color: var(--irisma-content-gold) !important;
  }

  body.irisma-mobile-final-92
  :is(article,[class*="content"],[class*="Content"])
  :is(p,h1,h2,h3,h4,h5,h6,li) {
    color: #21180C;
  }

  /* -------------------------------------------------------
     LOGO + MENU ARE NEVER FIXED WHILE SCROLLING
     Home: absolute over hero.
     Inner pages: normal document flow.
     ------------------------------------------------------- */
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header,
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header.is-sticky,
  body.irisma-mobile-final-92:has(#irisma-custom-hero)
  header[class*="sticky"] {
    position: absolute !important;
  }

  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero))
  header,
  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero))
  header.is-sticky,
  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero))
  header[class*="sticky"] {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }

  /* -------------------------------------------------------
     REAL LODGIFY MENU BUTTON
     JavaScript inserts the custom three-line element and
     restores it if Lodgify/React redraws the button.
     ------------------------------------------------------- */
  button[data-testid="sliding-menu-hamburger-button"] {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 7px 0 0 auto !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1.5px solid #C9A96A !important;
    border-radius: 16px !important;
    background: #050505 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.30) !important;
  }

  button[data-testid="sliding-menu-hamburger-button"]
  > :not(.irisma-hamburger-lines-927) {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  button[data-testid="sliding-menu-hamburger-button"]
  .irisma-hamburger-lines-927 {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
  }

  button[data-testid="sliding-menu-hamburger-button"]
  .irisma-hamburger-lines-927 i {
    display: block !important;
    width: 25px !important;
    height: 3px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #F3D27E !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* -------------------------------------------------------
     BOOKING SEARCH: FIXED ON EVERY PAGE
     One compact row and slightly above the screen bottom.
     ------------------------------------------------------- */
  body.irisma-mobile-final-92 #irisma-custom-search,
  body.irisma-mobile-final-92
  #irisma-custom-search.irisma-booking-bar-fixed,
  body.irisma-mobile-final-92
  #irisma-global-booking-shell #irisma-custom-search {
    position: fixed !important;
    left: 18px !important;
    right: 18px !important;
    top: auto !important;
    bottom: max(12px, calc(env(safe-area-inset-bottom) + 4px)) !important;
    z-index: 2147483000 !important;

    display: grid !important;
    grid-template-columns:
      minmax(0,1.04fr)
      minmax(0,1.04fr)
      minmax(0,.88fr)
      minmax(78px,.70fr) !important;
    grid-template-rows: 86px !important;

    width: auto !important;
    max-width: none !important;
    min-height: 86px !important;
    height: 86px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    overflow: visible !important;

    border: 1.5px solid #C99A43 !important;
    border-radius: 17px !important;
    background: linear-gradient(145deg,#151515 0%,#050505 100%) !important;
    box-shadow:
      0 18px 48px rgba(0,0,0,.66),
      0 0 14px rgba(201,154,67,.18) !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-field {
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 86px !important;
    height: 86px !important;
    margin: 0 !important;
    padding: 10px 9px !important;
    box-sizing: border-box !important;
    border-right: 1px solid rgba(201,154,67,.55) !important;
    border-bottom: 0 !important;
    background: transparent !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-field:nth-child(1) {
    grid-column: 1 !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-field:nth-child(2) {
    grid-column: 2 !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-field:nth-child(3) {
    grid-column: 3 !important;
    border-right: 1px solid rgba(201,154,67,.55) !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search .irisma-field-label {
    margin: 0 0 8px !important;
    color: #F3D27E !important;
    font: 900 8.6px/1 Arial,Helvetica,sans-serif !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search
  :is(.irisma-date-button,.irisma-date-input,.irisma-guests-button) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font: 700 11px/1.12 Arial,Helvetica,sans-serif !important;
    text-align: left !important;
    white-space: nowrap !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search .irisma-date-icon {
    margin-left: 4px !important;
    font-size: 14px !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-search-button {
    grid-column: 4 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 72px !important;
    height: auto !important;
    margin: 6px !important;
    padding: 0 7px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg,#F5D786 0%,#C9963D 100%) !important;
    color: #171008 !important;
    font: 950 11px/1.05 Arial,Helvetica,sans-serif !important;
    text-transform: uppercase !important;
  }

  /* Date and guest panels open immediately above the fixed bar. */
  body.irisma-mobile-final-92
  #irisma-custom-search
  :is(.irisma-date-popover,.irisma-guests-popover) {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: 108px !important;
    z-index: 2147483647 !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 126px) !important;
    overflow-y: auto !important;
  }

  /* Reserve space so page content is not hidden behind the fixed search. */
  body.irisma-mobile-final-92 {
    padding-bottom: 112px !important;
  }

  /* Keep popup immediately above the new compact search bar. */
  #irisma-mobile-offer-v72 {
    max-height: calc(100dvh - 126px) !important;
  }
}

@media (max-width: 390px) {
  body.irisma-mobile-final-92 #irisma-custom-search,
  body.irisma-mobile-final-92
  #irisma-custom-search.irisma-booking-bar-fixed {
    left: 10px !important;
    right: 10px !important;
    grid-template-columns:
      minmax(0,1fr)
      minmax(0,1fr)
      minmax(0,.82fr)
      minmax(72px,.67fr) !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-field {
    padding-left: 7px !important;
    padding-right: 7px !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search .irisma-field-label {
    font-size: 8px !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search
  :is(.irisma-date-button,.irisma-date-input,.irisma-guests-button) {
    font-size: 10px !important;
  }

  body.irisma-mobile-final-92
  #irisma-custom-search > .irisma-search-button {
    font-size: 10px !important;
  }
}


/* =========================================================
   IRISMA 9.2.7 CLEAN PATCH
   - remove Official Website / Book Now bar
   - logo and menu scroll with the page
   ========================================================= */
@media (max-width: 760px) {
  #irisma-mobile-official-92 {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* Home: header sits over the hero but is part of the page, not fixed. */
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header,
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header.is-sticky,
  body.irisma-mobile-final-92:has(#irisma-custom-hero) header[class*="sticky"] {
    position: absolute !important;
    top: 50px !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
  }

  /* Inner pages: normal document flow, never fixed or sticky. */
  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero)) header,
  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero)) header.is-sticky,
  body.irisma-mobile-final-92:not(:has(#irisma-custom-hero)) header[class*="sticky"] {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
}

/* =========================================================
   IRISMA DESKTOP CONTENTS — LIGHT GOLD
   Matches the approved mobile content background.
   Applies only to desktop/tablet widths above 760px.
   Hero, header, popup, booking search and overlays keep
   their own existing design.
   ========================================================= */
@media (min-width: 761px) {
  :root {
    --irisma-content-gold: #FFF3CF;
    --irisma-content-gold-soft: #FFF8E5;
  }

  html,
  body,
  main,
  [role="main"] {
    background-color: var(--irisma-content-gold) !important;
  }

  main > section:not(#irisma-custom-hero),
  main > div:not(#irisma-custom-hero),
  [role="main"] > section:not(#irisma-custom-hero),
  [role="main"] > div:not(#irisma-custom-hero),
  [data-testid^="component-resolver-"]:not([data-testid*="HomeHero"]) {
    background-color: var(--irisma-content-gold) !important;
  }

  /* Common Lodgify content wrappers that otherwise remain white. */
  main
  :is(
    article,
    [class*="content"],
    [class*="Content"],
    [class*="section"],
    [class*="Section"],
    [class*="container"],
    [class*="Container"]
  ):not(
    #irisma-custom-hero,
    #irisma-custom-hero *,
    #irisma-custom-search,
    #irisma-custom-search *,
    #irisma-compact-offer-v80,
    #irisma-compact-offer-v80 *,
    header,
    header *,
    footer,
    footer *,
    [role="dialog"],
    [role="dialog"] *
  ) {
    background-color: transparent !important;
  }

  main
  :is(article,[class*="content"],[class*="Content"])
  :is(p,h1,h2,h3,h4,h5,h6,li) {
    color: #21180C;
  }

  /* Explicit exclusions: preserve custom components exactly as they are. */
  #irisma-custom-hero,
  #irisma-custom-hero *,
  #irisma-custom-search,
  #irisma-custom-search *,
  #irisma-compact-offer-v80,
  #irisma-compact-offer-v80 *,
  header,
  header *,
  footer,
  footer *,
  [role="dialog"],
  [role="dialog"] * {
    background-color: unset;
  }
}

/* =========================================================
   IRISMA DESKTOP HERO — FULL PAGE WIDTH
   Makes the slideshow span the same full width as the page.
   Desktop only; mobile remains unchanged.
   ========================================================= */
@media (min-width: 761px) {
  html,
  body {
    overflow-x: clip !important;
  }

  #irisma-custom-hero {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    border-radius: 0 !important;
  }

  #irisma-custom-hero,
  #irisma-custom-hero .irisma-custom-slides,
  #irisma-custom-hero .irisma-custom-slide {
    box-sizing: border-box !important;
  }

  #irisma-custom-hero .irisma-custom-slides,
  #irisma-custom-hero .irisma-custom-slide {
    width: 100% !important;
    max-width: none !important;
  }

  main > :has(> #irisma-custom-hero),
  [role="main"] > :has(> #irisma-custom-hero) {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
  }
}