/* StarPlus Custom Stylesheet - Comprehensive Ultra-Clean White / Light Theme */

:root {
  --bg-main: #F8FAFC;
  --bg-card: #FFFFFF;
  --text-main: #0F172A;
  --text-muted: #64748B;
  --border-light: #E2E8F0;
}

/* ======================================================== */
/* GLOBAL LIGHT THEME OVERRIDES FOR STOREFRONT */
/* ======================================================== */

body {
  background-color: #F8FAFC !important;
  color: #0F172A !important;
}

/* Crisp White Header */
header#mainHeader, header {
  background-color: rgba(255, 255, 255, 0.95) !important;
  border-bottom: 1px solid #E2E8F0 !important;
  box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.04) !important;
}

header#mainHeader .text-white, header .text-white {
  color: #0F172A !important;
}

header#mainHeader nav a, header nav a {
  color: #475569 !important;
}

header#mainHeader nav a:hover, header nav a:hover {
  color: #0284C7 !important;
  background-color: #F1F5F9 !important;
}

/* Typography contrast */
h1.text-white, h2.text-white, h3.text-white, h4.text-white,
.text-white:not(.btn-text-white):not([class*="bg-"]):not(code) {
  color: #0F172A !important;
}

.text-slate-400, .text-slate-300 {
  color: #64748B !important;
}

.text-slate-200 {
  color: #334155 !important;
}

/* Card & Container Lightening */
.bg-slate-900,
.bg-slate-900\/80,
.bg-slate-900\/60,
.bg-slate-800,
.bg-slate-800\/90,
.bg-slate-800\/80,
.bg-slate-800\/60,
.bg-slate-800\/50,
.bg-slate-800\/40,
.bg-\[\#0B1120\],
.bg-\[\#0F172A\],
.bg-\[\#131D33\],
.bg-white\/\[0\.03\] {
  background-color: #FFFFFF !important;
  border-color: #E2E8F0 !important;
  box-shadow: 0 4px 20px -3px rgba(0, 0, 0, 0.05), 0 2px 6px -2px rgba(0, 0, 0, 0.02) !important;
}

/* Inputs & Form Elements */
input[type="text"], input[type="password"], input[type="number"], input[type="tel"], textarea, select {
  background-color: #F8FAFC !important;
  border-color: #CBD5E1 !important;
  color: #0F172A !important;
}

input::placeholder, textarea::placeholder {
  color: #94A3B8 !important;
}

input:focus, textarea:focus, select:focus {
  background-color: #FFFFFF !important;
  border-color: #0284C7 !important;
  box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.12) !important;
}

/* Borders */
.border-white\/10, .border-white\/5, .border-white\/20 {
  border-color: #E2E8F0 !important;
}

/* Preset buttons */
.star-preset-btn {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
  color: #0F172A !important;
}

.star-preset-btn:hover {
  background-color: #FEF3C7 !important;
  border-color: #F59E0B !important;
}

.star-preset-btn .text-white {
  color: #0F172A !important;
}

/* Ticker & Proof Bar */
#liveOrderTicker strong {
  color: #0F172A !important;
}

/* Modals & Drawers - Crystal Clean White Theme */
#loginModalContent,
#cartDrawer,
.modal-content-box {
  background-color: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  color: #0F172A !important;
  box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.2) !important;
}

#loginModalContent h3,
#loginModalContent label,
#cartDrawer h3,
#cartDrawer h4,
#cartDrawer span:not(.badge-text) {
  color: #0F172A !important;
}

#loginModalBackdrop,
#cartDrawerBackdrop {
  background-color: rgba(15, 23, 42, 0.6) !important;
  backdrop-filter: blur(8px) !important;
}

/* Fast Login Demo Box in White Theme */
.quick-login-callout {
  background: linear-gradient(135deg, #F0F9FF 0%, #FAF5FF 50%, #FFFBEB 100%) !important;
  border: 1px solid #BAE6FD !important;
}

.quick-login-callout button {
  background-color: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.quick-login-callout button:hover {
  background-color: #F8FAFC !important;
  border-color: #0284C7 !important;
}

/* Cart Item Container in White Theme */
.cart-rendered-item {
  background-color: #F8FAFC !important;
  border: 1px solid #E2E8F0 !important;
  color: #0F172A !important;
}

.cart-rendered-item h4 {
  color: #0F172A !important;
}

/* Background Gradients & Glows in Light Theme */
.fixed.inset-0.-z-10 > div:nth-child(1) {
  background-color: rgba(56, 189, 248, 0.25) !important;
}
.fixed.inset-0.-z-10 > div:nth-child(2) {
  background-color: rgba(251, 191, 36, 0.25) !important;
}
.fixed.inset-0.-z-10 > div:nth-child(3) {
  background-color: rgba(167, 139, 250, 0.25) !important;
}

/* Scrollbars - Light */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #F1F5F9;
}

::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #94A3B8;
}

/* Animations */
@keyframes ticker {
  0% { transform: translateX(0); }
  100% { transform: translateX(50%); }
}

.animate-ticker {
  display: inline-flex;
  animation: ticker 25s linear infinite;
}

.animate-ticker:hover {
  animation-play-state: paused;
}

.toast-enter {
  animation: slideInLeft 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.toast-exit {
  animation: slideOutLeft 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-100%); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes slideOutLeft {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(-100%); }
}

/* ======================================================== */
/* MOBILE ADMIN PANEL & TABLE OPTIMIZATIONS */
/* ======================================================== */
@media (max-width: 768px) {
  #adminSidebar {
    box-shadow: -10px 0 35px rgba(15, 23, 42, 0.18) !important;
  }
  
  .overflow-x-auto {
    -webkit-overflow-scrolling: touch;
  }
}