/* ===================================================================
   IIC Osaka — CILS booking form (Gravity Forms)
   OSAKA-ONLY. Su IIC Tokyo gli esami CILS si vendono via WooCommerce e questo
   file non esiste: tenerlo fuori da iic_corsi.css evita che #gform_wrapper_14
   colpisca un form omonimo ma diverso sul gemello.
   Caricato da includes/inc-osaka-cils-booking.php.
   =================================================================== */

/* ===================================================================
   CILS booking form (Gravity Form 14) — styling
   Colori dal kit Elementor (var --e-global-color-*), con fallback hex
   per le custom color legate all'ID del kit. Scoping su #gform_wrapper_14
   cosi' non tocca gli altri form. Layout tabella-zebra tipo vartable.
   =================================================================== */
#gform_wrapper_14 {
    --tl: var(--e-global-color-accent);            /* teal  #3D8681 */
    --bl: var(--e-global-color-primary);           /* blu   #436D8E */
    --tx: var(--e-global-color-text);              /* testo #56595A */
    --ink: var(--e-global-color-3c63f92, #231B1D);
    --rd: var(--e-global-color-6daeb54, #B33A3A);
    --card: var(--e-global-color-bd14155, #F1F2EB);
    --line: rgba(86, 89, 90, .20);
}
#gform_wrapper_14 .gform_fields { row-gap: 20px; }
/* La prima pagina ha gia' stacco in cima per i campi che la precedono: lo do alle altre. */
#gform_wrapper_14 .gform_body > .gform_page:not(:first-child) { padding-top: 20px; }
#gform_wrapper_14 .gfield_label,
#gform_wrapper_14 legend.gfield_label {
    font-weight: 700;
    color: var(--ink);
    font-size: 1rem;
    margin-bottom: 9px;
    line-height: 1.5;
}
#gform_wrapper_14 .gfield_required_text { color: var(--rd); font-weight: 600; }

/* Nag informativo (campo HTML iic_cils_discount_nag) */
#gform_wrapper_14 .iic_cils_discount_nag {
    background: var(--card);
    border: 1px solid var(--line);
    border-left: 4px solid var(--bl);
    border-radius: 8px;
    padding: 13px 15px;
    font-size: .9rem;
    line-height: 1.75;
    color: var(--tx);
}

/* Nota pagamento, ultima pagina (campo HTML iic_cils_payment_note) */
#gform_wrapper_14 .iic_cils_payment_note {
    background: rgba(61, 134, 129, .09);
    border: 1px solid var(--tl);
    border-left: 4px solid var(--tl);
    border-radius: 8px;
    padding: 14px 16px;
    font-size: .92rem;
    line-height: 1.85;
    color: var(--ink);
}

/* Istruzioni allegati, pagina 3 (campo HTML iic_cils_docs_intro) */
#gform_wrapper_14 .iic_cils_docs_intro {
    background: var(--card);
    border: 1px solid var(--line);
    border-left: 4px solid var(--bl);
    border-radius: 8px;
    padding: 14px 16px;
    font-size: .92rem;
    line-height: 1.8;
    color: var(--tx);
}
#gform_wrapper_14 .iic-cils-docs-lead {
    margin: 0 0 8px;
    font-weight: 700;
    color: var(--ink);
}
#gform_wrapper_14 .iic-cils-docs-list {
    margin: 0 0 10px;
    padding-left: 1.4em;
}
#gform_wrapper_14 .iic-cils-docs-list li { margin-bottom: 4px; }
#gform_wrapper_14 .iic-cils-docs-note { margin: 0 0 12px; }
#gform_wrapper_14 .iic-cils-docs-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}
#gform_wrapper_14 .iic-cils-doc-btn {
    display: inline-block;
    background: transparent;
    border: 1.5px solid var(--tl);
    color: var(--tl);
    border-radius: 8px;
    padding: 9px 14px;
    font-size: .88rem;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s;
}
#gform_wrapper_14 .iic-cils-doc-btn:hover { background: rgba(61, 134, 129, .10); }

/* Upload: la doppia riga (tipi file + dimensione) di GF piu' compatta */
#gform_wrapper_14 .gform_fileupload_rules {
    font-size: .8rem;
    color: #8a856f;
    margin-top: 4px;
}

/* Step della paginazione: piu' piccoli e discreti (di serie sono molto ingombranti) */
#gform_wrapper_14 .gf_page_steps {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--line);
}
#gform_wrapper_14 .gf_step {
    margin: 0 18px 6px 0;
    opacity: .55;
}
#gform_wrapper_14 .gf_step_active { opacity: 1; }
#gform_wrapper_14 .gf_step_number {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    line-height: 24px !important;
    font-size: .75rem !important;
    border-radius: 14px !important;
    margin-right: 6px !important;
}
#gform_wrapper_14 .gf_step_label {
    font-size: .82rem;
    font-weight: 600;
    color: var(--ink);
}
#gform_wrapper_14 .gf_step_completed .gf_step_number,
#gform_wrapper_14 .gf_step_active .gf_step_number {
    background-color: var(--tl) !important;
    border-color: var(--tl) !important;
    color: #fff !important;
}
/* Sugli step completati il tema disegna un cerchio pieno da 40px con ::before:
   va rimpicciolito insieme al numero, altrimenti sborda. E' anche l'elemento che
   si vede davvero, quindi il colore va messo qui, non sul .gf_step_number. */
#gform_wrapper_14 .gf_step_completed .gf_step_number::before {
    width: 28px !important;
    height: 28px !important;
    border-radius: 14px !important;
    background: var(--tl) !important;
    border-color: var(--tl) !important;
}

