/* =========================================================
   EDITABLE TOKENS — override from the Elementor widget Style tab.
   Defaults reproduce the original Kirbylicious guest-card design.
   ========================================================= */
.kgc-wrap{
  /* palette */
  --kgc-bg:transparent;     /* form area background (see-through) */
  --kgc-ink:#2B2118;
  --kgc-wine:#7C3A45;
  --kgc-sage:#6E7A54;
  --kgc-gold:#C98A3B;
  --kgc-card:#FBF5E6;
  --kgc-line:#D8C7A1;
  --kgc-danger:#A23B2E;

  /* sticky steps */
  --kgc-sticky-top:110px;
  --kgc-rail-bg:var(--kgc-card);
  --kgc-tab-radius:3px;
  --kgc-tab-active-bg:var(--kgc-gold);
  --kgc-tab-active-text:var(--kgc-card);

  /* section cards */
  --kgc-section-bg:var(--kgc-card);
  --kgc-section-border-color:var(--kgc-line);
  --kgc-section-border-width:1.5px;
  --kgc-section-border-style:dashed;
  --kgc-section-radius:10px;
  --kgc-section-padding:32px clamp(20px,4vw,44px) 40px;
  --kgc-section-gap:56px;

  /* fields */
  --kgc-field-gap:24px;
  --kgc-input-border:var(--kgc-line);
  --kgc-input-focus:var(--kgc-wine);
  --kgc-input-radius:0px;
  --kgc-notch-bg:#F2E7CE;

  /* chips (wine) & pills (sage) */
  --kgc-chip-selected-bg:var(--kgc-wine);
  --kgc-chip-selected-text:var(--kgc-card);
  --kgc-chip-hover-border:var(--kgc-gold);
  --kgc-pill-selected-bg:var(--kgc-sage);
  --kgc-pill-selected-text:var(--kgc-card);
  --kgc-pill-hover-border:var(--kgc-gold);

  /* submit button */
  --kgc-submit-bg:var(--kgc-wine);
  --kgc-submit-text:var(--kgc-card);
  --kgc-submit-hover-bg:#672f39;
  --kgc-submit-radius:8px;

  /* outer spacing */
  --kgc-wrap-padding:0 20px 100px;

  background:var(--kgc-bg); color:var(--kgc-ink);
  font-family:'Karla',sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased; position:relative;
}
.kgc-wrap *{ box-sizing:border-box; }
.kgc-wrap, .kgc-shell{ overflow:visible; }
.kgc-wrap .display{ font-family:'Fraunces',serif; }
.kgc-wrap .mono{ font-family:'Space Mono',monospace; letter-spacing:.03em; }

.kgc-shell{ margin:0 auto; padding:var(--kgc-wrap-padding); position:relative; z-index:1; }

/* ---------- sticky steps ---------- */
.kgc-tab-rail{
  position:sticky; top:var(--kgc-sticky-top); z-index:50;
  background:var(--kgc-rail-bg); padding:18px 0 10px;
  display:flex; gap:8px; overflow-x:auto; scrollbar-width:none;
  border-bottom:1px solid var(--kgc-line);
}
.kgc-tab-rail::-webkit-scrollbar{ display:none; }
.kgc-tab{
  flex:0 0 auto; display:flex; align-items:center; gap:8px;
  padding:9px 16px; border-radius:var(--kgc-tab-radius) var(--kgc-tab-radius) 0 0;
  background:var(--kgc-card); border:1px solid var(--kgc-line); border-bottom:none;
  font-size:12.5px; font-weight:700; color:var(--kgc-ink); opacity:.55; cursor:pointer;
  white-space:nowrap; transition:opacity .2s ease,transform .2s ease,background .2s ease;
  position:relative; top:1px;
}
.kgc-tab:hover{ opacity:.85; }
.kgc-tab .num{ color:var(--kgc-wine); }
.kgc-tab.active{ opacity:1; background:var(--kgc-tab-active-bg); border-color:var(--kgc-tab-active-bg); color:var(--kgc-tab-active-text); transform:translateY(-2px); }
.kgc-tab.active .num{ color:var(--kgc-tab-active-text); }
.kgc-tab.done::after{ content:"\2713"; margin-left:2px; color:var(--kgc-sage); font-size:11px; }
.kgc-tab.active.done::after{ color:var(--kgc-tab-active-text); }

