/* ============================================================
   Community Draws — Vendor Registration + Landing Hero (CLEAN + MERGED)
   File: /wp-content/themes/martfury-child/css/cd-vendor-registration.css

   SECTION A) Dokan Vendor Registration Form (scoped)
   SECTION B) Landing Page Hero Layout (generic template)

   IMPORTANT:
   - NO global .vc_row padding tweaks in this file
   - Green + white section padding is UNIFORM via shared variables
   ============================================================ */


/* ========================================================================
   SECTION A — DOKAN VENDOR REGISTRATION FORM (SCOPE: form only)
   ======================================================================== */

/* ============================================================
   0) Scope + box model
   ============================================================ */
form.dokan-vendor-registration-form { box-sizing: border-box; }
form.dokan-vendor-registration-form *,
form.dokan-vendor-registration-form *::before,
form.dokan-vendor-registration-form *::after { box-sizing: inherit; }


/* ============================================================
   1) Card wrapper + unified padding system
   ============================================================ */
form.dokan-vendor-registration-form{
  /* Unified padding tokens (desktop + mobile) */
  --cd-pad: 34px;          /* desktop/tablet internal padding */
  --cd-pad-mobile: 22px;   /* mobile internal padding */

  max-width: 760px !important;
  margin: 48px auto !important;

  background: #fff !important;

  border-radius: 18px !important;
  border: 1px solid rgba(229,231,235,.9) !important;
  border-top: 6px solid #6cc46f !important;

  /* White section padding (uniform baseline) */
  padding: var(--cd-pad) !important;

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

  overflow: hidden !important;
}

/* Mobile: make card feel wider (match hero gutter) */
@media (max-width: 767px){
  form.dokan-vendor-registration-form{
    max-width: 100% !important;

    /* Wider feel without touching global site gutters */
    margin: 14px 6px !important;

    border-radius: 16px !important;

    /* Uniform mobile padding */
    padding: var(--cd-pad-mobile) !important;
  }
}


/* ============================================================
   2) Neutralise Dokan horizontal layout (theme-proof)
   ============================================================ */
form.dokan-vendor-registration-form.dokan-form-horizontal .dokan-form-group{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
}


/* ============================================================
   3) Labels
   ============================================================ */
form.dokan-vendor-registration-form label{
  display: block !important;
  margin: 0 0 8px 0 !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  color: #0f172a !important;
  text-align: left !important;
}


/* ============================================================
   4) Inputs (base)
   ============================================================ */
form.dokan-vendor-registration-form input[type="text"],
form.dokan-vendor-registration-form input[type="email"],
form.dokan-vendor-registration-form input[type="password"]{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  padding: 12px 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(209,213,219,1) !important;
  background: #fff !important;

  font-size: 15px !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}

form.dokan-vendor-registration-form input:focus{
  outline: none !important;
  border-color: #6cc46f !important;
  box-shadow: 0 0 0 3px rgba(108,196,111,.20) !important;
}


/* ============================================================
   5) GREEN ZONE (pinned header) — UNIFORM PADDING
   ============================================================ */
form.dokan-vendor-registration-form .cd-green-zone{
  /* Pull green zone to the card edges (flush top corners) */
  margin: calc(var(--cd-pad) * -1) calc(var(--cd-pad) * -1) 0 calc(var(--cd-pad) * -1) !important;

  /* Uniform padding (same as form) */
  padding: var(--cd-pad) !important;

  background: rgba(108,196,111,.10) !important;

  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;

  border-bottom: 1px solid rgba(108,196,111,.35) !important;
}

@media (max-width: 767px){
  form.dokan-vendor-registration-form .cd-green-zone{
    margin: calc(var(--cd-pad-mobile) * -1) calc(var(--cd-pad-mobile) * -1) 0 calc(var(--cd-pad-mobile) * -1) !important;
    padding: var(--cd-pad-mobile) !important;

    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
  }
}

/* internal divider between Org + URL */
form.dokan-vendor-registration-form .cd-green-zone .cd-org-name{
  margin-bottom: 12px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(108,196,111,.25) !important;
}

/* breathing room below green divider */
form.dokan-vendor-registration-form .cd-green-zone + .dokan-form-group,
form.dokan-vendor-registration-form .cd-green-zone + .dokan-form-group.split-row,
form.dokan-vendor-registration-form .cd-green-zone + .form-row{
  margin-top: 18px !important;
}


/* ============================================================
   6) Shop URL preview line (prefix + slug)
   ============================================================ */
form.dokan-vendor-registration-form .cd-store-url-wrapper{
  width: 100% !important;
}

