/* Shorebird Booking minimal styles (Tailwind classes handle most visuals) */
.shorebird-booking-root {
  display: flex;
  justify-content: center;
  width: 100%;
}

.shorebird-booking-root { position: relative; z-index: 1055; }

/* Visa bara element på mobil, dölj från 768px och uppåt */
.shorebird-booking-root .sb-close-mobile { display: block; }
@media (min-width: 768px) {
  .shorebird-booking-root .sb-close-mobile { display: none; }
}

/* Dölj varningsikon på desktop, justera text-padding */
@media (min-width: 768px) {
  .shorebird-booking-root .sb-alert-icon { display: none; }
  .shorebird-booking-root .sb-alert-text { padding-left: 0 !important; }
}

/* Ta bort mellanrum när ikon inte visas; lägg bara padding på mobil */
.shorebird-booking-root .sb-alert-text { padding-left: 0 !important; }
@media (max-width: 767.98px) {
  .shorebird-booking-root .sb-alert-text { padding-left: 8px !important; }
}

/* Håll datumknappen rektangulär även vid fokus/aktivt läge */
.shorebird-booking-root button:where([data-role="date-btn"],[data-role="guests-btn"]) {
  height: 38px; /* tillbaka till stabil höjd */
  border-radius: 8px; /* same as rounded-lg */
}
.shorebird-booking-root button:where([data-role="date-btn"],[data-role="guests-btn"]):focus,
.shorebird-booking-root button:where([data-role="date-btn"],[data-role="guests-btn"]):active {
  outline: none;
  box-shadow: none;
  border-radius: 8px; /* förhindra att UA-styles gör den mer rundad */
}

/* Force the widget to sit above decorative backgrounds */
.shorebird-booking-form,
.shorebird-booking-root {
  position: relative;
  z-index: 5000;
}

/* Alert box styling - black text and icons */
.shorebird-booking-root .alert,
.shorebird-booking-root [class*="alert"],
.shorebird-booking-root .notification,
.shorebird-booking-root [class*="notification"],
.shorebird-booking-root .text-red-800,
.shorebird-booking-root .dark\\:text-red-400,
.shorebird-booking-root [class*="text-red-800"],
.shorebird-booking-root [class*="text-red-400"],
.shorebird-booking-root [role="alert"] * {
  color: #000000 !important;
}

/* Force black text on validation messages - more specific selectors */
.shorebird-booking-root div[role="alert"],
.shorebird-booking-root div[role="alert"] *,
.shorebird-booking-root .flex.items-center.p-4.mb-4.text-sm,
.shorebird-booking-root .flex.items-center.p-4.mb-4.text-sm *,
.shorebird-booking-root .text-red-800,
.shorebird-booking-root .dark\\:text-red-400,
.shorebird-booking-root [class*="text-red-800"],
.shorebird-booking-root [class*="text-red-400"] {
  color: #000000 !important;
}

.shorebird-booking-root .alert svg,
.shorebird-booking-root [class*="alert"] svg,
.shorebird-booking-root .notification svg,
.shorebird-booking-root [class*="notification"] svg {
  color: #000000 !important;
  fill: #000000 !important;
}

/* Säkerställ att huvudmodulen får tillräckligt med utrymme och är centrerad */
.shorebird-booking-root > div {
  width: 100%;
  max-width: none;
  min-width: 320px;
  margin: 0 auto;
}

/* Säkerställ att dropdown-menyer får rätt positionering och storlek */
.shorebird-booking-root .relative {
  position: relative;
}

.shorebird-booking-root .absolute {
  position: absolute !important;
}

/* Säkra att dropdown går att öppna igen efter stängning (peka igenom overlay-buggar) */
.shorebird-booking-root #sb-calendar { pointer-events: auto !important; }

/* Begränsa bredden på dropdown-menyer så de inte blir för stora */
.shorebird-booking-root .absolute.top-full {
  min-width: 320px;
  max-width: 400px;
  left: 0;
  right: auto;
}


.shorebird-booking-root .popover-enter { opacity: 0; transform: scale(0.98); }
.shorebird-booking-root .popover-enter-active { opacity: 1; transform: scale(1); transition: all .12s ease; }
.shorebird-booking-root .popover-leave { opacity: 1; transform: scale(1); }
.shorebird-booking-root .popover-leave-active { opacity: 0; transform: scale(0.98); transition: all .12s ease; }

/* Force widget overlays above theme elements */
.sb-modal,
#sb-calendar,
#sb-guests,
.shorebird-booking-root {
  position: relative;
  z-index: 2147483647 !important;
}

/* Ensure modal is visible even if theme toggles visibility */
.sb-modal { display: flex !important; opacity: 1 !important; visibility: visible !important; }

/* Fallback: säkerställ synlig modal även om Tailwind ej laddas i temat */
.sb-modal {
  position: fixed !important;
  top: 0; right: 0; bottom: 0; left: 0;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  z-index: 2147483647 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Fallback-stil för dialogrutan inuti modalen */
.sb-modal > div {
  width: 560px;
  max-width: 100%;
  max-height: 90vh;
  overflow: hidden;
  background: #1f2937; /* slate-700 approx */
  border-radius: 12px;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);
}

@media (max-width: 767.98px) {
  .sb-modal > div {
    width: 100%;
    height: 100%;
    background: #0f172a; /* slate-800 approx */
    display: flex;
    flex-direction: column;
  }
}