/**
 * Sri Laxmi Packers and Movers — Central Theme System
 * 
 * Note: The actual hex values are declared dynamically via PHP in head.php
 * from config/constants.php so changing config updates the entire site instantly.
 * Fallbacks are provided below using var().
 */

:root {
    /* Semantic Typography & Dimensions */
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-body: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    --transition-fast: 0.18s ease-in-out;
    --transition-normal: 0.28s ease-in-out;
    --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);

    --shadow-soft: 0 4px 18px rgba(0, 0, 0, 0.06);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.08);
    --shadow-hover: 0 16px 36px rgba(0, 0, 0, 0.12);
}

/* Theme Color Utility Classes */
.text-primary-theme { color: var(--color-primary) !important; }
.text-secondary-theme { color: var(--color-secondary) !important; }
.text-cream-theme { color: var(--color-cream) !important; }
.text-accent-theme { color: var(--color-accent) !important; }

.bg-primary-theme { background-color: var(--color-primary) !important; color: #ffffff; }
.bg-secondary-theme { background-color: var(--color-secondary) !important; color: #ffffff; }
.bg-cream-soft { background-color: var(--color-cream) !important; color: #212529; }
.bg-cream-subtle { background-color: rgba(var(--color-cream-rgb), 0.35) !important; }
.bg-accent-theme { background-color: var(--color-accent) !important; color: #ffffff; }

.border-primary-theme { border-color: var(--color-primary) !important; }
.border-secondary-theme { border-color: var(--color-secondary) !important; }
.border-accent-theme { border-color: var(--color-accent) !important; }

/* Gradients */
.gradient-brand {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%) !important;
}

.gradient-cream {
    background: linear-gradient(180deg, rgba(var(--color-cream-rgb), 0.5) 0%, #ffffff 100%) !important;
}

.gradient-hero-overlay {
    background: linear-gradient(135deg, rgba(20, 24, 33, 0.94) 0%, rgba(var(--color-primary-rgb), 0.78) 100%) !important;
}