/* ==========================================================================
   FORMINATOR — uklapanje u temu
   --------------------------------------------------------------------------
   Forma se ne gradi u temi; Forminator je renderuje, a ovaj fajl joj daje
   izgled ostatka sajta: isti radijusi, isti okviri, isti tokeni.

   ZAŠTO !important.

   Forminator svoj podrazumevani izgled piše selektorima koji nose ID forme:

       .forminator-ui#forminator-module-123.forminator-design--default .forminator-input

   To je specifičnost 1-3-0. Tema ne može da je nadjača klasama — koliko god
   ih ulančali, ID ostaje ID. Jedine dve opcije su da se ID pogađa (a menja se
   po formi i po sajtu) ili !important. Ovde je !important namerno i ograničen
   na osobine koje se zaista sudaraju; sve ostalo je pisano bez njega.

   Ako u Forminatoru pod Appearance izabereš stil koji ne ispisuje svoj CSS,
   ova pravila prolaze i bez !important — ali ostaju bezbedna u oba slučaja.

   SVE JE OGRANIČENO NA .pew-contact__form. Forminator se često koristi i
   drugde (popup, widget); tamo treba da ostane svoj.
   ========================================================================== */

/* Panel kontakta je zelen, pa forma čita tokene te površine. */
.pew-contact__form {
    --f-input-bg: var(--pew-green-deep);
    --f-input-fg: var(--pew-white);
    --f-line:     var(--pew-green-line);
}

/* Forminator svojim wrapperima daje sopstvene margine i širine. */
.pew-contact__form .forminator-ui,
.pew-contact__form .forminator-custom-form {
    margin: 0 !important;
    max-width: none !important;
}

/* --------------------------------------------------------------- 1. RASPORED */

/* Forminatorova rešetka radi; samo joj se izjednačava razmak sa temom. */
.pew-contact__form .forminator-row {
    margin-bottom: var(--sp-md) !important;
}
.pew-contact__form .forminator-row:last-of-type { margin-bottom: 0 !important; }

.pew-contact__form .forminator-field { margin-bottom: 0 !important; }

/* ---------------------------------------------------------------- 2. LABELE */

.pew-contact__form .forminator-label {
    font-family: var(--pew-font-body) !important;
    font-size: var(--fs-label) !important;
    font-weight: 600 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--pew-fg-muted) !important;
    margin-bottom: .35rem !important;
}

/* Zvezdica obaveznog polja: akcenat teme, ne crvena. Crvena je boja greške,
   a obavezno polje nije greška dok se ne pošalje prazno. */
.pew-contact__form .forminator-required {
    color: var(--pew-accent) !important;
    margin-left: .15em;
}

/* Opis ispod polja i brojač znakova. */
.pew-contact__form .forminator-description,
.pew-contact__form .forminator-description span {
    font-family: var(--pew-font-body) !important;
    font-size: var(--fs-label) !important;
    color: var(--pew-fg-muted) !important;
}

/* ----------------------------------------------------------------- 3. POLJA */

.pew-contact__form .forminator-input,
.pew-contact__form .forminator-textarea,
.pew-contact__form select.forminator-select,
.pew-contact__form .forminator-input-with-phone {
    width: 100% !important;
    padding: .75em 1em !important;
    background-color: var(--f-input-bg) !important;
    border: 1px solid var(--f-line) !important;
    /* Ovo je i bio povod za ceo fajl. */
    border-radius: var(--r-sm) !important;
    color: var(--f-input-fg) !important;
    font-family: var(--pew-font-body) !important;
    font-size: var(--fs-small) !important;
    line-height: 1.5 !important;
    box-shadow: none !important;
    transition: border-color var(--dur-base) var(--ease-out),
                box-shadow var(--dur-base) var(--ease-out);
}

.pew-contact__form .forminator-textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

.pew-contact__form .forminator-input::placeholder,
.pew-contact__form .forminator-textarea::placeholder {
    color: var(--pew-fg-muted) !important;
    opacity: 1 !important;
}

.pew-contact__form .forminator-input:focus,
.pew-contact__form .forminator-textarea:focus,
.pew-contact__form select.forminator-select:focus {
    outline: none !important;
    border-color: var(--pew-accent-fill) !important;
    box-shadow: 0 0 0 3px var(--pew-accent-wash) !important;
}

/* Polje za telefon: Forminator u njega ubacuje zastavicu kao zaseban element,
   pa spoljni omotač nosi okvir, a sam input ostaje go. */
