/* ═══════════════════════════════════════════════════════
   ClickFood — Site design variants (+ Verde Luxury in assets/themes/verde-luxury/)
   Loaded LAST so overrides always apply.
   Each design: typography + visual style (not just colors)
   ═══════════════════════════════════════════════════════ */

/* ── Base: main flex container for section ordering ── */
main.main-sections {
  display: flex !important;
  flex-direction: column !important;
}
.welcome-strip   { order: 1 !important; }
.about-section   { order: 2 !important; }
.menu-section    { order: 3 !important; }
.quote-strip     { order: 4 !important; }
.gallery-section { order: 5 !important; }
.private-section { order: 6 !important; }
.booking-section { order: 7 !important; }

/* ── Design: Gold Luxury (default) ── */
body.design-gold .ornament::before,
body.design-gold .ornament::after { background: linear-gradient(to right, transparent, var(--molana-primary), transparent) !important; }
body.design-gold .section-label { letter-spacing: 0.32em !important; }
body.design-gold .btn-gold,
body.design-gold .btn-gold-solid { border-radius: 0 !important; letter-spacing: 0.22em !important; font-family: 'Montserrat', sans-serif !important; }
body.design-gold .font-serif,
body.design-gold h1, body.design-gold h2, body.design-gold h3, body.design-gold h4 { font-family: 'Playfair Display', serif !important; }
body.design-gold .heritage-frame::before { border: 1px solid color-mix(in srgb, var(--molana-primary) 35%, transparent) !important; }
/* Gold layout: default order, image-left about, text-left private, info-left booking */

/* ── Design: Dark Modern ── */
body.design-dark { font-family: 'DM Sans', sans-serif !important; }
body.design-dark .font-serif,
body.design-dark h1, body.design-dark h2, body.design-dark h3, body.design-dark h4 { font-family: 'DM Serif Display', serif !important; }
body.design-dark .btn-gold,
body.design-dark .btn-gold-solid { font-family: 'DM Sans', sans-serif !important; border-radius: 0 !important; letter-spacing: 0.18em !important; }
body.design-dark .ornament { gap: 8px !important; }
body.design-dark .ornament::before,
body.design-dark .ornament::after { height: 2px !important; background: var(--molana-primary) !important; opacity: 0.8; }
body.design-dark .section-label { letter-spacing: 0.2em !important; font-weight: 500 !important; }
body.design-dark .menu-card { border-radius: 0 !important; border-width: 1px !important; }
body.design-dark .heritage-frame::before { border-width: 2px !important; top: -8px !important; left: -8px !important; right: 8px !important; bottom: 8px !important; }
/* Dark layout: gallery before menu, about image-right, booking form-left */
body.design-dark .welcome-strip { order: 1 !important; }
body.design-dark .about-section { order: 2 !important; }
body.design-dark .gallery-section { order: 3 !important; }
body.design-dark .quote-strip { order: 4 !important; }
body.design-dark .menu-section { order: 5 !important; }
body.design-dark .private-section { order: 6 !important; }
body.design-dark .booking-section { order: 7 !important; }
body.design-dark .about-image { order: 2 !important; }
body.design-dark .about-text { order: 1 !important; }
body.design-dark .booking-form { order: 1 !important; }
body.design-dark .booking-info { order: 2 !important; }
body.design-dark .section-block { padding-top: 2rem !important; padding-bottom: 2rem !important; }

/* ── Design: Burgundy Elegant ── */
body.design-luxury { font-family: 'Raleway', sans-serif !important; }
body.design-luxury .font-serif,
body.design-luxury h1, body.design-luxury h2, body.design-luxury h3, body.design-luxury h4 { font-family: 'Libre Baskerville', serif !important; }
body.design-luxury .btn-gold,
body.design-luxury .btn-gold-solid { font-family: 'Raleway', sans-serif !important; border-radius: 2px !important; }
body.design-luxury .ornament::before,
body.design-luxury .ornament::after { background: linear-gradient(90deg, transparent, var(--molana-primary) 20%, var(--molana-primary) 80%, transparent) !important; }
body.design-luxury .section-label { letter-spacing: 0.28em !important; font-style: italic !important; }
body.design-luxury .menu-card { border-left: 4px solid var(--molana-primary) !important; border-radius: 0 !important; }
/* Luxury layout: about image-right, private image-right, menu 2 cols */
body.design-luxury .about-image { order: 2 !important; }
body.design-luxury .about-text { order: 1 !important; }
body.design-luxury .private-image { order: 2 !important; }
body.design-luxury .private-text { order: 1 !important; }
body.design-luxury .menu-grid { grid-template-columns: repeat(2, 1fr) !important; }
@media (max-width: 768px) { body.design-luxury .menu-grid { grid-template-columns: 1fr !important; } }

