/**
 * FatturaPRO.click — Public CSS (Checkout Classico)
 *
 * Strategia: Progressive Enhancement con CSS Custom Properties
 *
 * Le variabili CSS definite qui fungono da "API pubblica" per i temi:
 * un tema può sovrascrivere queste variabili senza bisogno di conoscere
 * la struttura interna del plugin.
 *
 * Esempio di override da parte di un tema:
 *   :root {
 *       --fattpro-error-color: #e74c3c;
 *       --fattpro-field-gap: 1.5rem;
 *   }
 *
 * @since 2.63
 * @package Fatturapro_click
 */

/* ==========================================================================
   1. CSS Custom Properties — API Pubblica per i temi
   ========================================================================== */

:root {
    /* Colori */
    --fattpro-error-color: #dc3232;
    --fattpro-error-bg: transparent;
    --fattpro-success-color: #46b450;

    /* Spaziatura */
    --fattpro-field-gap: 0;

    /* Transizioni */
    --fattpro-transition-duration: 0.2s;

    /**
     * Select — Hook CSS per temi che vogliono personalizzare le <select>.
     *
     * Queste variabili NON vengono usate nella regola base (per evitare
     * che "initial" resetti lo stile nativo del browser). Sono esposte
     * come API pubblica: un tema può definirle per applicare stili
     * personalizzati tramite il proprio foglio di stile.
     *
     * Per i temi supportati dal plugin (es. Storefront), l'override
     * viene applicato direttamente via wp_add_inline_style() in PHP,
     * usando proprietà CSS dirette sul selettore .fattpro-select.
     *
     * @since 2.63
     */
}

/* ==========================================================================
   2. Contenitore campi FatturaPRO — Checkout Classico
   ========================================================================== */

/**
 * Classe wrapper per i campi custom del plugin.
 * Utilizzata in class-fatturapro-checkout-fields.php.
 */
.fatturapro_click_checkout_customfields {
    margin-bottom: var(--fattpro-field-gap);
}

/**
 * Gestione posizionamento colonna secondaria checkout.
 * Necessario per evitare che i campi FatturaPRO vengano sovrapposti
 * dalla colonna degli ordini in temi con layout a due colonne.
 *
 * Nota: questa regola è un workaround per la struttura del checkout
 * classico WooCommerce che utilizza position:relative sulla col-2.
 */
.fatturapro-chechout_customfields {
    position: relative;
    z-index: 10;
}

/* ==========================================================================
   3. Validazione inline — Messaggi di errore
   ========================================================================== */

/**
 * Errore inline generato dal JavaScript del plugin (addSpanError).
 * Usa inherit per font-size e font-family così da adattarsi al tema.
 */
.fattpro-error {
    display: block;
    color: var(--fattpro-error-color, #dc3232);
    background-color: var(--fattpro-error-bg, transparent);
    font-size: 0.85em;
    line-height: 1.4;
    margin-top: 0.25em;
    margin-bottom: 0.5em;
}

/**
 * Override della validazione WooCommerce per campi non validati.
 * Utilizza la variabile CSS del plugin per coerenza cromatica.
 */
.woocommerce form .form-row.woocommerce-invalid .select2-container,
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
    border-color: var(--fattpro-error-color, #dc3232);
}

/* ==========================================================================
   4. Transizioni show/hide — Evitare flash di contenuto
   ========================================================================== */

/**
 * I campi FatturaPRO che vengono mostrati/nascosti dal JavaScript
 * hanno un transition per evitare cambiamenti bruschi.
 * Il JS gestisce display:none/block, questa regola aggiunge opacity.
 */
#billing_company_field,
#fattpro_customer_type_field,
#fattpro_invoice_choice_field,
#fattpro_partita_iva_field,
#fattpro_codice_fiscale_field,
#fattpro_sdi_field,
#fattpro_pec_field {
    transition: opacity var(--fattpro-transition-duration, 0.2s) ease;
}

/* ==========================================================================
   5. Select FatturaPRO — Integrazione con i temi
   ========================================================================== */

/**
 * Le select del plugin (Customer Type, Invoice Choice) devono ereditare
 * lo stesso aspetto delle altre select del checkout WooCommerce.
 *
 * Strategia: usiamo gli stessi selettori che i temi usano per stilizzare
 * le select del checkout, aggiungendo la classe .fattpro-select come
 * gancio specifico. Questo permette ai temi di stilizzare le nostre
 * select esattamente come le altre, senza intervento.
 *
 * La classe .fattpro-select è aggiunta via `input_class` in PHP,
 * quindi va direttamente sull'elemento <select>, non sul wrapper.
 *
 * @since 2.63
 * @see   public/utils/class-fatturapro-checkout-fields.php
 */
.woocommerce form .form-row select.fattpro-select,
.woocommerce-page form .form-row select.fattpro-select {
    width: 100%;
    box-sizing: border-box;
    /**
     * SOLO proprietà strutturali. Non toccare proprietà visive
     * (background, border, padding, color, box-shadow) perché
     * devono restare sotto il controllo del tema.
     *
     * Per temi specifici (es. Storefront), il plugin inietta
     * override visivi via wp_add_inline_style() in PHP.
     *
     * @see public/class-fatturapro_click-public.php — enqueue_styles()
     */
}

/* ==========================================================================
   6. Accessibilità — Focus states
   ========================================================================== */

/**
 * Garantisce uno stile di focus visibile per i campi custom del plugin,
 * indipendente dal tema. Usa outline per non alterare il layout.
 */
.fatturapro_click_checkout_customfields input:focus,
.fatturapro_click_checkout_customfields select:focus {
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

/* ==========================================================================
   7. Responsive — Mobile first
   ========================================================================== */

/**
 * Su schermi piccoli, tutti i campi FatturaPRO occupano il 100% della larghezza.
 * Questo è già il default con form-row-wide, ma lo rafforziamo qui per i temi
 * che potrebbero usare layout diversi.
 */
@media (max-width: 768px) {
    #fattpro_customer_type_field,
    #fattpro_invoice_choice_field,
    #fattpro_partita_iva_field,
    #fattpro_codice_fiscale_field,
    #fattpro_sdi_field,
    #fattpro_pec_field,
    #billing_company_field {
        width: 100%;
        float: none;
    }
}