/* Move360 Bookings widget — inherits section colours via currentColor */
.m360b-widget { max-width: 860px; margin: 0 auto; font-weight: 500; }
.m360b-loading { opacity: .7; padding: 1rem 0; }

.m360b-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.m360b-price { font-weight: 700; }

/* Day strip */
.m360b-days { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .5rem; margin-bottom: 1.2rem; scrollbar-width: thin; }
.m360b-day {
  flex: 0 0 auto; min-width: 64px; padding: .6rem .5rem; text-align: center; cursor: pointer;
  border: 1px solid color-mix(in srgb, currentColor 30%, transparent); border-radius: 12px;
  background: none; color: inherit; font: inherit;
}
.m360b-day[disabled] { opacity: .35; cursor: default; }
.m360b-day .wd { display: block; font-size: .75rem; text-transform: uppercase; opacity: .75; }
.m360b-day .dn { display: block; font-size: 1.25rem; font-weight: 700; line-height: 1.3; }
.m360b-day .mo { display: block; font-size: .75rem; opacity: .75; }
.m360b-day.is-selected { background: currentColor; }
.m360b-day.is-selected span { color: #fff; } /* on light sections currentColor is black */
.m360-section--black .m360b-day.is-selected span,
.m360-section--navy .m360b-day.is-selected span,
.wp-block-cover .m360b-day.is-selected span { color: #000; }

/* Slot grid */
.m360b-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .7rem; margin-bottom: 1.2rem; }
.m360b-slot {
  padding: .8rem .6rem; text-align: center; cursor: pointer; border-radius: 12px;
  border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
  background: none; color: inherit; font: inherit;
}
.m360b-slot strong { display: block; font-size: 1.05rem; }
.m360b-slot small { opacity: .75; }
.m360b-slot:hover:not([disabled]) { border-color: currentColor; }
.m360b-slot.is-selected { outline: 2px solid currentColor; }
.m360b-slot[disabled] { opacity: .35; cursor: default; text-decoration: line-through; }
.m360b-noslots { opacity: .7; padding: .5rem 0 1rem; }

/* Form */
.m360b-form { border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent); padding-top: 1.2rem; display: grid; gap: .9rem; max-width: 560px; }
.m360b-form label { font-weight: 600; display: block; }
.m360b-form input, .m360b-form select {
  width: 100%; margin-top: .3rem; padding: 12px 14px; border-radius: 10px;
  border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
  background: color-mix(in srgb, currentColor 6%, transparent);
  color: inherit; font: inherit;
}
/* The open dropdown list is drawn by the OS and does NOT inherit the section's
   dark theme — without this, white text lands on a white popup and the options
   are invisible on black/navy sections. */
.m360b-form select option,
.m360b-form select optgroup {
  color: #000;
  background-color: #fff;
}
.m360b-form .m360b-row { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
@media (max-width: 560px) { .m360b-form .m360b-row { grid-template-columns: 1fr; } }

.m360b-submit {
  display: inline-block; border: 0; cursor: pointer; border-radius: 300px; padding: 1.05em 2em;
  font: 600 1rem/1.2 inherit; font-family: inherit; text-transform: uppercase;
  background: var(--m360-navy, #253551); color: #fff; justify-self: start;
}
.m360-section--black .m360b-submit, .m360-section--navy .m360b-submit, .wp-block-cover .m360b-submit { background: #fff; color: #000; }
.m360b-submit[disabled] { opacity: .5; cursor: wait; }

.m360b-summary { font-weight: 600; }
.m360b-error { color: #c0392b; font-weight: 600; }
.m360-section--black .m360b-error, .m360-section--navy .m360b-error { color: #ff8a80; }
.m360b-success { border: 1px solid color-mix(in srgb, currentColor 30%, transparent); border-radius: 14px; padding: 1.2rem; }
.m360b-success h4 { margin: 0 0 .4rem; }

/* Status page */
.m360b-status { max-width: 640px; }
.m360b-details { margin: 1.1rem 0; border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent); }
.m360b-detail {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: .65rem 0;
  border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}
.m360b-detail span { opacity: .65; font-weight: 500; }
.m360b-note { opacity: .8; }
