/* ================================================================
   EVP Kit Personalizado — form.css  v2.0
   Integrado à página do produto /produto/kit-personalizado/
   Design system: --linen, --cream, --bege, --ash, --ink, --ember
================================================================ */

/* ── Variáveis (herda do tema, redeclara por segurança) ─────── */
#evp-kit-form-wrap {
  --linen:      #F5F0EA;
  --cream:      #EDE8E0;
  --bege:       #D6CFC4;
  --ash:        #9E9A94;
  --ink:        #1C1A17;
  --ember:      #C4622D;
  --ember-dark: #9E4A1F;
  --stone:      #3A3530;

  background: var(--cream);
  border-top: 1px solid var(--bege);
  padding: 56px 0 72px;
  margin-top: 0;
}

/* ── Botão CTA que substitui "Adicionar ao carrinho" ────────── */
.evp-kit-cta-wrap {
  margin-top: 8px;
}

.evp-kit-cta-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: var(--ember) !important;
  color: #F5F0EA !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  padding: 16px 36px !important;
  border: none !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background .2s !important;
  width: 100% !important;
  justify-content: center !important;
  box-shadow: none !important;
}
.evp-kit-cta-btn:hover,
.evp-kit-cta-btn:focus {
  background: var(--ember-dark) !important;
  color: #F5F0EA !important;
  text-decoration: none !important;
}
.evp-kit-cta-btn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.evp-kit-cta-hint {
  font-size: 12px !important;
  color: var(--ash) !important;
  text-align: center !important;
  margin: 10px 0 0 !important;
  line-height: 1.5 !important;
  font-family: 'Jost', sans-serif !important;
}

/* ── Intro do formulário ────────────────────────────────────── */
.evp-kit-form-intro {
  margin-bottom: 36px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--bege);
}

.evp-kit-eyebrow {
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ember);
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.evp-kit-eyebrow::before {
  content: '';
  display: block;
  width: 28px;
  height: 1.5px;
  background: var(--ember);
  flex-shrink: 0;
}

.evp-kit-form-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 36px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  color: var(--ink) !important;
  margin: 0 0 10px !important;
}

.evp-kit-form-subtitle {
  font-size: 14px;
  color: var(--ash);
  line-height: 1.7;
  max-width: 560px;
  margin: 0;
}

/* ── Notices ───────────────────────────────────────────────── */
.evp-kit-notice {
  padding: 14px 18px;
  font-size: 14px;
  margin-bottom: 24px;
  border-left: 3px solid;
  font-family: 'Jost', sans-serif;
}
.evp-kit-notice--error {
  background: #fdf0ee;
  border-color: var(--ember);
  color: var(--ember-dark);
}
.evp-kit-notice--success {
  background: #f0f7ec;
  border-color: #5a9e3a;
  color: #2e5c1c;
  font-weight: 500;
}

/* ── Grid de campos ────────────────────────────────────────── */
.evp-kit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 0;
}

.evp-kit-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.evp-kit-field--full {
  grid-column: 1 / -1;
}

.evp-kit-field label {
  font-family: 'Jost', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--stone) !important;
  margin: 0 !important;
}
.evp-req  { color: var(--ember); }
.evp-kit-opt { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--ash); font-size: 12px; }

/* inputs — !important para sobrescrever estilos WC e tema */
.evp-kit-field input[type="text"],
.evp-kit-field input[type="email"],
.evp-kit-field input[type="tel"],
.evp-kit-field select,
.evp-kit-field textarea {
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  background: #F5F0EA !important;
  border: 1px solid var(--bege) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
  padding: 12px 16px !important;
  outline: none !important;
  transition: border-color .18s !important;
  width: 100% !important;
  box-shadow: none !important;
  height: auto !important;
  line-height: 1.5 !important;
}
.evp-kit-field input:focus,
.evp-kit-field select:focus,
.evp-kit-field textarea:focus {
  border-color: var(--ember) !important;
  box-shadow: none !important;
  outline: none !important;
}
.evp-kit-field select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239E9A94' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  padding-right: 36px !important;
  cursor: pointer !important;
}
.evp-kit-field textarea {
  resize: vertical !important;
  min-height: 120px !important;
}

