/* ============================================================
   Community Draws — Onboarding UI (Core Design System)
   File: /wp-content/mu-plugins/cd-onboarding-ui.css
   Scope: Registration + Dokan Wizard + Theme Page + Draw Configure

   GOALS
   - One consistent “card” system
   - Unified fields/buttons styling
   - Hide native setup steps (we render our own)
   - Fix iOS/mobile gutter issue (root overflow + Select2 hidden select offender)
   ============================================================ */


/* ============================================================
   0) Design Tokens
   ============================================================ */
:root{
  --cd-primary: #6cc46f;
  --cd-ink: #0f172a;
  --cd-muted: #64748b;
  --cd-border: rgba(229,231,235,.95);
  --cd-border-strong: rgba(203,213,225,.9);
  --cd-bg: #ffffff;

  --cd-radius: 18px;
  --cd-radius-sm: 12px;

  --cd-field-h: 46px;
  --cd-field-pad-x: 14px;

  /* ✅ Consistent left/right gutters across mobile/tablet/desktop */
  --cd-gutter: clamp(14px, 4vw, 22px);

  --cd-shadow:
    0 12px 28px rgba(0,0,0,.08),
    0 22px 60px rgba(0,0,0,.06);

  --cd-focus: 0 0 0 3px rgba(108,196,111,.35);
}


/* ============================================================
   1) Hard Scope + Box Model Safety
   - Keep changes restricted to onboarding surfaces
   ============================================================ */
.cd-vendor-reg-outer,
body.wc-setup,
body.wc-setup .wc-setup,
body.wc-setup .wc-setup-content,
.cd-onboarding-scope,
.cd-onboarding-progress{
  box-sizing: border-box;
}

.cd-vendor-reg-outer *,
body.wc-setup *,
.cd-onboarding-scope *,
.cd-onboarding-progress *,
.cd-vendor-reg-outer *::before,
body.wc-setup *::before,
.cd-onboarding-scope *::before,
.cd-onboarding-progress *::before,
.cd-vendor-reg-outer *::after,
body.wc-setup *::after,
.cd-onboarding-scope *::after,
.cd-onboarding-progress *::after{
  box-sizing: inherit;
}


/* ============================================================
   2) Wizard Page Frame + Root Overflow Controls
   ============================================================ */

/* Kill html margins ONLY when the wizard is running (scoped).
   Safari iOS + Chrome mobile support :has() now. */
html:has(body.wc-setup){
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

/* Wizard pages: no body margin/padding */
body.wc-setup{
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
  overflow-x: hidden !important;
}

/* Keep global overflow-x protection (harmless) */
html{
  overflow-x: hidden !important;
}

/* Some themes wrap content in #page/#content with padding/margins */
body.wc-setup .woocommerce,
body.wc-setup #page,
body.wc-setup #content{
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  overflow-x: hidden !important;
}

/* The wizard outer wrapper — keep it simple; we enforce gutters on the cards */
body.wc-setup .wc-setup{
  margin: 0 auto !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
}


/* ============================================================
   iOS overflow fix — VERIFIED OFFENDER (Select2 hidden <select>)
   select.wc-enhanced-select.select2-hidden-accessible
   ⚠️ DO NOT REMOVE — removing will reintroduce the right-gutter bug
   ============================================================ */
body.wc-setup select.select2-hidden-accessible{
  position: absolute !important;
  left: 0 !important;
  max-width: 100vw !important;
  width: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}


/* ============================================================
   3) Card Containers (Vendor Registration + Wizard)
   ============================================================ */

/* Vendor Registration card */
.cd-vendor-reg-outer form.dokan-vendor-registration-form{
  max-width: 760px !important;
  margin: 48px auto !important;
  background: var(--cd-bg) !important;
  border-radius: var(--cd-radius) !important;
  border: 1px solid var(--cd-border) !important;
  border-top: 6px solid var(--cd-primary) !important;
  padding: 34px 34px 24px !important;
  box-shadow: var(--cd-shadow) !important;
}

/* Dokan/Woo wizard card */
body.wc-setup .wc-setup-content{
  max-width: 760px !important;
  margin: 48px auto !important;
  background: var(--cd-bg) !important;
  border-radius: var(--cd-radius) !important;
  border: 1px solid var(--cd-border) !important;
  border-top: 6px solid var(--cd-primary) !important;
  padding: 34px 34px 24px !important;
  box-shadow: var(--cd-shadow) !important;

  /* ✅ Now that Select2 is fixed, let the card behave naturally */
  width: auto !important;

  /* ✅ FIX: prevent iOS/mobile shadow clipping */
  overflow: visible !important;
}


