.wcsb-addon-label { margin-left:6px; }
.wcsb-addon-label-disabled { color: #999; text-decoration: line-through; }
.wcsb-addon-disabled { opacity: 0.6; }
.wcsb-featured-item { width: calc(25% - 8px); box-sizing: border-box; }
.wcsb-featured-item .wcsb-addon-label { display:block; }
.wcsb-featured-item input { transform: scale(1.1); }
.wcsb-featured-item img { max-width:40px; max-height:40px; display:inline-block; vertical-align:middle; margin-right:8px; }
.wcsb-featured-expanded .wcsb-featured-item { width: calc(50% - 8px); }
.wcsb-booking-form-container {
  border: 1px solid #ddd;
  padding: 15px;
  margin: 20px 0;
  background: #fafafa;
  border-radius: 4px;
}

.wcsb-form-field {
  margin-bottom: 12px;
}

.wcsb-form-field label {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}

.wcsb-time-selectors {
  display: flex;
  gap: 20px;
}

.wcsb-time-selectors select {
  width: 100%;
  padding: 6px;
}

/* Ensure each time field shares the available row and wraps on small screens */
.wcsb-time-selectors .wcsb-form-field {
  flex: 1 1 180px; /* grow, shrink, basis */
  min-width: 140px;
}

.wcsb-time-selectors {
  flex-wrap: wrap;
}

/* Make Start and End appear side-by-side on narrow mobile screens (down to ~400px) */
@media (max-width: 400px) {
  .wcsb-time-selectors {
    gap: 12px;
  }
  /* use the high-specificity ID selector to override earlier !important rules */
  #wcsb-booking-form.wcsb-booking-form .wcsb-time-selectors .wcsb-form-field {
    flex: 1 1 48% !important; /* two columns */
    min-width: 0 !important;
  }
}

/* High specificity fallback to override aggressive theme styles */
#wcsb-booking-form.wcsb-booking-form .wcsb-time-selectors {
  display: flex !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
}

#wcsb-booking-form.wcsb-booking-form .wcsb-time-selectors .wcsb-form-field {
  flex: 1 1 180px !important;
  min-width: 140px !important;
}

.wcsb-price-display {
  margin-top: 14px; /* slightly more space above price */
  margin-bottom: 12px; /* space after price before next section */
  font-size: 1.4em; /* larger, more visible */
  font-weight: 700;
  line-height: 1.2;
}
/* subtle light orange background to highlight the price line */
.wcsb-price-display {
  background: #fff7e6; /* very light orange */
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #ffe6b8; /* subtle border */
}

.wcsb-hire-items {
  margin-top: 8px;
}

