/* SDS Lesson Booking — frontend */
.sdsb-form{--sdsb-brand:#01bf63;--sdsb-dark:#0d1411;--sdsb-line:#e1eae4;--sdsb-slate:#5a6660;
  max-width:860px;margin:0 auto;font-size:15px;color:#22282f}
.sdsb-steps{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 26px;padding:0}
.sdsb-steps li{flex:1;min-width:110px;text-align:center;font-size:12px;font-weight:600;color:var(--sdsb-slate);
  padding:8px 4px;border-bottom:3px solid var(--sdsb-line)}
.sdsb-steps li span{display:block;width:26px;height:26px;line-height:26px;border-radius:50%;
  background:var(--sdsb-line);color:#22282f;margin:0 auto 5px;font-weight:700}
.sdsb-steps li.active{color:var(--sdsb-dark);border-color:var(--sdsb-brand)}
.sdsb-steps li.active span,.sdsb-steps li.done span{background:var(--sdsb-brand);color:#fff}
.sdsb-steps li.done{border-color:var(--sdsb-brand)}
.sdsb-panel{display:none}
.sdsb-panel.active{display:block;animation:sdsbIn .25s ease}
@keyframes sdsbIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sdsb-panel h3{margin:0 0 14px;font-size:22px}
.sdsb-cat{margin:18px 0 10px;font-size:15px;color:var(--sdsb-slate);text-transform:uppercase;letter-spacing:.06em}
.sdsb-lessons{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sdsb-choice{display:block;cursor:pointer;position:relative}
.sdsb-choice input{position:absolute;opacity:0}
.sdsb-choice-in{display:block;border:2px solid var(--sdsb-line);border-radius:10px;padding:14px;height:100%;transition:.15s}
.sdsb-choice-in strong{display:block;margin-bottom:2px}
.sdsb-choice-in em{font-style:normal;color:var(--sdsb-brand);font-weight:700;font-size:13px}
.sdsb-choice-in small{display:block;color:var(--sdsb-slate);margin-top:5px;line-height:1.4}
.sdsb-choice input:checked + .sdsb-choice-in{border-color:var(--sdsb-brand);box-shadow:0 8px 22px rgba(1,191,99,.15)}
.sdsb-slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sdsb-slot{border:2px solid var(--sdsb-line);background:#fff;border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:600}
.sdsb-slot:hover{border-color:var(--sdsb-brand)}
.sdsb-slot.selected{background:var(--sdsb-brand);border-color:var(--sdsb-brand);color:#fff}
.sdsb-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sdsb-fields label{display:block;font-weight:600;font-size:13px}
.sdsb-fields .sdsb-wide{grid-column:1/-1}
.sdsb-fields input,.sdsb-fields select,.sdsb-fields textarea,#sdsbForm input[type=date]{width:100%;border:1px solid var(--sdsb-line);
  border-radius:8px;padding:10px 12px;margin-top:5px;font:inherit}
.sdsb-fields input:focus,.sdsb-fields textarea:focus{outline:none;border-color:var(--sdsb-brand);box-shadow:0 0 0 3px rgba(1,191,99,.18)}
.sdsb-review{width:100%;border-collapse:collapse}
.sdsb-review th{width:200px;text-align:left;color:var(--sdsb-slate);font-weight:600}
.sdsb-review th,.sdsb-review td{padding:8px 10px;border-bottom:1px dashed var(--sdsb-line)}
.sdsb-payopts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
#sdsbCard{border:1px solid var(--sdsb-line);border-radius:10px;padding:16px;margin-bottom:14px}
.sdsb-total{font-size:18px}
.sdsb-total strong{color:var(--sdsb-brand)}
.sdsb-nav{display:flex;justify-content:space-between;gap:10px;margin-top:24px}
.sdsb-btn{border:2px solid var(--sdsb-line);background:#fff;border-radius:8px;padding:11px 26px;font-weight:700;cursor:pointer;font:inherit}
.sdsb-primary{background:var(--sdsb-brand);border-color:var(--sdsb-brand);color:#fff;margin-left:auto}
.sdsb-primary:hover{background:#00a254;border-color:#00a254}
.sdsb-primary:disabled{opacity:.6;cursor:wait}
.sdsb-hidden{display:none!important}
.sdsb-msg{margin-top:12px;font-weight:600;scroll-margin-top:90px}
.sdsb-msg.sdsb-err{color:#c0392b}
.sdsb-msg.sdsb-ok{color:var(--sdsb-brand)}
.sdsb-success{text-align:center;padding:30px 10px}
.sdsb-success h3{font-size:26px}
@media(max-width:640px){.sdsb-fields,.sdsb-payopts{grid-template-columns:1fr}}

/* Mobile: keep Back/Continue always visible without scrolling — pin
   them to the bottom of the viewport instead of the end of the form. */
@media(max-width:767px){
  .sdsb-panels{ padding-bottom: 92px; padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
  .sdsb-nav{
    position: fixed;
    left: 0; right: 0; bottom: 0;
    margin-top: 0;
    background: #fff;
    padding: 12px 16px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -4px 18px rgba(13,20,17,.12);
    z-index: 500;
  }
  .sdsb-btn{ flex: 1; text-align: center; }
  .sdsb-primary{ margin-left: 0; }
  /* The theme's floating "back to top" button (z-index 1030) would
     otherwise sit on top of the sticky Continue button. */
  body.sdsb-has-form #backToTop{ display: none !important; }

  /* --- Compact mode: smaller fonts, tighter spacing throughout --- */
  .sdsb-form{ font-size: 13.5px; }

  .sdsb-steps{ gap: 4px; margin-bottom: 14px; }
  .sdsb-steps li{ min-width: 0; font-size: 9.5px; padding: 6px 2px; }
  .sdsb-steps li span{ width: 20px; height: 20px; line-height: 20px; margin-bottom: 3px; font-size: 11px; }

  .sdsb-panel h3{ font-size: 18px; margin-bottom: 8px; padding-bottom: 7px; }
  .sdsb-manage .sdsb-panel h3{ margin-bottom: 6px; }

  .sdsb-tabs{ gap: 6px; margin: 2px 0 12px; }
  .sdsb-tab{ padding: 7px 14px; font-size: 13px; }

  .sdsb-cat{ margin: 12px 0 6px; font-size: 11px; }

  .sdsb-lessons{ gap: 8px; }
  .sdsb-choice-in{ padding: 10px 12px 9px; border-radius: 8px; }
  .sdsb-choice-in strong{ font-size: 13.5px; margin-bottom: 1px; }
  .sdsb-choice-in em{ font-size: 11.5px; }
  .sdsb-choice-in small{ font-size: 12px; margin-top: 3px; line-height: 1.35; }
  .sdsb-price{ font-size: 13.5px; }
  .sdsb-readmore{ font-size: 11px; margin-top: 5px; }
  .sdsb-tick{ width: 18px; height: 18px; top: 7px; right: 7px; }
  .sdsb-tick svg{ width: 11px; height: 11px; }

  .sdsb-inst-head{ gap: 7px; margin-bottom: 3px; }
  .sdsb-avatar{ width: 38px; height: 38px; }
  .sdsb-avatar-txt{ font-size: 13px; }

  .sdsb-slots{ gap: 6px; margin-top: 8px; }
  .sdsb-slot{ padding: 6px 10px; font-size: 12.5px; }
  .sdsb-slot-tip{ width: 190px; font-size: 11.5px; padding: 8px 10px; }

  .sdsb-fields{ gap: 10px; }
  .sdsb-fields label{ font-size: 12px; }
  .sdsb-fields input,.sdsb-fields select,.sdsb-fields textarea,#sdsbForm input[type=date]{
    padding: 8px 10px; margin-top: 3px; font-size: 13.5px; }

  .sdsb-review th,.sdsb-review td{ padding: 6px 8px; font-size: 12.5px; }
  .sdsb-review th{ width: 130px; }

  .sdsb-payopts{ gap: 8px; margin-bottom: 10px; }
  .sdsb-totals{ margin: 4px 0 10px; }
  .sdsb-tline{ padding: 4px 0; font-size: 12.5px; }
  .sdsb-tline-total{ font-size: 15px; }

  .sdsb-msg{ margin-top: 8px; font-size: 12.5px; }

  .sdsb-modal-box{ padding: 18px; border-radius: 10px; }
  .sdsb-modal-box h3{ font-size: 17px; }
  .sdsb-modal-meta{ margin-bottom: 8px; font-size: 12.5px; }
  .sdsb-modal-body{ font-size: 13px; margin-bottom: 12px; }

  .sdsb-manage-actions{ gap: 8px; margin-top: 10px; }
  .sdsb-btn{ padding: 9px 16px; font-size: 13px; }
}

/* ===== v1.1 visual upgrade ===== */
.sdsb-form{font-family:inherit}
.sdsb-panel h3{font-size:24px;position:relative;padding-bottom:10px}
.sdsb-panel h3::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:4px;border-radius:2px;
  background:repeating-linear-gradient(90deg,var(--sdsb-brand) 0 10px,transparent 10px 16px)}
.sdsb-choice-in{position:relative;background:#fff;box-shadow:0 1px 2px rgba(13,20,17,.05);padding:16px 16px 14px}
.sdsb-choice:hover .sdsb-choice-in{transform:translateY(-2px);box-shadow:0 10px 24px rgba(13,20,17,.08);border-color:#bfe9d4}
.sdsb-choice input:checked + .sdsb-choice-in{transform:translateY(-2px);background:linear-gradient(180deg,#f4fdf8,#fff)}
.sdsb-tick{position:absolute;top:10px;right:10px;width:24px;height:24px;border-radius:50%;
  border:2px solid var(--sdsb-line);display:flex;align-items:center;justify-content:center;color:transparent;transition:.15s}
.sdsb-choice input:checked + .sdsb-choice-in .sdsb-tick{background:var(--sdsb-brand);border-color:var(--sdsb-brand);color:#fff}
.sdsb-price{font-size:16px}
.sdsb-readmore{margin-top:9px;background:none;border:none;padding:0;color:var(--sdsb-brand);font-weight:700;
  font-size:13px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-family:inherit}
.sdsb-readmore:hover{color:#00824a}
.sdsb-inst-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.sdsb-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--sdsb-brand);flex-shrink:0}
.sdsb-avatar-txt{display:inline-flex;align-items:center;justify-content:center;background:#e7f9f0;
  color:#0a7a43;font-weight:800;font-size:17px}
.sdsb-fields input.sdsb-invalid,.sdsb-fields select.sdsb-invalid,.sdsb-fields textarea.sdsb-invalid{
  border-color:#c0392b;box-shadow:0 0 0 3px rgba(192,57,43,.14)}
.sdsb-noscroll{overflow:hidden}
.sdsb-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px}
.sdsb-modal-backdrop{position:absolute;inset:0;background:rgba(13,20,17,.6);backdrop-filter:blur(2px)}
.sdsb-modal-box{position:relative;background:#fff;border-radius:14px;max-width:520px;width:100%;
  padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.3);animation:sdsbIn .2s ease}
.sdsb-modal-box h3{margin:0 0 6px;font-size:22px;padding-right:30px}
.sdsb-modal-meta{color:var(--sdsb-brand);font-weight:800;margin:0 0 12px}
.sdsb-modal-body{color:#3a434b;line-height:1.65;max-height:45vh;overflow:auto;margin-bottom:18px;white-space:pre-line}
.sdsb-modal-close{position:absolute;top:12px;right:14px;background:none;border:none;font-size:26px;
  line-height:1;cursor:pointer;color:var(--sdsb-slate)}
.sdsb-modal-close:hover{color:#c0392b}
.sdsb-modal-select{width:100%}
.sdsb-steps li{position:relative}
.sdsb-steps li span{transition:.2s;box-shadow:0 0 0 0 rgba(1,191,99,.3)}
.sdsb-steps li.active span{box-shadow:0 0 0 5px rgba(1,191,99,.18)}

/* Category tabs (step 1) */
.sdsb-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 18px}
.sdsb-tab{border:2px solid var(--sdsb-line);background:#fff;border-radius:30px;padding:9px 24px;
  font-weight:700;cursor:pointer;font:inherit;color:var(--sdsb-slate);transition:.15s}
.sdsb-tab:hover{border-color:var(--sdsb-brand);color:#0a7a43}
.sdsb-tab.active{background:var(--sdsb-brand);border-color:var(--sdsb-brand);color:#fff;
  box-shadow:0 6px 16px rgba(1,191,99,.25)}
.sdsb-tabpane{display:none}
.sdsb-tabpane.active{display:block;animation:sdsbIn .2s ease}

/* GST / totals breakdown */
.sdsb-totals{max-width:340px;margin:6px 0 14px}
.sdsb-tline{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--sdsb-line)}
.sdsb-tline-total{font-size:18px;font-weight:800;border-bottom:none}
.sdsb-tline-total span:last-child{color:var(--sdsb-brand)}
.sdsb-tline-sub{border-bottom:none;color:var(--sdsb-slate);font-size:13px;padding-top:0}

/* Manage My Booking */
.sdsb-manage-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.sdsb-btn.sdsb-danger{border-color:#e2b3ad;color:#c0392b}
.sdsb-btn.sdsb-danger:hover{background:#c0392b;border-color:#c0392b;color:#fff}
.sdsb-btn:disabled{opacity:.5;cursor:not-allowed}
.sdsb-manage .sdsb-panel h3{margin-bottom:10px}

/* Booked (unavailable) time slots — shown but disabled, with a tooltip */
.sdsb-slot-booked{
  background:#f3f3f3;
  border-color:var(--sdsb-line);
  color:#aab0ad;
  text-decoration:line-through;
  cursor:help;
  position:relative;
}
.sdsb-slot-booked:hover{border-color:var(--sdsb-line)}

/* Popover tooltip on booked slots — real markup (not a title attr) so the
   phone/email inside can be genuine clickable links. Shown on hover for
   desktop, and toggled via .sdsb-tip-open (tap) for touch devices. */
.sdsb-slot-tip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 10px);
  transform:translateX(-50%) translateY(4px);
  width:220px;
  max-width:60vw;
  background:var(--sdsb-dark);
  color:#fff;
  text-decoration:none;
  font-size:12.5px;
  font-weight:500;
  line-height:1.5;
  text-align:center;
  padding:10px 12px;
  border-radius:8px;
  box-shadow:0 10px 26px rgba(13,20,17,.25);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .15s ease, transform .15s ease;
  z-index:20;
}
.sdsb-slot-tip::after{
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  border:6px solid transparent;
  border-top-color:var(--sdsb-dark);
}
.sdsb-slot-tip a{ color:var(--sdsb-brand); text-decoration:underline; font-weight:700; }
.sdsb-slot-booked:hover .sdsb-slot-tip,
.sdsb-slot-booked:focus-within .sdsb-slot-tip,
.sdsb-slot-booked.sdsb-tip-open .sdsb-slot-tip{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

/* Mobile-only: keep category tabs on one line, and use tighter
   multi-column grids for Instructor/Location. Placed at the end of the
   file so it correctly overrides the base .sdsb-tabs/.sdsb-tab rules
   above (same specificity — CSS source order decides the winner). */
@media(max-width:767px){
  .sdsb-tabs{ flex-wrap: nowrap; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; }
  .sdsb-tabs::-webkit-scrollbar{ display: none; }
  .sdsb-tab{ flex-shrink: 0; padding: 7px 12px; font-size: 12.5px; }

  #sdsbInstructors .sdsb-lessons{ grid-template-columns: repeat(2, 1fr); gap: 7px; }
  #sdsbLocations .sdsb-lessons{ grid-template-columns: repeat(3, 1fr); gap: 6px; }
  #sdsbInstructors .sdsb-choice-in,
  #sdsbLocations .sdsb-choice-in{ padding: 8px 8px 7px; text-align: center; }
  #sdsbInstructors .sdsb-inst-head{ flex-direction: column; gap: 4px; }
  #sdsbInstructors .sdsb-choice-in strong{ font-size: 11.5px; line-height: 1.25; }
  #sdsbLocations .sdsb-choice-in strong{ font-size: 11.5px; line-height: 1.25; }
  #sdsbInstructors .sdsb-avatar{ width: 34px; height: 34px; }
  #sdsbInstructors .sdsb-tick,
  #sdsbLocations .sdsb-tick{ width: 15px; height: 15px; top: 4px; right: 4px; }
  #sdsbInstructors .sdsb-tick svg,
  #sdsbLocations .sdsb-tick svg{ width: 9px; height: 9px; }
}

/* Google Places address autosuggest dropdown */
.sdsb-optional{ font-weight: 400; font-size: 12px; color: var(--sdsb-slate); }
.sdsb-addr-suggest{
  position: absolute;
  z-index: 40;
  background: #fff;
  border: 1px solid var(--sdsb-line);
  border-radius: 8px;
  margin-top: 4px;
  box-shadow: 0 10px 26px rgba(13,20,17,.12);
  overflow: hidden;
}
.sdsb-addr-suggest-item{
  padding: 10px 14px;
  font-size: 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--sdsb-line);
}
.sdsb-addr-suggest-item:last-child{ border-bottom: none; }
.sdsb-addr-suggest-item:hover{ background: #f3f8f5; }