@charset "utf-8";
/* CSS Document */
/* Lightning Lyrics – Intake CSS v3.15.2 */
/* Path: /css/intake-css.css */

/* Force left align + white text; beat theme center rules */
#intake, #intake * { text-align: left !important; color: #fff; box-sizing: border-box; }

@media (max-width: 991.98px){
  /* Section sits 10px from the top; JS scrolls it there on step change */
  #intake { margin-top: 0 !important; padding-top: 10px !important; scroll-margin-top: 10px !important; }
  #intake .container, #intake .row, #intake [class^="col-"], #intake [class*=" col-"]{
    margin-top: 0 !important; padding-top: 0 !important;
  }
}

/* Base */
#ll-stepper { margin: 0; padding: 0; }
#ll-stepper .ll-card { background: transparent; border: 0; padding: 0; }
#ll-stepper fieldset { border: 0; margin: 0; padding: 0; }
#ll-stepper .ll-panels { margin: 0; padding: 0; }
#ll-stepper .ll-panel { display: none !important; }
#ll-stepper .ll-lbl { font-weight: 700; display: block; margin: 0 0 .5rem; }

/* Inputs */
#ll-stepper input[type=text],
#ll-stepper input[type=email],
#ll-stepper input[type=tel],
#ll-stepper textarea,
#ll-stepper select{
  width:100%; padding:18px; border:1px solid rgba(255,255,255,.18);
  background:#222; color:#fff; border-radius:0; font:inherit;
}
#ll-stepper ::placeholder{ color:rgba(255,255,255,.7); }
#ll-stepper textarea{ min-height:100px; resize:vertical; }

/* Actions / buttons */
#ll-stepper .ll-actions{ display:flex; gap:10px; margin-top:12px; }
#ll-stepper .ll-btn{
  display:inline-block; padding:.72rem 1.1rem; border-radius:0;
  font-weight:800; cursor:pointer; background:#0080FF; border:0; color:#fff; text-decoration:none;
}
#ll-stepper .ll-btn.ll-ghost{ background:transparent; border:1px solid rgba(255,255,255,.24); }

/* Progress bar */
.ll-progressbar{ margin:0 0 12px; }
.ll-progressbar-track{ width:100%; height:6px; background:rgba(255,255,255,.15); border-radius:0; overflow:hidden; }
.ll-progressbar-fill{ height:100%; width:0; background:#0080FF; transition:width .25s ease; }

/* Chips */
#ll-stepper .ll-chips{ display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin:.25rem 0 .75rem; }
#ll-stepper .ll-chips > label{ display:inline-flex; align-items:center; gap:.45rem; font-weight:600; cursor:pointer; }
#ll-stepper .ll-chips input{ accent-color:#0080FF; }

/* Hide radios */
.ll-step-radio{ position:absolute; left:-9999px; }

/* Panel visibility (11 steps; milestone conditional) */
#step-name:checked        ~ .ll-panels #panel-name,
#step-email:checked       ~ .ll-panels #panel-email,
#step-phone:checked       ~ .ll-panels #panel-phone,
#step-recipient:checked   ~ .ll-panels #panel-recipient,
#step-occasion:checked    ~ .ll-panels #panel-occasion,
#step-milestone:checked   ~ .ll-panels #panel-milestone,
#step-about:checked       ~ .ll-panels #panel-about,
#step-stories:checked     ~ .ll-panels #panel-stories,
#step-catchphrases:checked~ .ll-panels #panel-catchphrases,
#step-insidejokes:checked ~ .ll-panels #panel-insidejokes,
#step-music:checked       ~ .ll-panels #panel-music { display:block !important; }

/* Progress widths */
#step-name:checked        ~ .ll-progressbar .ll-progressbar-fill { width: 9.1%; }
#step-email:checked       ~ .ll-progressbar .ll-progressbar-fill { width:18.2%; }
#step-phone:checked       ~ .ll-progressbar .ll-progressbar-fill { width:27.3%; }
#step-recipient:checked   ~ .ll-progressbar .ll-progressbar-fill { width:36.4%; }
#step-occasion:checked    ~ .ll-progressbar .ll-progressbar-fill { width:45.5%; }
#step-milestone:checked   ~ .ll-progressbar .ll-progressbar-fill { width:54.6%; }
#step-about:checked       ~ .ll-progressbar .ll-progressbar-fill { width:63.7%; }
#step-stories:checked     ~ .ll-progressbar .ll-progressbar-fill { width:72.8%; }
#step-catchphrases:checked~ .ll-progressbar .ll-progressbar-fill { width:81.9%; }
#step-insidejokes:checked ~ .ll-progressbar .ll-progressbar-fill { width:91.0%; }
#step-music:checked       ~ .ll-progressbar .ll-progressbar-fill { width:100%; }

/* Conditional milestone (CSS :has() + fallback class) */
#panel-occasion .ll-next-if-milestone{ display:none; }
#panel-occasion .ll-next-skip-milestone{ display:inline-block; }
#panel-occasion:has(#select-occasion option[value="Birthday"]:checked) .ll-next-if-milestone,
#panel-occasion:has(#select-occasion option[value="Anniversary"]:checked) .ll-next-if-milestone{ display:inline-block; }
#panel-occasion:has(#select-occasion option[value="Birthday"]:checked) .ll-next-skip-milestone,
#panel-occasion:has(#select-occasion option[value="Anniversary"]:checked) .ll-next-skip-milestone{ display:none; }
#panel-occasion.ll-need-milestone .ll-next-if-milestone{ display:inline-block; }
#panel-occasion.ll-need-milestone .ll-next-skip-milestone{ display:none; }

/* Inline errors */
#ll-stepper .ll-error{ margin-top:8px; color:#ff6b6b; font-weight:700; font-size:.95rem; }
#ll-stepper [aria-invalid="true"]{ border-color:#ff6b6b !important; outline:0; }

/* --- Mobile keyboard safety space (no sticky; allow scrolling) --- */
@media (max-width: 991.98px){
  /* JS updates --kb with visualViewport; panels reserve bottom space so
     Back/Next are not hidden and you can still scroll naturally. */
  #ll-stepper .ll-panel{ padding-bottom: calc(var(--kb, 0px) + 140px); }
}