/* Geo.Net · Area clienti. Tema del computer: chiaro di base, .dark sull'html in scuro. Niente prefers-reduced-motion: animazioni sempre accese. */

:root {
    --gn-petrolio: #0e7490;
    --gn-petrolio-scuro: #0b5f76;
    --gn-superficie: #ffffff;
    --gn-superficie-2: #f3f8f9;
    --gn-bordo: rgba(11, 95, 118, .14);
    --gn-testo: #10262d;
    --gn-testo-2: #4b6169;
    --gn-ombra: 0 1px 2px rgba(8, 47, 58, .06), 0 10px 28px -12px rgba(8, 47, 58, .22);
    --gn-ombra-su: 0 2px 4px rgba(8, 47, 58, .08), 0 22px 44px -16px rgba(8, 47, 58, .34);
    --gn-luce: rgba(255, 255, 255, .55);
    --gn-raggio: 1rem;
}

.dark {
    --gn-superficie: #10191c;
    --gn-superficie-2: #0c1416;
    --gn-bordo: rgba(103, 207, 226, .14);
    --gn-testo: #e5f3f6;
    --gn-testo-2: #93abb2;
    --gn-ombra: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 30px -14px rgba(0, 0, 0, .7);
    --gn-ombra-su: 0 2px 6px rgba(0, 0, 0, .45), 0 24px 48px -18px rgba(0, 0, 0, .8);
    --gn-luce: rgba(103, 207, 226, .12);
}

/* Fondo con una velatura petrolio appena accennata */
.fi-body {
    background-image: radial-gradient(1200px 500px at 85% -10%, rgba(14, 116, 144, .07), transparent 60%);
    background-attachment: fixed;
}
.dark .fi-body { background-image: radial-gradient(1200px 500px at 85% -10%, rgba(44, 177, 203, .08), transparent 60%); }

/* ---------- Card con profondità e tilt ---------- */
.gn-card {
    position: relative;
    background: var(--gn-superficie);
    border: 1px solid var(--gn-bordo);
    border-radius: var(--gn-raggio);
    box-shadow: var(--gn-ombra);
    color: var(--gn-testo);
}
.gn-tilt {
    transform: perspective(900px) rotateX(var(--gn-rx, 0deg)) rotateY(var(--gn-ry, 0deg)) translateZ(0);
    transform-style: preserve-3d;
    transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease;
    will-change: transform;
}
.gn-tilt::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: radial-gradient(420px circle at var(--gn-mx, 50%) var(--gn-my, 0%), var(--gn-luce), transparent 45%);
    opacity: 0;
    transition: opacity .35s ease;
}
.gn-tilt.is-tilt { transition: transform .08s linear, box-shadow .35s ease; box-shadow: var(--gn-ombra-su); }
.gn-tilt.is-tilt::after { opacity: 1; }