/* Keep prefix + slug on ONE LINE always (mobile too) */
form.dokan-vendor-registration-form .cd-url-line{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;

  width: 100% !important;

  margin-top: 4px !important;
  white-space: nowrap !important;
  flex-wrap: nowrap !important;
}

/* Prefix: truncate if needed so slug can stay on same line */
form.dokan-vendor-registration-form .cd-url-prefix{
  display: block !important;

  flex: 0 1 auto !important;
  max-width: 68% !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #6b7280 !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Slug input: lightweight editable field (white pill) */
form.dokan-vendor-registration-form .cd-url-line input#seller-url{
  flex: 1 1 0% !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;

  margin: 0 0 0 4px !important;

  /* Editable affordance */
  background: #ffffff !important;
  border: 1px solid rgba(209,213,219,0.85) !important;
  border-radius: 8px !important;

  padding: 6px 8px !important;
  min-height: 30px !important;

  box-shadow: none !important;

  font-size: 14px !important;
  font-weight: 400 !important; /* reduced weight */
  line-height: 1.15 !important;
  color: #111827 !important;

  /* FORCE LOWERCASE (slug only) */
  text-transform: lowercase !important;

  -webkit-appearance: none !important;
  appearance: none !important;

  white-space: nowrap !important;

  position: relative !important;
  top: 0 !important;
}

/* Slug focus: clear, calm */
form.dokan-vendor-registration-form .cd-url-line input#seller-url:focus{
  outline: none !important;
  border-color: #6cc46f !important;
  box-shadow: 0 0 0 2px rgba(108,196,111,.15) !important;
}

/* Subtle hover cue */
form.dokan-vendor-registration-form .cd-url-line input#seller-url:hover{
  background: #f9fafb !important;
}

/* spinner */
form.dokan-vendor-registration-form .cd-url-line .dokan-spinner{
  margin-left: 10px !important;
  width: 18px !important;
  height: 18px !important;
  visibility: hidden !important;
}
form.dokan-vendor-registration-form .cd-url-line .dokan-spinner.is-active{
  visibility: visible !important;
}

/* Availability text */
form.dokan-vendor-registration-form #url-alart{
  display: block !important;
  margin: 6px 0 0 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;

  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;

  white-space: nowrap !important;
  text-align: left !important;
}

form.dokan-vendor-registration-form #url-alart.dokan-alert-success{ color: #6cc46f !important; }
form.dokan-vendor-registration-form #url-alart.dokan-alert-danger,
form.dokan-vendor-registration-form #url-alart.dokan-alert-error{ color: #dc2626 !important; }
form.dokan-vendor-registration-form #url-alart:empty{ display: none !important; }

form.dokan-vendor-registration-form .cd-url-help{ display: none !important; }


/* ============================================================
   7) FN/LN row (GRID - forced placement)
   ============================================================ */
form.dokan-vendor-registration-form .dokan-form-group.split-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  column-gap: 18px !important;
  row-gap: 0 !important;

  width: 100% !important;
  max-width: 100% !important;

  margin: 0 0 18px 0 !important;
  padding: 0 !important;

  float: none !important;
  clear: both !important;
  position: relative !important;
}

/* Full reset on cells */
form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-first,
form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-last{
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  float: none !important;
  clear: none !important;

  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
}

/* Force which column each lives in */
form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-first{
  grid-column: 1 !important;
  grid-row: 1 !important;
}
form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-last{
  grid-column: 2 !important;
  grid-row: 1 !important;
}

