/* ============================================================
   booking2-desktop.css — Desktop visual corrections for
   tickets.html (step 1) and tickets-select.html (step 2).
   Loaded AFTER booking2.css. No @media queries here.
   ============================================================ */


/* ──────────────────────────────────────────────────────────
   TYPOGRAPHY — Original uses Roboto Condensed 700 for all
   body/headings via wp-custom-css @import rule.
   The clone pulls Montserrat from dohaquest.com/css/fonts.css
   but the plugin headings (wpos-) must stay Roboto Condensed.
   ────────────────────────────────────────────────────────── */

/* Match original plugin's forced font on all body elements */
/* Original: body, h1-h6, p, a, button, input { font-family: 'Roboto Condensed', sans-serif !important; font-weight: 700; } */
/* We apply only to booking widget elements to avoid breaking the nav */
.wpos-wc-bw-step-timer-wrp,
.wpos-bw-booking-wrap,
.wpos-wc-bw-bkn-wrap,
.wpos-wc-bw-product-cat-acc {
  font-family: 'Roboto Condensed', sans-serif;
}


/* ──────────────────────────────────────────────────────────
   BREADCRUMB / WIZARD BAR
   Original: white card, no explicit border-radius shown —
   step-timer-wrp has no box-shadow in original plugin CSS.
   The original renders breadcrumbs in a simple row with no
   card background — they sit directly on the page content area.
   booking2.css added a white card; keep it but tighten padding
   to match original's 16px top/bottom, 0 horizontal padding
   for the ul (the outer wrp has page-level horizontal padding).
   ────────────────────────────────────────────────────────── */

/* Fix breadcrumb bar — original has no visible card shadow on this element */
.wpos-wc-bw-step-timer-wrp {
  background: #ffffff;
  border-radius: 0;          /* original has no card border-radius here */
  padding: 12px 0;           /* original: no side padding on the bar itself */
  box-shadow: none;          /* original plugin has no shadow on step-timer-wrp */
  margin-bottom: 20px;
  border-bottom: 1px solid #f0e6f8; /* subtle separator */
}

/* Breadcrumb ul gap — original wpos-booking.css: gap: 20px */
.wpos-wc-bw-bkn-wrap ul {
  gap: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* Breadcrumb link text — original: color var(--wpos-nine-color)=#999999, font-family Montserrat */
.wpos-wc-bw-bkn a {
  color: #999999;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;          /* original doesn't specify but 14px matches rendered output */
  font-weight: 400;
  text-decoration: none;
}

/* Active breadcrumb — original: border-bottom: 2px solid; padding-bottom: 6px; color = --wpos-blue-clr = #510c76 */
.wpos-wc-bw-bkn.active a {
  color: #510c76 !important;
  border-bottom: 2px solid #510c76 !important;
  padding-bottom: 6px !important;
  font-weight: 700 !important;
}

/* Icon left in breadcrumb — same color as text */
.wpos-wc-bw-bkn a .wpos-wc-bw-icon-left {
  margin: 0 6px 0 0;
  display: inline-block;
  position: relative;
}

/* Chevron right between steps — original: color #999 (nine-color) */
.wpos-wc-bw-bkn .wpos-wc-bw-icon-right {
  color: #999999;
  font-size: 12px;
  margin: 0 0 0 6px;
  display: inline-block;
  position: relative;
  top: 1px;
}

/* Active step icon + path fill */
.wpos-wc-bw-bkn.active path,
.wpos-wc-bw-bkn a:hover path {
  fill: #510c76 !important;
}
.wpos-wc-bw-bkn.active a:hover {
  color: #510c76 !important;
}


/* ──────────────────────────────────────────────────────────
   BOOKING WRAP CARD
   Original: .wpos-bw-booking-wrap has no card background —
   it's just the content area. The WP theme's entry-content-wrap
   provides the padded boxed area. booking2.css added a white card;
   retain the white bg but remove the extra card look to match original.
   ────────────────────────────────────────────────────────── */

.wpos-bw-booking-wrap {
  background: transparent;        /* original: no explicit bg on the wrap */
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}


/* ──────────────────────────────────────────────────────────
   STEP 1 — PARENT CATEGORY CARD
   Original (.wpos-wc-bw-product-pcat):
     box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1)
     border-radius: 15px 15px 15px 15px
     background-color: #ffffff (from inline wpos-wc-bw-public-inline-css)
     margin-bottom: 30px
     .wpos-wc-bw-product-cat-list: display:flex; align-items:center
     image flex-basis: 35%; content flex-basis: 65%
     image border-radius: 12px 0 0 12px
     cat-cnt-wrp padding: 10px 30px
   ────────────────────────────────────────────────────────── */

/* Category card — match original shadow + radius */
.wpos-wc-bw-product-cat.wpos-wc-bw-product-pcat {
  position: relative;
  margin-bottom: 30px !important;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1) !important;
  border-radius: 15px 15px 15px 15px !important;
  background-color: #ffffff !important;
  color: #2D3748 !important;
  overflow: hidden;
}

/* Card inner list — flex row, image left, content right */
.wpos-wc-bw-product-pcat .wpos-wc-bw-product-cat-list {
  display: flex;
  align-items: center;
}

/* Image wrapper — 35% wide */
.wpos-wc-bw-product-pcat .wpos-wc-bw-cat-img-wrp {
  flex-basis: 35%;
  flex-shrink: 0;
}

/* Category image — 240px tall, no radius on step1 pcat (parent card uses 12px 0 0 12px) */
.wpos-wc-bw-product-pcat .wpos-wc-bw-cat-img {
  border-radius: 12px 0 0 12px !important;
  min-height: 240px !important;
  height: 240px !important;
  width: 100%;
  object-fit: cover;
  display: block;
}

/* Content wrapper padding — original: 10px 30px */
.wpos-wc-bw-product-pcat .wpos-wc-bw-cat-cnt-wrp {
  flex-basis: 65%;
  padding: 10px 30px !important;
}

/* Category title — original: Roboto Condensed, color #510c76, font-size 28px, line-height 40px */
.wpos-wc-bw-cat-ttl,
.wpos-wc-bw-cat-ttl a {
  font-family: 'Roboto Condensed', sans-serif !important;
  color: #510c76 !important;
  font-size: 28px !important;
  line-height: 40px !important;
}

