:root {
  --focus-outline: rgba(255, 215, 0, 0.9);
}

/* Mode contraste élevé */
.high-contrast :where(body, .header, .footer, .hero, .section, .menu-item, .btn) {
  filter: none !important;
}

.high-contrast .hero-overlay {
  background: linear-gradient(180deg, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.85) 100%) !important;
}

.high-contrast .nav-link,
.high-contrast .section-title,
.high-contrast .section-subtitle,
.high-contrast .footer-section a {
  text-shadow: 0 2px 4px rgba(0,0,0,0.8) !important;
}

.high-contrast :focus-visible {
  outline: 3px solid var(--focus-outline) !important;
  outline-offset: 3px !important;
}
/* ========================================
   DALI FOOD - Thème Noir et Or
   Style supplémentaire pour le design luxueux
   ======================================== */

/* Sections et Headers */
.section-title {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.3));
}

.section-subtitle {
    color: #999 !important;
}

/* Feature Cards */
.feature-card {
    background-color: #0b0b0b !important;
    border: 1px solid rgba(255, 215, 0, 0.25) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 215, 0, 0.08) !important;
    color: #f5f5f5 !important;
}

.feature-card:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 215, 0, 0.25) !important;
    border-color: #FFD700 !important;
}

.feature-card h3 {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.6) !important;
}

.feature-card p {
  color: rgba(255,255,255,0.88) !important;
  text-shadow: 0 1px 1px rgba(0,0,0,0.5) !important;
}

.feature-card i {
  color: #FFD700 !important;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.6));
}

.feature-icon {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.3));
}

.feature-title {
    color: #FFD700 !important;
}

.feature-description {
    color: #999 !important;
}

/* Tab Buttons */
.tab-btn {
    background-color: transparent !important;
    color: #999 !important;
    border: 2px solid transparent !important;
    transition: all 0.3s ease !important;
}

.tab-btn:hover {
    color: #FFD700 !important;
    border-color: #FFD700 !important;
}

.tab-btn.active {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    color: #000 !important;
    border-color: #FFD700 !important;
}

/* Reservation Form */
.form-group label {
    color: #FFD700 !important;
}

.form-group input,
.form-group select,
.form-group textarea {
    background-color: #111 !important;
    border: 1px solid rgba(255, 215, 0, 0.3) !important;
    color: #fff !important;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: #FFD700 !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.3) !important;
}

/* About Section */
.about-section {
    background-color: #0a0a0a !important;
}

.about-content h2 {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.about-content p {
    color: #ccc !important;
}

.about-feature {
    color: #FFD700 !important;
}

.about-feature i {
    color: #FFA500 !important;
}

/* Contact Section */
.contact-info {
    background-color: #000 !important;
    border: 1px solid rgba(255, 215, 0, 0.2) !important;
}

.contact-item {
    color: #FFD700 !important;
}

.contact-item i {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Notification */
.notification {
    background: linear-gradient(135deg, #000, #111) !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    box-shadow: 0 4px 30px rgba(255, 215, 0, 0.4) !important;
}

.notification.success {
    border-color: #25D366 !important;
}

.notification.error {
    border-color: #e74c3c !important;
}

/* Scroll Indicator */
.scroll-indicator {
    color: #FFD700 !important;
    animation: glow 2s ease-in-out infinite !important;
}

@keyframes glow {
    0%, 100% {
        filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.5));
    }
    50% {
        filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.8));
    }
}

/* New Badge */
.new-badge {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    color: #000 !important;
    font-weight: 700 !important;
    animation: pulse-gold 2s infinite !important;
}

@keyframes pulse-gold {
    0% {
        box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
    }
    50% {
        box-shadow: 0 0 20px rgba(255, 215, 0, 0.8);
    }
    100% {
        box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
    }
}

/* Modal */
.modal-content {
    background-color: #111 !important;
    border: 2px solid #FFD700 !important;
    color: #fff !important;
}

.modal-content h2,
.modal-content h3 {
    color: #FFD700 !important;
}

.close {
    color: #FFD700 !important;
}

.close:hover {
    color: #FFA500 !important;
}

/* Order Guide */
.order-guide {
    background: linear-gradient(135deg, #0a0a0a, #000) !important;
}

.guide-step {
    background-color: #111 !important;
    border: 1px solid rgba(255, 215, 0, 0.2) !important;
}

.guide-step:hover {
    border-color: #FFD700 !important;
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.3) !important;
}

.step-number {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    color: #000 !important;
}

.step-icon {
    color: #FFD700 !important;
}

/* Sections backgrounds */
.features,
.reservation-section {
    background-color: #0a0a0a !important;
}

.menu-section,
.contact-section {
    background-color: #000 !important;
}

/* Links general */
a {
    transition: all 0.3s ease !important;
}

a:hover {
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}

/* WhatsApp special button effect */
.btn-whatsapp:hover {
    box-shadow: 0 5px 30px rgba(37, 211, 102, 0.5) !important;
}

/* Pulse animation for primary buttons */
.pulse-animation {
    animation: pulse-gold 2s infinite !important;
}

/* Loading effect */
.loading {
    border-color: rgba(255, 215, 0, 0.2) !important;
    border-top-color: #FFD700 !important;
}

/* Success color adjustments */
.text-success {
    color: #25D366 !important;
}

/* Error color adjustments */
.text-error {
    color: #e74c3c !important;
}

/* Loyalty program colors */
.loyalty-link {
    color: #FFD700 !important;
}

.points-circle {
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    color: #000 !important;
}

.reward-card.available {
    border-color: #FFD700 !important;
    background: #111 !important;
}

.reward-icon {
    color: #FFD700 !important;
}

/* Menu Items specifics */
.menu-item {
    background: #111 !important;
}

.menu-item-content {
    background: #111 !important;
}

.menu-item-name {
    color: #FFD700 !important;
}

.menu-item-price {
    color: #FFA500 !important;
    font-weight: 700 !important;
}

.menu-item-description {
    color: #999 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .hero-title {
        font-size: 3rem !important;
    }
    
    .section-title {
        font-size: 2rem !important;
    }
    
    .logo-img {
        height: 40px !important;
    }
    
    .footer-logo {
        height: 50px !important;
    }
}