/* ---------- section cards ---------- */
.kgc-section{ scroll-margin-top:calc(var(--kgc-sticky-top) + 70px); padding-top:var(--kgc-section-gap); }
.kgc-section-card{
  background:var(--kgc-section-bg);
  border:var(--kgc-section-border-width) var(--kgc-section-border-style) var(--kgc-section-border-color);
  border-radius:var(--kgc-section-radius); padding:var(--kgc-section-padding); position:relative;
}
.kgc-section-card::before{ content:""; position:absolute; top:-9px; left:28px; width:16px; height:16px; border-radius:50%; background:var(--kgc-notch-bg); border:var(--kgc-section-border-width) var(--kgc-section-border-style) var(--kgc-section-border-color); }
.kgc-section-head{ display:flex; align-items:baseline; gap:12px; margin-bottom:6px; }
.kgc-section-head .idx{ font-size:13px; color:var(--kgc-wine); font-weight:700; }
.kgc-section-head h2{ font-size:24px; font-weight:600; margin:0; }
.kgc-section-sub{ color:#5a4f43; font-size:14.5px; margin:0 0 28px; max-width:520px; }

/* ---------- fields ---------- */
.kgc-field{ margin-bottom:var(--kgc-field-gap); }
.kgc-field:last-child{ margin-bottom:0; }
.kgc-field label{ display:block; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--kgc-ink); margin-bottom:8px; }
.kgc-field .hint{ display:block; font-weight:400; text-transform:none; letter-spacing:0; color:#7a6f61; font-size:12.5px; margin-top:3px; }
.kgc-row{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:560px){ .kgc-row{ grid-template-columns:1fr; } }

.kgc-wrap input[type="text"], .kgc-wrap input[type="email"], .kgc-wrap textarea{
  width:100%; background:transparent; border:none; border-bottom:1.5px solid var(--kgc-input-border);
  border-radius:var(--kgc-input-radius); padding:8px 2px; font-family:'Karla',sans-serif; font-size:15.5px; color:var(--kgc-ink);
  resize:vertical; transition:border-color .15s ease;
}
.kgc-wrap textarea{ min-height:74px; line-height:1.5; }
.kgc-wrap input::placeholder, .kgc-wrap textarea::placeholder{ color:#b4a68d; }
.kgc-wrap input:focus, .kgc-wrap textarea:focus{ outline:none !important; border-bottom-color:var(--kgc-input-focus); box-shadow:none !important; }
.kgc-wrap button:focus-visible{ outline:2px solid var(--kgc-wine); outline-offset:2px; }

.kgc-error-text{ display:none; color:var(--kgc-danger); font-size:12px; margin-top:6px; }
.kgc-field.invalid .kgc-error-text{ display:block; }
.kgc-field.invalid input, .kgc-field.invalid textarea{ border-bottom-color:var(--kgc-danger); }

/* ---------- chips & pills ---------- */
.kgc-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.kgc-chip{ padding:8px 14px; border-radius:20px; border:1.5px solid var(--kgc-line); background:transparent; font-family:'Karla',sans-serif; font-size:13.5px; color:var(--kgc-ink); cursor:pointer; transition:all .15s ease; }
.kgc-chip:hover{ border-color:var(--kgc-chip-hover-border); }
.kgc-chip.selected{ background:var(--kgc-chip-selected-bg); border-color:var(--kgc-chip-selected-bg); color:var(--kgc-chip-selected-text); }

.kgc-radio-group{ display:flex; flex-wrap:wrap; gap:10px; }
.kgc-radio-pill{ padding:9px 16px; border-radius:8px; border:1.5px solid var(--kgc-line); background:transparent; font-family:'Karla',sans-serif; font-size:14px; color:var(--kgc-ink); cursor:pointer; transition:all .15s ease; }
.kgc-radio-pill:hover{ border-color:var(--kgc-pill-hover-border); }
.kgc-radio-pill.selected{ background:var(--kgc-pill-selected-bg); border-color:var(--kgc-pill-selected-bg); color:var(--kgc-pill-selected-text); }

/* ---------- submit ---------- */
.kgc-submit-wrap{ padding:56px 0 40px; text-align:center; }
.kgc-submit-wrap p{ color:#5a4f43; font-size:13.5px; margin:0 0 20px; }
.kgc-submit-btn{ font-family:'Fraunces',serif; font-size:18px; font-weight:600; background:var(--kgc-submit-bg); color:var(--kgc-submit-text); border:none; padding:16px 36px; border-radius:var(--kgc-submit-radius); cursor:pointer; transition:transform .15s ease,background .15s ease; }
.kgc-submit-btn:hover{ background:var(--kgc-submit-hover-bg); }
.kgc-submit-btn:active{ transform:scale(.98); }
.kgc-submit-btn:disabled{ opacity:.5; cursor:default; }
.kgc-form-msg{ margin-top:16px; font-size:13px; color:var(--kgc-danger); min-height:16px; }

/* ---------- success ---------- */
.kgc-success{ display:none; text-align:center; padding:90px 20px 60px; }
.kgc-success .stamp{ width:88px; height:88px; border-radius:50%; border:3px solid var(--kgc-sage); color:var(--kgc-sage); display:flex; align-items:center; justify-content:center; font-size:40px; margin:0 auto 26px; }
.kgc-success h2{ font-size:30px; margin:0 0 12px; }
.kgc-success p{ color:#5a4f43; max-width:460px; margin:0 auto; }

@media (prefers-reduced-motion:reduce){ .kgc-wrap *{ transition:none !important; } }

/* =========================================================
   MINIMAL RESET — only what themes commonly break; everything else
   is left open so the Elementor per-element controls fully apply.
   ========================================================= */
.kgc-wrap *{ box-sizing:border-box; }
.kgc-wrap input, .kgc-wrap textarea, .kgc-wrap button{ -webkit-appearance:none; appearance:none; }
.kgc-wrap button{ background:none; }
.kgc-wrap button, .kgc-wrap .kgc-tab, .kgc-wrap input, .kgc-wrap textarea{ box-shadow:none; }
.kgc-wrap button:focus, .kgc-wrap input:focus, .kgc-wrap textarea:focus{ box-shadow:none; }

/* ---------- responsive steps: 2-per-row on mobile so nothing is cut ---------- */
@media (max-width:560px){
  .kgc-wrap .kgc-tab-rail{ flex-wrap:wrap !important; overflow-x:visible !important; }
  .kgc-wrap .kgc-tab{ flex:1 1 calc(50% - 6px) !important; min-width:0 !important; justify-content:center; text-align:center; top:0; border-bottom-width:1px; }
  .kgc-wrap .kgc-tab.active{ transform:none; }
}