/* Title margin-bottom on parent cat — original: 15px */
.wpos-wc-bw-product-pcat .wpos-wc-bw-cat-ttl {
  margin-bottom: 15px;
}

/* "Book Now" button — original mwbook-book-btn:
   background-color: var(--wpos-violet-clr) = #520B75
   font-family: Montserrat; font-size: 16px; color: #FFFFFF
   border: 1px solid #520B75; border-radius: 10px;
   padding: 15px 20px; line-height: normal;
*/
.mwbook-book-btn {
  display: inline-block !important;
  background-color: #520B75 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  color: #FFFFFF !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: #520B75 !important;
  border-radius: 10px !important;
  padding: 15px 20px !important;
  line-height: normal !important;
  text-decoration: none !important;
}
.mwbook-book-btn:hover {
  background-color: #6e1798 !important;
  border-color: #6e1798 !important;
  color: #FFFFFF !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — PARENT CATEGORY TITLE
   Original: .wpos-wc-bw-parent-cat-ttl
     font-size: 28px; margin-bottom: 30px;
     font-family: Roboto Condensed; color: #510c76
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-parent-cat-ttl {
  font-size: 28px !important;
  margin-bottom: 30px !important;
  font-family: 'Roboto Condensed', sans-serif !important;
  color: #510c76 !important;
  font-weight: 700;
  /* override booking2.css which adds border-bottom and different size */
  border-bottom: none !important;
  padding-bottom: 0 !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — CHILD CATEGORY (ACCORDION ITEM) STRUCTURE
   Original (.wpos-wc-bw-product-ccat):
     margin-bottom: 30px; border-radius: 0; border: 0;
     border-bottom: 1px solid #d1c3b4; padding-bottom: 30px
   Cat image inside ccat: max-height:150px; object-fit:cover
   Cat-cnt-wrp inside ccat: padding: 0
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-product-ccat {
  margin-bottom: 30px !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #d1c3b4 !important;
  padding-bottom: 30px !important;
  /* Remove any card-like border added by booking2.css */
  box-shadow: none !important;
}

.wpos-wc-bw-product-ccat:last-child {
  margin-bottom: 0 !important;
  border: 0 !important;
  padding-bottom: 0 !important;
}

/* Child category image — max-height 150px to match original */
.wpos-wc-bw-product-ccat .wpos-wc-bw-cat-img-inr img {
  max-height: 150px !important;
  max-width: 100%;
  width: 100%;
  object-fit: cover !important;
  object-position: center;
}

/* Child category image itself (the .wpos-wc-bw-cat-img) */
.wpos-wc-bw-product-ccat .wpos-wc-bw-cat-img {
  min-height: unset !important;
  height: auto !important;
  max-height: 150px !important;
  border-radius: 0 !important;
}

/* No padding on content wrapper inside child cat */
.wpos-wc-bw-product-ccat .wpos-wc-bw-cat-cnt-wrp {
  padding: 0 !important;
}

/* The ccat's cat-img-inr has margin-bottom: 15px in original */
.wpos-wc-bw-product-ccat .wpos-wc-bw-cat-img-inr {
  margin-bottom: 15px;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — ACCORDION HEADING
   Original INACTIVE state (.wpos-wc-bw-acc-heading):
     font-size: 18px; color: var(--wpos-green-clr)=#38aa4a
     cursor: pointer; display: inline-block;
     border: 2px solid; padding: 8px 15px;
     font-family: Roboto Condensed; border-radius: 5px
   Original ACTIVE state (.wpos-wc-bw-acc-active .wpos-wc-bw-acc-heading):
     display: flex; align-items: center; justify-content: space-between;
     background-color: #ffc107; color: #000000;
     border-radius: 15px 15px 0 0; border: 0
   Overrides in wpos-wc-bw-public-inline-css also confirm these colors.
   ────────────────────────────────────────────────────────── */

/* Inactive accordion heading — inline-flex to keep icon on same row */
.wpos-wc-bw-product-ccat .wpos-wc-bw-acc-heading {
  font-size: 18px !important;
  color: #38aa4a !important;
  cursor: pointer;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  border: 2px solid #38aa4a !important;
  padding: 8px 15px !important;
  font-family: 'Roboto Condensed', sans-serif !important;
  border-radius: 5px !important;
  background-color: #ffffff !important;
  margin-top: 0 !important;
}

/* All child text in inactive heading */
.wpos-wc-bw-product-ccat .wpos-wc-bw-acc-heading * {
  color: #38aa4a !important;
}

/* Active accordion heading — gold background, black text, full-width flex */
.wpos-wc-bw-product-ccat.wpos-wc-bw-acc-active .wpos-wc-bw-acc-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background-color: #ffc107 !important;
  color: #000000 !important;
  border-radius: 15px 15px 0 0 !important;
  border: 0 !important;
  padding: 8px 15px !important;
}

.wpos-wc-bw-product-ccat.wpos-wc-bw-acc-active .wpos-wc-bw-acc-heading * {
  color: #000000 !important;
}

/* Accordion icon — hidden when inactive, shown when active (original uses ::before with fa icons) */
.wpos-wc-bw-acc-icon {
  position: relative;
  display: none !important;
}
.wpos-wc-bw-acc-active .wpos-wc-bw-acc-icon {
  display: inline-block !important;
  font-weight: bold;
  color: #000000;
}

/* The booking ct icon (calendar icon + label) — flex row, gap 10px */
.wpos-wcb-booking-ct-icon {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-weight: inherit;
  color: inherit !important;
}
.wpos-wcb-booking-ct-icon i {
  color: inherit !important;
}

/* Active accordion container gets white bg + slight shadow */
.wpos-wc-bw-acc-active .wpos-wc-bw-accordion-wrap {
  background-color: #ffffff !important;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1) !important;
  border-radius: 15px 15px 15px 15px !important;
}

/* Accordion content area padding */
.wpos-wc-bw-acc-content {
  padding: 20px 15px !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — DATE PICKER HEADER
   Original (.wpos-bw-booking-wrap .wpos-wcb-booking-header):
     display:flex; align-items:center; gap:10px;
     font-family: Roboto Condensed
   Date title: font-size:18px
   Selected date: font-size:18px; font-weight:bold; color:#520B75
   Change Date button: color:#510c76; border:1px solid #510c76;
     padding: 10px 30px; font-size:15px; font-weight:600;
     border-radius:5px; cursor:pointer
   ────────────────────────────────────────────────────────── */

.wpos-bw-booking-wrap .wpos-wcb-booking-header {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: 'Roboto Condensed', sans-serif !important;
  /* override booking2.css which adds border-bottom, padding, flex-wrap */
  border-bottom: none !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  flex-wrap: wrap;
}

/* Date-of-visit label: font-size 18px */
.wpos-bw-booking-wrap .wpos-wcb-booking-date-ttl {
  font-size: 18px !important;
  font-weight: normal;
  color: inherit;
}

/* Selected date display */
.wpos-bw-booking-wrap .wpos-wcb-selected-date {
  font-size: 18px !important;
  font-weight: bold !important;
  color: #520B75 !important;
}

/* "Select Date" / "Change Date" button */
.wpos-bw-booking-wrap .wpos-wcb-change-date {
  color: #510c76 !important;
  border: 1px solid #510c76 !important;
  padding: 10px 30px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out !important;
  box-shadow: none !important;
  outline: none !important;
  background-color: transparent;
}
.wpos-bw-booking-wrap .wpos-wcb-change-date:hover {
  color: #ffffff !important;
  background-color: #510c76 !important;
}
.wpos-bw-booking-wrap .wpos-wcb-change-date span {
  margin: 0 5px 0 0;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — DATEPICKER (CALENDAR) WIDGET
   Original (.wpos-wcb-booking-inp-wrap):
     max-width: 480px; border: 1px solid var(--global-palette7);
     background-color: #fff
   Datepicker cells: font-size:16px; width:40px; height:40px;
     line-height:40px; border-radius:50%; background-color:#fff;
     box-shadow: inset 0 0 0 1px #eeebe4
   Header: background-color: var(--global-palette7)=#f2f2f2; color:#000
   Title: font-size:18px; text-transform:uppercase
   Day cells hover/active: background-color:#ffc107; color:#000
   Closed days: background #c42a2a, color #fff
   Holiday days: background #f67c10, color #fff
   ────────────────────────────────────────────────────────── */

/* Datepicker container */
.wpos-wcb-booking-inp-wrap {
  max-width: 480px !important;
  width: 100% !important;
  border: 1px solid #f2f2f2 !important;
  background-color: #ffffff !important;
}

/* Override booking2.css datepicker wrapper styles */
.wpos-wcb-datepicker .ui-datepicker {
  width: 100% !important;
  border: 0 !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: unset !important;
  font-family: inherit;
}

/* Calendar cell link/span sizes */
.wpos-wcb-booking-inp-wrap .ui-datepicker td span,
.wpos-wcb-booking-inp-wrap .ui-datepicker td a {
  font-size: 16px !important;
  padding: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  border: 0 !important;
  width: 40px !important;
  height: 40px !important;
  display: inline-block !important;
  line-height: 40px !important;
  color: #000000 !important;
  box-shadow: inset 0 0 0 1px #eeebe4 !important;
  cursor: pointer !important;
  background-color: #ffffff !important;
  transition: background-color .4s !important;
  border-radius: 50% !important;
}

/* td padding and alignment */
.wpos-wcb-booking-inp-wrap .ui-datepicker-calendar tr td {
  border: 0 !important;
  padding: 4px !important;
  text-align: center !important;
}
.wpos-wcb-booking-inp-wrap .ui-datepicker-calendar tr th {
  border: 0 !important;
}

/* Calendar header background — original: var(--global-palette7)=#f2f2f2 NOT purple */
.wpos-wcb-datepicker .ui-widget-header,
.wpos-wcb-booking-inp-wrap .ui-widget-header {
  background-color: #f2f2f2 !important;
  color: #000000 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 10px 8px !important;
}

/* Calendar month/year title */
.wpos-wcb-booking-inp-wrap .ui-datepicker .ui-datepicker-title {
  font-size: 18px !important;
  text-transform: uppercase !important;
  font-family: Helvetica, sans-serif !important;
  color: #000000 !important;
  font-weight: normal !important;
}

/* Day-of-week headers */
.wpos-wcb-booking-inp-wrap .ui-datepicker th {
  font-size: 16px !important;
  padding: 12px 10px !important;
  color: #000000 !important;
  font-weight: normal !important;
}

/* Hover and active day — original: yellow #ffc107, black text */
.wpos-wcb-datepicker .ui-state-default.ui-state-hover,
.wpos-wcb-datepicker .ui-state-default.ui-state-active,
.wpos-wcb-booking-inp-wrap .ui-datepicker td a:hover,
.wpos-wcb-booking-inp-wrap .ui-datepicker td a.ui-state-hover,
.wpos-wcb-booking-inp-wrap .ui-datepicker td a.ui-state-active {
  background-color: #ffc107 !important;
  color: #000000 !important;
  border-color: transparent !important;
}

/* Prev/Next navigation buttons */
.wpos-wcb-booking-inp-wrap .ui-datepicker-next,
.wpos-wcb-booking-inp-wrap .ui-datepicker-prev {
  border: 1px solid #cccccc !important;
  background: #ededed !important;
  font-weight: normal;
  color: #2b2b2b !important;
  cursor: pointer !important;
  top: 6px !important;
}
.wpos-wcb-booking-inp-wrap .ui-datepicker-prev { left: 2px !important; }
.wpos-wcb-booking-inp-wrap .ui-datepicker-next { right: 2px !important; }

/* Disabled prev/next — hide them (matching original) */
.wpos-wcb-datepicker .ui-datepicker-prev.ui-state-disabled,
.wpos-wcb-datepicker .ui-datepicker-next.ui-state-disabled {
  display: none !important;
}

/* Closed (Sunday) days — original: background #c42a2a, white text */
.wpos-wcb-datepicker td.wpos-wc-bw-eg-close span,
.wpos-wcb-datepicker td.wpos-wc-bw-eg-close a {
  background-color: #c42a2a !important;
  color: #ffffff !important;
}

/* Holiday days — original: background #f67c10, white text */
.wpos-wcb-datepicker td.wpos-wc-bw-h-close span,
.wpos-wcb-datepicker td.wpos-wc-bw-h-close a {
  background-color: #f67c10 !important;
  color: #ffffff !important;
}

/* Disabled-state closed/holiday — keep colored, pointer-events on */
.wpos-wcb-datepicker .ui-state-disabled.wpos-wc-bw-eg-close,
.wpos-wcb-datepicker .ui-state-disabled.wpos-wc-bw-h-close {
  opacity: 1 !important;
  cursor: pointer !important;
  pointer-events: unset !important;
}

/* Override booking2.css which wrongly sets purple for active state */
.wpos-wcb-datepicker .ui-state-active,
.wpos-wcb-datepicker .ui-state-active:hover {
  background-color: #ffc107 !important;
  color: #000000 !important;
  border-color: transparent !important;
  font-weight: 700;
}

/* Remove the "today border" override from booking2.css (original doesn't have gold border-today) */
.wpos-wcb-datepicker .ui-datepicker-today a {
  border: 0 !important;
  box-shadow: inset 0 0 0 2px #ffc107 !important; /* subtle today highlight instead */
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — CALENDAR LEGEND (STATUS DOTS)
   Original (.wpos-wcb-booking-status-wrap):
     padding: 5px; margin: 15px 0; font-size: 15px;
     display: flex; gap: 15px; justify-content: center
   Mark: height:10px; width:10px; display:inline-block;
     border: 1px solid #999; margin-right: 3px
   Closed mark: background #c42a2a; border transparent
   Holiday mark: background #f67c10; border transparent
   ────────────────────────────────────────────────────────── */

.wpos-wcb-booking-status-wrap {
  padding: 5px !important;
  margin: 15px 0 !important;
  font-size: 15px !important;
  display: flex !important;
  gap: 15px !important;
  justify-content: center !important;
  flex-wrap: wrap;
}

.wpos-wcb-booking-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.wpos-wcb-booking-status-mark {
  height: 10px !important;
  width: 10px !important;
  display: inline-block !important;
  border: 1px solid #999999 !important;
  border-radius: 0 !important;   /* original: square dot, not circle */
  margin-right: 3px !important;
  flex-shrink: 0;
}

/* Open: default border (green fill via inline style in original HTML) */
.wpos-wcb-booking-status-open .wpos-wcb-booking-status-mark {
  background-color: #38aa4a !important;  /* green open */
  border-color: transparent !important;
}

/* Closed: red */
.wpos-wcb-booking-status-closed .wpos-wcb-booking-status-mark {
  background-color: #c42a2a !important;
  border-color: transparent !important;
}

/* Holiday: orange */
.wpos-wcb-booking-status-holiday .wpos-wcb-booking-status-mark {
  background-color: #f67c10 !important;
  border-color: transparent !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — DATE-TIME BOOKING AREA
   Original (.wpos-bw-booking-date-time-wrap):
     position: relative; margin-top: 20px; margin-bottom: 30px
   ────────────────────────────────────────────────────────── */

.wpos-bw-booking-date-time-wrap {
  position: relative;
  margin-top: 20px !important;
  margin-bottom: 30px !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — TICKET PRODUCT LIST CARDS
   Original (.wpos-bw-product-list-inr inside accordion):
     display:flex; gap:20px; align-items:center;
     background-color: transparent (inside accordion); padding: 0 0 30px 0;
     margin-bottom: 30px; border-bottom: 1px solid var(--wpos-light-sky)=#e5e6f5
   The standalone product list cards (outside accordion) use #EEEBE4 bg.
   ────────────────────────────────────────────────────────── */

/* Inside accordion — transparent bg, border-bottom separator */
.wpos-wc-bw-accordion-wrap .wpos-bw-product-list-inr {
  background-color: transparent !important;
  padding: 0 0 30px 0 !important;
  margin-bottom: 30px !important;
  border-bottom: 1px solid #e5e6f5 !important;
  border-radius: 0 !important;
}

.wpos-wc-bw-accordion-wrap .wpos-bw-product-list:last-child .wpos-bw-product-list-inr {
  border-bottom: 0 !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
}

/* Outside accordion (standalone) — beige background #EEEBE4 */
.wpos-bw-product-list-inr {
  display: flex !important;
  gap: 20px !important;
  align-items: center !important;
  background-color: #EEEBE4 !important;
  padding: 25px 15px !important;
  border-radius: 0 !important;
  margin-bottom: 25px !important;
  flex-wrap: wrap;
}

/* Product image inside card */
.wpos-bw-product-img {
  height: 150px !important;
  width: 100% !important;
  object-fit: cover !important;
  position: relative;
  z-index: 2;
  padding: 5px !important;
  border-radius: 15px !important;
  background-color: #ffffff;
  display: block;
}

.wpos-bw-product-list-inr .wpos-bw-product-img-wrap {
  max-width: 150px !important;
  width: 100%;
  position: relative;
  flex-shrink: 0;
}

/* Product content column flex-basis */
.wpos-bw-product-list .wpos-bw-product-cnt-wrap {
  flex-basis: 38% !important;
  min-width: 120px;
}

/* Price wrap */
.wpos-bw-price-wrap,
.wpos-bw-total-price-wrap {
  display: flex;
  gap: 0;
  font-weight: bold;
  font-family: 'Montserrat', sans-serif;
}

/* Price amount — original: inherits from wpos-booking.css (bold, family Montserrat) */
.wpos-bw-price-wrap .woocommerce-Price-amount {
  font-size: 1.25rem;
  font-weight: 800;
  color: #520B75;
}

/* Free price */
.wpos-bw-free-price bdi {
  font-size: 1.25rem;
  font-weight: 800;
  color: #28a745;
}

/* Product description title */
.wpos-bw-product-ttl,
.wpos-bw-product-ttl a {
  color: #510c76 !important;
  font-size: 20px !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Meta wrap (qty + add to cart column) */
.wpos-bw-product-list .wpos-bw-meta-wrap {
  flex-basis: 32% !important;
  min-width: 140px;
}

.wpos-bw-product-list .wpos-bw-total-price-wrap {
  flex-basis: 22% !important;
}

/* Quantity button pills — original: gold (#ffc107) pill, border-radius 20px 0 0 20px / 0 20px 20px 0 */
.wpos-bw-product-list .quantity {
  display: flex !important;
  justify-content: center !important;
  max-width: 80% !important;
  width: 100% !important;
}

.wpos-bw-product-list .quantity .wpos-bw-qty-btn {
  width: 110px !important;
  background-color: #ffc107 !important;
  font-weight: bold !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  cursor: pointer !important;
  transition: background-color .4s ease-in-out !important;
  border: 2px solid #ffc107 !important;
  border-radius: 20px 0 0 20px !important;
}

.wpos-bw-product-list .quantity .wpos-bw-plus-qty {
  border-radius: 0 20px 20px 0 !important;
}

.wpos-bw-product-list .quantity .wpos-bw-qty-btn:hover {
  background-color: #ffc107 !important;
  color: #ffffff !important;
}

/* Qty input field between pills */
.wpos-bw-product-list .quantity .qty,
.wpos-bw-product-list .dq-qty-input {
  padding: 6px !important;
  text-align: center !important;
  background-color: transparent !important;
  border: 1px solid #ffc107 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  outline: none !important;
  height: 35px !important;
  width: 100% !important;
  max-width: none !important;
  min-width: auto !important;
  box-shadow: none !important;
  font-weight: 700;
}

/* Add to cart button — purple, full-width, Montserrat 18px */
.wpos-bw-product-list .wpos-wc-add-to-cart-btn,
.wpos-bw-product-list .added_to_cart {
  position: relative !important;
  display: inline-block !important;
  background-color: #520B75 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  color: #FFFFFF !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: #520B75 !important;
  border-radius: 5px !important;
  padding: 6px 10px !important;
  box-shadow: none !important;
  text-align: center !important;
  width: 100% !important;
  margin: 20px auto 10px auto !important;
}

.wpos-bw-product-list .wpos-bw-product-add-to-cart {
  max-width: 80%;
  width: 100%;
}

.wpos-bw-product-list .wpos-wc-add-to-cart-btn:hover {
  background-color: #6e1798 !important;
  border-color: #6e1798 !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — LAYOUT: left/right booking columns
   Original: .wpos-bw-booking-wrap .wpos-bw-booking-left { flex-basis: 67% }
             .wpos-bw-booking-wrap .wpos-bw-booking-right { flex-basis: 33%; position:sticky; top:8px }
             .wpos-wc-bw-product-cat-acc { display:flex; gap:20px }
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-product-cat-acc {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 20px !important;
  font-size: 17px !important;
}

.wpos-bw-booking-wrap .wpos-bw-booking-left {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

.wpos-bw-booking-wrap .wpos-bw-booking-right {
  flex: 0 0 382px !important;
  width: 382px !important;
  position: sticky !important;
  top: 70px !important;
  align-self: flex-start !important;
  font-size: 17px !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — MINI-CART WIDGET (right sidebar)
   Original (.wpos-wc-bw-cart-widget):
     background: #fff; border: 1px solid var(--global-palette7);
     border-bottom: 5px solid var(--global-palette7); border-radius: 15px
   Header: background-color #ffc107; border-radius 15px 15px 0 0; padding 15px 25px
   Header h4: color: var(--wpos-violet-clr)=#520B75; font-size:18px
   Header p: font-size:12px; color:#796248
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-cart-widget {
  background-color: #ffffff !important;
  border: 1px solid #edf2f7 !important;
  border-radius: 0 !important;
  font-size: 17px !important;
  box-shadow: none !important;
}

.wpos-wc-bw-cart-widget .cart-header-wrap {
  padding: 15px 25px !important;
  border-bottom: 0 !important;
  background-color: #ffc107 !important;
  border-radius: 15px 15px 0 0 !important;
}

.wpos-wc-bw-cart-widget .cart-header-wrap h4 {
  color: #520B75 !important;
  text-transform: capitalize !important;
  margin-bottom: 0 !important;
  font-size: 18px !important;
}

.wpos-wc-bw-cart-widget .cart-header-wrap p {
  font-size: 12px !important;
  color: #796248 !important;
  width: 100% !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

/* Cart item product title */
.wpos-wc-bw-cart-widget .woocommerce-mini-cart-item .cart-items .product-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  margin-bottom: 8px !important;
  display: block !important;
  text-decoration: none !important;
  color: #510c76 !important;
}

/* Empty message — padding and font matching original */
.wpos-wc-bw-cart-widget .woocommerce-mini-cart__empty-message {
  padding: 15px 25px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  margin: 0 !important;
}

/* Cart total/Amount row — always visible flex row with separator */
.wpos-wc-bw-cart-widget .woocommerce-mini-cart__total.total {
  padding: 10px 25px 11px 25px !important;
  display: flex !important;
  justify-content: space-between !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #000000 !important;
  margin: 0 !important;
  border-top: 2px solid #edf2f7 !important;
}
.wpos-wc-bw-cart-widget .woocommerce-mini-cart__total.total * {
  color: #000000 !important;
}

/* Cart action button — originally purple outline button */
.wpos-wc-bw-action-btn .button,
.wpos-wc-bw-checkout-btn .button {
  background-color: transparent !important;
  box-shadow: none !important;
  display: block !important;
  text-align: center !important;
  font-size: 18px !important;
  padding: 6px 20px !important;
  transition: all .35s ease !important;
  border: 1px solid #510c76 !important;
  color: #510c76 !important;
  width: 100% !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 500 !important;
}

.wpos-wc-bw-action-btn .button:hover,
.wpos-wc-bw-checkout-btn .button:hover {
  background-color: #510c76 !important;
  color: #ffffff !important;
}

.wpos-wc-bw-action-btn,
.wpos-wc-bw-checkout-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 15px 25px !important;
  margin-bottom: 0 !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — LOADING OVERLAY / SPINNER
   Original (.wpos-wc-bw-overlay-wrap):
     position:fixed; full screen overlay; rgba(255,255,255,0.7);
     z-index:99999; display:none (shown when loading)
   Overlay content: background #510c76; padding 20px; white text;
     border: 6px solid rgba(255,255,255,0.5); text-align:center
   Logo img in overlay: display:block; width:180px
   Spinner (.wpos-bw-loader): border 4px #f3f3f3; border-top #510c76;
     width:30px; height:30px; border-radius 50%; spin animation
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-overlay-wrap {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-color: rgba(255, 255, 255, 0.7) !important;
  z-index: 99999 !important;
  display: none;       /* shown by JS */
  align-items: center !important;
  justify-content: center !important;
}

.wpos-wc-bw-overlay-wrap .wpos-wc-bw-overlay-cnt {
  background-color: #510c76 !important;
  padding: 20px !important;
  color: #ffffff !important;
  text-align: center !important;
  border: 6px solid rgba(255, 255, 255, 0.5) !important;
}

.wpos-wc-bw-overlay-wrap .wpos-wc-bw-overlay-cnt img {
  display: block !important;
  width: 180px !important;
}

.wpos-wc-bw-overlay-wrap .wpos-wc-bw-overlay-cnt p {
  margin: 1rem 0 0 0 !important;
}

/* Spinner: white ring, purple top arc */
.wpos-bw-loader {
  display: inline-block !important;
  border: 4px solid #f3f3f3 !important;
  border-radius: 50% !important;
  border-top: 4px solid #510c76 !important;
  width: 30px !important;
  height: 30px !important;
  animation: wpos-bw-spin 2s linear infinite !important;
  vertical-align: middle !important;
}


/* ──────────────────────────────────────────────────────────
   STEP 2 — POPUP WINDOWS
   Original (.wpos-wc-bw-popup-cnt-block):
     background #fff; box-shadow 0 0 10px rgba(0,0,0,0.5);
     border-radius: 15px
   Popup title: background #ffc107; color #000; font-size 24px;
     padding 10px 20px; border-radius 15px 15px 0 0; text-align center
   Close button: right:5px; top:8px; width:30px; height:30px;
     line-height:30px; border-radius:50%
   Close button hover: background #510c76; span color #fff
   Popup body: padding 20px; text-align center
   ────────────────────────────────────────────────────────── */

.wpos-wc-bw-popup-cnt-block {
  position: relative !important;
  width: 100% !important;
  pointer-events: auto !important;
  background-color: #ffffff !important;
  border-radius: 15px !important;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5) !important;
  outline: 0 !important;
}

.wpos-wc-bw-popup-title {
  background-color: #ffc107 !important;
  color: #000000 !important;
  font-size: 24px !important;
  padding: 10px 20px !important;
  line-height: normal !important;
  text-align: center !important;
  font-family: 'Montserrat', sans-serif !important;
  border-radius: 15px 15px 0 0 !important;
}

.wpos-wc-bw-popup-close-wrp {
  display: inline-block !important;
  position: absolute !important;
  right: 5px !important;
  top: 8px !important;
  cursor: pointer !important;
  padding: 0 5px !important;
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  line-height: 30px !important;
}

.wpos-wc-bw-popup-close-wrp:hover {
  background-color: #510c76 !important;
}

.wpos-wc-bw-popup-close-wrp span {
  color: #000000 !important;
  font-size: 22px !important;
  line-height: 14px !important;
  width: 20px !important;
  height: 20px !important;
  display: inline-block !important;
  text-align: center !important;
}

.wpos-wc-bw-popup-close-wrp:hover span {
  color: #ffffff !important;
}

.wpos-wc-bw-popup-body {
  padding: 20px !important;
  text-align: center !important;
}

/* Popup overlay */
.wpos-wc-bw-popup-overlay {
  display: none;
  background-color: #000000 !important;
  height: 100% !important;
  left: 0 !important;
  opacity: 0.5 !important;
  overflow: hidden !important;
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  z-index: 9995 !important;
}

/* Popup action buttons (Accept / Cancel) */
.wpos-wc-bw-popup-btn-wrap {
  display: flex !important;
  align-content: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin-top: 15px !important;
}

.wpos-wc-bw-popup-btn-wrap .wpos-wc-bw-popup-btn {
  background-color: #510c76 !important;
  color: rgba(255, 255, 255, 0.87) !important;
  flex-basis: 35% !important;
  padding: 10px !important;
  font-size: 18px !important;
  cursor: pointer !important;
}

.wpos-wc-bw-popup-btn-wrap .wpos-wc-bw-popup-cancle-btn {
  background-color: #999999 !important;
}

.wpos-wc-bw-popup-btn-wrap .wpos-wc-bw-popup-cancle-btn:hover {
  background-color: #cccccc !important;
}

.wpos-wc-bw-popup-btn-wrap .wpos-wc-bw-popup-btn:hover {
  background-color: #520B75 !important;
}

/* Popup data wrapper — full-screen centered modal */
.wpos-wc-bw-popup-data-wrp {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 999999 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  outline: 0 !important;
}

.wpos-wc-bw-popup-data-cnt {
  box-sizing: border-box !important;
  position: relative !important;
  width: auto !important;
  pointer-events: none !important;
  max-width: 650px !important;
  margin: 1.75rem auto !important;
  padding: 0 8px !important;
}


/* ──────────────────────────────────────────────────────────
   SIMPLIFIED BOOKING SITE NAVIGATION
   Matches bookings.dohaquest.com: white fixed header 60px,
   Logo left / Overview|Tickets|My Account|Cart right
   ────────────────────────────────────────────────────────── */

.dq-booking-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 60px !important;
  background: #ffffff !important;
  z-index: 9999 !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.10) !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
.dq-booking-header-inner {
  max-width: 1290px !important;
  margin: 0 auto !important;
  padding: 0 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 60px !important;
}
.dq-booking-logo img {
  height: 40px !important;
  width: auto !important;
  display: block !important;
}
.dq-booking-nav {
  display: flex !important;
  align-items: center !important;
  gap: 36px !important;
}
.dq-booking-nav a {
  color: #520B75 !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  letter-spacing: 0.01em !important;
  transition: color 0.15s !important;
  white-space: nowrap !important;
}
.dq-booking-nav a:hover {
  color: #F2B02D !important;
}
.dq-cart-icon-link {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  position: relative !important;
}
.dq-cart-icon-link svg {
  color: #520B75 !important;
  stroke: #520B75 !important;
}
.dq-cart-count {
  background: #520B75 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 50% !important;
  min-width: 18px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 3px !important;
  line-height: 1 !important;
}

/* Mobile hamburger button — hidden on desktop, shown via mobile CSS */
.dq-mobile-hamburger {
  display: none !important;
  background: none !important;
  border: none !important;
  padding: 4px 0 !important;
  cursor: pointer !important;
  line-height: 0 !important;
}
/* SVG is white (for dark backgrounds); invert to black for white header */
.dq-mobile-hamburger img {
  filter: brightness(0) !important;
}

/* Push page content below fixed 60px nav */
body {
  padding-top: 60px !important;
}

/* ──────────────────────────────────────────────────────────
   PHOTO HERO BANNER
   Matches original .entry-hero with background-image, 380px,
   dark overlay, centered white title
   ────────────────────────────────────────────────────────── */

.entry-hero.page-hero-section {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}
.entry-hero-container-inner {
  position: relative !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  height: 380px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.hero-section-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0,0,0,0.32) !important;
  z-index: 0 !important;
}
.hero-container {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  text-align: center !important;
}
.entry-header.page-title {
  margin: 0 !important;
  padding: 0 !important;
}
.entry-title {
  color: #ffffff !important;
  font-size: 2.6rem !important;
  font-weight: 700 !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.45) !important;
  letter-spacing: 0.01em !important;
}


/* ──────────────────────────────────────────────────────────
   BOOKING PAGE CONTAINER max-width
   Original: content area = 1178px (acc=1178, left=776, right=382, gap=20)
   So booking-page-wrap max-width = 1178 + 30 (Bootstrap 15px padding each side) = 1208px
   Top padding: original has 112px gap after hero, clone had 48px → add 64px more
   ────────────────────────────────────────────────────────── */

.booking-page-wrap {
  max-width: 1208px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 112px !important;
  padding-bottom: 80px !important;
}


/* ──────────────────────────────────────────────────────────
   SPINNER KEYFRAMES (ensure wpos-bw-spin is defined)
   ────────────────────────────────────────────────────────── */

@keyframes wpos-bw-spin {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* ==============================================================
   LIVE QA FIXES — applied after Playwright comparison
   Date: 2026-06-14
   ============================================================== */

/* ──────────────────────────────────────────────────────────────
   FIX 1: Breadcrumb bar — transparent bg, no border, 30px margin,
   no padding (original plugin does NOT style this as a white card).
   booking2.css adds white bg + shadow + padding — override here.
   ────────────────────────────────────────────────────────────── */
.wpos-wc-bw-step-timer-wrp {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 30px !important;
  border-radius: 0 !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 2: Breadcrumb link font — Roboto Condensed 700, 14px.
   17px made each <li> 34px tall (step-timer-wrp = 136px);
   14px brings it to ~26px (step-timer-wrp = 128px) matching original.
   ────────────────────────────────────────────────────────────── */
.wpos-wc-bw-bkn a,
.wpos-wc-bw-bkn-link a {
  font-family: 'Roboto Condensed', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #999999 !important;
}

.wpos-wc-bw-bkn.active a,
.wpos-wc-bw-bkn-link.active a {
  font-family: 'Roboto Condensed', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #510c76 !important;
  border-bottom: 2px solid #510c76 !important;
  padding-bottom: 6px !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 3: STEP 1 — Category card layout.
   Original: horizontal flex (35% image left + 65% content right),
   full-width card, border-radius 15px, box-shadow, 240px image height.
   Clone uses Bootstrap grid (col-lg-4 vertical card).
   Fix: force the cat-list inside booking-wrap to display as horizontal flex
   and expand the cat-wrap to full width.
   ────────────────────────────────────────────────────────────── */

/* Override Bootstrap col sizing — make category wrap full width */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-wrap {
  justify-content: flex-start !important;
}
.wpos-bw-booking-wrap .wpos-wc-bw-cat-wrap > [class*="col"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
}

/* The cat-list container: horizontal flex, full-width card */
.wpos-bw-booking-wrap .wpos-wc-bw-product-cat-list.wpos-wc-bw-has-cat-img {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  background-color: #ffffff !important;
  border-radius: 15px !important;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px !important;
  overflow: hidden !important;
  margin-bottom: 30px !important;
  border: none !important;
  cursor: pointer;
}

/* Image wrapper — 35% */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-img-wrp {
  flex: 0 0 35% !important;
  max-width: 35% !important;
}

/* Cat image: horizontal card image (left side, 240px tall, rounded left) — Step 1 */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-img {
  border-radius: 12px 0 0 12px !important;
  min-height: 240px !important;
  height: 240px !important;
  width: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
/* Step 2 card: block layout, no shadow/radius/bg — matches original exactly */
.wpos-bw-booking-wrap .wpos-wc-bw-product-ccat .wpos-wc-bw-product-cat-list.wpos-wc-bw-has-cat-img {
  display: block !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  margin-bottom: 15px !important;
}
/* Step 2 cat-cnt-wrp: no padding (original measured 0px) */
.wpos-bw-booking-wrap .wpos-wc-bw-product-ccat .wpos-wc-bw-cat-cnt-wrp {
  padding: 0 !important;
  flex: none !important;
  width: 100% !important;
}
/* Step 2 child category image — 240px tall, full-width (matches original exactly) */
.wpos-bw-booking-wrap .wpos-wc-bw-product-ccat .wpos-wc-bw-cat-img {
  min-height: 240px !important;
  height: 240px !important;
  max-height: 240px !important;
  width: 100% !important;
  border-radius: 0 !important;
}
/* Step 2 child image wrapper — full-width block */
.wpos-bw-booking-wrap .wpos-wc-bw-product-ccat .wpos-wc-bw-cat-img-wrp {
  width: 100% !important;
  max-width: 100% !important;
  min-width: auto !important;
  flex: none !important;
  display: block !important;
  align-self: auto !important;
}

/* Content wrapper: 65%, padding 10px 30px */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-cnt-wrp {
  flex: 1 1 65% !important;
  padding: 10px 30px !important;
  text-align: left !important;
}

/* Neutralize Bootstrap p-4 added inline */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-cnt-wrp.p-4 {
  padding: 10px 30px !important;
}

/* Cat title in step 1 horizontal card */
.wpos-bw-booking-wrap .wpos-wc-bw-cat-ttl {
  font-size: 28px !important;
  line-height: 40px !important;
  color: #510c76 !important;
  font-family: 'Roboto Condensed', sans-serif !important;
  font-weight: 700 !important;
  margin-bottom: 15px !important;
  display: block !important;
}

/* Book Now button — override inline styles from HTML */
.wpos-bw-booking-wrap .mwbook-book-btn {
  font-family: 'Roboto Condensed', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  background-color: #510c76 !important;
  color: #ffffff !important;
  border: 1px solid #510c76 !important;
  border-radius: 10px !important;
  padding: 15px 20px !important;
  line-height: normal !important;
  display: inline-block !important;
  text-decoration: none !important;
}
.wpos-bw-booking-wrap .mwbook-book-btn:hover {
  background-color: #6e1798 !important;
  border-color: #6e1798 !important;
  color: #ffffff !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 4: Calendar header background — original: #EDF2F7 (rgb 237 242 247)
   Current desktop CSS says #f2f2f2. Update to match original exactly.
   ────────────────────────────────────────────────────────────── */
.wpos-wcb-datepicker .ui-widget-header,
.wpos-wcb-booking-inp-wrap .ui-widget-header {
  background-color: #EDF2F7 !important;
  color: #000000 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 10px 8px !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 5: Right sidebar "Your Order" widget — always visible, no
   inline display:none needed. Layout handled by sidebar CSS block below.
   ────────────────────────────────────────────────────────────── */


/* ──────────────────────────────────────────────────────────────
   FIX 6: Product list inner (ticket cards) — on original when inside
   accordion, they have transparent bg, border-bottom separator.
   On original OUTSIDE accordion (which doesn't exist in clone)
   they have beige #EEEBE4.
   In clone structure tickets are inside accordion — keep transparent.
   ────────────────────────────────────────────────────────────── */

/* Ticket product image — original: 150px height, white bg, 15px border-radius, 5px padding */
.wpos-bw-product-img-wrap {
  flex-shrink: 0 !important;
  width: 150px !important;
  max-width: 150px !important;
}
.wpos-bw-product-img {
  height: 150px !important;
  width: 100% !important;
  object-fit: cover !important;
  border-radius: 15px !important;
  background-color: #ffffff;
  padding: 5px !important;
  display: block !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 7: Accordion heading — the acc-icon (chevron) should always show
   inside the heading (it's inside the heading html in clone).
   Original: accordion icon is always part of heading markup.
   Fix: don't hide the acc-icon via CSS when inside acc-heading.
   ────────────────────────────────────────────────────────────── */
.wpos-wc-bw-acc-heading .wpos-wc-bw-acc-icon {
  display: inline-block !important;
  color: inherit !important;
}


/* ──────────────────────────────────────────────────────────────
   FIX 8: Booking wrap — remove card styling from booking2.css
   (white bg, padding, box-shadow) to match original transparent wrap.
   ────────────────────────────────────────────────────────────── */
.wpos-bw-booking-wrap {
  background: transparent !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}


/* ── Right sidebar widget — simplified to match original structure ── */
.woocommerce-mini-cart.cart_list { list-style: none; margin: 0; padding: 0; }
.woocommerce-mini-cart.cart_list { list-style: none; margin: 0; padding: 0; }
.woocommerce-mini-cart-item {
  display: flex;
  padding: 14px 20px;
  border-bottom: 1px solid #f5f5f5;
  align-items: flex-start;
  gap: 8px;
}
.woocommerce-mini-cart-item .cart-items { flex: 1; }
.woocommerce-mini-cart-item .product-title span { font-weight: 700; font-size: .88rem; color: #333; }
.woocommerce-mini-cart-item .variation { font-size: .78rem; color: #666; margin: 4px 0; }
.woocommerce-mini-cart-item .variation dt,
.woocommerce-mini-cart-item .variation dd { display: inline; margin: 0; }
.woocommerce-mini-cart-item .variation dt::after { content: ' '; }
.woocommerce-mini-cart-item .variation dd::after { content: '\a'; white-space: pre; }
.dq-side-remove { color: #e74c3c; cursor: pointer; font-size: .8rem; display: inline-block; margin-top: 6px; }
.woocommerce-mini-cart-item .item-qty { width: 40px; text-align: center; font-weight: 700; font-size: .9rem; padding-top: 2px; }
.woocommerce-mini-cart-item .items-price { width: 80px; text-align: right; font-size: .85rem; font-weight: 600; }
.woocommerce-mini-cart__total {
  padding: 10px 20px;
  margin: 0;
  display: flex;
  justify-content: space-between;
  font-size: .9rem;
  border-top: 1px solid #f0f0f0;
}
.woocommerce-mini-cart__total strong { font-weight: 700; }
.dq-side-actions {
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dq-side-back-btn {
  display: block;
  text-align: center;
  padding: 10px;
  border: 2px solid #520B75;
  border-radius: 6px;
  color: #520B75;
  font-weight: 700;
  text-decoration: none;
  font-size: .9rem;
}
.dq-side-proceed-btn {
  display: block;
  text-align: center;
  padding: 10px;
  background: #520B75;
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: .9rem;
}
.dq-side-proceed-btn:hover { background: #3d0857; color: #fff; }
.dq-side-empty-msg { padding: 20px; color: #999; font-size: .9rem; list-style: none; }
/* On mobile: sidebar stacks below left column, full-width */
@media (max-width: 767px) {
  .wpos-wc-bw-product-cat-acc { flex-direction: column !important; }
  .wpos-bw-booking-wrap .wpos-bw-booking-right {
    display: block !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    top: auto !important;
    align-self: stretch !important;
  }
}

/* ── Timer strip: keep breadcrumbs + timer on one row ───────── */
/* wpos-booking.css sets .wpos-wc-bw-bkn-wrap { width: 100% } which
   pushes the timer to a second row. Override to flex:1 so timer stays right. */
.wpos-wc-bw-step-timer-wrp .wpos-wc-bw-bkn-wrap {
  width: auto !important;
  flex: 1 1 auto !important;
}
#dq-session-timer {
  flex: 0 0 auto !important;
}