/* ============================================================
   3.1) Mobile gutters — force true left/right breathing room
   - Prevent "flush to edges" on small screens
   ============================================================ */
@media (max-width: 860px){
  :root{ --cd-field-h: 44px; }

  /* Vendor outer is allowed to exist, but the card controls actual width */
  .cd-vendor-reg-outer{ padding: 0 !important; }

  /* ✅ Force mobile card widths to be viewport minus gutters (+ safe-area) */
  body.wc-setup .wc-setup-content,
  .cd-vendor-reg-outer form.dokan-vendor-registration-form,
  .cd-onboarding-progress{
    width: calc(
      100vw
      - (2 * var(--cd-gutter))
      - env(safe-area-inset-left)
      - env(safe-area-inset-right)
    ) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Mobile padding rhythm */
  .cd-vendor-reg-outer form.dokan-vendor-registration-form{
    margin: 18px auto !important;
    padding: 22px 18px 16px !important;
  }

  body.wc-setup .wc-setup-content{
    margin: 18px auto !important;
    padding: 22px 18px 16px !important;
    max-width: 760px !important;
  }

  /* iOS safe area for bottom buttons */
  body.wc-setup .wc-setup-content{
    padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  }
}


/* Headings */
.cd-vendor-reg-outer h1,
.cd-vendor-reg-outer h2,
body.wc-setup .wc-setup-content h1,
body.wc-setup .wc-setup-content h2{
  color: var(--cd-ink) !important;
  letter-spacing: -0.02em;
}


/* ============================================================
   4) Fields + Labels + Helper Text
   ============================================================ */
.cd-vendor-reg-outer label,
body.wc-setup .wc-setup-content label{
  color: var(--cd-ink) !important;
  font-weight: 650 !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.25 !important;
}

@media (max-width: 860px){
  body.wc-setup .wc-setup-content label{
    margin: 0 0 4px 0 !important;
  }
}

.cd-vendor-reg-outer input[type="text"],
.cd-vendor-reg-outer input[type="email"],
.cd-vendor-reg-outer input[type="password"],
.cd-vendor-reg-outer input[type="tel"],
.cd-vendor-reg-outer input[type="url"],
.cd-vendor-reg-outer input[type="number"],
.cd-vendor-reg-outer select,
.cd-vendor-reg-outer textarea,
body.wc-setup .wc-setup-content input[type="text"],
body.wc-setup .wc-setup-content input[type="email"],
body.wc-setup .wc-setup-content input[type="password"],
body.wc-setup .wc-setup-content input[type="tel"],
body.wc-setup .wc-setup-content input[type="url"],
body.wc-setup .wc-setup-content input[type="number"],
body.wc-setup .wc-setup-content select,
body.wc-setup .wc-setup-content textarea{
  width: 100% !important;
  max-width: 100% !important;
  height: var(--cd-field-h) !important;
  padding: 10px var(--cd-field-pad-x) !important;
  border-radius: var(--cd-radius-sm) !important;
  border: 1px solid var(--cd-border-strong) !important;
  background: #fff !important;
  color: var(--cd-ink) !important;
  outline: none !important;
  box-shadow: none !important;
}

.cd-vendor-reg-outer textarea,
body.wc-setup .wc-setup-content textarea{
  height: auto !important;
  min-height: 110px !important;
  padding-top: 12px !important;
}

.cd-vendor-reg-outer input:focus,
.cd-vendor-reg-outer select:focus,
.cd-vendor-reg-outer textarea:focus,
body.wc-setup .wc-setup-content input:focus,
body.wc-setup .wc-setup-content select:focus,
body.wc-setup .wc-setup-content textarea:focus{
  border-color: rgba(108,196,111,.85) !important;
  box-shadow: var(--cd-focus) !important;
}

/* spacing rhythm */
.cd-vendor-reg-outer .dokan-form-group{
  margin-bottom: 18px !important;
}

body.wc-setup .wc-setup-content .form-row,
body.wc-setup .wc-setup-content p.form-row{
  margin-bottom: 14px !important;
}

/* Helper text */
.cd-vendor-reg-outer .dokan-form-group .dokan-text,
body.wc-setup .wc-setup-content .description{
  color: var(--cd-muted) !important;
}

/* If this step uses tables, make them behave on mobile */
@media (max-width: 860px){
  body.wc-setup .wc-setup-content table{
    width: 100% !important;
    max-width: 100% !important;
  }

  body.wc-setup .wc-setup-content table.form-table{
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }

  body.wc-setup .wc-setup-content table.form-table th,
  body.wc-setup .wc-setup-content table.form-table td{
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    word-break: break-word !important;
  }
}

/* ============================================================
   Welcome / Ready step — centre intro copy
   ============================================================ */
body.cd-step-ready .wc-setup-content p,
body.cd-step-ready .wc-setup-content .cd-step-subtitle{
  text-align: center !important;
}

/* ============================================================
   5) Buttons — remove theme gradients and unify look
   ============================================================ */
.cd-vendor-reg-outer button,
.cd-vendor-reg-outer input[type="submit"],
body.wc-setup .wc-setup-content a.button,
body.wc-setup .wc-setup-content a.button-primary,
body.wc-setup .wc-setup-content a.button.button-primary,
body.wc-setup .wc-setup-content button,
body.wc-setup .wc-setup-content input[type="submit"]{
  border-radius: 14px !important;
  padding: 12px 18px !important;
  font-weight: 750 !important;
  letter-spacing: .01em;
  box-shadow: none !important;
  background-image: none !important;
}

/* Primary */
.cd-vendor-reg-outer button[type="submit"],
.cd-vendor-reg-outer input[type="submit"],
body.wc-setup .wc-setup-content .button-primary,
body.wc-setup .wc-setup-content a.button-primary,
body.wc-setup .wc-setup-content a.button.button-primary,
body.wc-setup .wc-setup-content button.button-primary,
body.wc-setup .wc-setup-content input[type="submit"].button-primary{
  background-color: var(--cd-primary) !important;
  border: 1px solid rgba(108,196,111,.9) !important;
  color: #0b1b12 !important;
}

body.wc-setup .wc-setup-content .button-primary:hover,
body.wc-setup .wc-setup-content a.button-primary:hover,
body.wc-setup .wc-setup-content a.button.button-primary:hover,
.cd-vendor-reg-outer button[type="submit"]:hover,
.cd-vendor-reg-outer input[type="submit"]:hover{
  filter: brightness(.98) !important;
}

/* Secondary */
body.wc-setup .wc-setup-content a.button:not(.button-primary){
  background: #fff !important;
  border: 1px solid var(--cd-border-strong) !important;
  color: var(--cd-ink) !important;
}

body.wc-setup .wc-setup-content a.button:hover,
body.wc-setup .wc-setup-content button:hover{
  filter: brightness(.99);
}

/* Reduce empty space above wizard buttons */
body.wc-setup .wc-setup-content .wc-setup-actions{
  margin-top: 14px !important;
  padding-top: 8px !important;
}

/* ============================================================
   5.1) Wizard CTA — FORCE pill shape on ALL steps
   - Dokan outputs different classes/element types per step
   - Fixes the "Continue" button staying native shape on Account Setup
   ============================================================ */
body.wc-setup .wc-setup-content .wc-setup-actions .button,
body.wc-setup .wc-setup-content .wc-setup-actions a.button,
body.wc-setup .wc-setup-content .wc-setup-actions button,
body.wc-setup .wc-setup-content .wc-setup-actions input[type="submit"],
body.wc-setup .wc-setup-content .wc-setup-actions .dokan-btn,
body.wc-setup .wc-setup-content .wc-setup-actions .dokan-btn-theme,
body.wc-setup .wc-setup-content .wc-setup-actions #dokan-store-save-btn{
  border-radius: 999px !important;          /* ✅ true pill */
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 28px !important;
  line-height: 56px !important;
  font-weight: 800 !important;
  font-size: 18px !important;
}