/* Entrata morbida dei blocchi */
@keyframes gn-sali { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.gn-page .gn-card { animation: gn-sali .5s cubic-bezier(.2, .7, .2, 1) backwards; }
.gn-page .gn-colonne .gn-card:nth-child(2) { animation-delay: .08s; }

/* ---------- Bacheca ---------- */
.gn-hero { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .gn-hero { grid-template-columns: 1fr 1.25fr; } }

.gn-crediti { padding: 1.5rem; display: flex; flex-direction: column; gap: .25rem; overflow: hidden; }
.gn-card__eyebrow { font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gn-testo-2); }
.gn-card__testo { color: var(--gn-testo-2); }
.gn-crediti__numero { font-size: 3.5rem; line-height: 1; font-weight: 700; color: var(--gn-petrolio); transform: translateZ(30px); font-variant-numeric: tabular-nums; }
.dark .gn-crediti__numero { color: #67cfe2; }
.gn-crediti--pochi .gn-crediti__numero { color: #b45309; }
.gn-crediti--zero .gn-crediti__numero { color: #b91c1c; }
.dark .gn-crediti--pochi .gn-crediti__numero { color: #fbbf24; }
.dark .gn-crediti--zero .gn-crediti__numero { color: #f87171; }

.gn-avviso { margin-top: .75rem; display: flex; gap: .5rem; align-items: flex-start; padding: .65rem .8rem; border-radius: .7rem; font-size: .9rem; font-weight: 500; }
.gn-avviso__icona { width: 1.15rem; height: 1.15rem; flex: none; margin-top: .1rem; }
.gn-avviso--warning { background: #fef3c7; color: #78350f; }
.gn-avviso--danger { background: #fee2e2; color: #7f1d1d; }
.dark .gn-avviso--warning { background: rgba(251, 191, 36, .14); color: #fde68a; }
.dark .gn-avviso--danger { background: rgba(248, 113, 113, .14); color: #fecaca; }

.gn-cta {
    display: flex; flex-direction: column; justify-content: center; gap: .35rem;
    padding: 1.5rem 1.75rem; min-height: 11rem; text-decoration: none; overflow: hidden;
    background: linear-gradient(135deg, #0e7490 0%, #0b5f76 55%, #0a4f63 100%);
    color: #fff; border-color: transparent;
}
.gn-cta:focus-visible { outline: 3px solid #67cfe2; outline-offset: 3px; }
.gn-cta__icona { width: 2.5rem; height: 2.5rem; transform: translateZ(40px); }
.gn-cta__titolo { font-size: 1.6rem; font-weight: 700; letter-spacing: -.01em; transform: translateZ(30px); }
.gn-cta__testo { opacity: .85; transform: translateZ(20px); }
.gn-cta::before {
    content: ""; position: absolute; right: -3rem; bottom: -3rem; width: 12rem; height: 12rem; border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .18); box-shadow: 0 0 0 1.5rem rgba(255, 255, 255, .05), 0 0 0 3rem rgba(255, 255, 255, .03);
}
.gn-cta--spento { filter: grayscale(.7); opacity: .75; }

.gn-colonne { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 1024px) { .gn-colonne { grid-template-columns: 1fr 1fr; } }

.gn-blocco { padding: 1.25rem; }
@media (min-width: 640px) { .gn-blocco { padding: 1.5rem; } }
.gn-blocco__testa { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .75rem; }
.gn-blocco h2, .gn-blocco__testa h2 { font-size: 1.05rem; font-weight: 650; }
.gn-link { color: var(--gn-petrolio); font-weight: 600; font-size: .9rem; text-decoration: none; }
.dark .gn-link { color: #67cfe2; }
.gn-link:hover { text-decoration: underline; }

.gn-riga { display: flex; gap: .85rem; align-items: center; padding: .7rem .5rem; margin: 0 -.5rem; border-radius: .7rem; text-decoration: none; color: inherit; }
.gn-riga + .gn-riga { border-top: 1px solid var(--gn-bordo); }
.gn-riga:hover { background: var(--gn-superficie-2); }
.gn-riga__corpo { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.gn-riga__corpo span { color: var(--gn-testo-2); font-size: .875rem; }
.gn-data { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 3.1rem; height: 3.1rem; border-radius: .7rem; background: rgba(14, 116, 144, .1); color: var(--gn-petrolio-scuro); }
.dark .gn-data { background: rgba(44, 177, 203, .14); color: #a3e4ef; }
.gn-data__giorno { font-weight: 700; font-size: 1.15rem; line-height: 1; }
.gn-data__mese { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; }
.gn-codice { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; color: var(--gn-testo-2); }

.gn-comunicazione { padding: .8rem 0; }
.gn-comunicazione + .gn-comunicazione { border-top: 1px solid var(--gn-bordo); }
.gn-comunicazione h3 { font-weight: 600; display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.gn-comunicazione p { color: var(--gn-testo-2); font-size: .925rem; margin-top: .2rem; }
.gn-comunicazione time { font-size: .75rem; color: var(--gn-testo-2); opacity: .8; }
.gn-comunicazione--evidenza { background: linear-gradient(90deg, rgba(14, 116, 144, .08), transparent); margin: 0 -1.25rem; padding: .8rem 1.25rem; border-left: 3px solid var(--gn-petrolio); }
.gn-pill { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: .15rem .5rem; border-radius: 99px; background: var(--gn-petrolio); color: #fff; }
.gn-vuoto { color: var(--gn-testo-2); padding: .5rem 0; }
.gn-vuoto--grande { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 2.5rem 1rem; text-align: center; border: 1.5px dashed var(--gn-bordo); border-radius: var(--gn-raggio); }
.gn-vuoto__icona { width: 2rem; height: 2rem; color: var(--gn-petrolio); }

/* ---------- Nuova prenotazione ---------- */
.gn-passi { display: flex; gap: .5rem; list-style: none; padding: 0; margin: 0; overflow-x: auto; }
.gn-passi__voce { flex: 1; min-width: max-content; }
.gn-passi__voce > * { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .55rem .8rem; border-radius: 99px; font-size: .875rem; font-weight: 600; color: var(--gn-testo-2); background: var(--gn-superficie); border: 1px solid var(--gn-bordo); }
.gn-passi__voce > * > span { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--gn-superficie-2); font-size: .8rem; }
.gn-passi__voce.is-attivo > * { color: #fff; background: var(--gn-petrolio); border-color: transparent; }
.gn-passi__voce.is-attivo > * > span { background: rgba(255, 255, 255, .2); }
.gn-passi__voce.is-fatto button { cursor: pointer; color: var(--gn-petrolio); }
.dark .gn-passi__voce.is-fatto button { color: #67cfe2; }

.gn-legenda { color: var(--gn-testo-2); font-size: .9rem; }

.gn-griglia { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); transition: opacity .2s; }
.gn-griglia.is-caricamento { opacity: .45; }
@media (max-width: 479px) { .gn-griglia { grid-template-columns: 1fr; } }

.gn-giorno {
    position: relative; display: flex; flex-direction: column; gap: .6rem; padding: .85rem;
    background: var(--gn-superficie); border: 1px solid var(--gn-bordo); border-radius: .9rem; box-shadow: var(--gn-ombra);
    animation: gn-sali .45s cubic-bezier(.2, .7, .2, 1) backwards;
}
.gn-giorno:nth-child(3n+2) { animation-delay: .04s; }
.gn-giorno:nth-child(3n) { animation-delay: .08s; }
.gn-giorno.is-weekend .gn-giorno__settimana { color: #b45309; }
.dark .gn-giorno.is-weekend .gn-giorno__settimana { color: #fbbf24; }
.gn-giorno.is-pieno { opacity: .5; box-shadow: none; background: var(--gn-superficie-2); filter: grayscale(1); }
.gn-giorno__testa { display: flex; align-items: baseline; gap: .4rem; transform: translateZ(20px); }
.gn-giorno__settimana { text-transform: uppercase; font-size: .72rem; font-weight: 700; letter-spacing: .06em; color: var(--gn-testo-2); }
.gn-giorno__numero { font-size: 1.6rem; font-weight: 700; line-height: 1; }
.gn-giorno__mese { font-size: .85rem; color: var(--gn-testo-2); }
@media (max-width: 479px) {
    .gn-giorno { flex-direction: row; align-items: center; }
    .gn-giorno__testa { flex-direction: column; align-items: center; gap: 0; min-width: 3.2rem; }
    .gn-giorno__cantieri { flex: 1; }
}
.gn-giorno__cantieri { display: flex; flex-direction: column; gap: .4rem; transform: translateZ(14px); }

.gn-slot {
    display: block; width: 100%; text-align: left; padding: .6rem .7rem; min-height: 2.75rem; border-radius: .65rem;
    font-size: .875rem; cursor: pointer; color: var(--gn-petrolio-scuro);
    background: rgba(14, 116, 144, .08); border: 1px solid rgba(14, 116, 144, .25);
    transition: background .15s, color .15s, transform .15s, box-shadow .15s;
}
.gn-slot:hover, .gn-slot:focus-visible { background: var(--gn-petrolio); color: #fff; transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(14, 116, 144, .8); outline: none; }
.gn-slot:disabled { opacity: .6; cursor: wait; }
.dark .gn-slot { color: #a3e4ef; background: rgba(44, 177, 203, .1); border-color: rgba(44, 177, 203, .3); }
.dark .gn-slot:hover, .dark .gn-slot:focus-visible { background: #0e7490; color: #fff; }
.gn-slot--3 { border-style: dashed; }
.gn-slot--pieno { cursor: default; text-align: center; color: var(--gn-testo-2); background: transparent; border: 1px dashed var(--gn-bordo); }
.gn-slot--pieno:hover { background: transparent; color: var(--gn-testo-2); transform: none; box-shadow: none; }

.gn-scelta { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.25rem; border-left: 4px solid var(--gn-petrolio); }
.gn-scelta > div { flex: 1; display: flex; flex-direction: column; }
.gn-scelta span { color: var(--gn-testo-2); font-size: .9rem; }
.gn-scelta__icona { width: 2rem; height: 2rem; color: var(--gn-petrolio); flex: none; }

.gn-azioni { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: flex-end; margin-top: 1.25rem; }
@media (max-width: 479px) { .gn-azioni > * { flex: 1 1 100%; justify-content: center; } }

.gn-riepilogo dl { display: grid; gap: .1rem; margin: 1rem 0; }
.gn-riepilogo dl > div { display: grid; grid-template-columns: 1fr; gap: .1rem; padding: .6rem 0; border-bottom: 1px solid var(--gn-bordo); }
@media (min-width: 640px) { .gn-riepilogo dl > div { grid-template-columns: 9rem 1fr; } }
.gn-riepilogo dt { color: var(--gn-testo-2); font-size: .875rem; }
.gn-riepilogo dd { font-weight: 600; overflow-wrap: anywhere; }

.gn-blocco--fermo { text-align: center; padding: 2.5rem 1.5rem; }
.gn-blocco--fermo p { color: var(--gn-testo-2); margin-top: .35rem; }
.gn-blocco--fermo .gn-azioni { justify-content: center; }
.gn-blocco__icona { width: 3rem; height: 3rem; margin: 0 auto .75rem; color: #b91c1c; }
.dark .gn-blocco__icona { color: #f87171; }

.gn-scrivi { max-width: 48rem; }

/* Pagina di accesso */
.fi-simple-main { box-shadow: var(--gn-ombra-su); border-radius: 1.25rem; }

.gn-slot strong { display: block; line-height: 1.2; }
.gn-slot span { font-size: .8rem; opacity: .85; }
@media (max-width: 479px) {
    .gn-slot { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; }
}