/* ==========================================================================
   Ankieta "Dobierz pielęgnację" — WGRAĆ:
   wp-content/themes/<motyw-potomny>/assets/infinity-ankieta.css
   Paleta i typografia zgodne ze style.css (Cormorant Garamond + Montserrat).
   ========================================================================== */

.ia-wrap {
    max-width: 680px;
    margin: 0 auto;
    background: #FAF8F4;
    font-family: 'Montserrat', sans-serif;
    color: #1D1D1B;
}
.ia-wrap * { box-sizing: border-box; }

/* Motyw nadpisuje domyślne [hidden] własnym display — wymuszamy ukrywanie,
   inaczej wszystkie kroki ankiety wyświetlają się jednocześnie. */
.ia-wrap [hidden],
.ia-progress[hidden],
.ia-wrap .ia-step[hidden],
.ia-wrap .ia-nav[hidden],
.ia-wrap .ia-cond[hidden],
.ia-wrap .ia-q3[hidden],
.ia-wrap button[hidden],
.ia-wrap p[hidden] { display: none !important; }

.ia-bar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 22px 24px; border-bottom: 1px solid #DED5C9;
}
.ia-logo { font-family: 'Cormorant Garamond', serif; font-size: 19px; letter-spacing: 0.14em; }
.ia-close { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #6E6962 !important; text-decoration: none; }
.ia-close:hover { color: #B88A44 !important; }

.ia-progress { padding: 20px 24px 0; }
.ia-progress-label { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #6E6962; margin-bottom: 8px; }
.ia-progress-track { height: 3px; background: #F3EDE4; }
.ia-progress-fill { height: 3px; background: #B88A44; width: 0; transition: width .3s ease; }

.ia-body { padding: 36px 24px 40px; }
.ia-center { text-align: center; }

.ia-h1 { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 32px; line-height: 1.25; margin: 20px 0 18px; text-transform: none; }
.ia-h2 { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 24px; margin: 0 0 30px; text-transform: none; }
.ia-lead { font-size: 14.5px; color: #6E6962; line-height: 1.7; max-width: 440px; margin: 0 auto 14px; font-weight: 300; }
.ia-note-strong { font-size: 12.5px; font-weight: 600; letter-spacing: 0.04em; margin: 20px 0 34px; }
.ia-note-italic { font-size: 11.5px; color: #6E6962; font-style: italic; margin: 0 0 26px; }

.ia-q { margin-bottom: 34px; }
.ia-q-title { font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: 600; margin: 0 0 6px; text-transform: none; letter-spacing: 0; }
.ia-q-help { font-size: 12.5px; color: #6E6962; margin: 0 0 16px; }

/* Pigułki (radio / checkbox) */
.ia-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.ia-pills-stack { flex-direction: column; }
.ia-pill { position: relative; display: inline-flex; cursor: pointer; margin: 0; }
.ia-pill input { position: absolute; opacity: 0; width: 0; height: 0; }
.ia-pill span {
    display: block; padding: 11px 18px; border: 1px solid #DED5C9; background: #FFFFFF;
    font-size: 13px; color: #1D1D1B; transition: all .15s ease;
}
.ia-pill:hover span { border-color: #B88A44; }
.ia-pill input:checked + span { background: #B88A44; border-color: #B88A44; color: #FFFFFF; }
.ia-pill input:focus-visible + span { outline: 2px solid #D6B77A; outline-offset: 2px; }
.ia-pills.ia-limit .ia-pill input:not(:checked) + span { opacity: .45; }
.ia-pills-stack .ia-pill, .ia-pills-stack .ia-pill span { width: 100%; text-align: left; }

/* Karty (pytanie 11) */
.ia-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ia-card {
    position: relative; display: block; padding: 18px 16px; border: 1px solid #DED5C9;
    background: #FFFFFF; cursor: pointer; transition: all .15s ease;
}
.ia-card input { position: absolute; opacity: 0; width: 0; height: 0; }
.ia-card:hover { border-color: #B88A44; }
.ia-card:has(input:checked) { border-color: #B88A44; background: #F7F2EB; }
.ia-card-kicker { display: block; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; margin-bottom: 6px; }
.ia-card-sub { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.ia-card-desc { display: block; font-size: 12px; color: #6E6962; line-height: 1.5; }

/* Pola tekstowe */
.ia-input {
    width: 100%; border: 1px solid #DED5C9; background: #FFFFFF; padding: 12px 14px;
    font-family: 'Montserrat', sans-serif; font-size: 13.5px; color: #1D1D1B; border-radius: 0;
    margin-top: 14px; resize: vertical;
}
.ia-input:focus { outline: none; border-color: #B88A44; }
.ia-fields { display: flex; flex-direction: column; gap: 16px; margin-bottom: 26px; }
.ia-fields .ia-input { margin-top: 0; }
.ia-label { display: block; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #6E6962; margin-bottom: 6px; }

/* Upload zdjęć */
.ia-uploads { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ia-upload {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; height: 150px; border: 1px dashed #DED5C9; background: #F7F2EB; cursor: pointer; transition: all .15s ease;
}
.ia-upload:hover { border-color: #B88A44; }
.ia-upload input { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.ia-upload-plus { font-size: 22px; color: #B88A44; line-height: 1; }
.ia-upload-label { font-size: 11px; color: #6E6962; text-align: center; padding: 0 8px; }
.ia-upload.is-filled { border-style: solid; border-color: #B88A44; background: #FFFFFF; }

/* Zgody */
.ia-consent { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; color: #6E6962; line-height: 1.6; margin-bottom: 14px; cursor: pointer; }
.ia-consent input { margin-top: 3px; accent-color: #B88A44; }

/* Nawigacja */
.ia-nav {
    position: sticky; bottom: 0; background: #FAF8F4; border-top: 1px solid #DED5C9;
    padding: 16px 24px; display: flex; justify-content: space-between; gap: 12px;
}
.ia-btn-dark, .ia-btn-gold, .ia-btn-ghost {
    display: inline-flex; align-items: center; justify-content: center;
    font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-weight: 500;
    border-radius: 0; cursor: pointer; text-decoration: none; transition: all .2s ease;
}
.ia-btn-dark { background: #1D1D1B; color: #FAF8F4 !important; border: 1px solid #1D1D1B; padding: 16px 44px; font-size: 12.5px; letter-spacing: 0.12em; }
.ia-btn-dark:hover { background: #B88A44; border-color: #B88A44; color: #FFFFFF !important; }
.ia-btn-gold { background: #B88A44; color: #FFFFFF !important; border: 1px solid #B88A44; padding: 14px 30px; font-size: 11.5px; letter-spacing: 0.1em; }
.ia-btn-gold:hover { background: #1D1D1B; border-color: #1D1D1B; }
.ia-btn-ghost { background: none; color: #1D1D1B !important; border: 1px solid #DED5C9; padding: 14px 26px; font-size: 11.5px; letter-spacing: 0.1em; }
.ia-btn-ghost:hover { border-color: #B88A44; color: #B88A44 !important; }

.ia-error, .ia-error-box { font-size: 12.5px; color: #A33A3A; margin: 16px 0 0; }
.ia-error-box { margin: 20px 24px 0; padding: 12px 14px; border: 1px solid #E0BCBC; background: #FBF3F3; }
.ia-hp { position: absolute; left: -9999px; }

/* Motyw stylizuje h1/h2/h3 i przyciski globalnie (Cormorant + inne rozmiary),
   dlatego typografia ankiety musi być wymuszona. */
.ia-wrap,
.ia-wrap p, .ia-wrap span, .ia-wrap div, .ia-wrap label,
.ia-wrap input, .ia-wrap textarea, .ia-wrap button, .ia-wrap a {
    font-family: 'Montserrat', sans-serif !important;
}
.ia-wrap .ia-h1, .ia-wrap .ia-h2 { font-family: 'Cormorant Garamond', serif !important; font-weight: 400 !important; letter-spacing: 0 !important; }
.ia-wrap .ia-logo { font-family: 'Cormorant Garamond', serif !important; }
.ia-wrap .ia-q-title {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14.5px !important; font-weight: 600 !important;
    line-height: 1.5 !important; letter-spacing: 0 !important;
    text-transform: none !important; font-variant-numeric: lining-nums !important;
    color: #1D1D1B !important;
}
.ia-wrap .ia-q-help { font-size: 12.5px !important; font-weight: 400 !important; color: #6E6962 !important; line-height: 1.6 !important; }
.ia-wrap .ia-pill span, .ia-wrap .ia-card-desc, .ia-wrap .ia-input { font-weight: 400 !important; }
.ia-wrap .ia-card-kicker, .ia-wrap .ia-card-sub { font-weight: 600 !important; }

/* Motyw nadpisuje style pól formularza (kolor tekstu, wysokość, obramowanie) */
.ia-wrap input[type="text"].ia-input,
.ia-wrap input[type="email"].ia-input,
.ia-wrap input[type="tel"].ia-input,
.ia-wrap textarea.ia-input {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid #DED5C9 !important;
    background: #FFFFFF !important;
    color: #1D1D1B !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.ia-wrap input.ia-input:focus,
.ia-wrap textarea.ia-input:focus { border-color: #B88A44 !important; outline: none !important; }
.ia-wrap input.ia-input::placeholder,
.ia-wrap textarea.ia-input::placeholder { color: #B0A798 !important; opacity: 1; }

/* Ekran startowy — wyśrodkowana kolumna tekstu */
.ia-step.ia-center, .ia-body.ia-center { text-align: center !important; }
.ia-step.ia-center .ia-h1 { max-width: 460px; margin-left: auto; margin-right: auto; }
.ia-step.ia-center .ia-lead,
.ia-step.ia-center .ia-note-strong { margin-left: auto; margin-right: auto; text-align: center; }

/* Sticky nawigacja nie może wtapiać się w treść */
.ia-nav { z-index: 5; box-shadow: 0 -6px 16px rgba(29, 29, 27, 0.05); }

@media (max-width: 640px) {
    .ia-body { padding: 26px 18px 32px; }
    .ia-h1 { font-size: 26px; }
    .ia-h2 { font-size: 21px; }
    .ia-cards { grid-template-columns: minmax(0, 1fr); }
    .ia-uploads { grid-template-columns: minmax(0, 1fr); }
    .ia-upload { height: 120px; }
    .ia-nav { padding: 12px 18px; }
    .ia-btn-gold, .ia-btn-ghost { padding: 14px 18px; font-size: 11px; letter-spacing: 0.06em; }
    .ia-pill span { font-size: 12.5px; padding: 10px 15px; }
}