/* ── Design: Emerald Fresh ── */
body.design-emerald { font-family: 'Inter', sans-serif !important; }
body.design-emerald .font-serif,
body.design-emerald h1, body.design-emerald h2, body.design-emerald h3, body.design-emerald h4 { font-family: 'Fraunces', serif !important; }
body.design-emerald .btn-gold,
body.design-emerald .btn-gold-solid { font-family: 'Inter', sans-serif !important; border-radius: 20px !important; }
body.design-emerald .ornament::before,
body.design-emerald .ornament::after { background: linear-gradient(to right, transparent, var(--molana-primary), transparent) !important; }
body.design-emerald .ornament span { font-size: 0.5rem !important; }
body.design-emerald .menu-card { border-radius: 20px !important; overflow: hidden !important; }
body.design-emerald .masonry-item img { border-radius: 14px !important; }
body.design-emerald .seating-box { border-radius: 14px !important; }
/* Emerald layout: about stacked, menu 4 cols, gallery 4 cols */
body.design-emerald .about-grid { grid-template-columns: 1fr !important; }
body.design-emerald .about-image { order: 1 !important; }
body.design-emerald .about-text { order: 2 !important; }
body.design-emerald .menu-grid { grid-template-columns: repeat(4, 1fr) !important; }
@media (max-width: 1200px) { body.design-emerald .menu-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 768px) { body.design-emerald .menu-grid { grid-template-columns: 1fr !important; } }
body.design-emerald .gallery-section .masonry { columns: 4 !important; }
@media (max-width: 1100px) { body.design-emerald .gallery-section .masonry { columns: 2 !important; } }
@media (max-width: 560px) { body.design-emerald .gallery-section .masonry { columns: 1 !important; } }
body.design-emerald .about-section,
body.design-emerald .private-section { padding-top: 2rem !important; padding-bottom: 2rem !important; }

/* ── Design: Ocean Calm ── */
body.design-ocean { font-family: 'Nunito', sans-serif !important; }
body.design-ocean .font-serif,
body.design-ocean h1, body.design-ocean h2, body.design-ocean h3, body.design-ocean h4 { font-family: 'Source Serif 4', serif !important; }
body.design-ocean .btn-gold,
body.design-ocean .btn-gold-solid { font-family: 'Nunito', sans-serif !important; border-radius: 28px !important; letter-spacing: 0.14em !important; }
body.design-ocean .ornament::before,
body.design-ocean .ornament::after { background: linear-gradient(to right, transparent, var(--molana-primary) 30%, transparent) !important; opacity: 0.7; }
body.design-ocean .section-label { letter-spacing: 0.24em !important; }
body.design-ocean .menu-card { border-radius: 12px !important; }
body.design-ocean .form-input { border-radius: 8px !important; }
/* Ocean layout: quote first, about image-right, booking form-left */
body.design-ocean .quote-strip { order: 1 !important; }
body.design-ocean .welcome-strip { order: 2 !important; }
body.design-ocean .about-section { order: 3 !important; }
body.design-ocean .menu-section { order: 4 !important; }
body.design-ocean .gallery-section { order: 5 !important; }
body.design-ocean .private-section { order: 6 !important; }
body.design-ocean .booking-section { order: 7 !important; }
body.design-ocean .about-image { order: 2 !important; }
body.design-ocean .about-text { order: 1 !important; }
body.design-ocean .booking-form { order: 1 !important; }
body.design-ocean .booking-info { order: 2 !important; }

