/* ==========================================================================
   SUNYA - Footer
   ========================================================================== */

/* v1.5.7: il footer era l'ultima superficie scura rimasta su
   --sunya-color-primary (navy fisso): restava #1a1a2e mentre il resto
   del sito seguiva surface-dark. Qui primary significa FONDO, quindi
   va su surface-dark. Il testo segue text-on-dark. */
.sunya-footer {
    background-color: var(--sunya-footer-bg, var(--sunya-color-surface-dark, var(--sunya-color-primary)));
    color: var(--sunya-footer-color, var(--sunya-color-text-on-dark, #e5e7eb));

    /* v1.9.7 — LA SUPERFICIE DICHIARA IL PROPRIO INCHIOSTRO.

       --sunya-color-text vale l'inchiostro sulla carta CHIARA: nel
       footer, che e' scuro, chiunque lo legga scrive scuro su scuro.
       Misurato su davidearduini: `.sunya-widget a` (sidebar.css) usa
       var(--sunya-color-text) e ha la stessa specificita' (0,1,1) di
       `.sunya-footer a`, ma sidebar.css e' enqueued DOPO footer.css:
       vinceva per ordine sorgente e i link dei widget uscivano a 2.96.

       Ridichiarare qui il TOKEN invece di alzare la specificita' sui
       singoli selettori: le custom property si risolvono sull'elemento
       e non competono nella cascata, quindi ogni discendente del footer
       legge l'inchiostro giusto senza che nessuna regola debba vincere.
       Stesso principio del refactor nav (fase 3).

       I child che dichiarano --sunya-footer-color continuano a
       governare entrambi: e' la stessa catena del `color` qui sopra. */
    --sunya-color-text: var(--sunya-footer-color, var(--sunya-color-text-on-dark, #e5e7eb));
}


/* --------------------------------------------------------------------------
   Footer main (logo + widgets)
   -------------------------------------------------------------------------- */

.sunya-footer__main {
    padding: var(--sunya-spacing-section) 0 var(--sunya-spacing-2xl);
}

.sunya-footer__logo img {
    display: block;
    width: auto;
    height: auto;
    max-height: inherit;
}


/* --------------------------------------------------------------------------
   Widget area
   -------------------------------------------------------------------------- */

.sunya-footer__widgets-grid {
    display: grid;
    gap: var(--sunya-spacing-2xl);
}

.sunya-footer__widgets-grid--1col { grid-template-columns: 1fr; }
.sunya-footer__widgets-grid--2col { grid-template-columns: repeat(2, 1fr); }
.sunya-footer__widgets-grid--3col { grid-template-columns: repeat(3, 1fr); }
.sunya-footer__widgets-grid--4col { grid-template-columns: repeat(4, 1fr); }

.sunya-footer .widget-title,
.sunya-footer .sunya-widget__title,
.sunya-footer__column .wp-block-heading {
    /* v1.7.1: era #ffffff fisso — unico elemento del footer che non
       seguiva il brand. La gerarchia col testo la fanno dimensione e
       bordo, non il colore. */
    color: var(--sunya-color-text-on-dark, #ffffff);
    font-size: var(--sunya-font-size-lg);
    margin-bottom: var(--sunya-spacing-lg);
    padding-bottom: var(--sunya-spacing-sm);
    border-bottom: 2px solid var(--sunya-color-accent);
    display: inline-block;
}

/* Link nel footer */
.sunya-footer a {
    color: var(--sunya-footer-color, var(--sunya-color-text-on-dark, #e5e7eb));
    text-decoration: none;
    transition: color var(--sunya-transition-fast);
}

.sunya-footer a:hover,
.sunya-footer a:focus-visible {
    color: var(--sunya-color-accent);
}

/* Liste widget */
.sunya-footer .widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sunya-footer .widget ul li {
    padding: var(--sunya-spacing-xs) 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.sunya-footer .widget ul li:last-child {
    border-bottom: none;
}

.sunya-footer .widget ul li a {
    display: block;
    padding: var(--sunya-spacing-xs) 0;
}


/* --------------------------------------------------------------------------
   Footer bottom
   -------------------------------------------------------------------------- */

.sunya-footer__bottom {
    background-color: var(--sunya-footer-bottom-bg, transparent);
    color: var(--sunya-footer-bottom-color, inherit);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: var(--sunya-spacing-xl) 0 var(--sunya-spacing-lg);
}

/* Link nella barra copyright: segue il colore testo della barra se impostato */
.sunya-footer__bottom a {
    color: var(--sunya-footer-bottom-color, var(--sunya-footer-color, var(--sunya-color-text-on-dark, #e5e7eb)));
}

.sunya-footer__bottom a:hover,
.sunya-footer__bottom a:focus-visible {
    color: var(--sunya-color-accent);
}

/* Icone social nella barra copyright: seguono il colore della barra, non quello del footer generale */
.sunya-footer__bottom .sunya-social--footer .sunya-social__link {
    color: var(--sunya-footer-bottom-color, var(--sunya-footer-color, var(--sunya-color-text-on-dark, #e5e7eb)));
}

/* Righe del footer bottom */
.sunya-footer__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--sunya-spacing-md);
}

.sunya-footer__row + .sunya-footer__row {
    margin-top: var(--sunya-spacing-md);
    padding-top: var(--sunya-spacing-md);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

/* Riga copyright (contiene copy + menu + social) */
.sunya-footer__row--copy {
    font-size: var(--sunya-font-size-sm);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--sunya-spacing-md);
}

/* Blocco sinistro: logo + copyright */
.sunya-footer__copy-left {
    display: flex;
    align-items: center;
    gap: var(--sunya-spacing-md);
}

.sunya-footer__copy-left .sunya-footer__logo {
    flex-shrink: 0;
}

.sunya-footer__copy-left .sunya-footer__logo img {
    max-height: 30px;
    width: auto;
    display: block;
}

.sunya-footer__copy {
    flex-shrink: 0;
}

.sunya-footer__copy p {
    margin: 0;
}

/* Blocco destro: menu + social */
.sunya-footer__copy-right {
    display: flex;
    align-items: center;
    gap: var(--sunya-spacing-lg);
}

/* Menu footer */
.sunya-footer__menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: var(--sunya-spacing-lg);
}

.sunya-footer__menu a {
    font-size: var(--sunya-font-size-sm);
}


/* --------------------------------------------------------------------------
   Payment icons
   -------------------------------------------------------------------------- */

.sunya-payments {
    padding: var(--sunya-spacing-sm) 0;
}

.sunya-payments__list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: var(--sunya-spacing-sm);
}

.sunya-payments__icon {
    display: inline-flex;
}

.sunya-payments__icon svg {
    width: 38px;
    height: 24px;
    display: block;
    border-radius: 3px;
}


/* --------------------------------------------------------------------------
   Pre-footer CTA
   -------------------------------------------------------------------------- */

.sunya-prefooter {
    position: relative;
    background-color: var(--sunya-prefooter-bg, var(--sunya-color-accent));
    color: var(--sunya-prefooter-ink, var(--sunya-color-on-accent, #ffffff));
    overflow: hidden;
}

.sunya-prefooter--has-bg {
    /* v1.5.7: fondo, non inchiostro -> surface-dark */
    background-color: var(--sunya-color-surface-dark, var(--sunya-color-primary, #1a1a2e));
    background-image: var(--sunya-prefooter-bg-image);
    background-size: cover;
    background-position: center;
}

.sunya-prefooter__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.sunya-prefooter__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sunya-spacing-2xl);
    padding: var(--sunya-spacing-2xl) 0;
}

.sunya-prefooter__content {
    flex: 1;
}

.sunya-prefooter__title {
    font-size: var(--sunya-font-size-2xl);
    font-weight: var(--sunya-font-weight-bold);
    margin: 0 0 var(--sunya-spacing-xs);
    color: inherit;
}

.sunya-prefooter__text {
    font-size: var(--sunya-font-size-lg);
    margin: 0;
    opacity: 0.9;
}

.sunya-prefooter__action {
    flex-shrink: 0;
}

/* Pulsante del pre-footer — v1.7.8
   La sezione decide la carta, quindi decide anche il pulsante.
   `.sunya-btn--white` nasce per fondi scuri: sul pre-footer accent il
   suo fondo chiaro misurava 1.23 contro la sezione (1.00 in modalita'
   Chiara con pre-footer chiaro), sotto il 3:1 che WCAG 1.4.11 chiede
   ai componenti UI. L'inchiostro giusto per questa carta esiste gia'
   ed e' derivato a 4.5 dalla v1.6.9: il pulsante semplicemente non lo
   ereditava.

   Escluso `--has-bg`: li' la carta e' davvero scura e il bianco e'
   corretto.

   Specificita': `:not()` pesa come una classe, `:where()` no -> 0,2,0.
   Batte `.sunya-btn--white` (0,1,0) e pareggia con le regole dei child
   su `.sunya-prefooter .sunya-prefooter__btn`, che vincono per ordine
   sorgente (dadesign continua a vedere il proprio cyan).

   v1.9.5 - INCHIOSTRO DALLA CARTA, NON DALL'ACCENT.
   `--sunya-color-on-accent` e' derivato dall'ACCENT, ma la carta della
   sezione e' `--sunya-prefooter-bg`: sono la stessa cosa solo finche'
   un child non dichiara la seconda. Chi lo fa (dadesign: pre-footer
   scuro per scelta di design, con l'accent cyan) si ritrovava
   inchiostro calcolato su una carta e applicato su un'altra.

   Ora il consumatore legge `--sunya-prefooter-ink`, che il child
   dichiara insieme alla carta; il fallback resta `on-accent`, quindi
   per chi non tocca nulla il comportamento e' identico a prima.
   E' la stessa regola dell'header dopo il refactor 1.8.3/1.8.4: la
   superficie dichiara il proprio inchiostro, i consumatori leggono il
   token e non sanno in che stato si trovano. */
.sunya-prefooter:not(.sunya-prefooter--has-bg) :where(.sunya-prefooter__btn) {
    background-color: var(--sunya-prefooter-ink, var(--sunya-color-on-accent, #ffffff));
    color: var(--sunya-prefooter-bg, var(--sunya-color-accent));
    border-color: var(--sunya-prefooter-ink, var(--sunya-color-on-accent, #ffffff));
}

/* Gemella obbligatoria: `.sunya-btn--white:hover` pesa 0,2,0 e senza
   questa riprenderebbe il sopravvento riportando `text-on-dark` sulla
   carta accent — il difetto peggiorato.

   v1.9.5 - `:hover` FUORI dal `:where()`, il bottone DENTRO: 0,3,0.
   Prima erano entrambi a peso pieno (0,4,0) e la regola scavalcava i
   child, che sul riposo invece potevano governare il proprio pulsante.
   L'asimmetria si vedeva solo puntando il mouse: su dadesign l'hover
   riportava `on-accent` (#0d1117) sulla carta scura del pre-footer,
   contrasto 1.00 — l'etichetta spariva dentro il proprio bordo.

   0,3,0 e' il peso esatto che serve: batte ancora `.sunya-btn--white:hover`
   (0,2,0, e buttons.css e' enqueued DOPO footer.css, quindi il pareggio
   non basterebbe), e pareggia con `.sunya-prefooter .sunya-prefooter__btn:hover`
   dei child, che tornano a vincere per ordine sorgente come sul riposo. */
.sunya-prefooter:not(.sunya-prefooter--has-bg) :where(.sunya-prefooter__btn):hover,
.sunya-prefooter:not(.sunya-prefooter--has-bg) :where(.sunya-prefooter__btn):focus-visible {
    background-color: transparent;
    color: var(--sunya-prefooter-ink, var(--sunya-color-on-accent, #ffffff));
    border-color: var(--sunya-prefooter-ink, var(--sunya-color-on-accent, #ffffff));
}

.sunya-prefooter__form {
    min-width: 320px;
}

/* Stile minimal */
.sunya-prefooter--minimal .sunya-prefooter__inner {
    justify-content: center;
    text-align: center;
    flex-direction: column;
    gap: var(--sunya-spacing-md);
    padding: var(--sunya-spacing-xl) 0;
}

.sunya-prefooter--minimal .sunya-prefooter__title {
    font-size: var(--sunya-font-size-xl);
}


/* --------------------------------------------------------------------------
   Back to top
   -------------------------------------------------------------------------- */

.sunya-btt {
    position: fixed;
    bottom: var(--sunya-spacing-xl);
    right: var(--sunya-spacing-xl);
    z-index: 900;
    background-color: var(--sunya-color-accent);
    color: var(--sunya-color-on-accent, #ffffff);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--sunya-shadow-lg);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity var(--sunya-transition-base),
                visibility var(--sunya-transition-base),
                transform var(--sunya-transition-base),
                background-color var(--sunya-transition-fast);
}

.sunya-btt--visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.sunya-btt:hover {
    /* v1.5.7: il riposo e' accent, quindi l'hover e' accent-hover.
       Passare al navy legacy era un salto di colore, non uno stato. */
    background-color: var(--sunya-color-accent-hover, var(--sunya-color-accent));
    transform: translateY(-3px);
}

.sunya-btt:focus-visible {
    outline: 2px solid var(--sunya-color-accent);
    outline-offset: 3px;
}

/* Forme */
.sunya-btt--circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.sunya-btt--rounded {
    width: 48px;
    height: 48px;
    border-radius: var(--sunya-radius-md);
}

.sunya-btt--pill {
    padding: var(--sunya-spacing-sm) var(--sunya-spacing-md);
    border-radius: 999px;
    gap: var(--sunya-spacing-xs);
    font-size: var(--sunya-font-size-sm);
    font-weight: var(--sunya-font-weight-medium);
}

.sunya-btt--pill::after {
    content: attr(aria-label);
}

.sunya-btt--pill svg {
    width: 16px;
    height: 16px;
}


/* --------------------------------------------------------------------------
   Badge reCAPTCHA — sopra il pulsante torna-su (v1.10.9)

   Google posiziona `.grecaptcha-badge` con uno stile INLINE a bottom:14px,
   in basso a destra. E' esattamente dove sta il pulsante qui sopra, che
   occupa 32-80px dal fondo: si sovrappongono, e anche in orizzontale — a
   riposo il badge mostra ~70px di linguetta al bordo destro e il pulsante
   ne occupa 32-80. Misurato su dadesign.it il 2026-08-27.

   Lo alziamo, non lo nascondiamo: nascondere il badge e' consentito da
   Google SOLO affiancando al submit la disclosure testuale ("Questo sito e'
   protetto da reCAPTCHA..."), che e' una scelta di contenuto del sito, non
   del tema.

   `!important` e' inevitabile: il valore di Google e' inline. E' la stessa
   ragione per cui il parent lo usa altrove — l'inline di FooGallery in
   blog.css, le larghezze inline di WooCommerce — cioe' sempre e solo contro
   il markup di un terzo, mai contro il proprio CSS o quello di un child.

   Il valore NON e' scelto a occhio, e' la geometria del pulsante qui sopra:
   bottom (spacing-xl) + altezza + un margine. 48px copre `circle` e
   `rounded`; `pill` e' piu' basso, quindi lo stesso valore lo libera con un
   po' di margine in piu'. Se si cambia la geometria del pulsante questo
   numero va rifatto: per questo la regola sta qui e non altrove.

   Il test `:has(#sunya-btt)` e' esatto: sunya_render_back_to_top() esce
   prima di stampare quando il mod e' spento, quindi col pulsante disattivato
   non c'e' collisione e il badge resta dove lo mette Google.

   Un child con un altro flottante in basso a destra ritara con
   --sunya-recaptcha-offset, senza riscrivere la regola.
   -------------------------------------------------------------------------- */

body:has(#sunya-btt) .grecaptcha-badge {
    bottom: var(--sunya-recaptcha-offset,
        calc(var(--sunya-spacing-xl) + 48px + var(--sunya-spacing-md))) !important;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media screen and (max-width: 1024px) {

    .sunya-footer__widgets-grid--4col {
        grid-template-columns: repeat(2, 1fr);
    }

    .sunya-prefooter__inner {
        flex-direction: column;
        text-align: center;
    }

    .sunya-prefooter__form {
        min-width: 0;
        width: 100%;
        max-width: 400px;
    }
}

@media screen and (max-width: 768px) {

    .sunya-footer__widgets-grid--2col,
    .sunya-footer__widgets-grid--3col,
    .sunya-footer__widgets-grid--4col {
        grid-template-columns: 1fr;
    }

    .sunya-footer__row {
        flex-direction: column;
        text-align: center;
    }

    /* Mobile: copyright riga - stack verticale centrato */
    .sunya-footer__row--copy {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .sunya-footer__copy-left {
        flex-direction: column;
        align-items: center;
    }

    .sunya-footer__copy-right {
        flex-direction: column;
        align-items: center;
        gap: var(--sunya-spacing-md);
    }

    .sunya-footer__menu {
        justify-content: center;
        flex-wrap: wrap;
    }

    .sunya-prefooter__title {
        font-size: var(--sunya-font-size-xl);
    }

    .sunya-prefooter__text {
        font-size: var(--sunya-font-size-base);
    }

    .sunya-btt {
        bottom: var(--sunya-spacing-md);
        right: var(--sunya-spacing-md);
    }

    .sunya-btt--pill::after {
        content: none;
    }
}


/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    .sunya-btt {
        transition: none;
    }

    .sunya-btt:hover {
        transform: none;
    }
}