/* ── Kit Builder ───────────────────────────────────────────── */
#evp-kit-builder {
  margin-top: 8px;
}

.evp-kit-builder-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 32px 0 20px;
  padding-top: 28px;
  border-top: 1px solid var(--bege);
}
.evp-kit-tag {
  background: var(--ember);
  color: #F5F0EA;
  font-size: 10px;
  letter-spacing: .13em;
  text-transform: uppercase;
  padding: 5px 12px;
  font-weight: 600;
  font-family: 'Jost', sans-serif;
}
.evp-kit-builder-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 20px;
  font-weight: 600;
  color: var(--ink);
}

/* ── Quantidade de pessoas ─────────────────────────────────── */
#evp-kit-form-wrap .evp-kit-pessoas-row {
  padding: 22px 24px !important;
  background: #F5F0EA !important;
  border: 1px solid #D6CFC4 !important;
  margin-bottom: 20px !important;
  border-radius: 0 !important;
}
#evp-kit-form-wrap .evp-kit-field--pessoas label {
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  font-size: 11px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #3A3530 !important;
  font-family: 'Jost', sans-serif !important;
}
#evp-kit-form-wrap .evp-kit-qty-wrap {
  display: inline-flex !important;
  align-items: stretch !important;
  border: none !important;
  background: transparent !important;
}
#evp-kit-form-wrap .evp-kit-qty-btn,
#evp-kit-form-wrap button.evp-kit-qty-btn {
  width: 48px !important;
  height: 52px !important;
  min-width: 48px !important;
  min-height: 52px !important;
  background: #EDE8E0 !important;
  border: 1px solid #D6CFC4 !important;
  border-radius: 0 !important;
  color: #1C1A17 !important;
  font-size: 22px !important;
  font-weight: 300 !important;
  font-family: 'Jost', sans-serif !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  line-height: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  text-shadow: none !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: background .15s !important;
}
#evp-kit-form-wrap .evp-kit-qty-btn:hover,
#evp-kit-form-wrap button.evp-kit-qty-btn:hover { background: #D6CFC4 !important; }
#evp-kit-form-wrap .evp-kit-qty-dec { border-right: none !important; }
#evp-kit-form-wrap .evp-kit-qty-inc { border-left: none !important; }
#evp-kit-form-wrap .evp-kit-qty-wrap input[type="number"],
#evp-kit-form-wrap input#evp-pessoas {
  font-family: 'Jost', sans-serif !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  width: 88px !important;
  height: 52px !important;
  min-height: 52px !important;
  border: 1px solid #D6CFC4 !important;
  border-radius: 0 !important;
  background: #F5F0EA !important;
  color: #1C1A17 !important;
  text-align: center !important;
  padding: 0 8px !important;
  margin: 0 !important;
  box-shadow: none !important;
  -moz-appearance: textfield !important;
  outline: none !important;
  line-height: 1 !important;
  display: block !important;
  float: none !important;
}
#evp-kit-form-wrap .evp-kit-qty-wrap input[type="number"]::-webkit-inner-spin-button,
#evp-kit-form-wrap .evp-kit-qty-wrap input[type="number"]::-webkit-outer-spin-button,
#evp-kit-form-wrap input#evp-pessoas::-webkit-inner-spin-button,
#evp-kit-form-wrap input#evp-pessoas::-webkit-outer-spin-button { -webkit-appearance: none !important; margin: 0 !important; }
#evp-kit-form-wrap .evp-kit-qty-wrap input[type="number"]:focus,
#evp-kit-form-wrap input#evp-pessoas:focus {
  border-color: #C4622D !important;
  box-shadow: none !important;
  outline: none !important;
}
#evp-kit-form-wrap .evp-kit-pessoas-hint {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  color: #9E9A94 !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  line-height: 1.5 !important;
  font-family: 'Jost', sans-serif !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}