/* ── Design: Saffron Warm ── */
body.design-saffron { font-family: 'Open Sans', sans-serif !important; }
body.design-saffron .font-serif,
body.design-saffron h1, body.design-saffron h2, body.design-saffron h3, body.design-saffron h4 { font-family: 'Merriweather', serif !important; }
body.design-saffron .btn-gold,
body.design-saffron .btn-gold-solid { font-family: 'Open Sans', sans-serif !important; border-radius: 4px !important; }
body.design-saffron .ornament::before,
body.design-saffron .ornament::after { background: repeating-linear-gradient(90deg, var(--molana-primary), var(--molana-primary) 2px, transparent 2px, transparent 8px) !important; opacity: 0.6; }
body.design-saffron .section-label { letter-spacing: 0.2em !important; }
body.design-saffron .menu-card { border-radius: 6px !important; box-shadow: 0 2px 16px rgba(0,0,0,0.25) !important; }
body.design-saffron .heritage-frame::before { border-style: double !important; border-width: 3px !important; }
/* Saffron layout: about image-right, private image-right */
body.design-saffron .about-image { order: 2 !important; }
body.design-saffron .about-text { order: 1 !important; }
body.design-saffron .private-image { order: 2 !important; }
body.design-saffron .private-text { order: 1 !important; }

/* ── Design: Rose Romantic ── */
body.design-rose { font-family: 'Jost', sans-serif !important; }
body.design-rose .font-serif,
body.design-rose h1, body.design-rose h2, body.design-rose h3, body.design-rose h4 { font-family: 'Italiana', serif !important; }
body.design-rose .btn-gold,
body.design-rose .btn-gold-solid { font-family: 'Jost', sans-serif !important; border-radius: 0 !important; letter-spacing: 0.2em !important; }
body.design-rose .ornament::before,
body.design-rose .ornament::after { background: linear-gradient(to right, transparent, var(--molana-primary), transparent) !important; }
body.design-rose .ornament span { opacity: 0.8 !important; }
body.design-rose .section-label { letter-spacing: 0.36em !important; font-weight: 400 !important; }
body.design-rose .menu-card { border-radius: 0 !important; border-color: color-mix(in srgb, var(--molana-primary) 25%, transparent) !important; }
/* Rose layout: menu 2 cols */
body.design-rose .menu-grid { grid-template-columns: repeat(2, 1fr) !important; }
@media (max-width: 768px) { body.design-rose .menu-grid { grid-template-columns: 1fr !important; } }

/* ── Design: Midnight Sophisticated ── */
body.design-midnight { font-family: 'Outfit', sans-serif !important; }
body.design-midnight .font-serif,
body.design-midnight h1, body.design-midnight h2, body.design-midnight h3, body.design-midnight h4 { font-family: 'Cinzel', serif !important; }
body.design-midnight .btn-gold,
body.design-midnight .btn-gold-solid { font-family: 'Outfit', sans-serif !important; border-radius: 0 !important; letter-spacing: 0.24em !important; }
body.design-midnight .ornament::before,
body.design-midnight .ornament::after { background: linear-gradient(90deg, transparent, var(--molana-primary), transparent) !important; }
body.design-midnight .section-label { letter-spacing: 0.4em !important; font-weight: 600 !important; }
body.design-midnight .menu-card { border: 1px solid color-mix(in srgb, var(--molana-primary) 20%, transparent) !important; }
body.design-midnight .heritage-frame::before { border-width: 2px !important; }
/* Midnight layout: about image-right, private image-right, booking form-left, menu 4 cols */
body.design-midnight .about-image { order: 2 !important; }
body.design-midnight .about-text { order: 1 !important; }
body.design-midnight .private-image { order: 2 !important; }
body.design-midnight .private-text { order: 1 !important; }
body.design-midnight .booking-form { order: 1 !important; }
body.design-midnight .booking-info { order: 2 !important; }
body.design-midnight .menu-grid { grid-template-columns: repeat(4, 1fr) !important; }
@media (max-width: 1200px) { body.design-midnight .menu-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 768px) { body.design-midnight .menu-grid { grid-template-columns: 1fr !important; } }

/* ── Design: Pizza Shop (bold red, casual Italian) ── */
body.design-pizza { font-family: 'Barlow', sans-serif !important; }
body.design-pizza .font-serif,
body.design-pizza h1, body.design-pizza h2, body.design-pizza h3, body.design-pizza h4 { font-family: 'Oswald', sans-serif !important; }
body.design-pizza .btn-gold,
body.design-pizza .btn-gold-solid { font-family: 'Oswald', sans-serif !important; border-radius: 0 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; }
body.design-pizza .ornament::before,
body.design-pizza .ornament::after { background: var(--molana-primary) !important; height: 3px !important; opacity: 0.9; }
body.design-pizza .section-label { letter-spacing: 0.28em !important; font-weight: 600 !important; text-transform: uppercase !important; }
body.design-pizza .menu-card { border-radius: 0 !important; border-left: 4px solid var(--molana-primary) !important; }
body.design-pizza .menu-card:hover { border-left-width: 6px !important; }
body.design-pizza .heritage-frame::before { border: 2px solid var(--molana-primary) !important; }
/* Pizza layout: menu 2 cols, about image-right */
body.design-pizza .about-image { order: 2 !important; }
body.design-pizza .about-text { order: 1 !important; }
body.design-pizza .menu-grid { grid-template-columns: repeat(2, 1fr) !important; }
@media (max-width: 768px) { body.design-pizza .menu-grid { grid-template-columns: 1fr !important; } }