/* Ensure inputs fill */
form.dokan-vendor-registration-form .dokan-form-group.split-row input{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Stack on mobile */
@media (max-width: 767px){
  form.dokan-vendor-registration-form .dokan-form-group.split-row{
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
    row-gap: 18px !important;
  }
  form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-first,
  form.dokan-vendor-registration-form .dokan-form-group.split-row > .form-row-last{
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}


/* ============================================================
   8) White section spacing protection
   ============================================================ */
form.dokan-vendor-registration-form > .dokan-form-group,
form.dokan-vendor-registration-form > .dokan-form-group.split-row,
form.dokan-vendor-registration-form > p.form-row{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

form.dokan-vendor-registration-form .dokan-form-group,
form.dokan-vendor-registration-form .form-row{
  max-width: 100% !important;
}


/* ============================================================
   9) Terms row
   ============================================================ */
form.dokan-vendor-registration-form .cd-terms-row label{
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  margin: 10px 0 0 0 !important;
  font-weight: 700 !important;
}

form.dokan-vendor-registration-form .cd-terms-row input[type="checkbox"]{
  transform: scale(1.12);
}


/* ============================================================
   10) Submit Button — Full width, brand lime (HARD FORCE)
   ============================================================ */
form.dokan-vendor-registration-form .cd-submit-row{
  margin: 22px 0 0 0 !important;
}

/* Primary CTA (covers Dokan/theme classes too) */
form.dokan-vendor-registration-form input[type="submit"],
form.dokan-vendor-registration-form input[type="submit"].dokan-btn,
form.dokan-vendor-registration-form input[type="submit"].dokan-btn-theme{
  display: block !important;
  width: 100% !important;

  background-color: #9ac34b !important;
  background-image: none !important;
  filter: none !important;
  opacity: 1 !important;

  color: #0f172a !important;
  border: none !important;
  border-radius: 14px !important;

  padding: 14px 18px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;

  text-align: center !important;
  cursor: pointer !important;

  -webkit-appearance: none !important;
  appearance: none !important;

  transition:
    background-color .15s ease,
    transform .06s ease,
    box-shadow .15s ease !important;

  box-shadow: 0 6px 14px rgba(154,195,75,.35) !important;
}

form.dokan-vendor-registration-form input[type="submit"]::before,
form.dokan-vendor-registration-form input[type="submit"]::after{
  content: none !important;
  display: none !important;
}

/* Hover (desktop) */
form.dokan-vendor-registration-form input[type="submit"]:hover{
  background-color: #8bb63f !important;
}

/* Active / tap feedback */
form.dokan-vendor-registration-form input[type="submit"]:active{
  transform: translateY(1px) !important;
  box-shadow: 0 4px 10px rgba(154,195,75,.28) !important;
}

/* Focus */
form.dokan-vendor-registration-form input[type="submit"]:focus{
  outline: none !important;
  box-shadow:
    0 0 0 4px rgba(154,195,75,.35),
    0 6px 14px rgba(154,195,75,.35) !important;
}


/* ============================================================
   11) URL preview — HARD OVERRIDES (wins against Dokan/theme)
   ============================================================ */
form.dokan-vendor-registration-form .cd-url-prefix,
form.dokan-vendor-registration-form .dokan-store-url-prefix,
form.dokan-vendor-registration-form strong.dokan-store-url-prefix{
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #6b7280 !important;
}

/* IMPORTANT: don't re-bold the dynamic part */
form.dokan-vendor-registration-form .dokan-store-url,
form.dokan-vendor-registration-form .cd-url-slug{
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #111827 !important;
  vertical-align: baseline !important;
}


/* ============================================================
   12) FINAL mobile width nudge — slightly wider card (form only)
   ============================================================ */
@media (max-width: 767px){
  form.dokan-vendor-registration-form{
    margin-left: 6px !important;
    margin-right: 6px !important;
  }
}



/* ========================================================================
   SECTION B — LANDING PAGE HERO (GENERIC TEMPLATE) — WPBakery-PROOF
   Scope: ONLY rows/columns you explicitly class with:
     Row:    cd-landing-hero
     Col 1:  cd-landing-hero__copy
     Col 2:  cd-landing-hero__form
   ======================================================================== */

/* Mobile-first: leave stack alone */
.cd-landing-hero{
  position: relative;
}

/* Desktop */
@media (min-width: 992px){

  /* If class is on the VC row itself */
  .vc_row.cd-landing-hero,
  .vc_row-fluid.cd-landing-hero{
    padding-top: clamp(40px, 5vw, 80px) !important;
    padding-bottom: clamp(40px, 5vw, 80px) !important;
    min-height: 0 !important;

    display: flex !important;
    align-items: center !important;
  }

  /* If class is on a wrapper and there is an inner VC row */
  .cd-landing-hero .vc_row,
  .cd-landing-hero .vc_row-fluid{
    display: flex !important;
    align-items: center !important;
  }

  /* WPBakery columns often need flex on the INNER container */
  .cd-landing-hero__copy,
  .cd-landing-hero__form{
    display: flex !important;
  }

  .cd-landing-hero__copy > .vc_column-inner,
  .cd-landing-hero__form > .vc_column-inner{
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: 100% !important;
  }

  /* Copy column */
  .cd-landing-hero__copy > .vc_column-inner{
    max-width: 620px !important;
  }

  /* Form column */
  .cd-landing-hero__form{
    justify-content: flex-end !important;
  }

  .cd-landing-hero__form > .vc_column-inner{
    align-items: flex-end !important;
  }

  /* Optional micro-balance */
  .cd-landing-hero__form form{
    margin-top: 8px !important;
  }

  /* Background tuning (only affects the hero row) */
  .cd-landing-hero{
    background-position: center 35% !important;
    background-size: cover !important;
  }

  /* Safety: stop WPBakery “stretch height” oddities */
  .cd-landing-hero .vc_column_container{
    height: auto !important;
  }
}