.pew-contact__form .forminator-field-phone .forminator-input-with-phone {
    padding: 0 !important;
    overflow: hidden;
}
.pew-contact__form .forminator-field-phone .forminator-input-with-phone .forminator-input {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Select2, ako je polje select. Forminator ga renderuje kao svoj widget. */
.pew-contact__form .forminator-custom-form .select2-container--default .select2-selection--single {
    height: auto !important;
    padding: .75em 1em !important;
    background-color: var(--f-input-bg) !important;
    border: 1px solid var(--f-line) !important;
    border-radius: var(--r-sm) !important;
}
.pew-contact__form .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--f-input-fg) !important;
    line-height: 1.5 !important;
    padding: 0 !important;
}

/* Checkbox / radio — kvadratić u boji akcenta. */
.pew-contact__form .forminator-checkbox input,
.pew-contact__form .forminator-radio input { accent-color: var(--pew-accent-fill); }
.pew-contact__form .forminator-checkbox,
.pew-contact__form .forminator-radio {
    font-size: var(--fs-tiny) !important;
    color: var(--pew-fg-body) !important;
    line-height: 1.5 !important;
}
.pew-contact__form .forminator-checkbox a,
.pew-contact__form .forminator-radio a {
    color: var(--pew-accent) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ----------------------------------------------------------------- 4. DUGME */

/*
 * Dugme dobija telo .pew-btn. Ne može da nosi tu klasu — markup ispisuje
 * Forminator — pa se pravila ponavljaju ovde. Boje čita iz --pew-btn-*, što
 * znači da na zelenoj sekciji ispadne zlatno, a na beloj zeleno, bez ijedne
 * dodatne linije.
 */
.pew-contact__form .forminator-button-submit,
.pew-contact__form button.forminator-button-submit {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .55em;
    width: 100% !important;
    margin-top: var(--sp-sm) !important;
    padding: .95em 1.6em !important;
    background: var(--pew-btn-bg) !important;
    color: var(--pew-btn-fg) !important;
    border: 0 !important;
    border-radius: var(--r-sm) !important;
    font-family: var(--pew-font-body) !important;
    font-size: var(--fs-small) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: background-color var(--dur-base) var(--ease-out);
}
.pew-contact__form .forminator-button-submit:hover {
    background: var(--pew-btn-bg-hot) !important;
    color: var(--pew-btn-fg) !important;
}
.pew-contact__form .forminator-button-submit:focus-visible {
    outline: 2px solid var(--pew-accent-fill) !important;
    outline-offset: 3px;
}

/* Vrteška dok se šalje — Forminator joj daje svoju boju. */
.pew-contact__form .forminator-button-submit .forminator-icon-loader {
    color: var(--pew-btn-fg) !important;
}

/* ---------------------------------------------------- 5. GREŠKE I ODGOVORI */

.pew-contact__form .forminator-error-message {
    font-family: var(--pew-font-body) !important;
    font-size: var(--fs-label) !important;
    color: #F0A9A0 !important;   /* čitljivo crveno NA ZELENOJ podlozi */
    margin-top: .3rem !important;
}
.pew-contact__form .forminator-has_error .forminator-input,
.pew-contact__form .forminator-has_error .forminator-textarea {
    border-color: #E08A7E !important;
}

/* Poruka posle slanja. Forminator razlikuje uspeh i grešku klasom na wrapperu. */
.pew-contact__form .forminator-response-message {
    margin: 0 0 var(--sp-md) !important;
    padding: var(--sp-sm) var(--sp-md) !important;
    border-radius: var(--r-sm) !important;
    font-size: var(--fs-small) !important;
    line-height: 1.5 !important;
}
.pew-contact__form .forminator-response-message.forminator-success {
    background: var(--pew-accent-wash) !important;
    border: 1px solid var(--pew-accent-fill) !important;
    color: var(--pew-fg) !important;
}
.pew-contact__form .forminator-response-message.forminator-error {
    background: rgba(224, 138, 126, .12) !important;
    border: 1px solid #E08A7E !important;
    color: var(--pew-fg) !important;
}
.pew-contact__form .forminator-response-message p:last-child { margin-bottom: 0 !important; }

/* Forminator ume da ubaci svoj naslov i opis forme iznad polja; sekcija ih
   već ima, pa bi se ponavljali. */
.pew-contact__form .forminator-title,
.pew-contact__form .forminator-subtitle { display: none !important; }