/* Stile "Dashboard" (come l'app IAppsCL Dashboard): grafite con un riflesso blu in alto, schede arrotondate,
   accento arancio, carattere Chakra Petch. Il carattere è nel sito (fonts/, licenza OFL) e non arriva da
   Google Fonts: in una pagina di informativa privacy non si devono passare indirizzi IP a terzi.
   Si applica sopra lo stile originale di ogni pagina, senza toccarne i testi. */
@font-face { font-family: "Chakra Petch"; src: url("fonts/chakrapetch-medium.ttf") format("truetype"); font-weight: 400 600; font-display: swap; }
@font-face { font-family: "Chakra Petch"; src: url("fonts/chakrapetch-bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

:root {
  color-scheme: dark;
  --d-bg: #0E1014; --d-glow: #18243A; --d-surface: #171A20; --d-surface2: #1F232B; --d-stroke: #272C36;
  --d-text: #ECEEF2; --d-muted: #8C94A3; --d-accent: #FF8A2A; --d-accent-soft: rgba(255, 138, 42, .16);
}
@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --d-bg: #F3F4F6; --d-glow: #DCE4F0; --d-surface: #FFFFFF; --d-surface2: #ECEEF2; --d-stroke: #DFE2E8;
    --d-text: #14171C; --d-muted: #5E6674; --d-accent: #C9560B; --d-accent-soft: rgba(201, 86, 11, .12);
  }
}

html { background: linear-gradient(180deg, var(--d-glow) 0, var(--d-bg) 460px) no-repeat, var(--d-bg); min-height: 100%; }
body {
  font-family: "Chakra Petch", system-ui, sans-serif; font-weight: 500;
  color: var(--d-text); background: var(--d-surface);
  max-width: 760px; margin: 28px auto 40px; padding: 28px 26px 36px;
  border: 1px solid var(--d-stroke); border-radius: 18px;
  line-height: 1.65;
}
@media (max-width: 800px) { body { margin: 12px; padding: 22px 18px 28px; } }

h1 { font-size: 1.65rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; margin: .2rem 0 .6rem; }
h2 {
  font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--d-muted);
  margin: 2.1rem 0 .7rem; padding-left: 12px; border-left: 3px solid var(--d-accent); line-height: 1.3;
}
h3 { font-size: 1.02rem; font-weight: 700; margin: 1.4rem 0 .4rem; }
p, li { color: var(--d-text); }
a { color: var(--d-accent); text-decoration-thickness: 1px; text-underline-offset: 3px; }
ul { padding-left: 1.2rem; }
li { margin: .4rem 0; }
li::marker { color: var(--d-accent); }
strong, b { font-weight: 700; }
code { background: var(--d-surface2); border: 1px solid var(--d-stroke); border-radius: 6px; padding: .05em .35em; font-size: .9em; }
table { border-collapse: collapse; width: 100%; }
th, td { border: 1px solid var(--d-stroke); padding: .45rem .6rem; text-align: left; }
th { background: var(--d-surface2); }
hr { border: 0; border-top: 1px solid var(--d-stroke); margin: 2rem 0; }

.updated { color: var(--d-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; }
.lang-switch { margin: 0 0 1rem; }
.lang-switch a {
  display: inline-block; text-decoration: none; font-weight: 600; font-size: .85rem;
  padding: .35rem .9rem; border: 1px solid var(--d-stroke); border-radius: 999px; background: var(--d-surface2); color: var(--d-text);
}
.lang-switch a:hover { border-color: var(--d-accent); color: var(--d-accent); }

/* niente scorrimento orizzontale sul telefono: tabelle e nomi lunghi vanno a capo */
html, body { overflow-x: clip; }
table { table-layout: fixed; }
td, th, code { overflow-wrap: anywhere; word-break: break-word; }
