/* S-Diving Event Styler v3.8 */

/* === BASE === */
body.sdiving-single-event { background: #f0f2f5 !important; }
body.sdiving-single-event:not(.sdiving-ready) .mec-wrap { opacity: 0; }
body.sdiving-single-event.sdiving-ready .mec-wrap { opacity: 1; transition: opacity 0.35s ease; }
body.sdiving-single-event .l-titlebar,
body.sdiving-single-event .w-post-elm .w-post-header { display: none !important; }



/* === HERO === */
.sdiving-hero {
    position: relative !important; background-color: #0a1628 !important;
    background-size: cover !important; background-position: center !important;
 height: 80vh; !important; display: flex !important; align-items: flex-end !important;
    overflow: hidden !important; width: 100vw !important; margin-left: calc(-50vw + 50%) !important;
}
.sdiving-hero--has-image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, rgb(10 22 40 / 79%) 0%, rgb(10 22 40 / 52%) 40%, rgba(10, 22, 40, 0.7) 75%, rgba(10, 22, 40, 0.97) 100%) !important;
    z-index: 1 !important;
}
.sdiving-hero-inner {
    position: relative !important; z-index: 2 !important;
    max-width: 1360px !important; margin: 0 auto !important;
    padding: 60px 40px 98px !important; width: 100% !important;
}
.sdiving-breadcrumb { margin-bottom: 20px !important; font-size: 14px !important; }
.sdiving-breadcrumb a { color: rgba(255,255,255,0.5) !important; text-decoration: none !important; }
.sdiving-breadcrumb a:hover { color: rgba(255,255,255,0.8) !important; }
.sdiving-sep { color: rgba(255,255,255,0.3) !important; margin: 0 8px !important; }
.sdiving-current { color: rgba(255,255,255,0.6) !important; }
.sdiving-tag {
    display: inline-flex !important; align-items: center !important; gap: 8px !important;
    padding: 8px 18px !important; background: rgba(240,145,6,0.15) !important;
    border: 1px solid rgba(240,145,6,0.64) !important; border-radius: 100px !important;
    color: #f09106 !important; font-size: 12px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; margin-bottom: 20px !important;
}
.sdiving-tag svg { stroke: #f09106 !important; }
.sdiving-title {
    font-size: clamp(36px, 5.5vw, 56px) !important; font-weight: 800 !important;
    color: #fff !important; line-height: 1.1 !important; margin: 0 0 16px !important;
    letter-spacing: -0.02em !important; max-width: 700px !important;
}
.sdiving-title-accent { color: #f09106 !important; }
.sdiving-subtitle {
    font-size: 17px !important; line-height: 1.6 !important;
    color: rgba(255,255,255,0.65) !important; margin: 0 0 32px !important; max-width: 580px !important;
}
.sdiving-badges { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; }
.sdiving-badge {
    display: flex !important; align-items: center !important; gap: 14px !important;
    padding: 16px 24px !important; background: rgba(255,255,255,0.08) !important;
    backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 16px !important; min-width: 180px !important;
}
.sdiving-badge-icon { display: flex !important; align-items: center !important; flex-shrink: 0 !important; }
.sdiving-badge-icon svg { stroke: rgba(255,255,255,0.5) !important; }
.sdiving-badge-label {
    display: block !important; font-size: 11px !important; font-weight: 600 !important;
    color: rgba(255,255,255,0.45) !important; letter-spacing: 0.08em !important; margin-bottom: 3px !important;
}
.sdiving-badge-value { display: block !important; font-size: 16px !important; font-weight: 700 !important; color: #fff !important; }

/* === CONTENT AREA === */
.sdiving-content-area {
   padding: 48px 40px 60px !important;
    width: 100vw !important; margin-left: calc(-50vw + 50%) !important;
}
.sdiving-layout {
  max-width: 1360px !important;
  margin: 0 auto !important;
    margin-top: 0px;
  display: grid !important;
  grid-template-columns: 1fr 380px !important;
  gap: 32px !important;
  align-items: start !important;
  margin-top: -100px !important;
  z-index: 1;
  position: relative;
}
.sdiving-col-left {
    min-width: 0 !important; background: #fff !important; border-radius: 24px !important;
    padding: 40px !important; box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.sdiving-col-left .mec-event-content { font-size: 16px !important; line-height: 1.75 !important; color: #374151 !important; }
.sdiving-col-left .mec-event-content h2 { font-size: 26px !important; font-weight: 800 !important; color: #050040 !important; margin: 0 0 20px !important; }
.sdiving-col-left .mec-event-content h3 { font-size: 20px !important; font-weight: 700 !important; color: #050040 !important; margin: 32px 0 12px !important; }
.sdiving-col-left .mec-event-content p { margin: 0 0 16px !important; color: #475569 !important; }
.sdiving-col-left .mec-event-content strong { font-weight: 700 !important; color: #1e293b !important; }
.sdiving-col-right { position: sticky !important; top: 24px !important; }

/* === BOOKING CARD === */
.sdiving-card {
    background: #fff !important; border-radius: 24px !important; padding: 32px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.06) !important; border: 1px solid rgba(0,0,0,0.04) !important;
}
.sdiving-card-header {
  margin-bottom: 5px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}
.sdiving-card-title { font-size: 18px !important; font-weight: 800 !important; color: #050040 !important; margin: 0 0 8px !important; }
.sdiving-card-price { display: flex !important; align-items: baseline !important; gap: 4px !important; }
.sdiving-price-amount { font-size: 40px !important; font-weight: 800 !important; color: #050040 !important; line-height: 1.1 !important; }
.sdiving-price-pp { font-size: 16px !important; color: #94a3b8 !important; font-weight: 500 !important; }


/* ============================================================
   MEC BOOKING FORM - v4.1 targeting exact MEC DOM
   Actual structure:
   form > .mec-book-first > label, img(calendar), select
   form > .mec-event-tickets-list > .mec-event-ticket > .mec-ticket-style-row
     > section-1 (icon), section-2 (name+price), section-3 (counter+avail)
       section-3 > .mec-event-ticket-input-wrapper > a.plus, input, a.minus
       section-3 > .mec-event-ticket-available
   form > hidden inputs
   form > .mec-book-form-btn-wrap > button
   ============================================================ */

/* Reset booking container */
.sdiving-card .mec-events-meta-group-booking {
    background: transparent !important; padding: 0 !important;
    margin: 0 !important; border: none !important; box-shadow: none !important;
}
.sdiving-card .mec-events-meta-group-booking h4 { display: none !important; }

/* === DATE SECTION inside .mec-book-first === */
.sdiving-card .mec-book-first {
    display: block !important;
    margin-bottom: 16px !important;
}
/* Our wrapper: label on top, select below */
.sdiving-card .sdiving-date-wrapper {
    display: flex !important; flex-direction: column !important;
    gap: 8px !important;
}
/* Date label */
.sdiving-card .sdiving-date-label {
    display: block !important; float: none !important; width: auto !important;
    color: #64748b !important; font-size: 12px !important; font-weight: 600 !important;
    text-transform: uppercase !important; letter-spacing: 0.06em !important;
    margin: 0 !important; padding: 0 !important;
}
/* Hide MEC original label if it escaped our wrapper */
.sdiving-card .mec-book-first > label { display: none !important; }
/* HIDE calendar icon image */
.sdiving-card .mec-book-first img,
.sdiving-card img[src*="calendar-icon"] {
    display: none !important;
}
/* Date select - FULL WIDTH */
.sdiving-card .sdiving-date-wrapper select,
.sdiving-card .sdiving-date-select {
    width: 100% !important; display: block !important;
    padding: 14px 40px 14px 16px !important;
    background-color: #f5f3ef !important;
    border: 1.5px solid #ece8e1 !important; border-radius: 14px !important;
    color: #1e293b !important; font-size: 16px !important; font-weight: 600 !important;
    appearance: none !important; -webkit-appearance: none !important;
    cursor: pointer !important; height: auto !important; line-height: 1.4 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%2364748b' stroke-width='1.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important; background-position: right 16px center !important;
}
.sdiving-card .mec-book-first select:focus {
    border-color: #f09106 !important; outline: none !important;
    box-shadow: 0 0 0 3px rgba(240,145,6,0.1) !important;
}

/* === TICKET LIST === */
.sdiving-card .mec-event-tickets-list {
    margin: 0 !important; padding: 0 !important;
    border: none !important; background: transparent !important;
}
.sdiving-card .mec-event-ticket { margin: 0 !important; padding: 0 !important; }

/* === TICKET ROW (beige card) === */
.sdiving-card .mec-ticket-style-row {
    display: flex !important; align-items: center !important;
    background: #f5f3ef !important;
    border: 1.5px solid #ece8e1 !important;
    border-radius: 16px !important;
    padding: 18px 20px !important;
    gap: 12px !important;
}

/* Section 1: ticket icon → HIDE */
.sdiving-card .mec-ticket-style-row-section-1 { display: none !important; }

/* Section 2: name + price → flex grow left */
.sdiving-card .mec-ticket-style-row-section-2 {
    flex: 1 !important; min-width: 0 !important;
}
.sdiving-card .mec-ticket-name-description-wrapper {
    display: flex !important; flex-direction: column !important; gap: 2px !important;
}
.sdiving-card .mec-event-ticket-name {
    color: #050040 !important; font-weight: 600 !important; font-size: 14px !important;
}
.sdiving-card .mec-event-ticket-price {
    color: #64748b !important; font-weight: 500 !important; font-size: 13px !important;
}

/* Section 3: counter only (availability moved out by JS) */
.sdiving-card .mec-ticket-style-row-section-3 {
    flex-shrink: 0 !important;
    display: flex !important; align-items: center !important;
}

/* === COUNTER: MEC renders plus,input,minus → row-reverse makes −,input,+ === */
.sdiving-card .mec-event-ticket-input-wrapper {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    gap: 0 !important;
    position: relative !important;
}
/* Reset MEC absolute positioning on buttons */
.sdiving-card .mec-event-ticket-input-wrapper a.minus,
.sdiving-card .mec-event-ticket-input-wrapper a.plus {
    position: initial !important;
    top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
}
/* Round circle buttons — compact, exact beta style */
.sdiving-card .mec-event-ticket-input-wrapper a {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    width: 38px !important; height: 38px !important;
    border-radius: 50% !important; border: none !important;
    background: #fff !important; text-decoration: none !important;
    transition: background 0.2s !important; flex-shrink: 0 !important;
    cursor: pointer !important;
}
.sdiving-card .mec-event-ticket-input-wrapper a:hover { background: #e5e0d8 !important; }
.sdiving-card .mec-event-ticket-input-wrapper a img { display: none !important; }
/* − button */
.sdiving-card .mec-event-ticket-input-wrapper a.minus::after {
    content: "\2212" !important; font-size: 16px !important; color: #1e293b !important; line-height: 1 !important; font-weight: 400 !important;
}
/* + button */
.sdiving-card .mec-event-ticket-input-wrapper a.plus::after {
    content: "+" !important; font-size: 18px !important; color: #1e293b !important; line-height: 1 !important; font-weight: 400 !important;
}
/* Number input between buttons */
.sdiving-card .mec-event-ticket-input-wrapper input[type="number"] {
    width: 44px !important; text-align: center !important;
    border: none !important; background: transparent !important;
    font-size: 22px !important; font-weight: 700 !important; color: #050040 !important;
    padding: 0 !important; margin: 0 !important;
    -moz-appearance: textfield !important;
}
.sdiving-card .mec-event-ticket-input-wrapper input[type="number"]::-webkit-outer-spin-button,
.sdiving-card .mec-event-ticket-input-wrapper input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none !important; margin: 0 !important;
}
.sdiving-card .mec-event-ticket-input-wrapper input[type="number"]:focus {
    outline: none !important; box-shadow: none !important;
}

/* === AVAILABILITY (moved outside ticket row by JS) === */
.sdiving-card .mec-event-ticket-available {
    font-size: 14px !important; color: #22c55e !important;
    font-weight: 500 !important;
}
.sdiving-card .sdiving-availability-moved {
    display: block !important;
    margin: 12px 0 8px !important;
}
.sdiving-green-dot {
  display: inline-block !important;
  width: 10px !important;
  height: 10px !important;
  background: #22c55e !important;
  border-radius: 50% !important;
  margin-right: 4px !important;
  vertical-align: middle !important;
  position: relative !important;
  animation: sdiving-pulse 1.6s ease-out infinite !important;
  font-size: 0 !important;
  margin-top: -2px;
}
@keyframes sdiving-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(34,197,94,0.7); }
    70%  { box-shadow: 0 0 0 8px rgba(34,197,94,0); }
    100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}

/* Hide unavailable/sold-out messages */
.sdiving-card .mec-ticket-unavailable-spots { display: none !important; }

/* === SUBMIT BUTTON === */
.sdiving-card .mec-book-form-btn-wrap {
    margin-top: 8px !important; padding: 0 !important;
}
.sdiving-card .mec-book-form-next-button {
    width: 100% !important; padding: 18px 24px !important; background: #f09106 !important;
    color: #fff !important; border: none !important; border-radius: 14px !important;
    font-size: 16px !important; font-weight: 700 !important; cursor: pointer !important;
    transition: all 0.3s ease !important; display: block !important; text-align: center !important;
}
.sdiving-card .mec-book-form-next-button:hover {
    background: #d17e05 !important; transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(240,145,6,0.3) !important;
}
.sdiving-card .mec-book-form-next-button svg { display: none !important; }
.sdiving-card .mec-bg-color { background: #f09106 !important; }

/* Messages */
.sdiving-card .mec-success { background: #f0fdf4 !important; color: #16a34a !important; border-radius: 12px !important; padding: 14px 18px !important; }
.sdiving-card .mec-error { background: #fef2f2 !important; color: #dc2626 !important; border-radius: 12px !important; padding: 14px 18px !important; }
.sdiving-card .mec-events-meta-group-booking hr { display: none !important; }

/* === CALENDAR EXPORT CARD === */
.sdiving-cal-card {
    background: #fff !important; border-radius: 20px !important; padding: 24px 32px !important;
    margin-top: 16px !important; box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.sdiving-cal-title { font-size: 14px !important; font-weight: 700 !important; color: #050040 !important; margin: 0 0 14px !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; }
.sdiving-cal-card .mec-event-export-module a {
    display: inline-flex !important; align-items: center !important; padding: 10px 18px !important;
    background: #f8fafc !important; border: 1.5px solid #e2e8f0 !important; border-radius: 12px !important;
    color: #475569 !important; font-size: 14px !important; font-weight: 500 !important;
    text-decoration: none !important; margin-right: 8px !important; margin-bottom: 8px !important;
}
.sdiving-cal-card .mec-event-export-module a:hover { border-color: #f09106 !important; color: #f09106 !important; }
.sdiving-cal-card .mec-event-export-module ul { list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.sdiving-cal-card .mec-event-export-module li { padding: 0 !important; margin: 0 !important; }
.sdiving-cal-card .mec-event-export-module li::before { display: none !important; }

/* === HIDE ORIGINALS === */
body.sdiving-single-event .mec-event-info-desktop,
body.sdiving-single-event .mec-events-event-image,
body.sdiving-single-event .mec-breadcrumbs,
body.sdiving-single-event .mec-event-social,
body.sdiving-single-event .mec-next-event-details,
body.sdiving-single-event .mec-single-event > .mec-single-title,
body.sdiving-single-event .mec-single-event > .mec-booking-button-register { display: none !important; }
body.sdiving-single-event .mec-single-event-date,
body.sdiving-single-event .mec-single-event-time,
body.sdiving-single-event .mec-single-event-cost,
body.sdiving-single-event .mec-single-event-location,
body.sdiving-single-event .mec-single-event-organizer,
body.sdiving-single-event .mec-single-event-category,
body.sdiving-single-event .mec-single-event dl { display: none !important; }
body.sdiving-single-event .mec-frontbox { display: none !important; }
body.sdiving-single-event .sdiving-card .mec-frontbox,
body.sdiving-single-event .sdiving-cal-card .mec-frontbox { display: block !important; }
body.sdiving-single-event .mec-single-event .mec-col-8,
body.sdiving-single-event .mec-single-event .mec-col-4 { width: 100% !important; max-width: 100% !important; flex: none !important; float: none !important; padding: 0 !important; }
body.sdiving-single-event .mec-single-event .mec-row { display: block !important; margin: 0 !important; }
body.sdiving-single-event .mec-events-meta-group { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; }

/* === RESPONSIVE === */
@media (max-width: 1024px) {
    .sdiving-layout { grid-template-columns: 1fr !important; gap: 24px !important; }
    .sdiving-col-right { position: relative !important; top: 0 !important; }
    .sdiving-hero-inner { padding: 40px 24px 36px !important; }
    .sdiving-content-area { padding: 32px 24px 48px !important; }
}
@media (max-width: 640px) {
    .sdiving-hero { min-height: 380px !important; }
    .sdiving-hero-inner { padding: 32px 16px 28px !important; }
    .sdiving-title { font-size: 32px !important; }
    .sdiving-badges { flex-direction: column !important; gap: 8px !important; }
    .sdiving-badge { min-width: 0 !important; padding: 12px 16px !important; }
    .sdiving-content-area { padding: 24px 16px 40px !important; }
    .sdiving-col-left { padding: 24px !important; border-radius: 20px !important; }
    .sdiving-card { padding: 24px !important; border-radius: 20px !important; }
    .sdiving-price-amount { font-size: 32px !important; }
}

/* ============================================================
   STAP 2: DEELNEMERSFORMULIER STYLING
   ============================================================ */

/* Reset MEC bootstrap row floats */
.sdiving-card .mec-booking-form-container.row {
    display: block !important; float: none !important;
    margin: 0 !important; width: 100% !important;
}
.sdiving-card .mec-booking-form-container .col-md-12,
.sdiving-card .mec-booking-form-container .col-md-6 {
    float: none !important; width: 100% !important;
    padding: 0 !important; box-sizing: border-box !important;
}

/* Verberg MEC iconen en subtotal blokken bovenaan */
.sdiving-card .mec-ticket-icon-wrapper { display: none !important; }
.sdiving-card .mec-ticket-subtotal-wrapper {
    display: flex !important; align-items: center !important;
    background: #f5f3ef !important; border-radius: 12px !important;
    padding: 14px 18px !important; margin-bottom: 20px !important;
    border: 1.5px solid #ece8e1 !important;
    width: 100% !important; float: none !important; clear: both !important;
    box-sizing: border-box !important;
}
.sdiving-card .mec-ticket-subtotal-wrapper .mec-ticket-name-description-wrapper {
    display: flex !important; gap: 8px !important; align-items: center !important;
}
.sdiving-card .mec-ticket-price-label {
    font-size: 13px !important; color: #64748b !important; font-weight: 500 !important;
}
.sdiving-card .mec-ticket-price {
    font-size: 15px !important; font-weight: 700 !important; color: #050040 !important;
}

/* Verberg de h4 "Deelnemersformulier" titel van MEC */
.sdiving-card .mec-booking-form-container > h4 { display: none !important; }

/* Ticket container: verberg ticket detail header (icon + subtotal per ticket) */
.sdiving-card .mec-ticket-detail { display: none !important; }

/* Lijst items — geen bullets */
.sdiving-card .mec-book-bfixed-fields-container,
.sdiving-card .mec-book-tickets-container,
.sdiving-card .mec-book-tickets-reg-fields-container {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
}
.sdiving-card .mec-book-bfixed-fields-container li,
.sdiving-card .mec-book-tickets-container li,
.sdiving-card .mec-book-tickets-reg-fields-container li {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
}
.sdiving-card .mec-book-bfixed-fields-container li::before,
.sdiving-card .mec-book-tickets-container li::before,
.sdiving-card .mec-book-tickets-reg-fields-container li::before { display: none !important; }

/* Booking form container: alles op volle breedte, kolom layout */
.sdiving-card .mec-booking-form-container {
    display: block !important; width: 100% !important;
}
.sdiving-card .mec-book-bfixed-fields-container,
.sdiving-card .mec-book-tickets-container {
    display: block !important; width: 100% !important;
}
.sdiving-card .mec-book-ticket-container {
    display: block !important; width: 100% !important;
}
/* Grid voor formuliervelden */
.sdiving-card .mec-book-tickets-reg-fields-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
    margin-bottom: 4px !important;
    width: 100% !important;
}
/* Volle breedte velden */
.sdiving-card .mec-book-reg-field-text,
.sdiving-card .mec-book-reg-field-tel,
.sdiving-card .mec-book-reg-field-textarea {
    grid-column: 1 / -1 !important;
}
/* col-md-6 naast elkaar, col-md-12 vol */
.sdiving-card .mec-book-tickets-reg-fields-container .col-md-6 {
    grid-column: span 1 !important;
}
.sdiving-card .mec-book-tickets-reg-fields-container .col-md-12 {
    grid-column: 1 / -1 !important;
}

/* Labels */
.sdiving-card .mec-booking-form-container label {
    display: block !important; font-size: 12px !important; font-weight: 600 !important;
    color: #64748b !important; text-transform: uppercase !important;
    letter-spacing: 0.05em !important; margin-bottom: 6px !important;
}
.sdiving-card .mec-booking-form-container label .wbmec-mandatory {
    color: #ef4444 !important; margin-left: 2px !important;
}

/* Veld icons verbergen */
.sdiving-card .mec-field-icon { display: none !important; }

/* Input velden */
.sdiving-card .mec-booking-form-container input[type="text"],
.sdiving-card .mec-booking-form-container input[type="email"],
.sdiving-card .mec-booking-form-container input[type="tel"],
.sdiving-card .mec-booking-form-container input[type="number"],
.sdiving-card .mec-booking-form-container select,
.sdiving-card .mec-booking-form-container textarea {
    width: 100% !important; display: block !important;
    padding: 13px 16px !important;
    background: #f5f3ef !important;
    border: 1.5px solid #ece8e1 !important;
    border-radius: 12px !important;
    color: #1e293b !important; font-size: 15px !important; font-weight: 500 !important;
    outline: none !important; transition: border-color 0.2s !important;
    box-shadow: none !important; appearance: none !important;
    -webkit-appearance: none !important;
    font-family: inherit !important;
}
.sdiving-card .mec-booking-form-container input:focus,
.sdiving-card .mec-booking-form-container select:focus,
.sdiving-card .mec-booking-form-container textarea:focus {
    border-color: #f09106 !important;
    box-shadow: 0 0 0 3px rgba(240,145,6,0.1) !important;
    background: #fff !important;
}
.sdiving-card .mec-booking-form-container textarea {
    min-height: 100px !important; resize: vertical !important;
}

/* mec-field-wrapper: zorg dat input vol is */
.sdiving-card .mec-field-wrapper { display: block !important; width: 100% !important; }

/* Terug knop */
.sdiving-card .mec-book-form-back-button {
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    padding: 12px 20px !important;
    background: #f5f3ef !important; border: 1.5px solid #ece8e1 !important;
    border-radius: 12px !important; color: #475569 !important;
    font-size: 14px !important; font-weight: 600 !important;
    cursor: pointer !important; transition: all 0.2s !important;
    text-decoration: none !important;
}
.sdiving-card .mec-book-form-back-button:hover {
    background: #ece8e1 !important; color: #1e293b !important;
}
.sdiving-card .mec-book-form-back-button img { display: none !important; }
.sdiving-card .mec-book-form-back-button::before {
    content: "←" !important; font-size: 16px !important;
}

/* Knoppen rij */
.sdiving-card .mec-book-form-btn-wrap {
    display: flex !important; flex-direction: column !important;
    gap: 10px !important; margin-top: 20px !important;
}

/* clearfix verbergen */
.sdiving-card .clearfix { display: none !important; }

/* Ticket container border weg */
.sdiving-card .mec-book-ticket-container {
    border: none !important; padding: 0 !important; margin: 0 !important;
}

/* ============================================================
   STAP 2 POPUP OVERLAY
   ============================================================ */

.sdiving-popup-overlay {
    position: fixed !important; inset: 0 !important;
    background: rgba(10,22,40,0.65) !important;
    backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important;
    z-index: 99999 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    padding: 20px !important; box-sizing: border-box !important;
    opacity: 0; pointer-events: none;
    transition: opacity 0.25s ease !important;
}
.sdiving-popup-overlay.sdiving-popup-open {
    opacity: 1 !important; pointer-events: all !important;
}
.sdiving-popup-modal {
    background: #fff !important; border-radius: 24px !important; padding: 28px !important;
    width: 100% !important; max-width: 540px !important;
    max-height: 90vh !important; overflow-y: auto !important;
    position: relative !important;
    box-shadow: 0 24px 60px rgba(0,0,0,0.2) !important;
    transform: translateY(20px);
    transition: transform 0.25s ease !important;
    box-sizing: border-box !important;
}
.sdiving-popup-overlay.sdiving-popup-open .sdiving-popup-modal {
    transform: translateY(0) !important;
}
.sdiving-popup-header {
    display: flex !important; align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 20px !important; padding-bottom: 16px !important;
    border-bottom: 1px solid #f1f5f9 !important;
}
.sdiving-popup-header h3 {
    font-size: 20px !important; font-weight: 800 !important;
    color: #050040 !important; margin: 0 !important;
}
.sdiving-popup-close {
    width: 34px !important; height: 34px !important; border-radius: 50% !important;
    background: #f5f3ef !important; border: none !important; cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 20px !important; color: #64748b !important; line-height: 1 !important;
    transition: background 0.2s !important; flex-shrink: 0 !important;
}
.sdiving-popup-close:hover { background: #ece8e1 !important; color: #1e293b !important; }
.sdiving-popup-content { display: block !important; }

/* ============================================================
   POPUP FORM INHOUD
   ============================================================ */

/* Reset MEC bootstrap floats */
.sdiving-popup-content .mec-booking-form-container,
.sdiving-popup-content .mec-booking-form-container.row {
    display: block !important; float: none !important;
    width: 100% !important; margin: 0 !important; padding: 0 !important;
    box-sizing: border-box !important;
}
/* Reset alle col-md floats */
.sdiving-popup-content .col-md-12,
.sdiving-popup-content .col-md-6 {
    float: none !important; width: 100% !important;
    padding: 0 !important; margin: 0 !important; box-sizing: border-box !important;
}
/* Verberg MEC iconen + ticket detail header */
.sdiving-popup-content .mec-ticket-icon-wrapper,
.sdiving-popup-content .mec-ticket-detail,
.sdiving-popup-content .mec-booking-form-container > h4,
.sdiving-popup-content .mec-booking-form-container > h3 { display: none !important; }

/* Subtotal blok */
.sdiving-popup-content .mec-ticket-subtotal-wrapper {
    display: flex !important; align-items: center !important; gap: 12px !important;
    background: #f5f3ef !important; border-radius: 12px !important;
    padding: 13px 18px !important; margin-bottom: 20px !important;
    border: 1.5px solid #ece8e1 !important;
    width: 100% !important; float: none !important; clear: both !important;
    box-sizing: border-box !important;
}
.sdiving-popup-content .mec-ticket-name-description-wrapper {
    display: flex !important; gap: 8px !important; align-items: center !important;
}
.sdiving-popup-content .mec-ticket-price-label {
    font-size: 13px !important; color: #64748b !important; font-weight: 500 !important;
}
.sdiving-popup-content .mec-ticket-price {
    font-size: 15px !important; font-weight: 700 !important; color: #050040 !important;
}

/* Lijst reset */
.sdiving-popup-content ul,
.sdiving-popup-content .mec-book-bfixed-fields-container,
.sdiving-popup-content .mec-book-tickets-container,
.sdiving-popup-content .mec-book-tickets-reg-fields-container {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
    display: block !important; width: 100% !important;
}
.sdiving-popup-content li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.sdiving-popup-content li::before { display: none !important; }

/* Per deelnemer sectie */
.sdiving-popup-content .mec-book-ticket-container {
    border: 1.5px solid #ece8e1 !important; border-radius: 14px !important;
    padding: 20px !important; margin-bottom: 14px !important;
    background: #fafaf9 !important; box-sizing: border-box !important;
    display: block !important; width: 100% !important; float: none !important; clear: both !important;
}
.sdiving-popup-content .mec-book-ticket-container:last-of-type { margin-bottom: 0 !important; }
.sdiving-popup-content .mec-book-ticket-container[data-ticket-label]::before {
    content: attr(data-ticket-label) !important;
    display: block !important; font-size: 11px !important; font-weight: 700 !important;
    color: #f09106 !important; text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin-bottom: 14px !important; padding-bottom: 12px !important;
    border-bottom: 1px solid #ece8e1 !important;
}

/* Velden grid */
.sdiving-popup-content .mec-book-tickets-reg-fields-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px 14px !important;
}
.sdiving-popup-content .mec-book-tickets-reg-fields-container .col-md-6 {
    grid-column: span 1 !important; float: none !important; width: auto !important;
}
.sdiving-popup-content .mec-book-tickets-reg-fields-container .col-md-12,
.sdiving-popup-content .mec-book-reg-field-text,
.sdiving-popup-content .mec-book-reg-field-tel,
.sdiving-popup-content .mec-book-reg-field-textarea {
    grid-column: 1 / -1 !important; float: none !important; width: auto !important;
}

/* Labels */
.sdiving-popup-content label {
    display: block !important; font-size: 11px !important; font-weight: 600 !important;
    color: #64748b !important; text-transform: uppercase !important;
    letter-spacing: 0.05em !important; margin-bottom: 6px !important; margin-top: 0 !important;
    float: none !important; width: auto !important;
}
.sdiving-popup-content label .wbmec-mandatory,
.sdiving-popup-content label .required { color: #ef4444 !important; }
.sdiving-popup-content .mec-field-icon { display: none !important; }
.sdiving-popup-content .mec-field-wrapper { display: block !important; width: 100% !important; }

/* Input velden */
.sdiving-popup-content input[type="text"],
.sdiving-popup-content input[type="email"],
.sdiving-popup-content input[type="tel"],
.sdiving-popup-content input[type="number"],
.sdiving-popup-content select,
.sdiving-popup-content textarea {
    width: 100% !important; display: block !important; box-sizing: border-box !important;
    padding: 10px 14px !important; background: #f5f3ef !important;
    border: 1.5px solid #ece8e1 !important; border-radius: 10px !important;
    color: #1e293b !important; font-size: 14px !important; font-weight: 500 !important;
    outline: none !important; transition: border-color 0.2s !important;
    box-shadow: none !important; appearance: none !important;
    -webkit-appearance: none !important; font-family: inherit !important;
    float: none !important;
}
.sdiving-popup-content input:focus,
.sdiving-popup-content select:focus,
.sdiving-popup-content textarea:focus {
    border-color: #f09106 !important;
    box-shadow: 0 0 0 3px rgba(240,145,6,0.1) !important;
    background: #fff !important;
}
.sdiving-popup-content textarea { min-height: 80px !important; resize: vertical !important; }

/* Knoppen */
.sdiving-popup-content .mec-book-form-btn-wrap {
    display: flex !important; flex-direction: column !important;
    gap: 10px !important; margin-top: 20px !important;
    padding-top: 16px !important; border-top: 1px solid #f1f5f9 !important;
}
.sdiving-popup-content .mec-book-form-next-button {
    width: 100% !important; padding: 16px 24px !important; background: #f09106 !important;
    color: #fff !important; border: none !important; border-radius: 12px !important;
    font-size: 16px !important; font-weight: 700 !important; cursor: pointer !important;
    transition: background 0.2s !important; display: block !important; text-align: center !important;
}
.sdiving-popup-content .mec-book-form-next-button:hover { background: #d17e05 !important; }
.sdiving-popup-content .mec-book-form-back-button {
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    padding: 11px 18px !important; background: #f5f3ef !important;
    border: 1.5px solid #ece8e1 !important; border-radius: 10px !important;
    color: #475569 !important; font-size: 14px !important; font-weight: 600 !important;
    cursor: pointer !important; transition: background 0.2s !important;
    width: auto !important;
}
.sdiving-popup-content .mec-book-form-back-button:hover { background: #ece8e1 !important; }
.sdiving-popup-content .mec-book-form-back-button img { display: none !important; }
.sdiving-popup-content .mec-book-form-back-button::before { content: "\2190" !important; font-size: 15px !important; }
.sdiving-popup-content .clearfix { display: none !important; }