/* ============================================================
   TEMA SITO - Palette centrally gestita (verde / nero / grigi)
   ============================================================
   Per cambiare i colori di TUTTO il sito modifica solo le
   variabili qui sotto. Le pagine che usano il tema includono:
       <link rel="stylesheet" href="assets/css/tema.css">
   (dal modulo DVR il percorso e' ../assets/css/tema.css)
   ============================================================ */

:root {
    /* --- VERDE CHIARO SFUMATO (richiesta: scuro -> chiaro) --- */
    --colore-sfondo:         #e9f5ec;   /* base molto chiara per aree con testo NERO */
    --colore-superficie:     #ffffff;   /* card bianche su sfondo sfumato */
    --colore-pannello:       #0e2716;   /* header/pannelli scuri */
    --colore-bordo:          #b7e4c7;   /* bordi su chiaro */

    /* --- VERDE ACCENTO --- */
    --colore-accento:        #22c55e;   /* verde brillante: link, pulsanti, bordi attivi */
    --colore-accento-hover:  #16a34a;   /* verde al passaggio del mouse */
    --colore-accento-scuro:  #15803d;   /* verde per hover pulsanti / elementi pieni */
    --colore-accento-deep:   #166534;   /* verde molto scuro (card secondarie) */
    --colore-brand:          #1b4332;   /* verde istituzionale scuro */

    /* --- TESTI: BIANCO su scuro, NERO su chiaro --- */
    --colore-testo:          #0a0a0a;   /* testo principale su sfondo chiaro = NERO */
    --colore-testo-soft:     #344e41;   /* testo secondario su chiaro = verde-nero soft */
    --colore-testo-muted:    #6b9080;   /* footer / note */
    --colore-testo-bianco:   #ffffff;   /* testi BIANCHI su superfici scure (hero/header) */
    --colore-testo-forte:    #0a0a0a;   /* alias nero */
    --colore-testo-nero:     #0a0a0a;   /* alias nero puro */
    --colore-chiaro:         #ffffff;   /* superficie chiara per modali/form */

    /* --- SFUMATURE VERDE SCURO -> CHIARO --- */
    --gradiente-a:           #0e2716;   /* verde quasi nero */
    --gradiente-b:           #1b4332;   /* verde bosco */
    --gradiente-c:           #2d6a4f;   /* verde medio */
    --gradiente-d:           #52b788;   /* verde chiaro */
    --gradiente-e:           #b7e4c7;   /* verde chiarissimo */
    --gradiente-body:        linear-gradient(180deg, #0e2716 0%, #1b4332 18%, #2d6a4f 38%, #40916c 58%, #74c69d 80%, #d8f3dc 100%);
    --gradiente-hero:        linear-gradient(135deg, #0e2716 0%, #1b4332 22%, #2d6a4f 48%, #40916c 75%, #95d5b2 100%);

    /* Header semi-trasparente */
    --colore-header:         rgba(14, 39, 22, .92);
    --colore-header-chiaro:  rgba(255,255,255,.92);

    /* Coordinate mouse per effetto movimento */
    --mouse-x: 50%;
    --mouse-y: 50%;
}

/* ------------------------------------------------------------
   PULSANTE FLOTTANTE "TORNA ALLA HOME"
   (usato da home_button.php e dalle pagine del modulo DVR)
   ------------------------------------------------------------ */
.home-btn {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 99999;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--colore-accento-scuro);
    color: #ffffff;
    text-decoration: none;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 18px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
    transition: transform .15s ease, background .15s ease;
}
.home-btn:hover {
    background: var(--colore-accento);
    transform: translateY(-2px);
}

/* ============================================================
   EFFETTO SFONDO IN MOVIMENTO AL PASSAGGIO DEL MOUSE
   - Spotlight radiale che segue il cursore
   - Parallasse leggero su hero e card (solo se non ridotto)
   ============================================================ */
body {
    position: relative;
    overflow-x: hidden;
}
body::before {
    content: "";
    position: fixed;
    inset: -20%;
    background:
        radial-gradient(650px circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.22), transparent 58%),
        radial-gradient(900px circle at 85% 15%, rgba(34,197,94,0.18), transparent 65%),
        radial-gradient(700px circle at 10% 80%, rgba(116,198,157,0.16), transparent 60%);
    pointer-events: none;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.4s ease;
    will-change: background-position;
}
body.has-mouse::before { opacity: 1; }

/* Leggero spostamento parallasse quando il mouse si muove */
@media (prefers-reduced-motion: no-preference) {
    .hero {
        will-change: transform;
        transition: transform 0.25s ease-out;
        transform: translate(
            calc((var(--mouse-x) - 50%) * 0.015),
            calc((var(--mouse-y) - 50%) * 0.015)
        );
    }
    .service-card:hover, .portal-card:hover {
        transform: translateY(-5px) translate(
            calc((var(--mouse-x) - 50%) * 0.008),
            calc((var(--mouse-y) - 50%) * 0.008)
        );
    }
}

/* Rispetta chi preferisce meno animazioni */
@media (prefers-reduced-motion: reduce) {
    body::before { display: none; }
    .hero { transform: none !important; }
}

/* Disattiva effetto su tocco (mobile) */
@media (pointer: coarse) {
    body::before { opacity: 0.35; }
}