#evp-kit-form-wrap .evp-kit-pessoas-hint svg { flex-shrink: 0; opacity: .7; }
#evp-kit-form-wrap .evp-kit-chips-label {
  font-size: 11px !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: #9E9A94 !important;
  margin: 16px 0 8px !important;
  padding: 0 !important;
  font-family: 'Jost', sans-serif !important;
  background: none !important;
  border: none !important;
  display: block !important;
}
#evp-kit-form-wrap .evp-kit-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#evp-kit-form-wrap .evp-kit-chip,
#evp-kit-form-wrap button.evp-kit-chip {
  padding: 7px 14px !important;
  border: 1px solid #D6CFC4 !important;
  border-radius: 0 !important;
  background: #EDE8E0 !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #3A3530 !important;
  cursor: pointer !important;
  transition: all .15s !important;
  box-shadow: none !important;
  line-height: 1 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  outline: none !important;
  margin: 0 !important;
}
#evp-kit-form-wrap .evp-kit-chip:hover,
#evp-kit-form-wrap button.evp-kit-chip:hover {
  border-color: #C4622D !important;
  color: #C4622D !important;
  background: #EDE8E0 !important;
}
#evp-kit-form-wrap .evp-kit-chip.evp-chip-active,
#evp-kit-form-wrap button.evp-kit-chip.evp-chip-active {
  background: #C4622D !important;
  border-color: #C4622D !important;
  color: #F5F0EA !important;
}

/* loading spinner */
.evp-kit-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--ash);
  padding: 16px 0;
  font-family: 'Jost', sans-serif;
}
.evp-kit-spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid var(--bege);
  border-top-color: var(--ember);
  border-radius: 50%;
  animation: evpSpin .7s linear infinite;
  flex-shrink: 0;
}
@keyframes evpSpin { to { transform: rotate(360deg); } }

/* categorias */
.evp-kit-categories {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.evp-kit-cat-block {
  background: #F5F0EA;
  border: 1px solid var(--bege);
  padding: 18px 20px;
}
.evp-kit-cat-name {
  font-family: 'Jost', sans-serif;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ember);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--bege);
}
.evp-kit-products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px;
}
.evp-kit-prod-item {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--cream);
  border: 1px solid var(--bege);
  padding: 9px 12px;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  user-select: none;
}
.evp-kit-prod-item:hover       { border-color: var(--ember); }
.evp-kit-prod-item.evp-selected { border-color: var(--ember); background: #f9ece4; }
.evp-kit-prod-item input[type="checkbox"] {
  accent-color: var(--ember) !important;
  width: 15px !important;
  height: 15px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.evp-kit-prod-item span {
  font-size: 12.5px;
  color: var(--ink);
  line-height: 1.35;
  font-family: 'Jost', sans-serif;
}

/* ── Submit ─────────────────────────────────────────────────── */
.evp-kit-submit-area {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--bege);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
}
.evp-kit-privacy {
  font-size: 12px;
  color: var(--ash);
  line-height: 1.6;
  max-width: 380px;
  font-family: 'Jost', sans-serif;
  margin: 0 !important;
}
.evp-kit-btn-submit {
  background: var(--ember) !important;
  color: #F5F0EA !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 15px 44px !important;
  cursor: pointer !important;
  transition: background .2s !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  line-height: 1 !important;
}
.evp-kit-btn-submit:hover    { background: var(--ember-dark) !important; }
.evp-kit-btn-submit:disabled { opacity: .55 !important; cursor: not-allowed !important; }

/* ── Responsivo ─────────────────────────────────────────────── */
@media (max-width: 680px) {
  .evp-kit-grid { grid-template-columns: 1fr; }
  .evp-kit-field--full { grid-column: 1; }
  .evp-kit-form-title { font-size: 28px !important; }
  .evp-kit-submit-area { flex-direction: column; align-items: flex-start; }
  .evp-kit-btn-submit { width: 100% !important; justify-content: center !important; }
  .evp-kit-products-grid { grid-template-columns: 1fr 1fr; }
}
