{pageContent?.description || 'Experience unparalleled luxury and world-class hospitality. Your journey to exceptional comfort begins here.'}
- {}
+ {/* Badges */}
{badges.length > 0 && badges.some(b => b.text) && (
-
+
{badges.map((badge, index) => {
if (!badge.text) return null;
const BadgeIcon = iconMap[badge.icon] || Award;
return (
-
-
-
{badge.text}
+
+
+ {badge.text}
);
})}
)}
- {}
-
+ {/* Social Media Links */}
+
{pageContent?.social_links?.facebook && (
-
-
+
+
)}
{pageContent?.social_links?.twitter && (
@@ -186,11 +195,11 @@ const Footer: React.FC = () => {
href={pageContent.social_links.twitter}
target="_blank"
rel="noopener noreferrer"
- className="group relative w-11 h-11 flex items-center justify-center rounded-full bg-gray-800/50 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/50 transition-all duration-300 hover:bg-[#d4af37]/10"
+ className="group relative w-12 h-12 sm:w-14 sm:h-14 flex items-center justify-center rounded-lg bg-gradient-to-br from-gray-800/60 to-gray-900/60 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/60 transition-all duration-300 hover:bg-gradient-to-br hover:from-[#d4af37]/10 hover:to-[#c9a227]/10 hover:shadow-lg hover:shadow-[#d4af37]/20 hover:-translate-y-0.5"
aria-label="Twitter"
>
-
-
+
+
)}
{pageContent?.social_links?.instagram && (
@@ -198,11 +207,11 @@ const Footer: React.FC = () => {
href={pageContent.social_links.instagram}
target="_blank"
rel="noopener noreferrer"
- className="group relative w-11 h-11 flex items-center justify-center rounded-full bg-gray-800/50 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/50 transition-all duration-300 hover:bg-[#d4af37]/10"
+ className="group relative w-12 h-12 sm:w-14 sm:h-14 flex items-center justify-center rounded-lg bg-gradient-to-br from-gray-800/60 to-gray-900/60 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/60 transition-all duration-300 hover:bg-gradient-to-br hover:from-[#d4af37]/10 hover:to-[#c9a227]/10 hover:shadow-lg hover:shadow-[#d4af37]/20 hover:-translate-y-0.5"
aria-label="Instagram"
>
-
-
+
+
)}
{pageContent?.social_links?.linkedin && (
@@ -210,11 +219,11 @@ const Footer: React.FC = () => {
href={pageContent.social_links.linkedin}
target="_blank"
rel="noopener noreferrer"
- className="group relative w-11 h-11 flex items-center justify-center rounded-full bg-gray-800/50 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/50 transition-all duration-300 hover:bg-[#d4af37]/10"
+ className="group relative w-12 h-12 sm:w-14 sm:h-14 flex items-center justify-center rounded-lg bg-gradient-to-br from-gray-800/60 to-gray-900/60 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/60 transition-all duration-300 hover:bg-gradient-to-br hover:from-[#d4af37]/10 hover:to-[#c9a227]/10 hover:shadow-lg hover:shadow-[#d4af37]/20 hover:-translate-y-0.5"
aria-label="LinkedIn"
>
-
-
+
+
)}
{pageContent?.social_links?.youtube && (
@@ -222,71 +231,73 @@ const Footer: React.FC = () => {
href={pageContent.social_links.youtube}
target="_blank"
rel="noopener noreferrer"
- className="group relative w-11 h-11 flex items-center justify-center rounded-full bg-gray-800/50 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/50 transition-all duration-300 hover:bg-[#d4af37]/10"
+ className="group relative w-12 h-12 sm:w-14 sm:h-14 flex items-center justify-center rounded-lg bg-gradient-to-br from-gray-800/60 to-gray-900/60 backdrop-blur-sm border border-gray-700/50 hover:border-[#d4af37]/60 transition-all duration-300 hover:bg-gradient-to-br hover:from-[#d4af37]/10 hover:to-[#c9a227]/10 hover:shadow-lg hover:shadow-[#d4af37]/20 hover:-translate-y-0.5"
aria-label="YouTube"
>
-
-
+
+
)}
- {}
+ {/* Quick Links */}
-
+
Quick Links
-
+
-
+
{quickLinks.map((link) => (
-
-
- {link.label}
+
+ {link.label}
))}
- {}
+ {/* Guest Services */}
-
+
Guest Services
-
+
-
+
{supportLinks.map((link) => (
-
-
- {link.label}
+
+ {link.label}
))}
- {}
+ {/* Contact Information */}
-
+
Contact
-
+
-
+
-
-
-
-
+
-
+
{(displayAddress
.split('\n').map((line, i) => (
@@ -298,55 +309,59 @@ const Footer: React.FC = () => {
{displayPhone && (
-
-
-
-
+
-
+
{displayPhone}
)}
{displayEmail && (
-
-
-
-
+
-
+
{displayEmail}
)}
- {}
-
-
+ {/* Rating Section */}
+
+
{[...Array(5)].map((_, i) => (
-
+
))}
-
Rated 5.0 by 10,000+ guests
+
Rated 5.0 by 10,000+ guests
- {}
-
+ {/* Divider */}
+
- {}
+ {/* Bottom Section */}
-
+
{(() => {
const currentYear = new Date().getFullYear();
const copyrightText = pageContent?.copyright_text || '© {YEAR} Luxury Hotel. All rights reserved.';
@@ -354,20 +369,20 @@ const Footer: React.FC = () => {
return copyrightText.replace(/{YEAR}/g, currentYear.toString());
})()}
-
-
Privacy
+
+ Privacy
•
- Terms
+ Terms
•
- {}
-
+ {/* Bottom Gold Accent Line */}
+
- {}
+ {/* Chat Widget */}
);
diff --git a/Frontend/src/components/layout/Header.tsx b/Frontend/src/components/layout/Header.tsx
index 04b0ea45..baef7757 100644
--- a/Frontend/src/components/layout/Header.tsx
+++ b/Frontend/src/components/layout/Header.tsx
@@ -119,7 +119,7 @@ const Header: React.FC
= ({
)}
-
+
{settings.company_name}
diff --git a/Frontend/src/components/modals/AuthModalManager.tsx b/Frontend/src/components/modals/AuthModalManager.tsx
index 3d79942b..32f85673 100644
--- a/Frontend/src/components/modals/AuthModalManager.tsx
+++ b/Frontend/src/components/modals/AuthModalManager.tsx
@@ -1,12 +1,28 @@
-import React from 'react';
+import React, { useEffect } from 'react';
import { useAuthModal } from '../../contexts/AuthModalContext';
import LoginModal from './LoginModal';
import RegisterModal from './RegisterModal';
import ForgotPasswordModal from './ForgotPasswordModal';
import ResetPasswordModal from './ResetPasswordModal';
+import useAuthStore from '../../store/useAuthStore';
const AuthModalManager: React.FC = () => {
- const { isOpen, modalType, resetPasswordParams } = useAuthModal();
+ const { isOpen, modalType, resetPasswordParams, openModal } = useAuthModal();
+ const { isAuthenticated } = useAuthStore();
+
+ // Listen for auth:logout event from apiClient
+ useEffect(() => {
+ const handleAuthLogout = (event: CustomEvent) => {
+ if (!isAuthenticated) {
+ openModal('login');
+ }
+ };
+
+ window.addEventListener('auth:logout', handleAuthLogout as EventListener);
+ return () => {
+ window.removeEventListener('auth:logout', handleAuthLogout as EventListener);
+ };
+ }, [openModal, isAuthenticated]);
if (!isOpen) {
return null;
diff --git a/Frontend/src/components/modals/ForgotPasswordModal.tsx b/Frontend/src/components/modals/ForgotPasswordModal.tsx
index 548d78db..502cfba7 100644
--- a/Frontend/src/components/modals/ForgotPasswordModal.tsx
+++ b/Frontend/src/components/modals/ForgotPasswordModal.tsx
@@ -98,7 +98,7 @@ const ForgotPasswordModal: React.FC = () => {
{settings.company_tagline}
)}
-
+
Forgot Password?
diff --git a/Frontend/src/components/modals/LoginModal.tsx b/Frontend/src/components/modals/LoginModal.tsx
index e550ea53..70414c15 100644
--- a/Frontend/src/components/modals/LoginModal.tsx
+++ b/Frontend/src/components/modals/LoginModal.tsx
@@ -165,7 +165,7 @@ const LoginModal: React.FC = () => {
{settings.company_tagline}
)}
-
+
{requiresMFA ? 'Verify Your Identity' : 'Welcome Back'}
diff --git a/Frontend/src/components/modals/RegisterModal.tsx b/Frontend/src/components/modals/RegisterModal.tsx
index 90307865..c5a5d798 100644
--- a/Frontend/src/components/modals/RegisterModal.tsx
+++ b/Frontend/src/components/modals/RegisterModal.tsx
@@ -170,7 +170,7 @@ const RegisterModal: React.FC = () => {
{settings.company_tagline}
)}
-
+
Create Account
diff --git a/Frontend/src/components/modals/ResetPasswordModal.tsx b/Frontend/src/components/modals/ResetPasswordModal.tsx
index 7ab24a7c..4c943070 100644
--- a/Frontend/src/components/modals/ResetPasswordModal.tsx
+++ b/Frontend/src/components/modals/ResetPasswordModal.tsx
@@ -166,7 +166,7 @@ const ResetPasswordModal: React.FC = ({ token }) => {
{settings.company_tagline}
)}
-
+
{isSuccess ? 'Complete!' : 'Reset Password'}
diff --git a/Frontend/src/components/rooms/ReviewSection.tsx b/Frontend/src/components/rooms/ReviewSection.tsx
index 9b35f0db..fc3e5a04 100644
--- a/Frontend/src/components/rooms/ReviewSection.tsx
+++ b/Frontend/src/components/rooms/ReviewSection.tsx
@@ -10,6 +10,7 @@ import {
type Review,
} from '../../services/api/reviewService';
import useAuthStore from '../../store/useAuthStore';
+import { useAuthModal } from '../../contexts/AuthModalContext';
import Recaptcha from '../common/Recaptcha';
import { recaptchaService } from '../../services/api/systemSettingsService';
@@ -39,6 +40,7 @@ const ReviewSection: React.FC = ({
roomId
}) => {
const { isAuthenticated } = useAuthStore();
+ const { openModal } = useAuthModal();
const [reviews, setReviews] = useState([]);
const [loading, setLoading] = useState(true);
const [submitting, setSubmitting] = useState(false);
@@ -257,13 +259,13 @@ const ReviewSection: React.FC = ({
>
Please{' '}
- openModal('login')}
className="font-semibold underline
hover:text-[#f5d76e] transition-colors"
>
login
- {' '}
+ {' '}
to write a review
diff --git a/Frontend/src/pages/NotFoundPage.tsx b/Frontend/src/pages/NotFoundPage.tsx
index 1726a5c3..ad10e00d 100644
--- a/Frontend/src/pages/NotFoundPage.tsx
+++ b/Frontend/src/pages/NotFoundPage.tsx
@@ -45,7 +45,7 @@ const NotFoundPage: React.FC = () => {
{/* 404 Number */}
-
+
404
@@ -59,7 +59,7 @@ const NotFoundPage: React.FC = () => {
{/* Main Message */}
-
+
Page Not Found
diff --git a/Frontend/src/pages/auth/index.ts b/Frontend/src/pages/auth/index.ts
deleted file mode 100644
index 5a7a6609..00000000
--- a/Frontend/src/pages/auth/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export { default as LoginPage } from './LoginPage';
-export { default as RegisterPage } from './RegisterPage';
-export { default as ForgotPasswordPage } from './ForgotPasswordPage';
-export { default as ResetPasswordPage } from './ResetPasswordPage';
diff --git a/Frontend/src/pages/customer/BookingDetailPage.tsx b/Frontend/src/pages/customer/BookingDetailPage.tsx
index 39f45975..2e361d0d 100644
--- a/Frontend/src/pages/customer/BookingDetailPage.tsx
+++ b/Frontend/src/pages/customer/BookingDetailPage.tsx
@@ -30,6 +30,7 @@ import {
type Booking,
} from '../../services/api/bookingService';
import useAuthStore from '../../store/useAuthStore';
+import { useAuthModal } from '../../contexts/AuthModalContext';
import Loading from '../../components/common/Loading';
import PaymentStatusBadge from
'../../components/common/PaymentStatusBadge';
@@ -40,6 +41,7 @@ const BookingDetailPage: React.FC = () => {
const { id } = useParams<{ id: string }>();
const navigate = useNavigate();
const { isAuthenticated } = useAuthStore();
+ const { openModal } = useAuthModal();
const { formatCurrency } = useFormatCurrency();
const [booking, setBooking] = useState(
@@ -55,11 +57,9 @@ const BookingDetailPage: React.FC = () => {
toast.error(
'Please login to view booking details'
);
- navigate('/login', {
- state: { from: `/bookings/${id}` }
- });
+ openModal('login');
}
- }, [isAuthenticated, navigate, id]);
+ }, [isAuthenticated, openModal, id]);
useEffect(() => {
diff --git a/Frontend/src/pages/customer/BookingPage.tsx b/Frontend/src/pages/customer/BookingPage.tsx
index dbc3d748..4371099a 100644
--- a/Frontend/src/pages/customer/BookingPage.tsx
+++ b/Frontend/src/pages/customer/BookingPage.tsx
@@ -35,6 +35,7 @@ import {
import { serviceService, Service, promotionService, Promotion } from '../../services/api';
import { createPayPalOrder } from '../../services/api/paymentService';
import useAuthStore from '../../store/useAuthStore';
+import { useAuthModal } from '../../contexts/AuthModalContext';
import {
bookingValidationSchema,
type BookingFormData
@@ -49,6 +50,7 @@ const BookingPage: React.FC = () => {
const { id } = useParams<{ id: string }>();
const navigate = useNavigate();
const { isAuthenticated, userInfo } = useAuthStore();
+ const { openModal } = useAuthModal();
const { formatCurrency, currency } = useFormatCurrency();
const [room, setRoom] = useState(null);
@@ -71,9 +73,7 @@ const BookingPage: React.FC = () => {
toast.error(
'Please login to make a booking'
);
- navigate('/login', {
- state: { from: `/booking/${id}` }
- });
+ openModal('login');
} else if (userInfo?.role === 'admin' || userInfo?.role === 'staff') {
toast.error('Admin and staff users cannot make bookings');
if (userInfo?.role === 'admin') {
@@ -1284,17 +1284,13 @@ const BookingPage: React.FC = () => {
- Pay the remaining balance on arrival
+ Requires 20% deposit, remaining balance on arrival
- Note: You need to pay
- 20% deposit via
- bank transfer immediately after booking to
- secure the room. Pay the remaining balance
- on arrival.
+ 20% deposit required to secure your booking. Pay the remaining balance on arrival at the hotel.
@@ -1769,14 +1765,14 @@ const BookingPage: React.FC = () => {
>
Deposit to pay (20%)
-
{formatPrice(totalPrice * 0.2)}
- Pay via bank transfer to confirm booking
+ Pay 20% deposit to secure booking, remaining balance on arrival
-
-
- Required: Pay 20% deposit
- via bank transfer after booking.
- Remaining balance ({formatPrice(totalPrice * 0.8)})
- to be paid on arrival.
-
-
+
+
+ 20% deposit required to secure your booking. Pay the remaining balance ({formatPrice(totalPrice * 0.8)}) on arrival at the hotel.
+
+
diff --git a/Frontend/src/pages/customer/DepositPaymentPage.tsx b/Frontend/src/pages/customer/DepositPaymentPage.tsx
index 55d6826a..775af580 100644
--- a/Frontend/src/pages/customer/DepositPaymentPage.tsx
+++ b/Frontend/src/pages/customer/DepositPaymentPage.tsx
@@ -243,7 +243,7 @@ const DepositPaymentPage: React.FC = () => {
Your booking has been confirmed.
- Remaining amount to be paid at check-in.
+ Remaining amount to be paid on arrival at the hotel.
-
+
Deposit Payment Required
- Please pay 20% deposit to
- confirm your booking
+ Please pay 20% deposit to confirm your booking. Pay the remaining balance on arrival at the hotel.
diff --git a/Frontend/src/pages/customer/MyBookingsPage.tsx b/Frontend/src/pages/customer/MyBookingsPage.tsx
index 250a1adf..1825c8be 100644
--- a/Frontend/src/pages/customer/MyBookingsPage.tsx
+++ b/Frontend/src/pages/customer/MyBookingsPage.tsx
@@ -23,6 +23,7 @@ import {
type Booking,
} from '../../services/api/bookingService';
import useAuthStore from '../../store/useAuthStore';
+import { useAuthModal } from '../../contexts/AuthModalContext';
import Loading from '../../components/common/Loading';
import EmptyState from '../../components/common/EmptyState';
import { useFormatCurrency } from '../../hooks/useFormatCurrency';
@@ -31,6 +32,7 @@ import { parseDateLocal } from '../../utils/format';
const MyBookingsPage: React.FC = () => {
const navigate = useNavigate();
const { isAuthenticated } = useAuthStore();
+ const { openModal } = useAuthModal();
const { formatCurrency } = useFormatCurrency();
const [bookings, setBookings] = useState
([]);
@@ -48,11 +50,9 @@ const MyBookingsPage: React.FC = () => {
useEffect(() => {
if (!isAuthenticated) {
toast.error('Please login to view your bookings');
- navigate('/login', {
- state: { from: '/bookings' }
- });
+ openModal('login');
}
- }, [isAuthenticated, navigate]);
+ }, [isAuthenticated, openModal]);
useEffect(() => {
diff --git a/Frontend/src/pages/customer/PaymentConfirmationPage.tsx b/Frontend/src/pages/customer/PaymentConfirmationPage.tsx
index 1965fe62..e7693296 100644
--- a/Frontend/src/pages/customer/PaymentConfirmationPage.tsx
+++ b/Frontend/src/pages/customer/PaymentConfirmationPage.tsx
@@ -24,6 +24,7 @@ import {
import { confirmBankTransfer } from
'../../services/api/paymentService';
import useAuthStore from '../../store/useAuthStore';
+import { useAuthModal } from '../../contexts/AuthModalContext';
import Loading from '../../components/common/Loading';
import PaymentStatusBadge from
'../../components/common/PaymentStatusBadge';
@@ -33,6 +34,7 @@ const PaymentConfirmationPage: React.FC = () => {
const { id } = useParams<{ id: string }>();
const navigate = useNavigate();
const { isAuthenticated } = useAuthStore();
+ const { openModal } = useAuthModal();
const { formatCurrency } = useFormatCurrency();
const [booking, setBooking] = useState(
@@ -54,9 +56,9 @@ const PaymentConfirmationPage: React.FC = () => {
toast.error(
'Please login to confirm payment'
);
- navigate('/login');
+ openModal('login');
}
- }, [isAuthenticated, navigate]);
+ }, [isAuthenticated, openModal]);
useEffect(() => {
if (id && isAuthenticated) {
diff --git a/Frontend/src/pages/customer/RoomDetailPage.tsx b/Frontend/src/pages/customer/RoomDetailPage.tsx
index a715ff93..2da6726f 100644
--- a/Frontend/src/pages/customer/RoomDetailPage.tsx
+++ b/Frontend/src/pages/customer/RoomDetailPage.tsx
@@ -401,7 +401,7 @@ const RoomDetailPage: React.FC = () => {
>
- No immediate charge — secure your booking now and pay at the hotel
+ 20% deposit required to secure your booking. Pay the remaining balance on arrival at the hotel.
)}
diff --git a/Frontend/src/services/api/apiClient.ts b/Frontend/src/services/api/apiClient.ts
index 48b03370..a3d1ea46 100644
--- a/Frontend/src/services/api/apiClient.ts
+++ b/Frontend/src/services/api/apiClient.ts
@@ -1,4 +1,5 @@
import axios, { AxiosError, InternalAxiosRequestConfig } from 'axios';
+import useAuthStore from '../../store/useAuthStore';
const rawBase = import.meta.env.VITE_API_URL || 'http://localhost:8000';
const normalized = String(rawBase).replace(/\/$/, '');
@@ -134,10 +135,21 @@ apiClient.interceptors.response.use(
localStorage.removeItem('token');
localStorage.removeItem('userInfo');
+ // Update auth store state
+ useAuthStore.getState().logout().catch(() => {
+ // Ignore logout errors, just clear the state
+ useAuthStore.setState({
+ token: null,
+ userInfo: null,
+ isAuthenticated: false,
+ isLoading: false,
+ });
+ });
- if (!window.location.pathname.includes('/login')) {
- window.location.href = '/login';
- }
+ // Dispatch custom event to trigger login modal
+ window.dispatchEvent(new CustomEvent('auth:logout', {
+ detail: { message: 'Session expired. Please login again.' }
+ }));
const errorMessage = (error.response?.data as any)?.message || 'Session expired. Please login again.';
return Promise.reject({
diff --git a/Frontend/src/styles/index.css b/Frontend/src/styles/index.css
index 4ffdb86c..54ece0be 100644
--- a/Frontend/src/styles/index.css
+++ b/Frontend/src/styles/index.css
@@ -90,14 +90,16 @@
body {
margin: 0;
- font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
+ font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
'Droid Sans', 'Helvetica Neue', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
+ font-weight: 300;
background: #fafafa;
color: var(--luxury-gray-900);
- line-height: 1.6;
+ line-height: 1.7;
+ letter-spacing: 0.01em;
}
code {
@@ -105,6 +107,42 @@ code {
'Courier New', monospace;
}
+/* Luxury Typography */
+h1, h2, h3, h4, h5, h6 {
+ font-family: 'Cinzel', 'Playfair Display', serif;
+ font-weight: 600;
+ letter-spacing: -0.02em;
+ line-height: 1.2;
+}
+
+h1 {
+ font-weight: 700;
+ letter-spacing: -0.03em;
+}
+
+h2 {
+ font-weight: 600;
+ letter-spacing: -0.02em;
+}
+
+h3, h4, h5, h6 {
+ font-weight: 500;
+ letter-spacing: -0.01em;
+}
+
+/* Elegant text for special elements */
+.elegant-text {
+ font-family: 'Cormorant Garamond', 'Playfair Display', serif;
+ letter-spacing: 0.02em;
+}
+
+/* Display font for large headings */
+.display-text {
+ font-family: 'Cinzel', 'Playfair Display', serif;
+ font-weight: 600;
+ letter-spacing: -0.02em;
+}
+
@layer components {
.luxury-card {
@@ -143,6 +181,9 @@ code {
@apply active:translate-y-0;
@apply disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:translate-y-0;
@apply relative overflow-hidden;
+ font-family: 'Poppins', 'Inter', sans-serif;
+ font-weight: 500;
+ letter-spacing: 0.05em;
}
.btn-luxury-primary::before {
@@ -171,14 +212,17 @@ code {
}
.luxury-section-title {
- @apply text-3xl md:text-4xl font-serif font-semibold;
+ @apply text-3xl md:text-4xl font-display font-semibold;
@apply text-gray-900 tracking-tight;
@apply mb-2;
+ letter-spacing: -0.02em;
}
.luxury-section-subtitle {
@apply text-gray-600 text-lg font-light;
@apply tracking-wide;
+ font-family: 'Cormorant Garamond', 'Playfair Display', serif;
+ letter-spacing: 0.05em;
}
@@ -235,6 +279,8 @@ code {
@apply bg-white text-gray-900;
@apply placeholder:text-gray-400;
@apply font-light tracking-wide;
+ font-family: 'Poppins', 'Inter', sans-serif;
+ letter-spacing: 0.01em;
}
diff --git a/Frontend/tailwind.config.js b/Frontend/tailwind.config.js
index c7bbc716..0cec8e04 100644
--- a/Frontend/tailwind.config.js
+++ b/Frontend/tailwind.config.js
@@ -8,7 +8,10 @@ export default {
extend: {
fontFamily: {
serif: ['Playfair Display', 'Georgia', 'Times New Roman', 'serif'],
- sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],
+ display: ['Cinzel', 'Playfair Display', 'Georgia', 'serif'],
+ elegant: ['Cormorant Garamond', 'Playfair Display', 'Georgia', 'serif'],
+ sans: ['Poppins', 'Inter', 'system-ui', '-apple-system', 'sans-serif'],
+ body: ['Poppins', 'Inter', 'system-ui', '-apple-system', 'sans-serif'],
},
colors: {
luxury: {