Files
Newbie_CRM/Web_Backgrounds/cuba-theme.css
T
2026-07-02 17:14:57 +02:00

155 lines
4.3 KiB
CSS

/* ============================================================================
Cuba Theme — Classic Cuban car on a playa at golden hour (6pm sunset)
Malecón, Havana — warm sunset tones, turquoise Caribbean accents
============================================================================ */
.dark.theme-cuba {
--background: 25 40% 6%;
--foreground: 30 20% 90%;
--card: 25 35% 10%;
--card-foreground: 30 20% 90%;
--popover: 25 35% 10%;
--popover-foreground: 30 20% 90%;
--primary: 15 85% 55%;
--primary-foreground: 0 0% 100%;
--secondary: 185 60% 50%;
--secondary-foreground: 0 0% 100%;
--muted: 25 20% 15%;
--muted-foreground: 25 10% 55%;
--accent: 195 65% 55%;
--accent-foreground: 0 0% 0%;
--destructive: 0 75% 50%;
--destructive-foreground: 0 0% 100%;
--success: 145 55% 45%;
--success-foreground: 0 0% 100%;
--warning: 35 90% 55%;
--warning-foreground: 0 0% 0%;
--border: 25 25% 18%;
--input: 25 20% 15%;
--ring: 15 85% 55%;
--radius: 0.75rem;
--sidebar: 25 40% 6%;
--sidebar-foreground: 30 20% 90%;
--sidebar-primary: 15 85% 55%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 25 30% 12%;
--sidebar-accent-foreground: 30 20% 90%;
--sidebar-border: 25 25% 15%;
--sidebar-ring: 15 85% 55%;
--chart-1: 15 85% 55%;
--chart-2: 185 60% 50%;
--chart-3: 45 85% 55%;
--chart-4: 195 65% 55%;
--chart-5: 335 60% 55%;
}
.light.theme-cuba {
--background: 30 30% 96%;
--foreground: 25 40% 15%;
--card: 0 0% 100%;
--card-foreground: 25 40% 15%;
--popover: 0 0% 100%;
--popover-foreground: 25 40% 15%;
--primary: 15 80% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 185 55% 45%;
--secondary-foreground: 0 0% 100%;
--muted: 30 15% 90%;
--muted-foreground: 25 10% 45%;
--accent: 195 60% 50%;
--accent-foreground: 0 0% 0%;
--destructive: 0 72% 50%;
--destructive-foreground: 0 0% 100%;
--success: 145 50% 40%;
--success-foreground: 0 0% 100%;
--warning: 35 85% 50%;
--warning-foreground: 0 0% 0%;
--border: 30 15% 85%;
--input: 30 10% 88%;
--ring: 15 80% 50%;
--radius: 0.75rem;
--sidebar: 0 0% 100%;
--sidebar-foreground: 25 40% 15%;
--sidebar-primary: 15 80% 50%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 30 15% 92%;
--sidebar-accent-foreground: 25 40% 15%;
--sidebar-border: 30 15% 85%;
--sidebar-ring: 15 80% 50%;
--chart-1: 15 80% 50%;
--chart-2: 185 55% 45%;
--chart-3: 45 80% 50%;
--chart-4: 195 60% 50%;
--chart-5: 335 55% 50%;
}
/* ── Malecón, Havana at golden hour background ──────────────────── */
.dark.theme-cuba body::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
background: url("https://images.unsplash.com/photo-1584098179114-7962ad5d6653?w=1920&q=80") no-repeat center center fixed;
background-size: cover;
background-attachment: fixed;
background-position: center;
}
.light.theme-cuba body::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
background: hsl(30, 30%, 96%);
}
/* ── Make main containers transparent so body::before shows ──────── */
.dark.theme-cuba .min-h-screen.bg-background {
background: transparent !important;
}
.dark.theme-cuba .min-h-screen.bg-\[\#F8F8F8\],
.dark.theme-cuba .dark\:bg-\[\#0A0A0A\] {
background: transparent !important;
}
.light.theme-cuba .min-h-screen {
background: hsl(30, 30%, 96%) !important;
}
/* ── Frosted glass cards ────────────────────────────────────────── */
.dark.theme-cuba .bg-card,
.dark.theme-cuba .bg-popover,
.dark.theme-cuba .bg-muted {
background-color: hsl(var(--card) / 0.85);
backdrop-filter: blur(12px);
}
.dark.theme-cuba .bg-sidebar {
background-color: hsl(var(--sidebar) / 0.9);
backdrop-filter: blur(12px);
}
.light.theme-cuba .bg-card,
.light.theme-cuba .bg-popover,
.light.theme-cuba .bg-muted {
background-color: hsl(var(--card) / 0.92);
backdrop-filter: blur(8px);
}
.light.theme-cuba .bg-sidebar {
background-color: hsl(var(--sidebar) / 0.95);
backdrop-filter: blur(8px);
}
@media (prefers-reduced-transparency: reduce) {
.theme-cuba .bg-card,
.theme-cuba .bg-popover,
.theme-cuba .bg-muted,
.theme-cuba .bg-sidebar {
backdrop-filter: none;
}
}