/* ── HorecaMaxx preset themes (data-hx-theme on ) ─────────────────────── */ [data-hx-theme="bistro"] { --hx-primary: #9f1239; --hx-primary-dark: #881337; --hx-primary-light: #ffe4e6; --hx-primary-hover-mid: #be123c; --hx-accent: #ca8a04; --hx-accent-dark: #a16207; --hx-bg: #faf5f0; --hx-surface: #ffffff; --hx-nav-bg: #1c1917; --hx-text: #292524; --hx-muted: #78716c; --hx-border: #e7e5e4; --hx-nav-link-active-bg: rgba(159, 18, 57, 0.4); --hx-focus-ring: rgba(159, 18, 57, 0.18); --hx-primary-shadow: rgba(159, 18, 57, 0.35); --hx-primary-shadow-soft: rgba(159, 18, 57, 0.25); --hx-primary-border: rgba(159, 18, 57, 0.28); --hx-primary-selected: rgba(159, 18, 57, 0.35); --hx-primary-selected-strong: rgba(159, 18, 57, 0.45); --hx-primary-tint: rgba(159, 18, 57, 0.12); --hx-primary-tint-soft: rgba(159, 18, 57, 0.08); --hx-primary-tint-faint: rgba(159, 18, 57, 0.04); --hx-login-bg: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(159, 18, 57, 0.35) 0%, transparent 55%), radial-gradient(ellipse 70% 50% at 85% 90%, rgba(202, 138, 4, 0.22) 0%, transparent 50%), linear-gradient(155deg, #1c1917 0%, #4c0519 45%, #881337 100%); --hx-qr-header-end: #4c0519; } [data-hx-theme="bar"] { --hx-primary: #6366f1; --hx-primary-dark: #4f46e5; --hx-primary-light: #e0e7ff; --hx-primary-hover-mid: #818cf8; --hx-accent: #22d3ee; --hx-accent-dark: #06b6d4; --hx-bg: #f0f4ff; --hx-surface: #ffffff; --hx-nav-bg: #0f172a; --hx-text: #1e1b4b; --hx-muted: #64748b; --hx-border: #e0e7ff; --hx-nav-link-active-bg: rgba(99, 102, 241, 0.4); --hx-focus-ring: rgba(99, 102, 241, 0.18); --hx-primary-shadow: rgba(99, 102, 241, 0.35); --hx-primary-shadow-soft: rgba(99, 102, 241, 0.25); --hx-primary-border: rgba(99, 102, 241, 0.28); --hx-primary-selected: rgba(99, 102, 241, 0.35); --hx-primary-selected-strong: rgba(99, 102, 241, 0.45); --hx-primary-tint: rgba(99, 102, 241, 0.12); --hx-primary-tint-soft: rgba(99, 102, 241, 0.08); --hx-primary-tint-faint: rgba(99, 102, 241, 0.04); --hx-login-bg: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(99, 102, 241, 0.4) 0%, transparent 55%), radial-gradient(ellipse 70% 50% at 85% 90%, rgba(34, 211, 238, 0.25) 0%, transparent 50%), linear-gradient(155deg, #0f172a 0%, #312e81 45%, #4f46e5 100%); --hx-qr-header-end: #312e81; } [data-hx-theme="hotel"] { --hx-primary: #1e40af; --hx-primary-dark: #1e3a8a; --hx-primary-light: #dbeafe; --hx-primary-hover-mid: #2563eb; --hx-accent: #b45309; --hx-accent-dark: #92400e; --hx-bg: #f8fafc; --hx-surface: #ffffff; --hx-nav-bg: #0c1929; --hx-text: #0f172a; --hx-muted: #64748b; --hx-border: #e2e8f0; --hx-nav-link-active-bg: rgba(30, 64, 175, 0.4); --hx-focus-ring: rgba(30, 64, 175, 0.18); --hx-primary-shadow: rgba(30, 64, 175, 0.35); --hx-primary-shadow-soft: rgba(30, 64, 175, 0.25); --hx-primary-border: rgba(30, 64, 175, 0.28); --hx-primary-selected: rgba(30, 64, 175, 0.35); --hx-primary-selected-strong: rgba(30, 64, 175, 0.45); --hx-primary-tint: rgba(30, 64, 175, 0.12); --hx-primary-tint-soft: rgba(30, 64, 175, 0.08); --hx-primary-tint-faint: rgba(30, 64, 175, 0.04); --hx-login-bg: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(30, 64, 175, 0.35) 0%, transparent 55%), radial-gradient(ellipse 70% 50% at 85% 90%, rgba(180, 83, 9, 0.22) 0%, transparent 50%), linear-gradient(155deg, #0c1929 0%, #1e3a8a 45%, #1e40af 100%); --hx-qr-header-end: #172554; } [data-hx-theme="minimal"] { --hx-primary: #475569; --hx-primary-dark: #334155; --hx-primary-light: #f1f5f9; --hx-primary-hover-mid: #64748b; --hx-accent: #0ea5e9; --hx-accent-dark: #0284c7; --hx-bg: #f9fafb; --hx-surface: #ffffff; --hx-nav-bg: #18181b; --hx-text: #18181b; --hx-muted: #71717a; --hx-border: #e4e4e7; --hx-radius: 10px; --hx-radius-sm: 8px; --hx-nav-link-active-bg: rgba(71, 85, 105, 0.45); --hx-focus-ring: rgba(71, 85, 105, 0.15); --hx-primary-shadow: rgba(71, 85, 105, 0.25); --hx-primary-shadow-soft: rgba(71, 85, 105, 0.18); --hx-primary-border: rgba(71, 85, 105, 0.22); --hx-primary-selected: rgba(71, 85, 105, 0.3); --hx-primary-selected-strong: rgba(71, 85, 105, 0.4); --hx-primary-tint: rgba(71, 85, 105, 0.1); --hx-primary-tint-soft: rgba(71, 85, 105, 0.06); --hx-primary-tint-faint: rgba(71, 85, 105, 0.03); --hx-login-bg: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(71, 85, 105, 0.25) 0%, transparent 55%), radial-gradient(ellipse 70% 50% at 85% 90%, rgba(14, 165, 233, 0.18) 0%, transparent 50%), linear-gradient(155deg, #18181b 0%, #27272a 45%, #475569 100%); --hx-qr-header-end: #27272a; }