/* ============================================================
   6) Notices (inside wizard)
   ============================================================ */
body.wc-setup .wc-setup-content .notice,
body.wc-setup .wc-setup-content .woocommerce-message,
body.wc-setup .wc-setup-content .woocommerce-info,
body.wc-setup .wc-setup-content .woocommerce-error{
  border-radius: 14px !important;
}


/* ============================================================
   7) Hide native Woo/Dokan progress bar (we render our own)
   ============================================================ */
body.wc-setup ol.wc-setup-steps,
body.wc-setup ul.wc-setup-steps,
body.wc-setup .wc-setup-steps{
  display: none !important;
}


/* ============================================================
   8) CD Onboarding Progress Header (OUR BAR)
   ============================================================ */
.cd-onboarding-progress{
  max-width: 760px !important;
  margin: 24px auto 10px !important;
  padding: 0 6px !important;
}

@media (max-width: 860px){
  .cd-onboarding-progress{
    margin: 16px auto 8px !important;
    padding: 0 !important;
  }
}

.cd-onboarding-progress .cd-op-title{
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  color: rgba(15,23,42,.65);
  margin: 0 0 14px 0;
}

.cd-onboarding-progress .cd-op-track{
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.cd-onboarding-progress .cd-op-track::before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 22px;
  height: 4px;
  background: rgba(203,213,225,.75);
  border-radius: 99px;
}