/* Styles moved from inline markup in woo-studio-booking.php */
.wcsb-addons-top { margin-bottom: 10px; }
.wcsb-addons-label { display:block; margin:0 0 8px 0; }
.wcsb-featured-equipment { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.wcsb-view-all-link { display:block; margin:6px 0; }
.wcsb-addons-legacy { display:none; }

/* Equipment modal/backdrop */
.wcsb-equipment-modal {
  display:none;
  position:fixed;
  left:0; right:0; top:0; bottom:0;
  background: rgba(0,0,0,0.6);
  align-items:center;
  justify-content:center;
  z-index: 9999;
}
.wcsb-equipment-dialog {
  background:#fff;
  padding:16px;
  border-radius:8px;
  max-width:720px;
  width:94%;
  max-height:80vh;
  overflow:auto;
  margin:40px auto;
  position:relative;
}
.wcsb-equipment-modal-close {
  position:absolute;
  right:-12px; top:-12px;
  border:none; color:#333; background:rgba(255,255,255,0.95);
  border:1px solid #ddd; border-radius:50%; width:28px; height:28px;
  line-height:26px; text-align:center; font-size:16px; cursor:pointer; z-index:1001;
}
.wcsb-equipment-search-row { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.wcsb-equipment-search { flex:1; padding:8px; border:1px solid #ddd; border-radius:4px; }
.wcsb-equipment-modal-body { display:flex; gap:12px; flex-wrap:wrap; }
.wcsb-equipment-modal-footer { margin-top:12px; text-align:right; }

.wcsb-hire-items label {
  display: block;
  margin-bottom: 4px;
}

/* Ensure addon item labels are not bold */
#wcsb-booking-form .wcsb-addon + span,
#wcsb-booking-form #wcsb-addons-top label {
  font-weight: normal !important;
}
/* Ensure addon label text is normal weight and not affected by theme styles */
#wcsb-booking-form #wcsb-addons-top .wcsb-addon-label { font-weight: normal !important; }

/* Add spacing between addons list and the price area when needed */
#wcsb-booking-form #wcsb-addons-top { margin-bottom: 10px; }

/* Buttons: make both buttons equal width and orange */
#wcsb-booking-form .wcsb-button-row {
  display: flex;
  gap: 8px;
}
#wcsb-booking-form .wcsb-button-row button {
  flex: 1 1 0;
  min-width: 120px;
  padding: 10px 14px;
  background: #cc3f00 !important; /* darker theme-aligned orange */
  color: #fff !important;
  border: 2px solid rgba(0,0,0,0.12) !important; /* stronger edge */
  border-radius: 6px !important;
  font-weight: 600;
  cursor: pointer;
}
#wcsb-booking-form .wcsb-button-row button:hover,
#wcsb-booking-form .wcsb-button-row button:focus {
  background: #b33600 !important; /* slightly darker on hover/focus */
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(204,63,0,0.08);
  border-color: rgba(0,0,0,0.16) !important;
}
/* subtle inset to give buttons a touch of depth */
#wcsb-booking-form .wcsb-button-row button:active {
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.08);
}
/* Narrow mini-cart stacking: only affect booking meta values we control.
   We add specific classes to the booking meta values so we don't change other cart item meta. */

