/* ═══ CEM Booking Widget — Elementor-proof (ID-scoped) ═══ */

.cem-bw, .cem-bw * { box-sizing: border-box; }
.cem-bw { margin: 28px 0; font-family: "manrope"; }
.cem-bw__empty { text-align: center; color: #999; padding: 20px; font-size: 14px; }

/* ════════════════════════════════════════════════════════════════
   RESET — neutralize Elementor kit styles inside the widget.
   ID selector (#cem-booking-widget) outranks .elementor-kit-X rules.
   ════════════════════════════════════════════════════════════════ */

#cem-booking-widget h4,
#cem-booking-widget p {
    margin: 0;
    padding: 0;
    font-family: inherit;
    text-transform: none;
    letter-spacing: normal;
}

#cem-booking-widget button {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: 1.4;
    color: inherit;
    min-height: 0;
    min-width: 0;
    width: auto;
    transition: none;
}
#cem-booking-widget button:hover,
#cem-booking-widget button:focus {
    background: none;
    color: inherit;
    border: none;
    box-shadow: none;
}
#cem-booking-widget button:focus-visible {
    outline: 2px solid rgba(74, 44, 90, .45);
    outline-offset: 2px;
}

/* ════════════════════════════════════════════════════════════════
   COMPONENT STYLES — all ID-prefixed so they outrank the reset
   ════════════════════════════════════════════════════════════════ */

/* ── Grid ── */
#cem-booking-widget .cem-bw__grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr 1fr;
    gap: 40px;
}
@media (max-width: 880px) {
    #cem-booking-widget .cem-bw__grid { grid-template-columns: 1fr; gap: 24px; }
}

/* ── Step headings ── */
#cem-booking-widget .cem-bw__step {
    font-size: 24px; font-weight: 700; color: #1c2240;
    margin: 0 0 30px;
}
#cem-booking-widget .cem-bw__hint {     font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);      color: var(--e-global-color-text); margin: 4px 0; }
#cem-booking-widget .cem-bw__note {     font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);     color: var(--e-global-color-text); margin: 0 0 16px; }

/* ── Calendar card ── */
#cem-booking-widget .cem-bw__calendar {
    border: 2px solid #57395C;
    border-radius: 14px;
    padding: 16px 14px 12px;
    background: #fff;
    max-width: 100%;
}
#cem-booking-widget .cem-bw__cal-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 12px; padding: 0 2px;
}
#cem-booking-widget .cem-bw__cal-title {
    font-size: 24px; font-weight: 700; color: #4a2c5a;
}
#cem-booking-widget .cem-bw__cal-nav {
    width: max-content;
    height: 25px;
    border-radius: 50%;
    border: 2px solid #57395C;
    background: #fff;
    color: #4a2c5a;
    cursor: pointer;
    font-size: 25px;
    font-weight: 600;
    padding: 10px 5px 13px 5px;
    line-height: 0px;
    display: inline-flex;
    transition: all .14s;
    flex-direction: column;
    justify-content: center;
}
#cem-booking-widget .cem-bw__cal-nav:hover {
    background: #f4eef9; border: 1.5px solid #4a2c5a; color: #4a2c5a;
}

/* ── Calendar grid with cell borders ── */
#cem-booking-widget .cem-bw__cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;                                  /* borders touch — no gap */
}

/* Weekday header row joins the grid */
#cem-booking-widget .cem-bw__cal-weekdays {
    margin-bottom: 0;
    border-top: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
}
#cem-booking-widget .cem-bw__cal-wd {
    text-align: center; font-size: 12px; font-weight: 600;
    color: #a8adb8; padding: 6px 0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

/* Day cells: every box gets a border (right+bottom per cell,
   left edge on the container — avoids doubled 2px lines) */
#cem-booking-widget .cem-bw__cal-days {
    border-left: 1px solid #e0e0e0;
}
#cem-booking-widget .cem-bw__cal-day {
    aspect-ratio: 1 / 1;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 500;
    color: #2b3148;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    border-radius: 0;
    position: relative;
    z-index: 0;
}
#cem-booking-widget .cem-bw__cal-day.is-other,
#cem-booking-widget .cem-bw__cal-day.is-disabled { color: #c8ccd4; }
#cem-booking-widget .cem-bw__cal-day.is-enabled  { cursor: pointer; color: #2b3148; }