.cd-onboarding-progress .cd-op-step{
  position: relative;
  flex: 1;
  text-align: center;
  font-weight: 650;
  color: var(--cd-muted);
  padding-bottom: 14px;
}

.cd-onboarding-progress .cd-op-step .cd-op-dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid rgba(203,213,225,.9);
  display: inline-block;
  position: relative;
  top: 12px;
  z-index: 2;
}

.cd-onboarding-progress .cd-op-step.is-done,
.cd-onboarding-progress .cd-op-step.is-active{
  color: var(--cd-ink);
}

.cd-onboarding-progress .cd-op-step.is-done .cd-op-dot,
.cd-onboarding-progress .cd-op-step.is-active .cd-op-dot{
  background: var(--cd-primary);
  border-color: rgba(108,196,111,.95);
}

.cd-onboarding-progress .cd-op-step::after{
  content: "";
  position: absolute;
  left: 50%;
  top: 22px;
  height: 4px;
  background: transparent;
  border-radius: 99px;
  z-index: 1;
}

.cd-onboarding-progress .cd-op-step.is-done::after{
  left: 0;
  width: 100%;
  background: var(--cd-primary);
}

.cd-onboarding-progress .cd-op-label{
  display: block;
  margin-top: 4px;
  font-size: 14px;
}

@media (max-width: 520px){
  .cd-onboarding-progress .cd-op-label{ font-size: 12px; }
}


/* ============================================================
   9) Wizard — Payment Step Polish (append-only)
   ============================================================ */

/* 9.1 Hide the orange “double-check” / info notice inside Bank Transfer (generic notices) */
body.cd-step-payment .cd-bank-transfer-row .notice,
body.cd-step-payment .cd-bank-transfer-row .woocommerce-info,
body.cd-step-payment .cd-bank-transfer-row .woocommerce-message,
body.cd-step-payment .cd-bank-transfer-row .dokan-alert,
body.cd-step-payment .cd-bank-transfer-row .dokan-info{
  display: none !important;
}

/* 9.1b Hide the ACTUAL offender from your inspect screenshot */
body.cd-step-payment .dokan-bank-settings-template .data-warning{
  display: none !important;
}

/* 9.2 Remove the inner bordered wrapper/panel inside Bank Transfer (keep it flat like Account Setup) */
body.cd-step-payment .cd-bank-transfer-row td > div,
body.cd-step-payment .cd-bank-transfer-row td fieldset,
body.cd-step-payment .cd-bank-transfer-row td .panel,
body.cd-step-payment .cd-bank-transfer-row td .card,
body.cd-step-payment .cd-bank-transfer-row td .dokan-panel{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 9.3 Make label → field spacing match Store step rhythm (table layout) */
body.cd-step-payment .cd-bank-transfer-row th{
  padding-bottom: 10px !important;
}
body.cd-step-payment .cd-bank-transfer-row td label{
  margin: 0 0 8px 0 !important; /* match baseline label rhythm */
}
body.cd-step-payment .cd-bank-transfer-row td .description{
  margin-top: 6px !important;
}

/* ============================================================
   9.4 Button system — force consistent shape + PERFECT centring
   (Fixes “one square / others pill / text not centred”)
   ============================================================ */
body.wc-setup .wc-setup-content .wc-setup-actions .button,
body.wc-setup .wc-setup-content .wc-setup-actions a.button,
body.wc-setup .wc-setup-content .wc-setup-actions button,
body.wc-setup .wc-setup-content .wc-setup-actions input[type="submit"],
body.wc-setup .wc-setup-content .wc-setup-actions #dokan-store-save-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 28px !important;

  line-height: 1 !important;          /* IMPORTANT: stop vertical drift */
  font-weight: 800 !important;
  font-size: 18px !important;
  text-align: center !important;
  white-space: nowrap !important;
}