/* Label styling for our booking meta (keeps label bold and on its own line) */
.woocommerce-mini-cart-item .wcsb-meta-label {
  display: inline-block !important;
  /* match Artist label weight for visual consistency */
  font-weight: 700 !important;
  margin-bottom: 0 !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Value styling for our booking meta: stack beneath the label, but only for booking values we added */
.woocommerce-mini-cart-item .wcsb-meta-value {
  display: block !important;
  /* reduce bottom gap so list spacing is even */
  margin: 0 0 4px !important;
  color: #444 !important;
  font-weight: 400 !important;
}

/* Ensure paragraphs inside our meta values behave correctly */
.woocommerce-mini-cart-item .wcsb-meta-value p {
  display: block !important;
  margin: 0 0 6px !important;
}

/* Calendar button styles (moved from user-cancel.css) */
.wcsb-calendar-btn{
    background:#0073aa;
    border-color:#006799;
    color:#fff !important;
    padding:8px 12px;
    border-radius:4px;
    display:inline-block;
    text-decoration:none;
}
.wcsb-calendar-btn:hover{ background:#006799; border-color:#005a80; }
.wcsb-calendar-list{ max-width:320px; }

/* Theme-specific narrow override seen in user's inspector: target the theme's variation classes
   so we only change Booking Date and Additional Items layout. */
/* Ensure the dd (value) for these variation classes displays as block under their dt label */
ul.widget_shopping_cart li.woocommerce-mini-cart-item .variation-BookingDate,
ul.widget_shopping_cart li.woocommerce-mini-cart-item .variation-AdditionalItems,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-BookingDate,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-AdditionalItems,
li.woocommerce-mini-cart-item .variation-BookingDate,
li.woocommerce-mini-cart-item .variation-AdditionalItems,
dd.variation-BookingDate,
dd.variation-AdditionalItems {
  display: block !important;
  width: 100% !important;
  clear: both !important;
  float: none !important;
  margin: 0 0 8px !important;
}

/* If the theme uses inner <p> elements, make sure they're block too */
dd.variation-BookingDate p,
dd.variation-AdditionalItems p {
  display: block !important;
  margin: 0 0 6px !important;
}

/* Reduce vertical gap between label (dt) and value (dd) for these booking fields */
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-BookingDate,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-AdditionalItems,
dt.variation-BookingDate,
dt.variation-AdditionalItems {
  margin-bottom: 2px !important;
  padding-bottom: 0 !important;
}

/* Force booking labels to be block so their values render beneath them reliably */
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-BookingDate,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-AdditionalItems,
dt.variation-BookingDate,
dt.variation-AdditionalItems {
  display: block !important;
}

ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-BookingDate,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-AdditionalItems,
dd.variation-BookingDate,
dd.variation-AdditionalItems {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

/* Tighten paragraph spacing inside the dd to avoid stray blank lines */
dd.variation-BookingDate p,
dd.variation-AdditionalItems p {
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide Booked By and Phone from the mini-cart (only visual; order meta still stored) */
ul.widget_shopping_cart li.woocommerce-mini-cart-item .variation-BookedBy,
ul.widget_shopping_cart li.woocommerce-mini-cart-item .variation-Phone,
dd.variation-BookedBy,
dd.variation-Phone {
  display: none !important;
}

/* Some themes insert a colon via pseudo-elements (dt:after / dd:before). Hide those for our two booking fields
   so stray colons don't appear on their own line. */
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-BookingDate::after,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dt.variation-AdditionalItems::after,
dt.variation-BookingDate::after,
dt.variation-AdditionalItems::after {
  content: none !important;
}
ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-BookingDate::before,
ul.widget_shopping_cart li.woocommerce-mini-cart-item dd.variation-AdditionalItems::before,
dd.variation-BookingDate::before,
dd.variation-AdditionalItems::before {
  content: none !important;
}

/* Apply the same subtle orange price background used in the booking form to mini-cart booking prices. */
ul.widget_shopping_cart li.woocommerce-mini-cart-item strong,
ul.widget_shopping_cart li.woocommerce-mini-cart-item strong .woocommerce-Price-amount {
  background: #fff7e6 !important;
  padding: 6px 8px !important;
  border-radius: 6px !important;
  border: 1px solid #ffe6b8 !important;
  display: inline-block !important;
  margin-top: 8px !important;
  color: inherit !important;
}

/* Modal tiles: reduce right-side whitespace on narrow screens and give small right padding to meta */
@media (max-width: 600px) {
  #wcsb-equipment-modal-body .wcsb-equip-tile { width: calc(50% - 10px) !important; }
  #wcsb-equipment-modal-body .wcsb-equip-tile > div:nth-child(2) { padding-right: 5px; }
}

/* Modal tile meta styles */
#wcsb-equipment-modal-body .wcsb-equip-meta { display:flex;flex-direction:column;gap:6px;padding-right:5px; }
#wcsb-equipment-modal-body .wcsb-equip-title {
  font-weight:600;
  line-height:1.15;
  /* reserve two lines for visual consistency */
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height: 2.4em; /* ensure two-line space even if one line of copy */
}
#wcsb-equipment-modal-body .wcsb-equip-price {
  background:#fff3e0;
  color:#333;
  padding:6px;
  border-radius:4px;
  font-weight:600;
  display:inline-block;
  border:1px solid #ffe6b8;
}

/* Checkbox and controls */
#wcsb-equipment-modal-body .wcsb-equip-chkrow { display:flex;flex-direction:column;gap:8px;margin-top:6px;align-items:flex-start; }
#wcsb-equipment-modal-body .wcsb-equip-chklabel { display:flex;align-items:center;gap:8px;cursor:pointer;padding-right:5px; width:100%; }
#wcsb-equipment-modal-body .wcsb-equip-chklabel input { transform:scale(1.05); }
#wcsb-equipment-modal-body .wcsb-equip-chktext { font-weight:600; }

/* Make 'More details' button full-width on small screens for bigger tap target */
@media (max-width:600px) {
  #wcsb-equipment-modal-body .wcsb-equip-chkrow .wcsb-equip-more-details {
    width: 100%;
    box-sizing: border-box;
  }
}

/* Clean modal tile structure styles */
#wcsb-equipment-modal-body .wcsb-equip-tile {
  width: calc(33% - 12px);
  min-width: 140px;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 8px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: stretch;
}
#wcsb-equipment-modal-body .wcsb-equip-img-wrap {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fafafa;
  border-radius: 4px;
  overflow: hidden;
  cursor: pointer;
}
#wcsb-equipment-modal-body .wcsb-equip-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Button style matching main form 'add to cart' / 'book & checkout' buttons */
.wcsb-equip-action {
  background: #cc3f00;
  color: #fff;
  border: 2px solid rgba(0,0,0,0.12);
  border-radius: 6px;
  padding: 10px 12px;
  font-weight: 600;
  cursor: pointer;
}
.wcsb-equip-action:hover,
.wcsb-equip-action:focus { background: #b33600; outline: none; box-shadow: 0 0 0 3px rgba(204,63,0,0.08); }

/* Mobile adjustments */
@media (max-width: 600px) {
  #wcsb-equipment-modal-body .wcsb-equip-tile { width: calc(50% - 10px) !important; }
  #wcsb-equipment-modal-body .wcsb-equip-meta { padding-right: 5px; }
  #wcsb-equipment-modal-body .wcsb-equip-chkrow .wcsb-equip-action { width: 100%; }
}

/* Orders layout left unchanged (reverted) - nav improvements remain above */

/* Toggle button for Add to session */
.wcsb-addon-modal-btn {
  /* default to primary/action look like Details */
  background: #cc3f00;
  color: #fff;
  border: 2px solid rgba(0,0,0,0.12);
  padding: 10px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
  transition: transform 140ms ease, background 160ms ease, color 160ms ease;
}
.wcsb-addon-modal-btn.selected {
  /* darker pressed/selected state */
  background: #a83300;
  color: #fff;
  border-color: rgba(0,0,0,0.16);
  transform: scale(0.98);
}
.wcsb-addon-modal-btn:focus { outline: none; box-shadow: 0 0 0 3px rgba(0,0,0,0.06); }

/* Ensure Add toggle button matches Details button width/appearance */
#wcsb-equipment-modal-body .wcsb-equip-chklabel .wcsb-addon-modal-btn,
#wcsb-equipment-modal-body .wcsb-equip-chkrow .wcsb-equip-action {
  display: block;
  width: 100%;
  box-sizing: border-box;
}