/* ── Design: Fast Food (bright yellow, energetic) ── */
body.design-fastfood { font-family: 'Barlow Condensed', sans-serif !important; }
body.design-fastfood .font-serif,
body.design-fastfood h1, body.design-fastfood h2, body.design-fastfood h3, body.design-fastfood h4 { font-family: 'Bebas Neue', sans-serif !important; letter-spacing: 0.08em !important; }
body.design-fastfood .btn-gold,
body.design-fastfood .btn-gold-solid { font-family: 'Bebas Neue', sans-serif !important; border-radius: 0 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; }
body.design-fastfood .ornament::before,
body.design-fastfood .ornament::after { background: var(--molana-primary) !important; height: 4px !important; opacity: 1; }
body.design-fastfood .section-label { letter-spacing: 0.2em !important; font-weight: 600 !important; text-transform: uppercase !important; }
body.design-fastfood .menu-card { border-radius: 0 !important; border: 2px solid color-mix(in srgb, var(--molana-primary) 40%, transparent) !important; }
body.design-fastfood .menu-card:hover { border-color: var(--molana-primary) !important; box-shadow: 0 0 24px color-mix(in srgb, var(--molana-primary) 25%, transparent) !important; }
body.design-fastfood .heritage-frame::before { border: 2px solid var(--molana-primary) !important; }
/* Fast Food layout: menu 3 cols, gallery 4 cols */
body.design-fastfood .menu-grid { grid-template-columns: repeat(3, 1fr) !important; }
@media (max-width: 1024px) { body.design-fastfood .menu-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 768px) { body.design-fastfood .menu-grid { grid-template-columns: 1fr !important; } }
body.design-fastfood .gallery-section .masonry { columns: 4 !important; }
@media (max-width: 768px) { body.design-fastfood .gallery-section .masonry { columns: 2 !important; } }

/* ── Design: Burger Diner (retro amber, American diner) ── */
body.design-burger { font-family: 'Archivo', sans-serif !important; }
body.design-burger .font-serif,
body.design-burger h1, body.design-burger h2, body.design-burger h3, body.design-burger h4 { font-family: 'Archivo Black', sans-serif !important; }
body.design-burger .btn-gold,
body.design-burger .btn-gold-solid { font-family: 'Archivo', sans-serif !important; border-radius: 4px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; font-weight: 600 !important; }
body.design-burger .ornament::before,
body.design-burger .ornament::after { background: repeating-linear-gradient(90deg, var(--molana-primary), var(--molana-primary) 4px, transparent 4px, transparent 12px) !important; height: 2px !important; opacity: 0.8; }
body.design-burger .section-label { letter-spacing: 0.24em !important; font-weight: 700 !important; text-transform: uppercase !important; }
body.design-burger .menu-card { border-radius: 8px !important; border: 2px solid color-mix(in srgb, var(--molana-primary) 30%, transparent) !important; }
body.design-burger .menu-card:hover { border-color: var(--molana-primary) !important; }
body.design-burger .heritage-frame::before { border: 2px dashed var(--molana-primary) !important; border-radius: 4px !important; }
/* Burger layout: about stacked, menu 2 cols, booking form-left */
body.design-burger .about-grid { grid-template-columns: 1fr !important; }
body.design-burger .about-image { order: 1 !important; }
body.design-burger .about-text { order: 2 !important; }
body.design-burger .menu-grid { grid-template-columns: repeat(2, 1fr) !important; }
@media (max-width: 768px) { body.design-burger .menu-grid { grid-template-columns: 1fr !important; } }
body.design-burger .booking-form { order: 1 !important; }
body.design-burger .booking-info { order: 2 !important; }