/*
* ============================================================
* SARGOM — TEMA: DARK (theme-dark.css)
* Ispirato al mockup sargomup.demotest.it
* ============================================================
*
* COME APPLICARE QUESTO TEMA:
* Nel file MasterFrontend.Master, nella sezione ,
* assicurati di avere questi due link nell'ordine esatto:
*
*
*
*
* Il tema sovrascrive le variabili del design system.
* Non toccare sargom-ds.css — modifica solo questo file.
*
* FONT USATI IN QUESTO TEMA:
* Aggiungi nel prima dei CSS:
*
*
*
* ============================================================
*/
:root {
/* --- COLORI BASE --- */
--sg-bg: #21272b;
--sg-bg-alt: #1b2024;
--sg-panel: #2a3036;
--sg-text: #eef1f3;
--sg-text-muted: #c8d0d6;
--sg-muted: #9aa3ab;
--sg-border: #363d44;
/* --- ACCENT (arancio brand) --- */
--sg-accent: #ff6600;
--sg-accent-hover: #e65600;
--sg-accent-shadow: rgba(255,102,0,.30);
--sg-accent-subtle: rgba(255,102,0,.12);
/* --- TIPOGRAFIA --- */
--sg-font-body: 'Montserrat', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
--sg-font-display: 'Montserrat', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
/* --- SPACING --- */
--sg-maxw: 1200px;
--sg-gutter: 20px;
--sg-gap: 20px;
--sg-section-py: 64px;
/* --- BORDER RADIUS --- */
--sg-radius-sm: 8px;
--sg-radius-card: 14px;
--sg-radius-pill: 999px;
/* --- OMBRE --- */
--sg-shadow: 0 4px 16px rgba(0,0,0,.28);
--sg-shadow-hover: 0 10px 28px rgba(0,0,0,.38);
/* --- HEADER --- */
--sg-header-bg: rgba(26,31,35,.85);
--sg-header-border: #32383d;
--sg-header-h: 64px;
--sg-nav-link: #dfe5ea;
--sg-nav-hover-bg: rgba(255,255,255,.07);
/* --- HERO --- */
--sg-hero-min-h: 520px;
--sg-hero-overlay: linear-gradient(180deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,.40) 60%, rgba(33,39,43,1) 100%);
--sg-hero-img: url('/img/sargom_hero.jpg');
/* --- FORM INPUTS --- */
--sg-input-bg: #1e2428;
--sg-input-border: #3a4249;
/* --- CHIP/BADGE --- */
--sg-chip-bg: rgba(255,255,255,.08);
--sg-chip-border: rgba(255,255,255,.14);
/* --- FOOTER --- */
--sg-footer-bg: #171c20;
--sg-footer-border: #2d3338;
--sg-footer-text: #cfd6db;
}