/* Center action buttons and constrain width to make small differences less noticeable */
#wcsb-equipment-modal-body .wcsb-equip-chkrow {
  display:flex;
  flex-direction:column;
  align-items:center; /* center buttons */
}
#wcsb-equipment-modal-body .wcsb-equip-chkrow .wcsb-addon-modal-btn,
#wcsb-equipment-modal-body .wcsb-equip-chkrow .wcsb-equip-action {
  max-width: 180px; /* shared visual width */
  width: 100%;
}

/* Normalize button box model inside modal to avoid theme differences */
#wcsb-equipment-modal-body .wcsb-equip-action,
#wcsb-equipment-modal-body .wcsb-addon-modal-btn {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
  min-height: 40px !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

/* Force consistent visual appearance and prevent grey tap overlays */
#wcsb-equipment-modal-body .wcsb-equip-action,
#wcsb-equipment-modal-body .wcsb-addon-modal-btn {
  background: #cc3f00 !important;
  color: #fff !important;
  border: 2px solid rgba(0,0,0,0.12) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
  opacity: 1 !important;
}

/* Active/pressed state should stay orange (darker) not grey */
#wcsb-equipment-modal-body .wcsb-equip-action:active,
#wcsb-equipment-modal-body .wcsb-addon-modal-btn:active,
#wcsb-equipment-modal-body .wcsb-equip-action:focus,
#wcsb-equipment-modal-body .wcsb-addon-modal-btn:focus {
  background: #a83300 !important;
  color: #fff !important;
  transform: translateY(0) !important;
  box-shadow: 0 0 0 3px rgba(204,63,0,0.08) !important;
}

/* Selected state for toggle (keeps pressed appearance) */
.wcsb-addon-modal-btn.selected {
  background: #a83300 !important;
  color: #fff !important;
  border-color: rgba(0,0,0,0.16) !important;
}

/* Ensure the price text doesn't wrap oddly inside the small widget */
ul.widget_shopping_cart li.woocommerce-mini-cart-item strong .woocommerce-Price-amount {
  white-space: nowrap !important;
}

