:root {
  --brand-gold: #d4af37;
  --brand-gold-light: #f3e5ab;
  --theme-primary: #d4af37;
  --theme-secondary: #8c5311;
  --theme-gradient: linear-gradient(135deg, #f59e0b, #d4af37, #92400e);
  --theme-glow: rgba(212, 175, 55, 0.45);
  --theme-bg-glow1: rgba(212, 175, 55, 0.28);
  --theme-bg-glow2: rgba(180, 83, 9, 0.18);
  --tw-gradient-stops: var(--theme-primary), var(--theme-secondary) !important;
}

/* خلفية متفاعلة حية مع هالة إضاءة واضحة */
body {
  background-color: #08080a !important;
  background-image: 
    radial-gradient(circle 800px at 50% -100px, var(--theme-bg-glow1), transparent),
    radial-gradient(circle 600px at 100% 100%, var(--theme-bg-glow2), transparent),
    radial-gradient(circle 500px at 0% 80%, var(--theme-bg-glow1), transparent),
    linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 100% 100%, 36px 36px, 36px 36px !important;
  background-attachment: fixed !important;
  overflow-x: hidden;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #0c0c10; }
::-webkit-scrollbar-thumb { background: #262630; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--theme-primary); }

.glass-card {
  background: rgba(18, 18, 24, 0.82);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
}
.glass-nav {
  background: rgba(12, 12, 16, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* فرض تدرج الثيم النقي على كافة الأزرار والتبويبات */
.owner-tab-btn.bg-gradient-to-r,
.cat-btn.active,
.sales-period-btn.bg-brand-gold,
#checkoutSubmitBtn,
#captainModalSubmitBtn,
.slide-badge,
button.bg-gradient-to-r {
  background-image: none !important;
  background: var(--theme-gradient) !important;
  color: #000000 !important;
  border: none !important;
  box-shadow: 0 4px 20px -2px var(--theme-glow) !important;
}

/* ألوان شريط السلايدر والنقاط النشطة */
#carouselProgressBar,
#carouselDots button.w-8 {
  background: var(--theme-gradient) !important;
  box-shadow: 0 0 12px var(--theme-glow) !important;
}

/* نصوص وحدود الثيم الصافية */
.text-brand-gold { color: var(--theme-primary) !important; }
.text-brand-goldLight { color: var(--brand-gold-light) !important; }
.border-brand-gold { border-color: var(--theme-primary) !important; }
.border-brand-gold\/40, .border-brand-gold\/30, .border-brand-gold\/20 {
  border-color: var(--theme-glow) !important;
}
.bg-brand-gold\/10, .bg-brand-gold\/15, .bg-brand-gold\/20 {
  background-color: var(--theme-bg-glow2) !important;
}

@media print {
  body * { visibility: hidden; }
  #printableThermalReceipt, #printableThermalReceipt * { visibility: visible; }
  #printableThermalReceipt {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    display: block !important;
    background: white;
    color: black;
  }
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

@media (max-width: 640px) {
  .mobile-bottom-sheet {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    max-height: 88vh !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
}

body:has(#captainView.block) #customerLiveOrderBar,
body:has(#kitchenView.block) #customerLiveOrderBar,
body:has(#ownerView.block) #customerLiveOrderBar,
body:has(#devView.block) #customerLiveOrderBar {
  display: none !important;
}

/* تلوين الكلمة الثانية من اسم الكافيه وفق الثيم النشط */
.brand-accent-word, #headerBrandNameAccent {
  color: var(--theme-primary) !important;
  -webkit-text-fill-color: var(--theme-primary) !important;
  background: none !important;
  text-shadow: 0 0 14px var(--theme-glow) !important;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}