/* Hover + selected: purple circle INSIDE the bordered cell */
#cem-booking-widget .cem-bw__cal-day.is-enabled:hover::before {
    content: "";
    position: absolute; inset: 4px;
    border-radius: 50%;
    background: #efe7f5;
    z-index: -1;
}
#cem-booking-widget .cem-bw__cal-day.is-selected { color: #fff; }
#cem-booking-widget .cem-bw__cal-day.is-selected::before,
#cem-booking-widget .cem-bw__cal-day.is-selected:hover::before {
    content: "";
    position: absolute; inset: 4px;
    border-radius: 50%;
    background: #4a2c5a;
    z-index: -1;
}

/* ── Time slots ── */
#cem-booking-widget .cem-bw__slots {
    display: flex; flex-direction: column; gap: 11px; max-width: 320px;
}
#cem-booking-widget .cem-bw__slot {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 16px;
    border: 1px solid #b5c9b8;
    border-radius: 9px;
    background: #fff; cursor: pointer;
    transition: all .14s;
    width: 100%; text-align: left;
}
#cem-booking-widget .cem-bw__slot:hover {
    background: #fff; border: 1px solid #4a2c5a;
}
#cem-booking-widget .cem-bw__slot.is-selected,
#cem-booking-widget .cem-bw__slot.is-selected:hover {
    background: #4a2c5a; border: 1px solid #4a2c5a;
}
#cem-booking-widget .cem-bw__slot.is-selected .cem-bw__slot-time,
#cem-booking-widget .cem-bw__slot.is-selected .cem-bw__slot-status { color: #fff; }
#cem-booking-widget .cem-bw__slot.is-soldout,
#cem-booking-widget .cem-bw__slot.is-soldout:hover {
    border: 1px solid #d9dde3; background: #fff; cursor: default;
}

#cem-booking-widget .cem-bw__slot-time {
    font-size: 20px; font-weight: 500; color: #1c2240;
}
#cem-booking-widget .cem-bw__slot-status { font-size: 20px; font-weight: 500; }
#cem-booking-widget .cem-bw__slot-status.is-ok      { color: #1d9e3f; }
#cem-booking-widget .cem-bw__slot-status.is-low     { color: #b8a000; }
#cem-booking-widget .cem-bw__slot-status.is-soldout { color: #c0271c; }

/* ── Stepper pill ── */
#cem-booking-widget .cem-bw__stepper {
    display: inline-flex; align-items: center; gap: 20px;
    border: 1.5px solid #1c2240; border-radius: 15px;
    padding: 9px 15px; margin-bottom: 14px;
    background: #fff;
}
#cem-booking-widget .cem-bw__step-btn {
    cursor: pointer;
    font-size: 24px; font-weight: 600; color: #1c2240;
    line-height: 1; padding: 0 2px;
    display: inline-flex; align-items: center; justify-content: center;
}
#cem-booking-widget .cem-bw__step-btn:hover { color: #4a2c5a; }
#cem-booking-widget .cem-bw__count {
    font-size: 16px; font-weight: 700; color: #1c2240;
    min-width: 18px; text-align: center;
}

#cem-booking-widget .cem-bw__people-label {
    display: flex; align-items: center; gap: 7px;
    font-size: 13.5px; color: #2b3148; margin: 0 0 22px;
}
#cem-booking-widget .cem-bw__person-ico { color: #2b3148; flex-shrink: 0; }

/* ── Reserve button ── */
#cem-booking-widget .cem-bw__reserve {
    width: 100%; max-width: 230px;
    padding: 14px 20px;
    background: #4a2c5a; color: #fff;
    border: none; border-radius: 9px;
    font-size: var(--e-global-typography-e2d2108-font-size);
    font-weight: var(--e-global-typography-e2d2108-font-weight);
    cursor: pointer; transition: background .14s;
    display: inline-flex; align-items: center; justify-content: center;
}
#cem-booking-widget .cem-bw__reserve:hover {
    background: #3a2148; color: #fff; border: none;
}
#cem-booking-widget .cem-bw__reserve:disabled { opacity: .65; cursor: default; }