/* Booked label inside modal: two-line stacked layout, centered, small time text */
.wcsb-equip-booked { text-align: center; padding: 4px 8px; }
.wcsb-equip-booked-title { font-weight: 700; font-size: 10px; }
.wcsb-equip-booked-time { color: #b00; margin-top: 0px; font-size:10px; }

/* Price loading state */
.wcsb-price-loading { display:inline-flex; align-items:center; gap:8px; color:#666; font-size:0.95em; }
.wcsb-price-spinner { width:14px; height:14px; border:2px solid rgba(0,0,0,0.12); border-top-color:#cc3f00; border-radius:50%; animation: wcsb-spin 0.8s linear infinite; }
@keyframes wcsb-spin { to { transform: rotate(360deg); } }

/* Price fade transition */
#wcsb-price-value { display:inline-block; transition: opacity 220ms ease; }
.wcsb-price-fade-out { opacity: 0.25; }

/* Booked tooltip */
.wcsb-equip-booked { position:relative; display:inline-flex; flex-direction:column; align-items:center; gap:0px; color:#b00; text-align:center; padding:4px 8px; }
.wcsb-booked-tooltip { position:absolute; left:50%; transform:translateX(-50%); top:calc(100% + 8px); min-width:220px; background:#222;color:#fff;padding:8px 10px;border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.25);font-size:13px;display:none;z-index:10010; }
.wcsb-equip-booked:focus-within .wcsb-booked-tooltip, .wcsb-equip-booked:hover .wcsb-booked-tooltip { display:block; }
.wcsb-booked-tooltip::after { content:''; position:absolute; left:50%; transform:translateX(-50%) rotate(45deg); top:-6px; width:10px;height:10px;background:#222; }

/* My Account navigation — mobile improvements */
@media (max-width: 780px) {
  /* Ensure the nav stacks and becomes full-width for easy tapping */
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-navigation ul,
  .woocommerce-account .woocommerce-MyAccount-navigation li {
    display: block !important;
    width: 100% !important;
    float: none !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation a {
    display: block !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    border: 1px solid #eee !important;
    background: #fff !important;
    color: #222 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation a:hover {
    background: #fbfbfb !important;
  }

  /* Highlight active item in a subtle way (matches plugin price highlight) */
  .woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
  .woocommerce-account .woocommerce-MyAccount-navigation a.current,
  .woocommerce-account .woocommerce-MyAccount-navigation a.active {
    font-weight: 700 !important;
    background: #fff7e6 !important;
    border-color: #ffe6b8 !important;
  }

  /* Remove decorative pseudo elements (arrows / chevrons) that some themes add */
  .woocommerce-account .woocommerce-MyAccount-navigation a::after,
  .woocommerce-account .woocommerce-MyAccount-navigation li::before,
  .woocommerce-account .woocommerce-MyAccount-navigation a .icon,
  .woocommerce-account .woocommerce-MyAccount-navigation a .woocommerce-MyAccount-navigation-link__icon {
    display: none !important;
    content: none !important;
  }

  /* Ensure the nav sits above and the content below takes full width */
  .woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 12px !important; }
  .woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; }

  /* Improve spacing of dropdown-like nav blocks some themes use */
  .woocommerce-account nav.woocommerce-MyAccount-navigation { padding: 6px 0 !important; }
}

/* Subtle copy-ref control (placed after the message to avoid intrusive layout)
   Small, link-like button suitable for mobile tap targets without visual weight */
.wcsb-ref-ctl { margin-top:6px; display:flex; gap:10px; align-items:center; }
.wcsb-ref-ctl .wcsb-copy-text { font-weight:600; color: #222; font-size: 0.98em; }
.wcsb-ref-ctl .wcsb-copy-btn {
  background: transparent;
  border: none;
  color: #1e73be; /* link blue */
  padding: 6px 8px;
  font-size: 0.95em;
  cursor: pointer;
  text-decoration: underline;
}
.wcsb-ref-ctl .wcsb-copy-btn:focus { outline: 2px solid rgba(30,115,190,0.12); border-radius:4px; }
.wcsb-ref-ctl .wcsb-copy-btn:hover { color: #174f81; }

@media (max-width:480px) {
  .wcsb-ref-ctl { gap:8px; }
  .wcsb-ref-ctl .wcsb-copy-btn { padding: 8px 10px; font-size: 1em; }
}