/* ============================================================
   Ammaya — Black & Gold Luxury
   Hero (ads slider) + header + footer in black & gold.
   Rest of the site uses the original white theme.
   Colors follow the admin settings:
     --primary (default #d4af37), --secondary, --accent
   Set hero_theme = 'banner' in admin to show the photo
   banner instead of the black & gold gradient.
   ============================================================ */

/* ---------- Hero / Ads slider: black & gold (covers red banner) ---------- */
.mad-hero-animated:not(.hero-banner),
.hero.mad-hero-animated:not(.hero-banner) {
  background: #0a0a0a !important;
}
.mad-hero-animated:not(.hero-banner) .hero-slide-items {
  /* fallback for old browsers */
  background:
    radial-gradient(ellipse 60% 50% at 70% 40%, rgba(212,175,55,.16), transparent 70%),
    radial-gradient(ellipse 40% 35% at 20% 80%, rgba(212,175,55,.08), transparent 70%),
    linear-gradient(135deg, #0a0a0a 0%, #141414 50%, #0a0a0a 100%) !important;
  /* follows admin primary color */
  background:
    radial-gradient(ellipse 60% 50% at 70% 40%, color-mix(in srgb, var(--primary, #d4af37) 16%, transparent), transparent 70%),
    radial-gradient(ellipse 40% 35% at 20% 80%, color-mix(in srgb, var(--primary, #d4af37) 8%, transparent), transparent 70%),
    linear-gradient(135deg, #0a0a0a 0%, #141414 50%, #0a0a0a 100%) !important;
}
.mad-hero-animated:not(.hero-banner) .hero-slide-items .hero-overlay {
  background: linear-gradient(135deg, rgba(0,0,0,.55), rgba(0,0,0,.15)) !important;
}

/* luxury gold gradient title */
.mad-hero-animated:not(.hero-banner) .mad-hero-title {
  text-shadow: none !important;
  filter: drop-shadow(2px 3px 0 rgba(0,0,0,.9)) drop-shadow(0 0 26px rgba(212,175,55,.28)) !important;
}
.mad-hero-animated:not(.hero-banner) .hero-title-gold {
  color: transparent !important;
  background: linear-gradient(180deg, #fff8dc 0%, var(--secondary, #f5d67b) 30%, var(--primary, #d4af37) 55%, var(--accent, #9c7c1a) 85%, var(--primary, #d4af37) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* glowing gold prices */
.mad-hero-animated:not(.hero-banner) .hero-price-gold {
  color: transparent !important;
  background: linear-gradient(180deg, #fff8dc 0%, var(--secondary, #f5d67b) 40%, var(--primary, #d4af37) 75%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
  filter: drop-shadow(2px 2px 0 rgba(0,0,0,.85)) drop-shadow(0 0 18px rgba(212,175,55,.35)) !important;
}

/* gold divider under hero text */
.mad-hero-animated:not(.hero-banner) .mad-hero-text::after {
  content: '';
  display: block;
  width: 130px;
  height: 3px;
  margin-top: 20px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--primary, #d4af37), transparent) !important;
}
@media (max-width: 767px) {
  .mad-hero-animated:not(.hero-banner) .mad-hero-text::after { margin-left: auto; margin-right: auto; background: linear-gradient(90deg, transparent, var(--primary, #d4af37), transparent) !important; }
}

/* shining gold order button (follows admin color) */
.mad-hero-animated .btn-style-3,
[class*="btn"].btn-style-3 {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--secondary, #f5d67b) 0%, var(--primary, #d4af37) 55%, var(--accent, #9c7c1a) 100%) !important;
  color: #0a0a0a !important;
  box-shadow: 0 6px 24px rgba(212,175,55,.35) !important;
}
.mad-hero-animated .btn-style-3:hover,
[class*="btn"].btn-style-3:hover {
  -webkit-box-shadow: 2px 6px 0px 0px rgba(212,175,55,.35), 0 8px 32px rgba(212,175,55,.5) !important;
  -moz-box-shadow: 2px 6px 0px 0px rgba(212,175,55,.35), 0 8px 32px rgba(212,175,55,.5) !important;
  box-shadow: 2px 6px 0px 0px color-mix(in srgb, var(--primary, #d4af37) 35%, transparent), 0 8px 32px color-mix(in srgb, var(--primary, #d4af37) 50%, transparent) !important;
  transform: translateY(-2px);
}
.mad-hero-animated .btn-style-3::after {
  content: '';
  position: absolute;
  top: 0;
  left: -80%;
  width: 50%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
  transform: skewX(-20deg);
  animation: goldShine 3.2s ease-in-out infinite;
}
@keyframes goldShine {
  0%, 55% { left: -80%; }
  100% { left: 180%; }
}

/* hero deal pills: primary color when selected */
.hero-deal-picker label {
  border-color: rgba(255,255,255,.5) !important;
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}
.hero-deal-picker label:has(input:checked) {
  border-color: var(--primary, #d4af37) !important;
  background: rgba(212,175,55,.15) !important;
  background: color-mix(in srgb, var(--primary, #d4af37) 15%, transparent) !important;
  box-shadow: 0 0 16px rgba(212,175,55,.25);
}

/* ---------- Header: black & gold ---------- */
#mad-header,
.mad-header-section--sticky-xl {
  background: rgba(10,10,10,.97) !important;
  border-bottom: 1px solid rgba(212,175,55,.28) !important;
}
.mad-pre-header {
  background: #060606 !important;
  border-bottom: 1px solid rgba(212,175,55,.14) !important;
}
.mad-navigation a,
.mad-navigation .menu-item a { color: #f0ead8 !important; }
.mad-navigation .menu-item.current-menu-item a,
.mad-navigation a:hover { color: var(--primary, #d4af37) !important; }
.mad-logo-text { color: #fff !important; }
.mad-info, .mad-info-content span { color: #b9b3a4 !important; }
.mad-info-title { color: #fff !important; }
.mad-item-link { color: #f0ead8 !important; }
.mad-item-link:hover { color: var(--primary, #d4af37) !important; }

/* ---------- Order confirmation: preparation time box ---------- */
.delivery-time-box {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 24px;
  padding: 16px 20px;
  border-radius: 12px;
  border: 1px solid var(--primary, #d4af37);
  background: rgba(212,175,55,.08);
  background: color-mix(in srgb, var(--primary, #d4af37) 8%, #fff);
  text-align: left;
}
.delivery-time-box i {
  font-size: 28px;
  color: var(--primary, #d4af37);
  flex-shrink: 0;
}
.delivery-time-box strong {
  display: block;
  font-size: 16px;
  color: #232223;
  margin-bottom: 2px;
}
.delivery-time-box span {
  font-size: 13px;
  color: #6b6b6b;
}

/* ---------- Sauce picker (Croque): no repeated prices, choice is included ---------- */
.sauce-picker .size-price { display: none !important; }
/* green check + gold border on selected sauce/drink (pure CSS, like Extras & Beläge) */
.croque-sauces input[type="radio"]:checked ~ .sauce-tick,
.menue-box input[type="radio"]:checked ~ .sauce-tick,
.burger-menue input[type="radio"]:checked ~ span .sauce-tick,
.snacks-menue input[type="radio"]:checked ~ .sauce-tick,
.free-sauce input[type="radio"]:checked ~ .sauce-tick,
.bowls-sauces input[type="checkbox"]:checked ~ .sauce-tick,
.box-choices input[type="checkbox"]:checked ~ .sauce-tick,
.box-choices input[type="radio"]:checked ~ .sauce-tick { display: inline !important; }
.croque-sauces .sauce-row:has(input[type="radio"]:checked),
.menue-box label:has(input[type="radio"]:checked),
.snacks-menue label:has(input[type="radio"]:checked),
.free-sauce label:has(input[type="radio"]:checked),
.bowls-sauces label:has(input[type="checkbox"]:checked),
.box-choices label:has(input:checked) { border-color: var(--primary, #d4af37) !important; background: rgba(212,175,55,.08); }
/* Snacks-Menü: Softdrinks nur bei angehaktem Menü zeigen */
.snacks-menue .menue-drinks { display: none; }
.snacks-menue:has(.menue-check:checked) .menue-drinks { display: flex; }

/* ---------- Footer: gold accents ---------- */
.footer {
  border-top: 2px solid var(--primary, #d4af37) !important;
}
.footer h4,
.footer-logo { color: var(--secondary, #f5d67b) !important; }

/* ============================================================
   Yummi base elements follow the admin colors (frontend only,
   scoped to #mad-page-wrapper so the admin panel is untouched)
   ============================================================ */
/* all solid buttons: admin primary, dark text */
#mad-page-wrapper .btn:not(.btn-outline):not(.btn-link) {
  background: var(--primary, #d4af37) !important;
  background: linear-gradient(135deg, var(--secondary, #f5d67b) 0%, var(--primary, #d4af37) 60%, var(--accent, #9c7c1a) 100%) !important;
  color: #0a0a0a !important;
  border: none !important;
}
#mad-page-wrapper .btn:not(.btn-outline):not(.btn-link):hover {
  -webkit-box-shadow: 2px 6px 0px 0px rgba(212,175,55,.4), 0 8px 28px rgba(212,175,55,.45) !important;
  box-shadow: 2px 6px 0px 0px color-mix(in srgb, var(--primary, #d4af37) 40%, transparent), 0 8px 28px color-mix(in srgb, var(--primary, #d4af37) 45%, transparent) !important;
  color: #0a0a0a !important;
  transform: translateY(-2px);
}
/* no dark-red hover on primary buttons (cart / checkout) */
#mad-page-wrapper .btn-primary:hover {
  background: var(--accent, #9c7c1a) !important;
  background: linear-gradient(135deg, var(--primary, #d4af37), var(--accent, #9c7c1a)) !important;
  color: #fff !important;
}
/* header cart circle: admin primary instead of red */
#mad-page-wrapper .mad-actions .mad-item-link {
  background: var(--primary, #d4af37) !important;
  color: #0a0a0a !important;
}
#mad-page-wrapper .mad-actions .mad-item-link:hover {
  background: var(--secondary, #f5d67b) !important;
  color: #0a0a0a !important;
}
#mad-page-wrapper .mad-cart-count {
  background: #0a0a0a !important;
  color: var(--primary, #d4af37) !important;
}
/* category cards: gold hover instead of fixed yellow */
#mad-page-wrapper .mad-menu-box .mad-menu-item:hover,
#mad-page-wrapper .mad-tabs .mad-active .mad-menu-item {
  background: var(--primary, #d4af37) !important;
}
/* kill leftover red SVG fills on hover/active */
#mad-page-wrapper .mad-menu-box .mad-menu-item:hover .svg .cls-1,
#mad-page-wrapper .mad-tabs .mad-active .mad-menu-icon .svg path {
  fill: #0a0a0a !important;
}
#mad-page-wrapper .mad-menu-box .mad-menu-item:hover .svg .cls-2 {
  stroke: #0a0a0a !important;
}
#mad-page-wrapper .shopping-cart {
  background: var(--primary, #d4af37) !important;
}

/* Yummi-Theme setzt automatisch '$' vor Preise – entfernen (Templates enthalten bereits €) */
.mad-product .mad-product-price:not(.onsale):before,
.mad-product .mad-product-price span:before,
table .mad-product-price:before,
.mad-total-item .mad-product-price:before,
.shopping-cart .subtotal span:before,
.mad-dollar:before,
.mad-pt-price-num:before,
.mad-spec-price::before,
.mad-menu-item .mad-menu-price:before {
  content: none !important;
}