/* ============================================================
   9.5 Store Step — remove rogue grey "submit" button
   (Keep only Continue + Skip)
   ============================================================ */
body.cd-step-store .wc-setup-actions input[type="submit"]:not(.button-primary){
  display: none !important;
}

/* ============================================================
   HOTFIXES — Requested polish items (do not rely on cd-step-* body classes)
   ============================================================ */

/* (2) Remove the orange info warning in Payout Setup (exact offender) */
body.wc-setup .dokan-bank-settings-template .data-warning,
body.wc-setup .dokan-bank-settings-template div.data-warning{
  display: none !important;
}

/* Some Dokan builds output this as generic notices too */
body.wc-setup .dokan-bank-settings-template .woocommerce-info,
body.wc-setup .dokan-bank-settings-template .notice,
body.wc-setup .dokan-bank-settings-template .dokan-alert{
  display: none !important;
}


/* (1) Remove rogue grey "submit" button on Fundraiser Account Setup card
   Keep:
   - Continue (usually .button-primary)
   - Skip (usually <a class="button">)
*/
body.wc-setup .wc-setup-actions input[type="submit"]:not(.button-primary),
body.wc-setup .wc-setup-actions button[type="submit"]:not(.button-primary),
body.wc-setup .wc-setup-actions .button[type="submit"]:not(.button-primary){
  display: none !important;
}

/* Extra safety: if it’s literally output as a plain .button (not primary) */
body.wc-setup .wc-setup-actions button.button:not(.button-primary),
body.wc-setup .wc-setup-actions input.button:not(.button-primary){
  display: none !important;
}

/* ============================================================
   10) Wizard table rhythm — unify label/field spacing across
       Fundraiser Account Setup + Payout Setup
   ============================================================ */

/* Consistent row spacing for all wizard form tables */
body.wc-setup .wc-setup-content table.form-table{
  border-collapse: collapse !important;
  width: 100% !important;
}

body.wc-setup .wc-setup-content table.form-table th,
body.wc-setup .wc-setup-content table.form-table td{
  vertical-align: top !important;
}

/* Desktop/tablet: tighten + standardise the “row gap” */
@media (min-width: 861px){
  body.wc-setup .wc-setup-content table.form-table th{
    padding: 0 22px 14px 0 !important; /* <- row gap */
    width: 34% !important;
  }
  body.wc-setup .wc-setup-content table.form-table td{
    padding: 0 0 14px 0 !important;    /* <- row gap */
    width: 66% !important;
  }

  /* If labels are in <th>, remove any extra spacing they introduce */
  body.wc-setup .wc-setup-content table.form-table th label{
    margin: 0 !important;
  }
}

/* Mobile: stack rows and enforce identical spacing everywhere */
@media (max-width: 860px){
  body.wc-setup .wc-setup-content table.form-table{
    table-layout: auto !important;
  }

  body.wc-setup .wc-setup-content table.form-table tr{
    display: block !important;
    padding: 0 0 14px 0 !important;   /* <- row gap */
  }

  body.wc-setup .wc-setup-content table.form-table th,
  body.wc-setup .wc-setup-content table.form-table td{
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
  }

  body.wc-setup .wc-setup-content table.form-table th label{
    margin: 0 0 8px 0 !important;     /* <- label -> field gap */
  }
}

/* ============================================================
   WELCOME — centre intro copy ONLY (do NOT touch buttons)
   ============================================================ */

/* Preferred (if your JS/body class exists) */
body.cd-step-welcome .wc-setup-content > h1,
body.cd-step-welcome .wc-setup-content > h2,
body.cd-step-welcome .wc-setup-content > p,
body.cd-step-welcome .wc-setup-content .cd-step-subtitle{
  text-align: center !important;
  max-width: 58ch;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Absolute safety: never allow the actions row to be affected */
body.cd-step-welcome .wc-setup-content .wc-setup-actions,
body.cd-step-welcome .wc-setup-content .wc-setup-actions *{
  text-align: initial !important;
}

/* ============================================================
   WELCOME — centre ALL welcome copy (incl wrapped paragraphs)
   Scope trick: Welcome = wizard page that is NOT store/payment/ready
   ============================================================ */

body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready) .wc-setup-content p,
body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready) .wc-setup-content .cd-step-subtitle{
  text-align: center !important;
  max-width: 58ch;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep button row behaviour untouched (belt + braces) */
body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready) .wc-setup-content .wc-setup-actions,
body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready) .wc-setup-content .wc-setup-actions *{
  text-align: initial !important;
}

