:root {
    --notte: 12 19 32;
    --ghiaia: 243 242 238;
    --carta: 255 255 255;
    --ink: 20 26 36;
    --ink-2: 63 70 84;
    --ink-3: 96 103 116;
    --ink-4: 144 151 163;
    --linea: 20 26 36;
    --accent: 20 26 36;
    --accent-testo: 20 26 36;
    color-scheme: light;
}

[data-linea="torrette"] { --accent: 108 80 53; --accent-testo: 108 80 53; }
[data-linea="illuminazione"] { --accent: 227 6 19; --accent-testo: 190 5 16; }
[data-linea="ricarica"] { --accent: 118 184 42; --accent-testo: 77 122 26; }
[data-linea="fotovoltaico"] { --accent: 45 46 131; --accent-testo: 45 46 131; }

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }

::selection { background: rgb(var(--notte)); color: #fff; }

#navbar {
    background: rgb(var(--notte) / 0.55);
    backdrop-filter: blur(12px) saturate(140%);
    -webkit-backdrop-filter: blur(12px) saturate(140%);
    border-color: rgb(255 255 255 / 0.08);
    transition: background-color 200ms ease-out, border-color 200ms ease-out;
}

#navbar .nav-link { color: rgb(255 255 255 / 0.75); }
#navbar .nav-link:hover, #navbar .nav-link[aria-current="page"] { color: #fff; }
#navbar .nav-logo { filter: brightness(0) invert(1); }
#navbar .nav-cta { background: rgb(255 255 255 / 0.12); color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.24); }
#navbar .nav-cta:hover { background: rgb(255 255 255 / 0.2); }
#navbar :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

#navbar[data-solid] {
    background: rgb(var(--ghiaia) / 0.92);
    border-color: rgb(var(--linea) / 0.1);
}
#navbar[data-solid] .nav-link { color: rgb(var(--ink-2)); }
#navbar[data-solid] .nav-link:hover, #navbar[data-solid] .nav-link[aria-current="page"] { color: rgb(var(--ink)); }
#navbar[data-solid] .nav-logo { filter: none; }
#navbar[data-solid] .nav-cta { background: rgb(var(--notte)); box-shadow: none; }
#navbar[data-solid] .nav-cta:hover { background: rgb(var(--ink-2)); }
#navbar[data-solid] :focus-visible { outline-color: rgb(var(--ink)); }

#navbar .nav-link[aria-current="page"] { font-weight: 600; }

#mobile-menu > summary { list-style: none; }
#mobile-menu > summary::-webkit-details-marker { display: none; }

/* Immagini: se il file manca mostra un segnaposto con percorso e dimensioni */
.img-slot.is-missing { display: none; }
:root:not(.show-slots) .slot-group:not(:has(.img-slot:not(.is-missing))) { display: none; }
.slot-hint { display: none; }
.show-slots .img-slot.is-missing { display: block; }
.show-slots .img-slot.is-missing img { display: none; }
.show-slots .img-slot.is-missing .slot-hint {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 12px 16px;
    background: repeating-linear-gradient(135deg, rgb(var(--ghiaia)), rgb(var(--ghiaia)) 8px, rgb(var(--carta)) 8px, rgb(var(--carta)) 16px);
    border: 1.5px dashed rgb(var(--linea) / 0.3);
    border-radius: inherit;
    color: rgb(var(--ink-2));
    font-size: 13px;
    line-height: 1.4;
    overflow: auto;
}
.show-slots .slot-hint strong { color: rgb(var(--ink)); font-weight: 600; word-break: break-all; }