/* Materie: tabella-zebra, prezzo a destra, checkbox in coda */
#gform_wrapper_14 .gfield_checkbox {
    display: block;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
}
#gform_wrapper_14 .gchoice {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    margin: 0;
    cursor: pointer;
    transition: background .12s;
    border-top: 1px solid var(--line);
}
#gform_wrapper_14 .gchoice:first-child { border-top: none; }
#gform_wrapper_14 .gchoice:nth-child(odd) { background: rgba(255, 255, 255, .4); }
#gform_wrapper_14 .gchoice:hover { background: rgba(61, 134, 129, .10); }
#gform_wrapper_14 .gchoice:has(input:checked) { background: rgba(61, 134, 129, .14); }
#gform_wrapper_14 .gchoice label {
    order: 1;
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 0;
    cursor: pointer;
    color: var(--ink);
    font-weight: 500;
}
#gform_wrapper_14 .gchoice input[type=checkbox] {
    order: 2;
    width: 20px;
    height: 20px;
    accent-color: var(--tl);
    margin: 0;
    flex: 0 0 auto;
    cursor: pointer;
}
#gform_wrapper_14 .ginput_price { color: var(--tl); font-weight: 700; white-space: nowrap; }

/* Sconto pacchetto completo (campo 割引) */
#gform_wrapper_14 .iic_cils_gf_product_discount {
    background: rgba(61, 134, 129, .09);
    border: 1px solid var(--tl);
    border-radius: 8px;
    padding: 12px 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
#gform_wrapper_14 .iic_cils_gf_product_discount .gfield_label { width: auto; margin: 0; }
#gform_wrapper_14 .iic_cils_gf_product_discount .ginput_container_singleproduct {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}
#gform_wrapper_14 .iic_cils_gf_product_discount .ginput_product_price_label { display: none; }
#gform_wrapper_14 .iic_cils_gf_product_discount .ginput_product_price {
    -webkit-appearance: none !important;
    appearance: none !important;
    color: var(--tl) !important;
    font-weight: 800;
    font-size: 1.25rem;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    width: auto !important;
    text-align: right;
    box-shadow: none !important;
}
#gform_wrapper_14 .iic_cils_gf_product_discount .gfield_description {
    flex-basis: 100%;
    color: var(--tx);
    font-size: .83rem;
    margin: 0;
}

/* Totale */
#gform_wrapper_14 .gfield_total {
    border-top: 2px solid var(--line);
    padding-top: 16px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#gform_wrapper_14 .gfield_total .gfield_label { margin: 0; font-size: 1.1rem; }
#gform_wrapper_14 .gfield_total .ginput_container_total { background: transparent !important; border: 0 !important; padding: 0 !important; }
#gform_wrapper_14 .gfield_total .ginput_total {
    -webkit-appearance: none !important;
    appearance: none !important;
    color: var(--tl) !important;
    font-size: 1.7rem;
    font-weight: 800;
    border: 0 !important;
    background: transparent !important;
    text-align: right;
    padding: 0 !important;
    width: auto !important;
    box-shadow: none !important;
}

/* Campi testo/email/tel (esclusi i product-price readonly) */
#gform_wrapper_14 input[type=text]:not(.ginput_total):not(.ginput_product_price),
#gform_wrapper_14 input[type=email],
#gform_wrapper_14 input[type=tel] {
    background: #fff !important;
    border: 1.5px solid var(--line) !important;
    border-radius: 8px;
    padding: 11px 13px;
    font-size: 1rem;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
}
#gform_wrapper_14 input[type=text]:not(.ginput_total):not(.ginput_product_price):focus,
#gform_wrapper_14 input[type=email]:focus {
    border-color: var(--tl) !important;
    box-shadow: 0 0 0 3px rgba(61, 134, 129, .15);
    outline: none;
}
#gform_wrapper_14 .gform-field-label--type-sub { color: #8a856f; font-size: .8rem; margin-top: 4px; }

/* Consenso */
#gform_wrapper_14 .ginput_container_consent { display: flex; align-items: flex-start; gap: 10px; }
#gform_wrapper_14 .ginput_container_consent input { width: 18px; height: 18px; accent-color: var(--tl); margin-top: 2px; flex: 0 0 auto; }

/* Bottoni: submit + paginazione (pagina 1 -> Next, pagina 2 -> Previous/Submit) */
#gform_wrapper_14 .gform_footer,
#gform_wrapper_14 .gform_page_footer { margin-top: 12px; display: flex; gap: 12px; }
#gform_wrapper_14 #gform_submit_button_14,
#gform_wrapper_14 .gform_next_button {
    background: var(--tl);
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 15px 28px;
    font-size: 1.05rem;
    font-weight: 700;
    flex: 1;
    cursor: pointer;
    transition: filter .15s;
}
#gform_wrapper_14 #gform_submit_button_14:hover,
#gform_wrapper_14 .gform_next_button:hover { filter: brightness(.92); }
#gform_wrapper_14 .gform_previous_button {
    border-radius: 10px;
    padding: 15px 24px;
    font-weight: 600;
    cursor: pointer;
    flex: 0 0 auto;
}
/* Il "Previous" e' stilato da piu' fonti (regola preesistente del tema -> secondary,
   WooCommerce .button, gravity-theme), tutte a singolo #id. Per l'outline serve una
   specificita' che le batta a prescindere dall'ordine di caricamento: doppio #id
   => (0,2,1,0), supera qualsiasi regola a singolo id. Senza tag: copre input e button. */
#gform_wrapper_14#gform_wrapper_14 .gform_previous_button {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--bl) !important;
    border: 1.5px solid rgba(86, 89, 90, .30) !important;
}