/* ============================================================
   WELCOME — remove "Skip for now" button (Welcome card only)
   ============================================================ */
body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready)
.wc-setup-content .wc-setup-actions a.button:not(.button-primary){
  display: none !important;
}

@media (max-width: 860px){
  body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready)
  .wc-setup-content .wc-setup-actions{
    display: flex !important;
    justify-content: center !important;
  }
}

/* ============================================================
   WELCOME — centre the remaining CTA (desktop + mobile)
   ============================================================ */
body.wc-setup:not(.cd-step-store):not(.cd-step-payment):not(.cd-step-ready)
.wc-setup-content .wc-setup-actions{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
}

/* ============================================================
   PATCH: Welcome CTA text not clickable
   - Force clicks to land on the actual <a>/<button>, not inner spans
   ============================================================ */
body.wc-setup .wc-setup-content .wc-setup-actions .button *,
body.wc-setup .wc-setup-content .wc-setup-actions a.button *,
body.wc-setup .wc-setup-content .wc-setup-actions button *,
body.wc-setup .wc-setup-content .wc-setup-actions input[type="submit"] *{
  pointer-events: none !important;
}

/* Ensure the button itself remains clickable */
body.wc-setup .wc-setup-content .wc-setup-actions .button,
body.wc-setup .wc-setup-content .wc-setup-actions a.button,
body.wc-setup .wc-setup-content .wc-setup-actions button,
body.wc-setup .wc-setup-content .wc-setup-actions input[type="submit"]{
  pointer-events: auto !important;
}

/* ============================================================
   Mobile: prevent card shadow clipping at bottom
   - Give the card breathing room
   - Ensure wrappers don't clip box-shadow
   ============================================================ */

@media (max-width: 768px) {

  /* ✅ Give the page some bottom space so the shadow can fade out naturally */
  body.wc-setup{
    padding-bottom: 40px !important;
  }

  /* Dokan/WC setup wrappers sometimes clip shadows */
  .wc-setup,
  .wc-setup-content,
  .wc-setup-content-wrapper,
  .woocommerce,
  #page,
  #main,
  .site-content {
    overflow: visible !important;
  }

  /* If the card itself is the setup content, ensure it can render shadow fully */
  .wc-setup-content {
    margin-bottom: 24px !important;
  }
}

/* ============================================================
   Dokan Wizard — Mobile shadow clipping fix
   Cause: an ancestor container uses overflow:hidden on mobile,
          which clips the card box-shadow.
   Fix: force overflow visible + add breathing room at bottom.
   ============================================================ */

@media (max-width: 782px){

  /* Let shadows render outside containers */
  body,
  html,
  .wc-setup,
  .wc-setup-content,
  .wc-setup-content > *{
    overflow: visible !important;
  }

  /* Give the shadow room to fade out */
  .wc-setup-content{
    padding-bottom: 28px !important;
  }

  /* If the card itself is the .wc-setup-content, ensure space below it */
  .wc-setup{
    padding-bottom: 28px !important;
  }
}
/* ============================================================
   MOBILE: Vertically centre ONLY Welcome + Ready cards
   - Welcome (cd-step-welcome): centre
   - Ready   (cd-step-ready):   centre
   - Store/Payment remain top-aligned (forms)
   ============================================================ */

@media (max-width: 860px){

  /* Use small-viewport units so iOS browser chrome doesn't break centring */
  body.cd-step-welcome,
  body.cd-step-ready{
    min-height: 100svh !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Centre the wizard frame inside the page */
  body.cd-step-welcome .wc-setup,
  body.cd-step-ready .wc-setup{
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    /* Keep a little breathing room so shadows never clip */
    padding-top: 14px !important;
    padding-bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  }

  /* Prevent the card's own margins from fighting centring */
  body.cd-step-welcome .wc-setup-content,
  body.cd-step-ready .wc-setup-content{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}
/* ============================================================
   READY STEP — remove duplicate "Browse Themes" link
   - Green CTA already routes to same destination
   - Prevents vertical-centre break on mobile
   ============================================================ */

body.cd-step-ready a.wc-return-to-dashboard,
body.cd-step-ready a:not(.button-primary){
  display: none !important;
}