/* themes/elegant_bw.css - ELEGANT BLACK & WHITE THEME */

/* =================================
   ELEGANT BLACK & WHITE THEME
   Sophisticated, timeless, high-fashion
   ================================= */

/* Override body background */
body {
    background: #ffffff;
    color: #1a1a1a;
}

/* Elegant Header - White with Subtle Shadow */
.main-header {
    background: #ffffff;
    border-bottom: none;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
}

.logo-image {
    border: 1px solid #e0e0e0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.logo-image:hover {
    border-color: #000000;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    transform: scale(1.05);
}

.logo-title {
    color: #000000;
    font-family: 'Playfair Display', 'Georgia', serif;
    letter-spacing: 2px;
    text-shadow: none;
}

.logo-tagline {
    color: #333333;
    font-style: italic;
    letter-spacing: 1px;
}

/* Navigation - Sophisticated Charcoal */
.nav-banner {
    background: #1a1a1a;
    border-bottom: none;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.nav-menu a {
    color: #ffffff;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 0.9rem;
}

.nav-menu a:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    text-shadow: none;
}

/* Card Styles - Clean with Subtle Shadow */
.card {
    background: #ffffff;
    border: none;
    box-shadow: none;
}

/* Buttons - Elegant Black and White */
.btn-primary {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.btn-primary:hover {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}

.btn-secondary {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

.btn-secondary:hover {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
}

/* HOMEPAGE SPECIFIC STYLES */

/* Payment/Testing Banner - Subtle Gray Background */
.payment-update-banner {
    background: #f8f8f8;
    border: none;
    box-shadow: none;
    padding: 2rem;
    margin: 3rem auto;
}

.payment-update-banner h3 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: 1px;
}

.payment-update-banner p {
    color: #2c2c2c;
}

.payment-update-banner .icon-wrench {
    color: #000000;
}

/* Seasonal Section - Dramatic Dark Background */
.seasonal-banner {
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    border: none;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    padding: 4rem 2rem;
}

.seasonal-banner::before {
    background: 
        radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 50%, rgba(255, 255, 255, 0.03) 0%, transparent 50%);
}

.seasonal-text h2 {
    color: #ffffff;
    font-family: 'Playfair Display', Georgia, serif;
    text-shadow: none;
    letter-spacing: 3px;
    font-weight: 400;
}

.seasonal-subtitle {
    color: #e8e8e8;
    font-style: italic;
}

.seasonal-text p {
    color: #d0d0d0;
}

.seasonal-shop-btn {
    background: #ffffff;
    color: #000000;
    border: none;
    font-weight: 700;
    letter-spacing: 1.5px;
    box-shadow: 0 4px 15px rgba(255, 255, 255, 0.2);
}

.seasonal-shop-btn:hover {
    background: #f0f0f0;
    color: #000000;
    border: none;
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(255, 255, 255, 0.3);
}

/* Highlight Items - Minimalist Elegance */
.highlight-item {
    background: #fafafa;
    border: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.highlight-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12);
    background: #f5f5f5;
}

.highlight-item i {
    background: linear-gradient(135deg, #000000 0%, #2c2c2c 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.highlight-item h3 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
}

.highlight-item p {
    color: #4a4a4a;
}

/* Featured Products Section */
.featured-section h2 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
    text-transform: uppercase;
    letter-spacing: 3px;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 1rem;
    margin-bottom: 2rem;
}

/* Product Cards - Clean & Elegant */
.product-card {
    background: #ffffff;
    border: 1px solid #e8e8e8;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.product-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    border-color: #d0d0d0;
}

.product-card h3 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
}

.product-card .price {
    color: #000000;
    font-weight: 700;
    font-size: 1.3rem;
}

.add-to-cart-btn {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

.add-to-cart-btn:hover {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

/* Shop CTA Section */
.shop-cta-section {
    background: #f8f8f8;
    border: none;
    padding: 4rem 2rem;
}

.shop-cta-section h2 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: 3px;
}

.shop-cta-section p {
    color: #4a4a4a;
}

.shop-now-btn {
    background: #ffffff;
    color: #000000;
    border: 2px solid #ffffff;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.shop-now-btn:hover {
    background: #000000;
    color: #ffffff;
    border: 2px solid #ffffff;
}

/* Bonfire Promo - Elegant Contrast */
.bonfire-promo-card {
    background: #ffffff;
    border: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.bonfire-promo-card h3 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
}

.bonfire-icon {
    color: #000000;
}

.bonfire-price {
    color: #000000;
    font-weight: 700;
    font-size: 1.5rem;
}

.bonfire-cta-btn {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
}

.bonfire-cta-btn:hover {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

/* Events Section */
.events-section h2 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: 3px;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 1rem;
    margin-bottom: 2rem;
}

.event-card {
    background: #ffffff;
    border: 1px solid #e8e8e8;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.event-card:hover {
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
}

.event-date {
    background: #000000;
    color: #ffffff;
}

.event-title {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
}

.btn-event {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
}

.btn-event:hover {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

/* Customer Account Section */
.customer-account-section {
    background: #fafafa;
    padding: 4rem 0;
}

.account-info h2 {
    color: #000000;
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: 2px;
}

.benefit-item {
    color: #2c2c2c;
}

.benefit-item i {
    color: #000000;
}

.btn-account.primary {
    background: #000000;
    color: #ffffff;
    border: 2px solid #000000;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.btn-account.primary:hover {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

.btn-account.secondary {
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

.btn-account.secondary:hover {
    background: #000000;
    color: #ffffff;
}

/* Cookie Banner */
.cookie-banner {
    background: #2c2c2c;
    border-top: none;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
}

.cookie-accept-btn {
    background: #ffffff;
    color: #000000;
    border: 2px solid #ffffff;
    font-weight: 700;
}

.cookie-accept-btn:hover {
    background: #000000;
    color: #ffffff;
    border: 2px solid #ffffff;
}

/* Footer - Elegant Dark Gray */
footer {
    background: #2c2c2c;
    border-top: none;
    box-shadow: 0 -2px 15px rgba(0, 0, 0, 0.1);
}

.footer-section h3 {
    color: #ffffff;
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: 1px;
}

.footer-section a {
    color: #d0d0d0;
}

.footer-section a:hover {
    color: #ffffff;
}

.footer-section p {
    color: #d0d0d0;
}

.footer-bottom {
    color: #a0a0a0;
    border-top: 1px solid #2c2c2c;
}

/* Compliance Footer */
.compliance-footer {
    background: #1a1a1a;
    border-top: none;
}

.compliance-links a {
    color: #d0d0d0;
}

.compliance-links a:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}

/* Add Google Font */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&display=swap');