/* ========================================================================== TENANT THEME — Lilleskaper Drop-in tema for white-label-plattforma. Alle verdiar er tokens; strukturen ligg i app.css og les berre var(--ls-*). Bruk: ========================================================================== */ [data-theme="lilleskaper"] { /* --- Merkefargar (henta direkte frå logoen) ------------------------- */ --brand-navy: #0B1330; --brand-orange: #F5921B; --brand-yellow: #FFC400; --brand-pink: #F0356B; --brand-sky: #35C6F0; --brand-lime: #7CC00C; --brand-red: #F4552B; /* --- Nøytralar ------------------------------------------------------ */ --cream: #FFF7E9; --cream-deep: #FFEFD4; --paper: #FFFFFF; --ink: #0B1330; --ink-soft: #46507A; /* --- Semantiske roller ---------------------------------------------- */ --bg: var(--cream); --bg-alt: var(--paper); --surface: var(--paper); --text: var(--ink); --text-muted: var(--ink-soft); --line: var(--brand-navy); --primary: var(--brand-orange); --primary-ink: var(--brand-navy); --accent: var(--brand-pink); --accent-ink: #FFFFFF; --sale: var(--brand-pink); --success: var(--brand-lime); --info: var(--brand-sky); /* --- Formspråk: tjukke konturar + harde skuggar ---------------------- */ --bw: 3px; /* border width */ --bw-thick: 4px; --radius-sm: 12px; --radius: 20px; --radius-lg: 30px; --radius-xl: 44px; --radius-pill: 999px; --shadow: 5px 6px 0 var(--line); --shadow-lg: 8px 10px 0 var(--line); --shadow-press: 2px 2px 0 var(--line); --shadow-soft: 0 18px 40px -22px rgba(11, 19, 48, .55); /* --- Typografi ------------------------------------------------------- */ --font-display: "Fredoka", "Baloo 2", system-ui, sans-serif; --font-body: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif; --fw-display: 700; --fw-black: 700; --tracking: -0.01em; /* --- Rytme ----------------------------------------------------------- */ --gap: clamp(16px, 2.2vw, 28px); --section-y: clamp(56px, 8vw, 108px); --container: 1240px; /* --- Karusell/ticker-fart -------------------------------------------- */ --ticker-speed: 26s; } /* Fargeroterande hjelpeklasser — brukt av kategorikort, badges og blokker. Kvar tenant kan definere sin eigen rekkefølge her. */ [data-theme="lilleskaper"] { --c1: var(--brand-pink); --c2: var(--brand-sky); --c3: var(--brand-lime); --c4: var(--brand-yellow); --c5: var(--brand-orange); }