/*
 * F-Tech Listing Engine: formularz zapytania o nowy leasing i blok zachety.
 * Tylko tokeny --ft-* z jasnym zapasem. Ladowane wylacznie tam, gdzie jest
 * shortcode [fle_leasing_formularz] albo blok CTA.
 */

/* === Blok zachety (lista, brak wynikow, karta ogloszenia) === */
.fle-leadcta{
    display:grid; grid-template-columns:auto 1fr; gap:0.9rem 1rem; align-items:center;
    background:var(--ft-surface, #FFFFFF); border:1px solid var(--ft-line, #E0E4DE); border-left:3px solid var(--ft-accent-line, #6A8700);
    border-radius:8px; padding:1.1rem 1.2rem; margin:1.5rem 0; color:var(--ft-text, #191D22);
    font-family:"Instrument Sans", sans-serif; box-sizing:border-box; max-width:100%;
    transition:border-color 0.2s cubic-bezier(0.4,0,0.2,1), transform 0.2s cubic-bezier(0.4,0,0.2,1);
}
.fle-leadcta *, .fle-leadcta *::before, .fle-leadcta *::after{ box-sizing:border-box; }
.fle-leadcta:hover{ border-color:var(--ft-line-2, #CDD2CA); border-left-color:var(--ft-accent-line, #6A8700); }
.fle-leadcta__icon{
    width:44px; height:44px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
    background:var(--ft-accent-soft, #EEF7D2); color:var(--ft-accent-text, #4E6A00); flex:none;
}
.fle-leadcta__body{ min-width:0; }
.fle-leadcta__title{ margin:0 0 0.25rem; font-family:"Archivo", sans-serif; font-weight:700; font-size:1.02rem; line-height:1.3; letter-spacing:-0.01em; color:var(--ft-text, #191D22); }
.fle-leadcta__text{ margin:0; color:var(--ft-muted, #626970); font-size:0.9rem; line-height:1.55; }
.fle-leadcta__btn{
    grid-column:1 / -1; justify-self:start; display:inline-flex; align-items:center; gap:0.5rem;
    min-height:44px; padding:0 1.1rem; border-radius:6px; text-decoration:none; font-weight:700; font-size:0.92rem;
    background:var(--ft-accent, #C8F52B); color:var(--ft-accent-ink, #191D22); border:1px solid var(--ft-accent, #C8F52B);
    transition:background-color 0.18s cubic-bezier(0.4,0,0.2,1), transform 0.18s cubic-bezier(0.4,0,0.2,1);
}
.fle-leadcta__btn:hover{ background:var(--ft-accent-hover, #B5DE1F); color:var(--ft-accent-ink, #191D22); transform:translateY(-1px); }
.fle-leadcta__btn svg{ transition:transform 0.18s cubic-bezier(0.4,0,0.2,1); }
.fle-leadcta__btn:hover svg{ transform:translateX(3px); }
.fle-leadcta__btn:focus-visible{ outline:2px solid var(--ft-focus, #4E6A00); outline-offset:3px; }
@media (min-width:720px){
    .fle-leadcta{ grid-template-columns:auto 1fr auto; padding:1.2rem 1.4rem; }
    .fle-leadcta__btn{ grid-column:auto; justify-self:end; }
}
.fle-leadcta--single{ margin:1rem 0 0; }
@media (min-width:720px){
    /* W bocznej kolumnie karty ogloszenia jest waska przestrzen: uklad pionowy. */
    .fle-single__side .fle-leadcta--single{ grid-template-columns:auto 1fr; }
    .fle-single__side .fle-leadcta--single .fle-leadcta__btn{ grid-column:1 / -1; justify-self:start; }
}

/* === Formularz === */
.fle-lead{
    --fle-lead-gap:1rem;
    color:var(--ft-text, #191D22); font-family:"Instrument Sans", sans-serif; max-width:760px; margin:0 auto;
    scroll-margin-top:96px;
}
.fle-lead *, .fle-lead *::before, .fle-lead *::after{ box-sizing:border-box; }
.fle-lead [hidden]{ display:none !important; }
.fle-lead__form{
    background:var(--ft-surface, #FFFFFF); border:1px solid var(--ft-line, #E0E4DE); border-radius:8px;
    padding:1.25rem 1rem 1.1rem; margin:0;
}
@media (min-width:640px){ .fle-lead__form{ padding:1.75rem 1.75rem 1.4rem; } }

.fle-lead__head{ margin-bottom:1.25rem; }
.fle-lead__eyebrow{
    display:flex; align-items:center; gap:0.5rem; margin:0 0 0.6rem;
    font-size:0.72rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--ft-muted, #626970);
}
.fle-lead__eyebrow i{ width:8px; height:8px; background:var(--ft-accent, #C8F52B); transform:rotate(45deg); display:inline-block; }
.fle-lead__progress-label{ margin:0 0 0.5rem; font-size:0.82rem; color:var(--ft-muted, #626970); }
.fle-lead__progress{ height:4px; border-radius:4px; background:var(--ft-surface-2, #F1F3EE); overflow:hidden; }
.fle-lead__progress span{
    display:block; height:100%; width:33.34%; background:var(--ft-accent-line, #6A8700);
    transition:width 0.35s cubic-bezier(0.4,0,0.2,1);
}
.fle-lead__steps{ list-style:none; margin:0.75rem 0 0; padding:0; display:flex; gap:0.5rem; flex-wrap:wrap; }
.fle-lead__steps li{
    margin:0; font-size:0.8rem; font-weight:600; color:var(--ft-muted, #626970);
    padding:0.25rem 0.6rem; border:1px solid var(--ft-line, #E0E4DE); border-radius:999px;
    transition:color 0.2s cubic-bezier(0.4,0,0.2,1), border-color 0.2s cubic-bezier(0.4,0,0.2,1), background-color 0.2s cubic-bezier(0.4,0,0.2,1);
}
.fle-lead__steps li.is-active{ color:var(--ft-accent-ink, #191D22); background:var(--ft-accent, #C8F52B); border-color:var(--ft-accent, #C8F52B); }
.fle-lead__steps li.is-done{ color:var(--ft-accent-text, #4E6A00); border-color:var(--ft-accent-line, #6A8700); }

.fle-lead__ctx{
    margin:0 0 1rem; padding:0.7rem 0.9rem; border-radius:6px; font-size:0.88rem; line-height:1.5;
    background:var(--ft-accent-soft, #EEF7D2); color:var(--ft-text, #191D22);
}

.fle-lead__step{ border:0; margin:0; padding:0; min-width:0; display:none; }
.fle-lead__step.is-active{ display:block; animation:fle-lead-in 0.32s cubic-bezier(0.4,0,0.2,1) both; }
@keyframes fle-lead-in{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.fle-lead__legend{
    font-family:"Archivo", sans-serif; font-weight:700; font-size:clamp(1.15rem, 2.2vw, 1.35rem);
    letter-spacing:-0.015em; margin:0 0 1rem; padding:0; color:var(--ft-text, #191D22);
}

.fle-lead__grid{ display:grid; grid-template-columns:1fr; gap:0 var(--fle-lead-gap); }
@media (min-width:640px){ .fle-lead__grid{ grid-template-columns:1fr 1fr; } }
.fle-lead__field{ margin:0 0 var(--fle-lead-gap); min-width:0; }
.fle-lead__field--full{ grid-column:1 / -1; }
.fle-lead__field label, .fle-lead__label{
    display:block; font-weight:600; font-size:0.88rem; margin:0 0 0.35rem; color:var(--ft-text, #191D22);
}
.fle-lead__field input[type=text], .fle-lead__field input[type=email], .fle-lead__field input[type=tel],
.fle-lead__field input[type=number], .fle-lead__field select, .fle-lead__field textarea{
    width:100%; max-width:100%; min-height:46px; padding:0.6rem 0.75rem; font:inherit; font-size:1rem;
    color:var(--ft-text, #191D22); background:var(--ft-surface, #FFFFFF);
    border:1px solid var(--ft-line-ui, #7E867C); border-radius:6px;
    transition:border-color 0.18s cubic-bezier(0.4,0,0.2,1), box-shadow 0.18s cubic-bezier(0.4,0,0.2,1);
}
.fle-lead__field textarea{ min-height:96px; resize:vertical; line-height:1.5; }
.fle-lead__field input:hover, .fle-lead__field select:hover, .fle-lead__field textarea:hover{ border-color:var(--ft-text-2, #474D55); }
.fle-lead__field input:focus-visible, .fle-lead__field select:focus-visible, .fle-lead__field textarea:focus-visible{
    outline:2px solid var(--ft-focus, #4E6A00); outline-offset:1px; border-color:var(--ft-focus, #4E6A00);
}
.fle-lead__hint{ display:block; font-size:0.8rem; color:var(--ft-muted, #626970); margin-top:0.3rem; line-height:1.45; }
.fle-lead__msg{ display:block; font-size:0.82rem; color:var(--ft-danger, #B42318); margin-top:0.3rem; line-height:1.4; }
.fle-lead__msg:empty{ display:none; }
.fle-lead .is-invalid input, .fle-lead .is-invalid select, .fle-lead .is-invalid textarea{ border-color:var(--ft-danger, #B42318); }

/* Wybor jako przyciski */
.fle-lead__chips{ display:flex; flex-wrap:wrap; gap:0.5rem; }
.fle-lead__chip{ position:relative; display:inline-flex; margin:0 !important; cursor:pointer; }
.fle-lead__chip input{ position:absolute; opacity:0; width:1px; height:1px; margin:0; }
.fle-lead__chip span{
    display:inline-flex; align-items:center; min-height:44px; padding:0.5rem 0.95rem;
    border:1px solid var(--ft-line-ui, #7E867C); border-radius:6px; background:var(--ft-surface, #FFFFFF);
    font-weight:600; font-size:0.9rem; color:var(--ft-text, #191D22);
    transition:border-color 0.18s cubic-bezier(0.4,0,0.2,1), background-color 0.18s cubic-bezier(0.4,0,0.2,1), transform 0.18s cubic-bezier(0.4,0,0.2,1);
}
.fle-lead__chip:hover span{ border-color:var(--ft-text-2, #474D55); transform:translateY(-1px); }
.fle-lead__chip input:checked + span{ background:var(--ft-accent-soft, #EEF7D2); border-color:var(--ft-accent-line, #6A8700); color:var(--ft-text, #191D22); box-shadow:inset 0 0 0 1px var(--ft-accent-line, #6A8700); }
.fle-lead__chip input:focus-visible + span{ outline:2px solid var(--ft-focus, #4E6A00); outline-offset:2px; }
.fle-lead .is-invalid .fle-lead__chip span{ border-color:var(--ft-danger, #B42318); }

/* Zgoda */
.fle-lead__check{ display:flex !important; gap:0.65rem; align-items:flex-start; font-weight:400 !important; font-size:0.86rem !important; line-height:1.55; color:var(--ft-text-2, #474D55) !important; cursor:pointer; }
.fle-lead__check input{ width:20px; height:20px; margin:0.1rem 0 0; flex:none; accent-color:var(--ft-accent-line, #6A8700); }
.fle-lead__check a{ color:var(--ft-accent-text, #4E6A00); text-underline-offset:2px; }
.fle-lead__req{ font-style:normal; color:var(--ft-muted, #626970); }

/* Nawigacja krokow */
.fle-lead__nav{ display:flex; gap:0.6rem; justify-content:flex-end; flex-wrap:wrap; margin-top:0.4rem; }
.fle-lead__btn{
    display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; min-height:46px; padding:0 1.25rem;
    border-radius:6px; font:inherit; font-weight:700; font-size:0.95rem; cursor:pointer;
    background:var(--ft-text, #191D22); color:var(--ft-surface, #FFFFFF); border:1px solid var(--ft-text, #191D22);
    transition:background-color 0.18s cubic-bezier(0.4,0,0.2,1), border-color 0.18s cubic-bezier(0.4,0,0.2,1), color 0.18s cubic-bezier(0.4,0,0.2,1), transform 0.18s cubic-bezier(0.4,0,0.2,1);
}
.fle-lead__btn:hover{ transform:translateY(-1px); background:var(--ft-text-2, #474D55); border-color:var(--ft-text-2, #474D55); }
.fle-lead__btn svg{ transition:transform 0.18s cubic-bezier(0.4,0,0.2,1); }
.fle-lead__btn:hover svg{ transform:translateX(3px); }
.fle-lead__btn--ghost{ background:transparent; color:var(--ft-text, #191D22); border-color:var(--ft-line-2, #CDD2CA); }
.fle-lead__btn--ghost:hover{ background:transparent; color:var(--ft-accent-text, #4E6A00); border-color:var(--ft-accent-line, #6A8700); }
.fle-lead__btn--primary{ background:var(--ft-accent, #C8F52B); color:var(--ft-accent-ink, #191D22); border-color:var(--ft-accent, #C8F52B); }
.fle-lead__btn--primary:hover{ background:var(--ft-accent-hover, #B5DE1F); border-color:var(--ft-accent-hover, #B5DE1F); color:var(--ft-accent-ink, #191D22); }
.fle-lead__btn:focus-visible{ outline:2px solid var(--ft-focus, #4E6A00); outline-offset:3px; }
.fle-lead__btn[disabled]{ opacity:0.6; cursor:progress; transform:none; }
@media (max-width:479px){ .fle-lead__nav .fle-lead__btn{ flex:1 1 auto; } }

.fle-lead__fine{ margin:0.8rem 0 0; font-size:0.8rem; color:var(--ft-muted, #626970); text-align:right; }
.fle-lead__status{ margin:0.75rem 0 0; font-size:0.88rem; color:var(--ft-text-2, #474D55); }
.fle-lead__status:empty{ display:none; }
.fle-lead__status.is-error{ color:var(--ft-danger, #B42318); }

.fle-lead__alert{
    margin:0 0 1rem; padding:0.8rem 1rem; border-radius:6px; border:1px solid var(--ft-danger-line, #EBA8A0);
    background:var(--ft-danger-soft, #FDECEA); color:var(--ft-danger-strong, #B42318); font-size:0.9rem;
}
.fle-lead__alert p{ margin:0; }
.fle-lead__done{
    background:var(--ft-surface, #FFFFFF); border:1px solid var(--ft-accent-line, #6A8700); border-radius:8px;
    padding:1.5rem 1.25rem; text-align:center; color:var(--ft-text-2, #474D55);
    animation:fle-lead-in 0.4s cubic-bezier(0.4,0,0.2,1) both;
}
.fle-lead__done:focus{ outline:none; }
.fle-lead__done:focus-visible{ outline:2px solid var(--ft-focus, #4E6A00); outline-offset:3px; }
.fle-lead__done svg{ color:var(--ft-accent-text, #4E6A00); }
.fle-lead__done-title{ font-family:"Archivo", sans-serif; font-weight:700; font-size:1.2rem; color:var(--ft-text, #191D22); margin:0.4rem 0 0.35rem; }
.fle-lead__done p{ margin:0; line-height:1.55; }

@media (prefers-reduced-motion: reduce){
    .fle-lead *, .fle-leadcta *, .fle-leadcta, .fle-lead__done{
        animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;
    }
    .fle-lead__step.is-active{ animation:none; }
}
