/* ============================================================
   Deshen Restaurant — Master Stylesheet
   Elegant cream/gold/green theme, mobile-first, 5-star dining
   ============================================================ */

/* ---------- CSS Variables ---------- */
:root {
  /* Brand Colors — Warm Cream & Gold with Forest Green accents */
  --rst-primary:     #1B4332;
  --rst-primary-lt:  #2D6A4F;
  --rst-primary-dk:  #143528;
  --rst-gold:        #C5A572;
  --rst-gold-lt:     #D4BB8E;
  --rst-gold-dk:     #A88B58;
  --rst-cream:       #FBF7F0;
  --rst-cream-dk:    #F0E8D8;
  --rst-charcoal:    #1C1917;
  --rst-dark:        #292524;
  --rst-text:        #3D3529;
  --rst-text-lt:     #78716C;
  --rst-border:      #E2DDD4;
  --rst-white:       #FFFFFF;

  /* Status Colors */
  --rst-success:     #16A34A;
  --rst-success-bg:  #F0FDF4;
  --rst-warning:     #D97706;
  --rst-warning-bg:  #FFFBEB;
  --rst-danger:      #DC2626;
  --rst-danger-bg:   #FEF2F2;
  --rst-info:        #2563EB;
  --rst-info-bg:     #EFF6FF;

  /* Typography */
  --rst-font-heading: 'Playfair Display', 'Georgia', serif;
  --rst-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Spacing */
  --rst-space-xs:  0.25rem;
  --rst-space-sm:  0.5rem;
  --rst-space-md:  1rem;
  --rst-space-lg:  1.5rem;
  --rst-space-xl:  2rem;
  --rst-space-2xl: 3rem;

  /* Radius */
  --rst-radius-sm:  0.375rem;
  --rst-radius-md:  0.5rem;
  --rst-radius-lg:  0.75rem;
  --rst-radius-xl:  1rem;
  --rst-radius-full: 9999px;

  /* Shadows */
  --rst-shadow-sm:   0 1px 2px rgba(28, 25, 23, .05);
  --rst-shadow-md:   0 4px 6px -1px rgba(28, 25, 23, .07), 0 2px 4px -2px rgba(28, 25, 23, .05);
  --rst-shadow-lg:   0 10px 15px -3px rgba(28, 25, 23, .08), 0 4px 6px -4px rgba(28, 25, 23, .04);
  --rst-shadow-xl:   0 20px 25px -5px rgba(28, 25, 23, .1), 0 8px 10px -6px rgba(28, 25, 23, .04);

  /* Transitions */
  --rst-ease: cubic-bezier(.4, 0, .2, 1);
  --rst-duration: 200ms;
}

/* ---------- Reset & Base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body.rst-body {
  margin: 0;
  padding: 0;
  font-family: var(--rst-font-body);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--rst-text);
  background: var(--rst-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ---------- Typography ---------- */
.rst-h1, .rst-h2, .rst-h3, .rst-h4, .rst-h5, .rst-h6 {
  font-family: var(--rst-font-heading);
  color: var(--rst-charcoal);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 var(--rst-space-sm);
}
.rst-h1 { font-size: clamp(1.75rem, 5vw, 2.5rem); }
.rst-h2 { font-size: clamp(1.5rem, 4vw, 2rem); }
.rst-h3 { font-size: clamp(1.25rem, 3vw, 1.5rem); }
.rst-h4 { font-size: 1.125rem; }
.rst-h5 { font-size: 1rem; }
.rst-h6 { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.05em; }

.rst-subtitle {
  font-family: var(--rst-font-body);
  font-weight: 400;
  color: var(--rst-text-lt);
  font-size: 0.95rem;
  letter-spacing: 0.02em;
}

.rst-gold-accent { color: var(--rst-gold); }

/* ---------- Layout Containers ---------- */
.rst-container {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  padding: 0 var(--rst-space-md);
}
@media (min-width: 768px) {
  .rst-container { max-width: 720px; }
}
@media (min-width: 1024px) {
  .rst-container { max-width: 1024px; }
}

.rst-page { min-height: 100dvh; display: flex; flex-direction: column; }
.rst-main { flex: 1; padding-bottom: 80px; }

/* ---------- Shared Site Footer ---------- */
.rst-site-footer {
  margin-top: auto;
  padding: var(--rst-space-lg) 0 calc(92px + env(safe-area-inset-bottom, 0px));
  background:
    radial-gradient(120% 90% at 50% -25%, color-mix(in srgb, var(--rst-gold) 12%, transparent), transparent 60%),
    linear-gradient(180deg, color-mix(in srgb, var(--rst-cream-dk) 38%, transparent) 0%, color-mix(in srgb, var(--rst-cream) 86%, transparent) 100%);
  border-top: 1px solid color-mix(in srgb, var(--rst-gold) 20%, var(--rst-border));
  position: relative;
}
.rst-site-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(220px, 55vw);
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--rst-gold) 72%, transparent), transparent);
}
.rst-site-footer .rst-container {
  text-align: center;
}
.rst-site-footer-copy,
.rst-site-footer-power {
  margin: 0;
  line-height: 1.45;
}
.rst-site-footer-copy {
  font-size: 0.84rem;
  color: var(--rst-text);
  font-weight: 700;
  letter-spacing: 0.01em;
}
.rst-site-footer-power {
  margin-top: 5px;
  font-size: 0.78rem;
  color: var(--rst-text-lt);
}
.rst-site-footer-link {
  color: var(--rst-gold-dk);
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid color-mix(in srgb, var(--rst-gold) 60%, transparent);
}
.rst-site-footer-link:hover {
  color: var(--rst-gold);
  border-bottom-color: var(--rst-gold);
}

/* ---------- Header ---------- */
.rst-header {
  background: var(--rst-white);
  border-bottom: 1px solid var(--rst-border);
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, .95);
}
.rst-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--rst-space-sm) var(--rst-space-md);
  max-width: 480px;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .rst-header-inner { max-width: 720px; }
}
@media (min-width: 1024px) {
  .rst-header-inner { max-width: 1024px; }
}
.rst-logo {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  text-decoration: none;
  color: var(--rst-charcoal);
}
.rst-logo img { height: 40px; width: auto; }
.rst-logo-text {
  font-family: var(--rst-font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--rst-primary);
}
.rst-logo-tagline {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--rst-gold);
  display: block;
  line-height: 1;
  margin-top: 2px;
}
.rst-header-actions { display: flex; align-items: center; gap: var(--rst-space-sm); }

/* ---------- Bottom Navigation ---------- */
.rst-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--rst-white);
  border-top: 1px solid var(--rst-border);
  z-index: 100;
  padding: var(--rst-space-xs) 0;
  padding-bottom: env(safe-area-inset-bottom, var(--rst-space-xs));
}
.rst-bottom-nav-inner {
  display: flex;
  justify-content: space-around;
  max-width: 540px;
  margin: 0 auto;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.rst-bottom-nav-inner::-webkit-scrollbar { display: none; }
.rst-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-decoration: none;
  color: var(--rst-text-lt);
  font-size: 0.68rem;
  font-weight: 500;
  padding: 0.5rem 0.4rem;
  min-width: 48px;
  min-height: 48px;
  flex-shrink: 0;
  border-radius: var(--rst-radius-md);
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  position: relative;
  transition: color var(--rst-duration) var(--rst-ease);
}
.rst-nav-item i { font-size: 1.2rem; }
.rst-nav-item.active,
.rst-nav-item:hover { color: var(--rst-primary); }
.rst-nav-item.active::after {
  content: '';
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 3px;
  background: var(--rst-primary);
  border-radius: var(--rst-radius-full);
}
.rst-nav-badge {
  position: absolute;
  top: -2px;
  right: 0;
  background: var(--rst-danger);
  color: var(--rst-white);
  font-size: 0.65rem;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: var(--rst-radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 0 0 2px var(--rst-white);
}

/* ---------- Buttons ---------- */
.rst-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rst-space-sm);
  padding: 0.625rem 1.25rem;
  font-family: var(--rst-font-body);
  font-size: 0.9rem;
  font-weight: 600;
  border: none;
  border-radius: var(--rst-radius-md);
  cursor: pointer;
  text-decoration: none;
  transition: all var(--rst-duration) var(--rst-ease);
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.rst-btn:active { transform: scale(.97); }

.rst-btn-primary {
  background: var(--rst-primary);
  color: var(--rst-white);
}
.rst-btn-primary:hover { background: var(--rst-primary-lt); }

.rst-btn-gold {
  background: var(--rst-gold);
  color: var(--rst-white);
}
.rst-btn-gold:hover { background: var(--rst-gold-dk); }

.rst-btn-outline {
  background: transparent;
  color: var(--rst-primary);
  border: 1.5px solid var(--rst-primary);
}
.rst-btn-outline:hover {
  background: var(--rst-primary);
  color: var(--rst-white);
}

.rst-btn-ghost {
  background: transparent;
  color: var(--rst-text);
}
.rst-btn-ghost:hover { background: var(--rst-cream-dk); }

.rst-btn-sm { padding: 0.5rem 0.875rem; font-size: 0.875rem; min-height: 36px; }
.rst-btn-lg { padding: 0.875rem 1.75rem; font-size: 1rem; min-height: 48px; }
.rst-btn-block { width: 100%; }
/* Ensure all primary buttons meet 44px touch target on mobile */
.rst-btn { min-height: 44px; }
.rst-btn-icon {
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: var(--rst-radius-full);
}
.rst-btn-icon-sm { width: 32px; height: 32px; font-size: 0.85rem; }

.rst-btn:disabled, .rst-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* ---------- Cards ---------- */
.rst-card {
  background: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  box-shadow: var(--rst-shadow-sm);
  overflow: hidden;
  transition: box-shadow var(--rst-duration) var(--rst-ease);
}
.rst-card:hover { box-shadow: var(--rst-shadow-md); }
.rst-card-img {
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
}
.rst-card-body { padding: var(--rst-space-md); }
.rst-card-title {
  font-family: var(--rst-font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--rst-charcoal);
  margin: 0 0 var(--rst-space-xs);
}
.rst-card-text {
  font-size: 0.85rem;
  color: var(--rst-text-lt);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---------- Menu Item Card ---------- */
.rst-menu-card {
  display: flex;
  background: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  box-shadow: var(--rst-shadow-sm);
  overflow: hidden;
  transition: box-shadow var(--rst-duration) var(--rst-ease);
}
.rst-menu-card:hover { box-shadow: var(--rst-shadow-md); }
.rst-menu-card-img {
  width: 110px;
  min-height: 110px;
  object-fit: cover;
  flex-shrink: 0;
}
.rst-menu-card-body {
  flex: 1;
  padding: var(--rst-space-md);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--rst-space-xs);
}
.rst-menu-card-name {
  font-family: var(--rst-font-heading);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--rst-charcoal);
}
.rst-menu-card-desc {
  font-size: 0.8rem;
  color: var(--rst-text-lt);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rst-menu-card-price {
  font-family: var(--rst-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--rst-primary);
}
.rst-menu-card-actions {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  margin-top: auto;
}

/* ---------- Dietary Tags ---------- */
.rst-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 2px 6px;
  border-radius: var(--rst-radius-full);
  white-space: nowrap;
}
.rst-tag-veg      { background: #DCFCE7; color: #166534; }
.rst-tag-vegan    { background: #D1FAE5; color: #065F46; }
.rst-tag-gf       { background: #FEF3C7; color: #92400E; }
.rst-tag-spicy    { background: #FEE2E2; color: #991B1B; }
.rst-tag-halal    { background: #DBEAFE; color: #1E40AF; }
.rst-tag-featured { background: var(--rst-gold); color: var(--rst-white); }

/* ---------- Quantity Selector ---------- */
.rst-qty {
  display: inline-flex;
  align-items: center;
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  overflow: hidden;
}
.rst-qty button {
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--rst-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.rst-qty button:active { background: var(--rst-cream); transform: scale(.94); }
.rst-qty span {
  min-width: 36px;
  text-align: center;
  font-weight: 700;
  font-size: 1rem;
  color: var(--rst-charcoal);
  user-select: none;
}

/* ---------- Badges & Status ---------- */
.rst-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: var(--rst-radius-full);
  text-transform: capitalize;
}
.rst-badge-pending   { background: var(--rst-warning-bg); color: var(--rst-warning); }
.rst-badge-confirmed { background: var(--rst-info-bg);    color: var(--rst-info); }
.rst-badge-preparing { background: #FFF7ED;               color: #C2410C; }
.rst-badge-ready     { background: var(--rst-success-bg); color: var(--rst-success); }
.rst-badge-served    { background: #F0FDF4;               color: #15803D; }
.rst-badge-completed { background: #F0F9FF;               color: #0369A1; }
.rst-badge-cancelled { background: var(--rst-danger-bg);  color: var(--rst-danger); }
.rst-badge-paid      { background: var(--rst-success-bg); color: var(--rst-success); }

/* ---------- Forms ---------- */
.rst-form-group { margin-bottom: var(--rst-space-md); }
.rst-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--rst-charcoal);
  margin-bottom: var(--rst-space-xs);
}
.rst-input,
.rst-select,
.rst-textarea {
  width: 100%;
  padding: 0.75rem 0.875rem;
  font-family: var(--rst-font-body);
  /* 16px minimum prevents iOS auto-zoom on focus */
  font-size: 16px;
  line-height: 1.4;
  min-height: 44px;
  color: var(--rst-charcoal);
  background: var(--rst-white);
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-md);
  transition: border-color var(--rst-duration) var(--rst-ease), box-shadow var(--rst-duration) var(--rst-ease);
  appearance: none;
  -webkit-appearance: none;
}
@media (min-width: 768px) {
  .rst-input, .rst-select, .rst-textarea { font-size: 0.95rem; min-height: 40px; }
}
.rst-input:focus,
.rst-select:focus,
.rst-textarea:focus {
  outline: none;
  border-color: var(--rst-primary);
  box-shadow: 0 0 0 3px rgba(114, 47, 55, .1);
}
.rst-input::placeholder { color: var(--rst-text-lt); }
.rst-textarea { resize: vertical; min-height: 80px; }
.rst-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2378716C' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.875rem center;
  padding-right: 2.5rem;
}
.rst-input-error { border-color: var(--rst-danger); }
.rst-error-text { font-size: 0.8rem; color: var(--rst-danger); margin-top: var(--rst-space-xs); }

/* ---------- Empty / Loading States ---------- */
.rst-empty {
  text-align: center;
  padding: var(--rst-space-2xl) var(--rst-space-md);
  color: var(--rst-text-lt);
}
.rst-empty i {
  font-size: 2.5rem;
  color: var(--rst-border);
  margin-bottom: var(--rst-space-md);
  display: block;
}
.rst-empty-title {
  font-family: var(--rst-font-heading);
  font-size: 1.1rem;
  color: var(--rst-charcoal);
  margin-bottom: var(--rst-space-xs);
}

.rst-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid var(--rst-border);
  border-top-color: var(--rst-primary);
  border-radius: 50%;
  animation: rst-spin 0.8s linear infinite;
  margin: 0 auto;
}
@keyframes rst-spin { to { transform: rotate(360deg); } }

.rst-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rst-space-md);
  padding: var(--rst-space-2xl) var(--rst-space-md);
  color: var(--rst-text-lt);
  font-size: 0.9rem;
}

/* ---------- Toast / Alerts ---------- */
.rst-toast-container {
  position: fixed;
  top: var(--rst-space-md);
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  width: 90%;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: var(--rst-space-sm);
  pointer-events: none;
}
.rst-toast {
  padding: var(--rst-space-md);
  border-radius: var(--rst-radius-md);
  font-size: 0.9rem;
  font-weight: 500;
  box-shadow: var(--rst-shadow-lg);
  pointer-events: auto;
  animation: rst-slideDown .3s var(--rst-ease);
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
}
.rst-toast-success { background: var(--rst-success); color: #fff; }
.rst-toast-error   { background: var(--rst-danger);  color: #fff; }
.rst-toast-info    { background: var(--rst-info);    color: #fff; }
.rst-toast-warning { background: var(--rst-warning); color: #fff; }
@keyframes rst-slideDown {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Modals ---------- */
.rst-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(28, 25, 23, .55);
  z-index: 1000;
  display: none;
  align-items: flex-end;
  justify-content: center;
  animation: rst-fadeIn .2s var(--rst-ease);
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior: contain;
}
.rst-modal-overlay.active { display: flex; }

.rst-modal {
  background: var(--rst-white);
  width: 100%;
  max-width: 480px;
  max-height: 92dvh;
  border-radius: var(--rst-radius-xl) var(--rst-radius-xl) 0 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-bottom: env(safe-area-inset-bottom, 0);
  animation: rst-slideUp .3s var(--rst-ease);
  position: relative;
}
@media (min-width: 768px) {
  .rst-modal-overlay { align-items: center; padding: 1rem; }
  .rst-modal { border-radius: var(--rst-radius-xl); max-height: 85vh; width: min(100%, 480px); }
}
@keyframes rst-fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes rst-slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

.rst-modal-handle {
  width: 40px;
  height: 4px;
  background: var(--rst-border);
  border-radius: var(--rst-radius-full);
  margin: var(--rst-space-sm) auto;
}
.rst-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--rst-space-md);
  border-bottom: 1px solid var(--rst-border);
}
.rst-modal-title {
  font-family: var(--rst-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--rst-charcoal);
}
.rst-modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--rst-cream-dk);
  color: var(--rst-text);
  font-size: 1.125rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.rst-modal-close:hover,
.rst-modal-close:focus-visible {
  background: var(--rst-primary);
  color: #fff;
  outline: none;
}
.rst-modal-close:active { transform: scale(.92); }
.rst-modal-body { padding: var(--rst-space-md); }
.rst-modal-footer {
  padding: var(--rst-space-md);
  border-top: 1px solid var(--rst-border);
  display: flex;
  gap: var(--rst-space-sm);
}

/* ---------- Section Dividers ---------- */
.rst-divider {
  display: flex;
  align-items: center;
  gap: var(--rst-space-md);
  margin: var(--rst-space-lg) 0;
}
.rst-divider::before,
.rst-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--rst-border);
}
.rst-divider-text {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--rst-text-lt);
}

/* ---------- Category Pills ---------- */
.rst-categories {
  display: flex;
  gap: var(--rst-space-sm);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: var(--rst-space-sm) 0;
  scrollbar-width: none;
}
.rst-categories::-webkit-scrollbar { display: none; }
.rst-category-pill {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rst-space-xs);
  padding: var(--rst-space-sm) var(--rst-space-md);
  border-radius: var(--rst-radius-lg);
  border: 1.5px solid var(--rst-border);
  background: var(--rst-white);
  color: var(--rst-text);
  font-size: 0.75rem;
  font-weight: 500;
  white-space: nowrap;
  scroll-snap-align: start;
  cursor: pointer;
  transition: all var(--rst-duration) var(--rst-ease);
  -webkit-tap-highlight-color: transparent;
  text-decoration: none;
}
.rst-category-pill i { font-size: 1.2rem; }
.rst-category-pill.active,
.rst-category-pill:hover {
  background: var(--rst-primary);
  color: var(--rst-white);
  border-color: var(--rst-primary);
}

/* ---------- Search Box ---------- */
.rst-search-wrap {
  position: relative;
}
.rst-search-wrap i {
  position: absolute;
  left: 0.875rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rst-text-lt);
  font-size: 0.9rem;
}
.rst-search-input {
  width: 100%;
  padding: 0.625rem 0.875rem 0.625rem 2.5rem;
  font-family: var(--rst-font-body);
  font-size: 0.9rem;
  background: var(--rst-white);
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  transition: border-color var(--rst-duration) var(--rst-ease);
}
.rst-search-input:focus {
  outline: none;
  border-color: var(--rst-primary);
}

/* ---------- Cart Summary Bar ---------- */
.rst-cart-bar {
  position: fixed;
  bottom: 60px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 2rem);
  max-width: 440px;
  background: var(--rst-primary);
  color: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  padding: var(--rst-space-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: var(--rst-shadow-xl);
  z-index: 90;
  cursor: pointer;
  transition: transform var(--rst-duration) var(--rst-ease);
  -webkit-tap-highlight-color: transparent;
}
.rst-cart-bar:active { transform: translateX(-50%) scale(.98); }
.rst-cart-bar-left { display: flex; align-items: center; gap: var(--rst-space-sm); }
.rst-cart-bar-count {
  background: var(--rst-gold);
  color: var(--rst-white);
  width: 28px;
  height: 28px;
  border-radius: var(--rst-radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
}
.rst-cart-bar-label { font-weight: 600; font-size: 0.9rem; }
.rst-cart-bar-total { font-weight: 700; font-size: 1.1rem; font-family: var(--rst-font-heading); }

/* ---------- Order Status Steps ---------- */
.rst-status-steps {
  display: flex;
  justify-content: space-between;
  position: relative;
  padding: 0 var(--rst-space-md);
}
.rst-status-steps::before {
  content: '';
  position: absolute;
  top: 16px;
  left: calc(var(--rst-space-md) + 16px);
  right: calc(var(--rst-space-md) + 16px);
  height: 2px;
  background: var(--rst-border);
}
.rst-status-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rst-space-xs);
  position: relative;
  z-index: 1;
}
.rst-status-dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--rst-white);
  border: 2px solid var(--rst-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  color: var(--rst-text-lt);
  transition: all .3s var(--rst-ease);
}
.rst-status-step.active .rst-status-dot {
  background: var(--rst-primary);
  border-color: var(--rst-primary);
  color: var(--rst-white);
}
.rst-status-step.done .rst-status-dot {
  background: var(--rst-success);
  border-color: var(--rst-success);
  color: var(--rst-white);
}
.rst-status-label {
  font-size: 0.65rem;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--rst-text-lt);
}
.rst-status-step.active .rst-status-label { color: var(--rst-primary); font-weight: 700; }
.rst-status-step.done .rst-status-label { color: var(--rst-success); }

/* ---------- Stars / Reviews ---------- */
.rst-stars { display: flex; gap: 2px; }
.rst-stars i { color: var(--rst-gold); font-size: 0.9rem; }
.rst-stars i.empty { color: var(--rst-border); }
.rst-stars-input { display: flex; gap: 4px; }
.rst-stars-input i {
  font-size: 1.8rem;
  color: var(--rst-border);
  cursor: pointer;
  transition: color .15s;
  -webkit-tap-highlight-color: transparent;
}
.rst-stars-input i.active { color: var(--rst-gold); }

/* ---------- Reservation Calendar ---------- */
.rst-date-slots {
  display: flex;
  gap: var(--rst-space-sm);
  overflow-x: auto;
  padding: var(--rst-space-sm) 0;
  scrollbar-width: none;
}
.rst-date-slots::-webkit-scrollbar { display: none; }
.rst-date-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--rst-space-sm) var(--rst-space-md);
  border-radius: var(--rst-radius-md);
  border: 1.5px solid var(--rst-border);
  background: var(--rst-white);
  cursor: pointer;
  transition: all var(--rst-duration) var(--rst-ease);
  min-width: 60px;
  -webkit-tap-highlight-color: transparent;
}
.rst-date-slot .day { font-size: 0.7rem; text-transform: uppercase; color: var(--rst-text-lt); font-weight: 600; }
.rst-date-slot .num { font-size: 1.1rem; font-weight: 700; color: var(--rst-charcoal); }
.rst-date-slot.active {
  background: var(--rst-primary);
  border-color: var(--rst-primary);
}
.rst-date-slot.active .day,
.rst-date-slot.active .num { color: var(--rst-white); }

.rst-time-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--rst-space-sm);
}
.rst-time-slot {
  text-align: center;
  padding: var(--rst-space-sm);
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-md);
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all var(--rst-duration) var(--rst-ease);
  -webkit-tap-highlight-color: transparent;
}
.rst-time-slot.active {
  background: var(--rst-primary);
  border-color: var(--rst-primary);
  color: var(--rst-white);
}
.rst-time-slot.disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ---------- Utility Classes ---------- */
.rst-text-center { text-align: center; }
.rst-text-right  { text-align: right; }
.rst-text-sm     { font-size: 0.85rem; }
.rst-text-xs     { font-size: 0.75rem; }
.rst-text-muted  { color: var(--rst-text-lt); }
.rst-text-gold   { color: var(--rst-gold); }
.rst-text-primary{ color: var(--rst-primary); }
.rst-text-success{ color: var(--rst-success); }
.rst-text-danger { color: var(--rst-danger); }
.rst-fw-600      { font-weight: 600; }
.rst-fw-700      { font-weight: 700; }

.rst-flex        { display: flex; }
.rst-flex-col    { display: flex; flex-direction: column; }
.rst-flex-wrap   { flex-wrap: wrap; }
.rst-items-center{ align-items: center; }
.rst-justify-between { justify-content: space-between; }
.rst-gap-xs      { gap: var(--rst-space-xs); }
.rst-gap-sm      { gap: var(--rst-space-sm); }
.rst-gap-md      { gap: var(--rst-space-md); }
.rst-gap-lg      { gap: var(--rst-space-lg); }

.rst-mt-sm  { margin-top: var(--rst-space-sm); }
.rst-mt-md  { margin-top: var(--rst-space-md); }
.rst-mt-lg  { margin-top: var(--rst-space-lg); }
.rst-mb-sm  { margin-bottom: var(--rst-space-sm); }
.rst-mb-md  { margin-bottom: var(--rst-space-md); }
.rst-mb-lg  { margin-bottom: var(--rst-space-lg); }
.rst-p-md   { padding: var(--rst-space-md); }
.rst-p-lg   { padding: var(--rst-space-lg); }
.rst-px-md  { padding-left: var(--rst-space-md); padding-right: var(--rst-space-md); }

.rst-rounded-full { border-radius: var(--rst-radius-full); }
.rst-hidden       { display: none !important; }
.rst-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/* ---------- Skeleton Loading ---------- */
.rst-skeleton {
  background: linear-gradient(90deg, var(--rst-cream-dk) 25%, var(--rst-cream) 50%, var(--rst-cream-dk) 75%);
  background-size: 200% 100%;
  animation: rst-shimmer 1.5s infinite;
  border-radius: var(--rst-radius-sm);
}
@keyframes rst-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.rst-skeleton-text { height: 14px; margin-bottom: var(--rst-space-sm); }
.rst-skeleton-heading { height: 24px; width: 60%; margin-bottom: var(--rst-space-md); }
.rst-skeleton-img { width: 100%; aspect-ratio: 16/10; }
.rst-skeleton-circle { width: 48px; height: 48px; border-radius: 50%; }

/* ---------- KDS Specific (Admin - full screen) ---------- */
.rst-kds-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--rst-space-md);
  padding: var(--rst-space-md);
  height: calc(100vh - 60px);
}
.rst-kds-column {
  display: flex;
  flex-direction: column;
  gap: var(--rst-space-sm);
  overflow-y: auto;
}
.rst-kds-column-header {
  font-family: var(--rst-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  text-align: center;
  padding: var(--rst-space-sm);
  border-radius: var(--rst-radius-md);
  position: sticky;
  top: 0;
  z-index: 1;
}
.rst-kds-col-new    .rst-kds-column-header { background: var(--rst-warning-bg); color: var(--rst-warning); }
.rst-kds-col-prep   .rst-kds-column-header { background: #FFF7ED; color: #C2410C; }
.rst-kds-col-ready  .rst-kds-column-header { background: var(--rst-success-bg); color: var(--rst-success); }

.rst-kds-ticket {
  background: var(--rst-white);
  border-radius: var(--rst-radius-md);
  padding: var(--rst-space-md);
  box-shadow: var(--rst-shadow-sm);
  border-left: 4px solid var(--rst-warning);
}
.rst-kds-ticket.preparing { border-left-color: #C2410C; }
.rst-kds-ticket.ready     { border-left-color: var(--rst-success); }

.rst-kds-ticket-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--rst-space-sm);
}
.rst-kds-order-num {
  font-weight: 700;
  font-size: 1rem;
  color: var(--rst-charcoal);
}
.rst-kds-table-tag {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--rst-radius-full);
  background: var(--rst-cream-dk);
  color: var(--rst-text);
}
.rst-kds-item {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 0.9rem;
  border-bottom: 1px dashed var(--rst-border);
}
.rst-kds-item:last-child { border-bottom: none; }
.rst-kds-item-qty {
  font-weight: 700;
  color: var(--rst-primary);
  min-width: 28px;
}
.rst-kds-timer {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--rst-text-lt);
  margin-top: var(--rst-space-sm);
}
.rst-kds-timer.urgent { color: var(--rst-danger); }

/* Responsive KDS */
@media (max-width: 767px) {
  .rst-kds-grid {
    grid-template-columns: 1fr;
    height: auto;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .rst-kds-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ---------- Print Styles ---------- */
@media print {
  .rst-header, .rst-bottom-nav, .rst-cart-bar, .rst-toast-container { display: none !important; }
  body.rst-body { background: #fff; }
  .rst-main { padding-bottom: 0; }
}

/* ============================================================
   LANDING PAGE & PUBLIC PAGES
   ============================================================ */

/* ---------- Sections ---------- */
.rst-section {
  padding: var(--rst-space-xl, 3rem) 0;
}
.rst-section-alt {
  background: var(--rst-cream);
}

/* ---------- Hero ---------- */
.rst-hero {
  background: linear-gradient(135deg, var(--rst-primary) 0%, #0C2218 100%);
  color: var(--rst-white);
  padding: 3.5rem 0 3rem;
  text-align: center;
}
.rst-hero-img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  padding: 4rem 0 3.5rem;
}
.rst-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(12,34,24,0.55) 0%,
    rgba(27,67,50,0.45) 40%,
    rgba(12,34,24,0.65) 100%
  );
  z-index: 1;
}
[data-theme="dark"] .rst-hero-overlay {
  background: linear-gradient(
    180deg,
    rgba(8,20,14,0.62) 0%,
    rgba(12,31,23,0.52) 40%,
    rgba(8,20,14,0.72) 100%
  );
}
.rst-hero-title {
  font-family: var(--rst-font-heading);
  font-size: clamp(2.5rem, 8vw, 4rem);
  font-weight: 800;
  letter-spacing: 0.04em;
  margin: var(--rst-space-xs) 0 var(--rst-space-sm);
  color: var(--rst-white);
}
.rst-hero-tagline {
  font-size: 1.05rem;
  opacity: 0.9;
  max-width: 420px;
  margin: 0 auto;
  line-height: 1.6;
}
.rst-hero-content { padding: 0 var(--rst-space-md); }
.rst-hero-actions { display: flex; gap: var(--rst-space-sm); justify-content: center; flex-wrap: wrap; }
.rst-hero-rating { justify-content: center; }

/* ---------- Featured Grid ---------- */
.rst-featured-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-md);
}
@media (min-width: 480px) {
  .rst-featured-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 768px) {
  .rst-featured-grid { grid-template-columns: repeat(3, 1fr); }
}
.rst-featured-card { overflow: hidden; }
.rst-featured-card .rst-card-img {
  height: 180px;
  background-size: cover;
  background-position: center;
}
.rst-featured-card .rst-card-img-placeholder {
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rst-cream);
  font-size: 2.5rem;
  color: var(--rst-text-lt);
}

/* ---------- Category Grid ---------- */
.rst-cat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--rst-space-md);
}
@media (min-width: 480px) {
  .rst-cat-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 768px) {
  .rst-cat-grid { grid-template-columns: repeat(4, 1fr); }
}
.rst-cat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rst-space-sm);
  padding: var(--rst-space-lg) var(--rst-space-md);
  border-radius: var(--rst-radius-xl);
  background: var(--rst-white);
  border: 1px solid var(--rst-border);
  box-shadow: var(--rst-shadow-sm);
  text-decoration: none;
  color: var(--rst-text);
  transition: all 0.3s var(--rst-ease);
  -webkit-tap-highlight-color: transparent;
  position: relative;
  overflow: hidden;
}
.rst-cat-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(197,165,114,0.06) 0%, transparent 60%);
  opacity: 0;
  transition: opacity 0.3s;
}
.rst-cat-card:hover::before { opacity: 1; }
.rst-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--rst-shadow-lg);
  border-color: var(--rst-gold-lt);
}
.rst-cat-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--rst-primary), var(--rst-primary-dk));
  color: var(--rst-gold-lt);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  box-shadow: 0 4px 12px rgba(27,67,50,0.25);
  transition: transform 0.3s, box-shadow 0.3s;
}
.rst-cat-card:hover .rst-cat-icon {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(27,67,50,0.35);
}
.rst-cat-name {
  font-family: var(--rst-font-heading);
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
  color: var(--rst-charcoal);
}
.rst-cat-card .rst-text-muted {
  font-size: 0.8rem;
}
[data-theme="dark"] .rst-cat-card {
  background: linear-gradient(160deg, #132D21 0%, #0F2419 100%);
  border-color: rgba(212,179,115,0.08);
}
[data-theme="dark"] .rst-cat-card:hover {
  border-color: rgba(212,179,115,0.2);
  box-shadow: 0 8px 24px rgba(0,0,0,0.4), 0 0 0 1px rgba(212,179,115,0.06);
}
[data-theme="dark"] .rst-cat-icon {
  background: linear-gradient(135deg, #1B5E3F, #143528);
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
}

/* ---------- Steps (How It Works) ---------- */
.rst-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--rst-space-md);
}
@media (min-width: 768px) {
  .rst-steps-grid { grid-template-columns: repeat(4, 1fr); }
}
.rst-step-card {
  text-align: center;
  padding: var(--rst-space-lg) var(--rst-space-md);
  position: relative;
}
.rst-step-num {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  font-family: var(--rst-font-heading);
  font-size: 2rem;
  font-weight: 800;
  color: var(--rst-cream-dk, #EDE4D7);
  line-height: 1;
}
.rst-step-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--rst-cream);
  color: var(--rst-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  margin: 0 auto var(--rst-space-md);
}
.rst-step-card h3 {
  font-family: var(--rst-font-heading);
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: var(--rst-space-xs);
}

/* ---------- Reviews Grid ---------- */
.rst-reviews-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-md);
}
@media (min-width: 480px) {
  .rst-reviews-grid { grid-template-columns: repeat(2, 1fr); }
}
.rst-review-card {
  background: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  padding: var(--rst-space-lg);
  box-shadow: var(--rst-shadow-sm);
}
.rst-review-card.rst-review-featured {
  border: 1px solid var(--rst-gold);
  box-shadow: 0 4px 14px rgba(212, 175, 55, 0.15);
  position: relative;
}
.rst-review-photos {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.rst-review-photo {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: var(--rst-radius-md);
  border: 1px solid rgba(0,0,0,0.08);
}

/* ---------- Info Grid (Hours + Contact) ---------- */
.rst-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-lg);
}
@media (min-width: 640px) {
  .rst-info-grid { grid-template-columns: repeat(2, 1fr); }
}
.rst-info-card {
  background: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  padding: var(--rst-space-lg);
  box-shadow: var(--rst-shadow-sm);
}
.rst-info-card .rst-h3 {
  margin-bottom: var(--rst-space-md);
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
}
.rst-hours-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.rst-hours-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--rst-space-sm) 0;
  border-bottom: 1px solid var(--rst-border);
  font-size: 0.9rem;
}
.rst-hours-item:last-child { border-bottom: none; }
.rst-hours-today {
  background: rgba(114, 47, 55, 0.05);
  padding: var(--rst-space-sm);
  border-radius: var(--rst-radius-sm);
  font-weight: 600;
}
.rst-hours-day { color: var(--rst-text); font-weight: 500; }
.rst-hours-time { color: var(--rst-text-lt); }
.rst-contact-info p {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  margin-bottom: var(--rst-space-sm);
  font-size: 0.9rem;
}
.rst-contact-info a {
  color: var(--rst-primary);
  text-decoration: none;
}

/* ---------- Menu Page Grid ---------- */
.rst-menu-grid {
  display: flex;
  flex-direction: column;
  gap: var(--rst-space-md);
}

/* ---------- Specials Grid ---------- */
.rst-specials-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-md);
}

/* ---------- Payment Overlay ---------- */
.rst-pay-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.7);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 200;
  backdrop-filter: blur(4px);
}
.rst-pay-overlay.active { display: flex; }
.rst-pay-box {
  background: var(--rst-white);
  border-radius: var(--rst-radius-xl);
  padding: var(--rst-space-xl, 2.5rem) var(--rst-space-lg);
  text-align: center;
  max-width: 360px;
  width: calc(100% - 2rem);
  animation: rst-slideUp .3s var(--rst-ease);
}
.rst-pay-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin: 0 auto var(--rst-space-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
}
.rst-pay-icon.pending { background: #FEF3C7; color: #D97706; }
.rst-pay-icon.success { background: #D1FAE5; color: var(--rst-success); }
.rst-pay-icon.failed  { background: #FEE2E2; color: var(--rst-danger); }
.rst-pay-title {
  font-family: var(--rst-font-heading);
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: var(--rst-space-xs);
}
.rst-pay-sub {
  color: var(--rst-text-lt);
  font-size: 0.9rem;
  margin-bottom: var(--rst-space-lg);
}

/* ---------- Order Tracking Page ---------- */
.rst-track-card {
  background: var(--rst-white);
  border-radius: var(--rst-radius-lg);
  box-shadow: var(--rst-shadow-sm);
  overflow: hidden;
}
.rst-track-header {
  background: var(--rst-primary);
  color: var(--rst-white);
  padding: var(--rst-space-lg);
  text-align: center;
}
.rst-track-body {
  padding: var(--rst-space-lg);
}
.rst-track-items {
  list-style: none;
  padding: 0;
  margin: 0;
}
.rst-track-items li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--rst-space-sm) 0;
  border-bottom: 1px solid var(--rst-border);
  font-size: 0.9rem;
}
.rst-track-items li:last-child { border-bottom: none; }

/* ============================================================
   PWA Install Bar
   ============================================================ */
.rst-install-bar {
  position: fixed;
  bottom: calc(70px + env(safe-area-inset-bottom, 0px));
  left: var(--rst-space-sm);
  right: var(--rst-space-sm);
  z-index: 150;
  background: linear-gradient(135deg, color-mix(in srgb, var(--rst-primary) 88%, #0F1F18) 0%, color-mix(in srgb, var(--rst-primary-dk) 90%, #0A1812) 100%);
  color: #F6F1E8;
  border: 1px solid color-mix(in srgb, var(--rst-gold) 32%, transparent);
  border-radius: var(--rst-radius-xl);
  padding: var(--rst-space-sm) var(--rst-space-md);
  animation: rst-slideUp .32s var(--rst-ease);
  box-shadow: 0 14px 28px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.2);
  backdrop-filter: blur(8px);
}
.rst-install-inner {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  max-width: 540px;
  margin: 0 auto;
  font-size: 0.86rem;
}
.rst-install-brand img {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.rst-install-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.rst-install-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: #FFF6E7;
  line-height: 1.2;
}
.rst-install-sub {
  font-size: 0.76rem;
  color: rgba(255, 246, 231, 0.85);
  line-height: 1.3;
}
.rst-install-btn {
  flex-shrink: 0;
  min-height: 38px;
  border: none;
  border-radius: var(--rst-radius-md);
  padding: 0.5rem 0.95rem;
  font-size: 0.82rem;
  font-weight: 700;
  background: linear-gradient(135deg, var(--rst-gold-lt), var(--rst-gold));
  color: #1E2A1E;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(0,0,0,.2);
}
.rst-install-btn:hover {
  filter: brightness(1.04);
}
.rst-install-dismiss {
  background: none;
  border: none;
  color: rgba(255,255,255,.82);
  font-size: 1.15rem;
  cursor: pointer;
  padding: 0 6px;
  line-height: 1;
}
@media (max-width: 560px) {
  .rst-install-inner {
    flex-wrap: wrap;
    gap: 8px;
  }
  .rst-install-copy {
    min-width: calc(100% - 54px);
    order: 1;
  }
  .rst-install-brand { order: 0; }
  .rst-install-btn {
    order: 2;
    width: calc(100% - 34px);
  }
  .rst-install-dismiss {
    order: 3;
    margin-left: auto;
  }
}

/* ============================================================
   Real-time Connection Indicator
   ============================================================ */
.rst-rt-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  color: var(--rst-text-lt);
  padding: 2px 8px;
  border-radius: var(--rst-radius-full);
  background: var(--rst-cream-dk);
}
.rst-rt-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rst-success);
  animation: rst-pulse 2s infinite;
}
.rst-rt-badge.offline::before { background: var(--rst-danger); animation: none; }

@keyframes rst-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* ============================================================
   Enhanced Mobile Responsiveness
   ============================================================ */

/* Touch-friendly tap targets (min 44px) */
.rst-btn,
.rst-nav-item,
.rst-category-pill,
.rst-modal-close,
input.rst-input,
select.rst-select,
textarea.rst-textarea {
  min-height: 44px;
}

/* Smooth touch scrolling for horizontal category pills */
.rst-categories {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  scroll-padding: 0 var(--rst-space-md);
}
.rst-categories::-webkit-scrollbar { display: none; }
.rst-category-pill { scroll-snap-align: start; }

/* Better text sizes on small screens */
@media (max-width: 374px) {
  body.rst-body { font-size: 0.9375rem; }
  .rst-h1 { font-size: 1.5rem; }
  .rst-h2 { font-size: 1.25rem; }
  .rst-h3 { font-size: 1.1rem; }
  .rst-nav-item { font-size: 0.6rem; padding: var(--rst-space-xs) 4px; }
  .rst-nav-item i { font-size: 1rem; }
  .rst-bottom-nav-inner { padding: 0 var(--rst-space-xs); }
  .rst-logo-text { font-size: 1rem; }
  .rst-logo-tagline { font-size: 0.55rem; }
  .rst-logo img { height: 32px; }
  .rst-header-inner { padding: var(--rst-space-xs) var(--rst-space-sm); }
  .rst-menu-card-img { width: 80px; min-height: 80px; }
  .rst-hero { padding: 2.5rem 0 2rem; }
  .rst-hero-img { padding: 2.5rem 0 2rem; }
  .rst-hero-title { font-size: 1.75rem; }
  .rst-hero-tagline { font-size: 0.9rem; }
  .rst-hero-actions { flex-direction: column; align-items: stretch; }
  .rst-hero-actions .rst-btn { width: 100%; justify-content: center; }
}

/* Mid-range phones (375-479px) */
@media (min-width: 375px) and (max-width: 479px) {
  .rst-menu-card-body { padding: var(--rst-space-sm); }
  .rst-hero-title { font-size: 2rem; }
  .rst-hero-tagline { font-size: 0.95rem; }
  .rst-hero-actions { flex-wrap: wrap; justify-content: center; }
  .rst-hero-actions .rst-btn { font-size: 0.85rem; padding: 10px 18px; }
}

/* Landscape phones — two-column menu grid */
@media (min-width: 480px) and (max-width: 767px) {
  .rst-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--rst-space-sm);
  }
  .rst-specials-grid { grid-template-columns: repeat(2, 1fr); gap: var(--rst-space-sm); }
  .rst-menu-card { flex-direction: column; }
  .rst-menu-card-img {
    width: 100%;
    height: 120px;
    min-height: auto;
    border-radius: var(--rst-radius-lg) var(--rst-radius-lg) 0 0;
  }
  .rst-featured-grid { grid-template-columns: repeat(2, 1fr); }
  .rst-specials-grid { grid-template-columns: repeat(2, 1fr); }
  .rst-steps-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Tablets and above — expand layouts */
@media (min-width: 768px) {
  .rst-bottom-nav-inner { max-width: 600px; }
  .rst-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--rst-space-md);
  }
  .rst-menu-card { flex-direction: column; }
  .rst-menu-card-img {
    width: 100%;
    height: 160px;
    min-height: auto;
    border-radius: var(--rst-radius-lg) var(--rst-radius-lg) 0 0;
  }
  .rst-hero { padding: var(--rst-space-2xl) 0; }
  .rst-hero-title { font-size: 3rem; }
  .rst-hero-tagline { font-size: 1.2rem; }
  .rst-section { padding: var(--rst-space-2xl) 0; }
  .rst-track-card { max-width: 600px; margin-left: auto; margin-right: auto; }
  .rst-pay-box { padding: var(--rst-space-2xl); }
}

/* Desktop: 3-column layouts */
@media (min-width: 1024px) {
  .rst-menu-grid { grid-template-columns: repeat(3, 1fr); }
  .rst-specials-grid { grid-template-columns: repeat(2, 1fr); }
  .rst-featured-grid { grid-template-columns: repeat(3, 1fr); }
  .rst-cat-grid { grid-template-columns: repeat(4, 1fr); }
  .rst-reviews-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- Skeleton Shimmer (loading states) ---------- */
.rst-skeleton {
  background: linear-gradient(90deg, var(--rst-cream-dk) 25%, var(--rst-cream) 50%, var(--rst-cream-dk) 75%);
  background-size: 200% 100%;
  animation: rst-shimmer 1.5s infinite;
  border-radius: var(--rst-radius-md);
}
@keyframes rst-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.rst-skeleton-card { height: 100px; margin-bottom: var(--rst-space-md); }
.rst-skeleton-line { height: 14px; margin-bottom: var(--rst-space-sm); width: 80%; }
.rst-skeleton-line.short { width: 50%; }

/* ---------- Safe Area (notched phones) ---------- */
@supports (padding: env(safe-area-inset-bottom)) {
  .rst-main { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  .rst-cart-bar { bottom: calc(56px + env(safe-area-inset-bottom)); }
}

/* ---------- Haptic Press Feedback ---------- */
.rst-btn:active,
.rst-nav-item:active,
.rst-menu-card:active,
.rst-category-pill:active {
  transform: scale(0.97);
  transition: transform 0.05s;
}

/* ---------- Toast Animation ---------- */
.rst-toast { animation: rst-slideIn .3s var(--rst-ease); }
@keyframes rst-slideIn {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* ---------- Reduced Motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- PayBill Instructions Card ---------- */
.rst-paybill-card {
  background: var(--rst-cream-dk);
  border: 1.5px solid var(--rst-gold);
  border-radius: var(--rst-radius-lg);
  overflow: hidden;
}
/* Ensure card stands out inside SweetAlert (especially dark mode) */
.swal2-popup .rst-paybill-card {
  background: color-mix(in srgb, var(--rst-gold) 8%, var(--rst-cream-dk));
  border: 1.5px solid color-mix(in srgb, var(--rst-gold) 40%, transparent);
}
.rst-paybill-header {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  padding: var(--rst-space-md);
  background: linear-gradient(135deg, color-mix(in srgb, var(--rst-gold) 15%, transparent), transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--rst-gold) 25%, transparent);
}
.rst-paybill-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--rst-gold), var(--rst-gold-dk));
  color: var(--rst-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.rst-paybill-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rst-gold);
}
.rst-paybill-subtitle {
  font-size: 0.75rem;
  color: var(--rst-text-lt);
  margin-top: 1px;
}
.rst-paybill-steps {
  padding: var(--rst-space-sm) var(--rst-space-md) var(--rst-space-md);
  display: flex;
  flex-direction: column;
  gap: var(--rst-space-sm);
}
.rst-paybill-step {
  display: flex;
  align-items: flex-start;
  gap: var(--rst-space-sm);
  font-size: 0.85rem;
  color: var(--rst-text);
  line-height: 1.45;
}
.rst-paybill-step-num {
  width: 22px;
  height: 22px;
  min-width: 22px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rst-gold) 18%, transparent);
  color: var(--rst-gold);
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}
.rst-paybill-value {
  color: var(--rst-gold);
  cursor: pointer;
  letter-spacing: 0.5px;
  user-select: all;
  position: relative;
  transition: color .2s;
}
.rst-paybill-value:hover { color: var(--rst-gold-lt); }
.rst-paybill-copy-icon {
  font-size: 0.7rem;
  opacity: 0.5;
  margin-left: 2px;
  transition: opacity .2s;
}
.rst-paybill-value:hover .rst-paybill-copy-icon { opacity: 1; }
.rst-paybill-value.copied { color: var(--rst-success); }
.rst-paybill-value.copied::after {
  content: 'Copied!';
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--rst-success);
  background: var(--rst-success-bg);
  padding: 2px 8px;
  border-radius: 4px;
  pointer-events: none;
  white-space: nowrap;
  animation: rst-fade-in .15s ease;
}
@keyframes rst-fade-in { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* ---------- Receipt Code Section (inside paybill card) ---------- */
.rst-receipt-section {
  padding: 0 var(--rst-space-md) var(--rst-space-md);
}
.rst-receipt-divider {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  margin: var(--rst-space-sm) 0;
  font-size: .72rem;
  color: var(--rst-text-lt);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.rst-receipt-divider::before,
.rst-receipt-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: color-mix(in srgb, var(--rst-gold) 30%, transparent);
}
.rst-receipt-label {
  font-size: .82rem;
  color: var(--rst-text-lt);
  margin-bottom: 6px;
}
.rst-receipt-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.rst-receipt-input {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-md);
  background: var(--rst-cream);
  color: var(--rst-charcoal);
  font-family: var(--rst-font-body);
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  outline: none;
  transition: border-color .2s;
}
.rst-receipt-input:focus {
  border-color: var(--rst-gold);
}
.rst-receipt-input::placeholder {
  text-transform: none;
  letter-spacing: 0;
  color: var(--rst-text-lt);
  opacity: .6;
}
.rst-receipt-submit {
  flex-shrink: 0;
  padding: 10px 16px;
  border: none;
  border-radius: var(--rst-radius-md);
  background: var(--rst-gold);
  color: var(--rst-cream);
  font-family: var(--rst-font-body);
  font-weight: 600;
  font-size: .85rem;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s, transform .1s;
}
.rst-receipt-submit:hover { background: var(--rst-gold-dk); }
.rst-receipt-submit:active { transform: scale(.97); }
.rst-receipt-msg {
  font-size: .78rem;
  min-height: 16px;
  margin-top: 4px;
}
@media (max-width: 400px) {
  .rst-receipt-row { flex-direction: column; }
  .rst-receipt-submit { width: 100%; text-align: center; }
}

/* ---------- Verify Row (SweetAlert modals) ---------- */
.rst-verify-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.rst-verify-row .swal2-input {
  flex: 1;
  min-width: 0;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.rst-verify-btn {
  flex-shrink: 0;
  font-size: .85rem !important;
  padding: 8px 14px !important;
  margin: 0 !important;
  white-space: nowrap;
}
@media (max-width: 400px) {
  .rst-verify-row {
    flex-direction: column;
  }
  .rst-verify-row .swal2-input {
    width: 100%;
  }
  .rst-verify-btn {
    width: 100%;
    text-align: center;
  }
}

/* ============================================================
   Dark Theme — Deep Emerald Green & Gold
   Inspired by rich marble textures with golden accents
   ============================================================ */
body.rst-dark,
[data-theme="dark"] {
  --rst-cream:       #0C1F17;
  --rst-cream-dk:    #122B1F;
  --rst-white:       #0F2419;
  --rst-charcoal:    #F0E8D8;
  --rst-dark:        #E8DFC8;
  --rst-text:        #C8BFAC;
  --rst-text-lt:     #8A9B8F;
  --rst-border:      #1E3A2D;
  --rst-primary:     #2D8B5E;
  --rst-primary-lt:  #3DA472;
  --rst-primary-dk:  #1F6B45;
  --rst-gold:        #D4B373;
  --rst-gold-lt:     #E2C68E;
  --rst-gold-dk:     #B89850;
  --rst-success-bg:  #0D2818;
  --rst-warning-bg:  #2A1F05;
  --rst-danger-bg:   #2D0F0F;
  --rst-info-bg:     #0D1A2D;
  --rst-shadow-sm:   0 1px 2px rgba(0,0,0,.3);
  --rst-shadow-md:   0 4px 6px -1px rgba(0,0,0,.35), 0 2px 4px -2px rgba(0,0,0,.2);
  --rst-shadow-lg:   0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.2);
  --rst-shadow-xl:   0 20px 25px -5px rgba(0,0,0,.45), 0 8px 10px -6px rgba(0,0,0,.2);
  color-scheme: dark;
}

body.rst-dark .rst-header,
[data-theme="dark"] .rst-header {
  background: rgba(12, 31, 23, .95);
  border-color: var(--rst-border);
}

body.rst-dark .rst-bottom-nav,
[data-theme="dark"] .rst-bottom-nav {
  background: rgba(12, 31, 23, .97);
  border-color: var(--rst-border);
}

body.rst-dark .rst-card,
[data-theme="dark"] .rst-card {
  background: #122B1F;
  border-color: var(--rst-border);
}

body.rst-dark .rst-input,
body.rst-dark .rst-select,
body.rst-dark .rst-textarea,
[data-theme="dark"] .rst-input,
[data-theme="dark"] .rst-select,
[data-theme="dark"] .rst-textarea {
  background: #162F23;
  border-color: var(--rst-border);
  color: var(--rst-text);
}

body.rst-dark img,
[data-theme="dark"] img {
  opacity: 0.92;
}

body.rst-dark .rst-pay-overlay .rst-pay-box,
[data-theme="dark"] .rst-pay-overlay .rst-pay-box {
  background: #122B1F;
}

body.rst-dark .rst-install-bar,
[data-theme="dark"] .rst-install-bar {
  background: linear-gradient(135deg, rgba(16, 45, 34, 0.95) 0%, rgba(11, 33, 24, 0.97) 100%);
  border-color: rgba(212, 179, 115, 0.35);
}

body.rst-dark .rst-site-footer,
[data-theme="dark"] .rst-site-footer {
  background:
    radial-gradient(120% 90% at 50% -25%, rgba(212, 179, 115, 0.14), transparent 62%),
    linear-gradient(180deg, rgba(18, 43, 31, 0.52) 0%, rgba(12, 31, 23, 0.96) 100%);
  border-top-color: rgba(212, 179, 115, 0.25);
}
body.rst-dark .rst-site-footer-copy,
[data-theme="dark"] .rst-site-footer-copy {
  color: #EDE1CA;
}
body.rst-dark .rst-site-footer-power,
[data-theme="dark"] .rst-site-footer-power {
  color: #9DB0A3;
}
body.rst-dark .rst-site-footer-link,
[data-theme="dark"] .rst-site-footer-link {
  color: var(--rst-gold-lt);
  border-bottom-color: rgba(212, 179, 115, 0.65);
}

body.rst-dark .rst-hero,
[data-theme="dark"] .rst-hero {
  background-color: #0C1F17;
}
body.rst-dark .rst-hero-title,
[data-theme="dark"] .rst-hero-title {
  color: #FFFFFF;
}
body.rst-dark .rst-hero-tagline,
[data-theme="dark"] .rst-hero-tagline {
  color: rgba(255, 255, 255, 0.88);
}

/* ---------- Theme Toggle Button ---------- */
.rst-theme-toggle {
  background: none;
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rst-text);
  font-size: 1rem;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-theme-toggle:hover {
  background: var(--rst-cream-dk);
  color: var(--rst-gold);
}

/* ---------- Branch Switcher ---------- */
.rst-branch-switcher { position: relative; }
.rst-branch-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: none;
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  padding: 0 12px; height: 36px;
  color: var(--rst-text); font: inherit; font-size: .85rem; font-weight: 500;
  cursor: pointer; max-width: 200px;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-branch-btn:hover { background: var(--rst-cream-dk); color: var(--rst-gold); border-color: var(--rst-gold); }
.rst-branch-btn .rst-branch-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.rst-branch-btn .rst-branch-caret { font-size: .65rem; opacity: .7; transition: transform var(--rst-duration); }
.rst-branch-btn[aria-expanded="true"] .rst-branch-caret { transform: rotate(180deg); }
@media (max-width: 520px) {
  .rst-branch-btn .rst-branch-label { max-width: 80px; font-size: .8rem; }
}

.rst-branch-menu {
  position: absolute; top: calc(100% + 8px); right: 0;
  min-width: 240px; max-width: 320px;
  background: #ffffff; color: #1b3a2f;
  border: 1px solid rgba(27,67,50,.12);
  border-radius: var(--rst-radius-md);
  box-shadow: 0 12px 32px rgba(27,67,50,.22), 0 4px 12px rgba(0,0,0,.08);
  padding: 6px;
  z-index: 1080;
  animation: rst-slideUp .15s var(--rst-ease);
}
.rst-branch-menu[hidden] { display: none; }
.rst-branch-menu-head {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  color: #6c7a72; padding: 8px 10px 6px; font-weight: 600;
}
.rst-branch-item {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left;
  background: none; border: 0;
  padding: 10px 12px; border-radius: var(--rst-radius-sm);
  color: #1b3a2f; cursor: pointer; font: inherit;
  transition: background var(--rst-duration) var(--rst-ease);
}
.rst-branch-item:hover,
.rst-branch-item:focus-visible { background: rgba(212,175,55,.10); outline: none; }
.rst-branch-item.is-active { background: rgba(27,67,50,.08); color: #1b3a2f; font-weight: 600; }
.rst-branch-item-name { flex: 1 1 auto; font-weight: 600; font-size: .92rem; color: #1b3a2f; }
.rst-branch-item-meta { display: block; font-size: .75rem; color: #6c7a72; font-weight: 400; margin-top: 2px; }
.rst-branch-item-check { color: var(--rst-gold); font-size: .85rem; }

/* ---------- Cookie Consent ---------- */
.rst-cookie-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: var(--rst-charcoal);
  color: var(--rst-cream);
  padding: var(--rst-space-md) var(--rst-space-lg);
  padding-bottom: calc(var(--rst-space-md) + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -4px 20px rgba(0,0,0,.25);
  animation: rst-slideUp .4s var(--rst-ease);
}
body.rst-dark .rst-cookie-bar,
[data-theme="dark"] .rst-cookie-bar {
  background: #162F23;
  color: var(--rst-text);
}
.rst-cookie-inner {
  max-width: 720px;
  margin: 0 auto;
}
.rst-cookie-text {
  font-size: 0.85rem;
  line-height: 1.5;
  margin-bottom: var(--rst-space-sm);
}
.rst-cookie-text a { color: var(--rst-gold); text-decoration: underline; }
.rst-cookie-actions {
  display: flex;
  gap: var(--rst-space-sm);
  flex-wrap: wrap;
}
.rst-cookie-btn {
  padding: 0.5rem 1.25rem;
  border-radius: var(--rst-radius-full);
  border: none;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  min-height: 40px;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-cookie-accept {
  background: var(--rst-gold);
  color: var(--rst-charcoal);
}
.rst-cookie-decline {
  background: transparent;
  border: 1px solid rgba(255,255,255,.3);
  color: inherit;
}

/* ---------- Auth / Profile Modal ---------- */
.rst-modal-auth {
  max-width: 400px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.rst-modal-auth .rst-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--rst-cream-dk);
  color: var(--rst-text);
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.rst-modal-auth .rst-modal-close:hover {
  background: var(--rst-primary);
  color: #fff;
}
.rst-modal-auth-body {
  padding: var(--rst-space-lg) var(--rst-space-md) calc(var(--rst-space-md) + 70px);
  position: relative;
}
.rst-auth-tabs {
  display: flex;
  border-bottom: 2px solid var(--rst-border);
  margin-bottom: var(--rst-space-lg);
}
.rst-auth-tab {
  flex: 1;
  padding: var(--rst-space-sm) var(--rst-space-md);
  text-align: center;
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  border: none;
  background: none;
  color: var(--rst-text-lt);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-auth-tab.active {
  color: var(--rst-primary);
  border-bottom-color: var(--rst-primary);
}
.rst-auth-tab:hover:not(.active) {
  color: var(--rst-text);
  background: var(--rst-cream);
}
[data-theme="dark"] .rst-modal-auth .rst-modal-close {
  background: rgba(255,255,255,0.08);
  color: #C8BFAC;
}
[data-theme="dark"] .rst-modal-auth .rst-modal-close:hover {
  background: var(--rst-gold);
  color: #0C1F17;
}
[data-theme="dark"] .rst-auth-tab:hover:not(.active) {
  background: rgba(255,255,255,0.04);
}

/* ---------- Order History ---------- */
.rst-history-card {
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-lg);
  padding: var(--rst-space-md);
  margin-bottom: var(--rst-space-sm);
  background: var(--rst-white);
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-history-card:active { transform: scale(0.98); }
.rst-history-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--rst-space-xs);
}
.rst-history-items {
  font-size: 0.82rem;
  color: var(--rst-text-lt);
  margin-bottom: var(--rst-space-sm);
  line-height: 1.4;
}
.rst-history-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* ---------- Profile Dropdown ---------- */
.rst-profile-btn {
  background: var(--rst-cream-dk);
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rst-primary);
  font-size: 0.9rem;
  font-weight: 700;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-profile-btn:hover { background: var(--rst-primary); color: var(--rst-white); }

/* ---------- PWA Update Bar ---------- */
.rst-update-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  background: var(--rst-info);
  color: #fff;
  padding: var(--rst-space-sm) var(--rst-space-md);
  text-align: center;
  font-size: 0.85rem;
  font-weight: 600;
  animation: rst-slideDown .3s var(--rst-ease);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--rst-space-sm);
}
.rst-update-bar button {
  background: rgba(255,255,255,.2);
  border: 1px solid rgba(255,255,255,.4);
  color: #fff;
  padding: 4px 16px;
  border-radius: var(--rst-radius-full);
  font-weight: 600;
  font-size: 0.8rem;
  cursor: pointer;
}
@keyframes rst-slideDown {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}
@keyframes rst-slideUp {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE: Animations, Image Modal, Cart Badges, Tutorial, Homely
   ══════════════════════════════════════════════════════════════= */

/* ─── Scroll Reveal Animations ─── */
.rst-animate-in {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1), transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.rst-animate-in.rst-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Hero entrance */
.rst-fade-in-up {
  animation: rstFadeInUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes rstFadeInUp {
  from { opacity: 0; transform: translateY(32px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Hero warm overlay */
.rst-hero-animated::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 80%, rgba(114, 47, 55, .12) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 20%, rgba(181, 148, 72, .08) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}
.rst-hero-animated .rst-hero-content { position: relative; z-index: 1; }

/* ─── Menu Card Enhancements ─── */
.rst-menu-card {
  cursor: pointer;
  position: relative;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease;
}
.rst-menu-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.rst-menu-card:active {
  transform: scale(0.98);
}

/* In-cart indicator */
.rst-in-cart-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: var(--rst-primary);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 600;
  border-radius: var(--rst-radius-full);
  animation: rstBadgePop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.rst-in-cart-badge i { font-size: 0.55rem; }
.rst-menu-card.rst-in-cart {
  border-color: var(--rst-primary);
  box-shadow: inset 0 0 0 1px var(--rst-primary), 0 2px 8px rgba(114, 47, 55, .1);
}
@keyframes rstBadgePop {
  0% { transform: scale(0); }
  70% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* Image zoom button on card */
.rst-img-zoom-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: rgba(0,0,0,0.5);
  color: #fff;
  font-size: 0.8rem;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.2s, transform 0.2s;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
}
.rst-menu-card:hover .rst-img-zoom-btn { opacity: 1; }
.rst-img-zoom-btn:hover { transform: scale(1.15); background: rgba(0,0,0,0.7); }

/* Add button animation */
.rst-add-btn {
  transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
  white-space: nowrap;
}
.rst-add-btn.rst-added {
  background: #27ae60 !important;
  border-color: #27ae60 !important;
  transform: scale(1.05);
}
.rst-add-btn:active { transform: scale(0.92); }

/* ─── Detail Modal Enhanced ─── */
.rst-modal-detail { max-width: 440px; padding: 0; overflow: hidden; position: relative; }
.rst-modal-detail-scroll { overflow-y: auto; max-height: calc(90dvh - 0px); -webkit-overflow-scrolling: touch; }
.rst-modal-detail .rst-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  background: rgba(0,0,0,0.55);
  color: #fff;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
}
.rst-modal-detail .rst-modal-body { padding: 1.25rem; }
.rst-modal-detail-body { padding-bottom: calc(var(--rst-space-md) + 70px) !important; }
.rst-detail-img-wrap {
  width: 100%;
  height: 220px;
  overflow: hidden;
  position: relative;
}
.rst-detail-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: zoom-in;
  transition: transform 0.3s ease;
}
.rst-detail-img:hover { transform: scale(1.05); }
.rst-detail-action-bar {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  margin-top: var(--rst-space-md);
}
.rst-flex-1 { flex: 1; }

/* ─── Auth form elements ─── */
.rst-field-error {
  color: var(--rst-danger);
  font-size: 0.78rem;
  margin-top: 4px;
  min-height: 0;
  display: none;
}
.rst-field-error.visible { display: block; }
.rst-input.rst-input-error { border-color: var(--rst-danger); }
.rst-password-wrap {
  position: relative;
}
.rst-password-toggle {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--rst-text-lt);
  cursor: pointer;
  padding: 4px;
  font-size: 0.9rem;
}
.rst-checkbox-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
  cursor: pointer;
  color: var(--rst-text);
}
.rst-checkbox-wrap input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--rst-primary);
  cursor: pointer;
}
.rst-phone-prefix {
  background: var(--rst-cream-dk);
  padding: 0.5rem 0.75rem;
  border-radius: var(--rst-radius-md);
  font-weight: 600;
  font-size: 0.9rem;
  white-space: nowrap;
}
[data-theme="dark"] .rst-phone-prefix { background: rgba(255,255,255,0.08); }
[data-theme="dark"] .rst-password-toggle { color: rgba(255,255,255,0.5); }

/* ─── Image Lightbox ─── */
.rst-lightbox-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,0.92);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  backdrop-filter: blur(8px);
}
.rst-lightbox-overlay.active {
  opacity: 1;
  visibility: visible;
}
.rst-lightbox-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.15);
  color: #fff;
  font-size: 1.2rem;
  cursor: pointer;
  z-index: 1;
  transition: background 0.2s;
}
.rst-lightbox-close:hover { background: rgba(255,255,255,0.3); }
.rst-lightbox-img {
  max-width: 90vw;
  max-height: 80vh;
  object-fit: contain;
  border-radius: 8px;
  animation: rstLightboxIn 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes rstLightboxIn {
  from { transform: scale(0.85); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
.rst-lightbox-caption {
  color: rgba(255,255,255,0.8);
  font-size: 0.9rem;
  margin-top: 12px;
  font-family: 'Playfair Display', serif;
  letter-spacing: 0.3px;
}

/* ─── Featured Card Hover ─── */
.rst-featured-card {
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;
  overflow: hidden;
}
.rst-featured-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.15);
}
.rst-featured-card .rst-card-img {
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.rst-featured-card:hover .rst-card-img {
  transform: scale(1.06);
}

/* ─── Category Card Hover ─── */
.rst-cat-card {
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease, border-color 0.25s;
}
.rst-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  border-color: var(--rst-gold);
}
.rst-cat-card .rst-cat-icon {
  transition: transform 0.3s ease;
}
.rst-cat-card:hover .rst-cat-icon {
  transform: scale(1.15) rotate(-3deg);
}

/* ─── Step Card Hover ─── */
.rst-step-card {
  transition: transform 0.25s ease;
}
.rst-step-card:hover {
  transform: translateY(-4px);
}
.rst-step-card:hover .rst-step-icon {
  color: var(--rst-gold);
}

/* ─── Review Card Subtle Anim ─── */
.rst-review-card {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.rst-review-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* ─── Help Button ─── */
.rst-help-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--rst-border);
  background: transparent;
  color: var(--rst-text);
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.rst-help-btn:hover {
  border-color: var(--rst-gold);
  color: var(--rst-gold);
  transform: scale(1.1);
}
/* Pulse animation for first-time visitors */
.rst-help-btn.rst-pulse {
  animation: rstPulse 2s ease-in-out 3;
}
@keyframes rstPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(181, 148, 72, 0.4); }
  50% { box-shadow: 0 0 0 10px rgba(181, 148, 72, 0); }
}

/* ─── Tutorial Overlay ─── */
.rst-tutorial-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s;
}
.rst-tutorial-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

/* SVG backdrop with cut-out hole */
.rst-tutorial-backdrop-svg {
  position: fixed;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

/* Spotlight ring (animated border around target) */
.rst-tutorial-spotlight {
  position: fixed;
  z-index: 2;
  border-radius: 12px;
  border: 2px solid var(--rst-gold);
  box-shadow: 0 0 0 4px rgba(197, 165, 114, 0.25);
  transition: top 0.4s cubic-bezier(0.22, 1, 0.36, 1),
              left 0.4s cubic-bezier(0.22, 1, 0.36, 1),
              width 0.4s cubic-bezier(0.22, 1, 0.36, 1),
              height 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

/* Tooltip */
.rst-tutorial-tooltip {
  position: fixed;
  z-index: 3;
  background: var(--rst-bg, #fff);
  color: var(--rst-text, #1e1e1e);
  border-radius: 16px;
  padding: 20px 24px;
  width: calc(100vw - 32px);
  max-width: 340px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.05);
  pointer-events: auto;
  box-sizing: border-box;
  animation: rstTooltipIn 0.3s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes rstTooltipIn {
  from { opacity: 0; transform: translateY(8px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Arrow pointer */
.rst-tutorial-arrow {
  position: absolute;
  width: 16px;
  height: 16px;
  background: var(--rst-bg, #fff);
  transform: rotate(45deg);
  box-shadow: -2px -2px 4px rgba(0,0,0,0.06);
  z-index: -1;
}
.rst-tutorial-arrow[data-dir="down"] {
  bottom: -8px;
  left: 50%;
  margin-left: -8px;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.06);
}
.rst-tutorial-arrow[data-dir="up"] {
  top: -8px;
  left: 50%;
  margin-left: -8px;
}
.rst-tutorial-arrow[data-dir="left"] {
  left: -8px;
  top: 50%;
  margin-top: -8px;
}
.rst-tutorial-arrow[data-dir="right"] {
  right: -8px;
  top: 50%;
  margin-top: -8px;
  box-shadow: 2px -2px 4px rgba(0,0,0,0.06);
}

/* Step counter badge */
.rst-tutorial-step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--rst-primary);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  margin-right: 8px;
  flex-shrink: 0;
}

.rst-tutorial-tooltip-header {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
}

.rst-tutorial-tooltip-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--rst-primary);
}
.rst-tutorial-tooltip-desc {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--rst-text-lt, #666);
  margin-bottom: 16px;
}
.rst-tutorial-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.rst-tutorial-dots {
  display: flex;
  gap: 5px;
  flex-shrink: 0;
}
.rst-tutorial-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--rst-border, #ddd);
  transition: all 0.2s;
}
.rst-tutorial-dot.active {
  background: var(--rst-primary);
  width: 18px;
  border-radius: 4px;
}
.rst-tutorial-dot.done {
  background: var(--rst-gold);
}
.rst-tutorial-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.rst-tutorial-skip {
  padding: 7px 12px;
  border: none;
  background: transparent;
  color: var(--rst-text-lt, #999);
  font-size: 0.8rem;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s;
  white-space: nowrap;
}
.rst-tutorial-skip:hover { background: var(--rst-cream, #f5f5f5); }
.rst-tutorial-next {
  padding: 7px 16px;
  border: none;
  background: var(--rst-primary);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.rst-tutorial-next:hover { filter: brightness(1.1); }
.rst-tutorial-emoji {
  font-size: 2rem;
  margin-bottom: 8px;
  display: block;
}

/* Welcome card variant (center screen, no spotlight) */
.rst-tutorial-welcome {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 3;
  text-align: center;
  width: calc(100vw - 40px);
  max-width: 380px;
  padding: 28px 24px 20px;
  pointer-events: auto;
  box-sizing: border-box;
  animation: rstWelcomeIn 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes rstWelcomeIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.92); }
  to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

/* ─── Tutorial responsive ─── */
@media (max-width: 480px) {
  .rst-tutorial-tooltip {
    width: calc(100vw - 24px);
    max-width: none;
    padding: 16px 18px;
    border-radius: 14px;
  }
  .rst-tutorial-tooltip-title { font-size: 0.95rem; }
  .rst-tutorial-tooltip-desc { font-size: 0.82rem; margin-bottom: 12px; }
  .rst-tutorial-footer { gap: 4px; }
  .rst-tutorial-skip { padding: 6px 10px; font-size: 0.75rem; }
  .rst-tutorial-next { padding: 6px 12px; font-size: 0.78rem; }
  .rst-tutorial-step-badge { width: 20px; height: 20px; font-size: 0.65rem; margin-right: 6px; }

  .rst-tutorial-welcome {
    width: calc(100vw - 28px);
    padding: 22px 18px 16px;
  }
  .rst-tutorial-welcome .rst-tutorial-emoji { font-size: 1.6rem; }
  .rst-tutorial-welcome .rst-tutorial-tooltip-title { font-size: 1rem; }
  .rst-tutorial-welcome .rst-tutorial-tooltip-desc { font-size: 0.82rem; margin-bottom: 10px; }
  .rst-tutorial-welcome .rst-tutorial-footer { flex-wrap: wrap; justify-content: center; gap: 6px; }
  .rst-tutorial-welcome .rst-tutorial-dots { width: 100%; justify-content: center; }
  .rst-tutorial-welcome .rst-tutorial-actions { width: 100%; justify-content: center; }
}
@media (max-width: 360px) {
  .rst-tutorial-tooltip { padding: 14px; }
  .rst-tutorial-welcome { padding: 18px 14px 14px; }
  .rst-tutorial-dot { width: 6px; height: 6px; }
  .rst-tutorial-dot.active { width: 14px; }
}

/* ─── Tutorial dark theme ─── */
[data-theme="dark"] .rst-tutorial-tooltip {
  background: #122B1F;
  color: #E8DFC8;
  box-shadow: 0 12px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(212,179,115,0.1);
}
[data-theme="dark"] .rst-tutorial-arrow { background: #122B1F; }
[data-theme="dark"] .rst-tutorial-tooltip-desc { color: #8A9B8F; }
[data-theme="dark"] .rst-tutorial-skip:hover { background: #1E3A2D; }
[data-theme="dark"] .rst-tutorial-spotlight {
  border-color: var(--rst-gold);
  box-shadow: 0 0 0 4px rgba(212, 179, 115, 0.15);
}

/* ─── Order Type Selector ─── */
.rst-order-type-wrap {
  display: flex;
  gap: var(--rst-space-sm);
  margin-bottom: var(--rst-space-md);
}
.rst-order-type-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rst-space-xs);
  padding: var(--rst-space-md) var(--rst-space-sm);
  border: 2px solid var(--rst-border);
  border-radius: var(--rst-radius-lg);
  cursor: pointer;
  transition: all 0.25s var(--rst-ease);
  background: var(--rst-white);
  text-align: center;
}
.rst-order-type-card:hover {
  border-color: var(--rst-gold);
}
.rst-order-type-card.active {
  border-color: var(--rst-primary);
  background: var(--rst-cream);
  box-shadow: inset 0 0 0 1px var(--rst-primary);
}
.rst-order-type-card .rst-type-icon {
  font-size: 1.4rem;
  color: var(--rst-text-lt);
  transition: color 0.2s;
}
.rst-order-type-card.active .rst-type-icon {
  color: var(--rst-primary);
}
.rst-order-type-card .rst-type-label {
  font-weight: 600;
  font-size: 0.9rem;
}
.rst-order-type-card .rst-type-desc {
  font-size: 0.75rem;
  color: var(--rst-text-lt);
  line-height: 1.3;
}
.rst-table-info-banner {
  display: flex;
  align-items: center;
  gap: var(--rst-space-sm);
  padding: var(--rst-space-md);
  border-radius: var(--rst-radius-md);
  font-size: 0.85rem;
  margin-bottom: var(--rst-space-md);
  line-height: 1.4;
}
.rst-table-info-banner.rst-info-blue {
  background: var(--rst-info-bg);
  color: var(--rst-info);
  border: 1px solid rgba(59, 130, 246, 0.2);
}
.rst-table-info-banner.rst-info-green {
  background: var(--rst-success-bg);
  color: var(--rst-success);
  border: 1px solid rgba(34, 197, 94, 0.2);
}
.rst-table-info-banner.rst-info-gold {
  background: #FEF9EF;
  color: #92710C;
  border: 1px solid rgba(181, 148, 72, 0.2);
}
.rst-reservation-field {
  transition: max-height 0.3s ease, opacity 0.3s ease;
  overflow: hidden;
}
.rst-reservation-field.rst-collapsed {
  max-height: 0;
  opacity: 0;
  margin: 0;
}
.rst-reservation-field.rst-expanded {
  max-height: 200px;
  opacity: 1;
}
[data-theme="dark"] .rst-order-type-card {
  background: var(--rst-dark);
  border-color: rgba(255,255,255,0.06);
}
[data-theme="dark"] .rst-order-type-card.active {
  background: rgba(45, 139, 94, 0.15);
}
[data-theme="dark"] .rst-table-info-banner.rst-info-gold {
  background: rgba(212, 179, 115, 0.08);
  color: var(--rst-gold);
}

/* ─── QR Scanner & Table Select ─── */
.rst-fab-table {
  position: fixed;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 90;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 2px solid var(--rst-gold);
  background: var(--rst-primary);
  color: #fff;
  font-size: 1.1rem;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
.rst-fab-table:hover { transform: translateY(-50%) scale(1.08); box-shadow: 0 6px 24px rgba(0,0,0,0.35); }
.rst-fab-table-inner { display: flex; align-items: center; justify-content: center; }
.rst-fab-table-num { font-weight: 800; font-size: 0.85rem; letter-spacing: 1px; }

.rst-table-select-modal {
  max-width: 420px;
  width: 94%;
}
.rst-table-select-body {
  padding: var(--rst-space-md) var(--rst-space-lg) var(--rst-space-lg);
}

/* Tab bar */
.rst-tab-bar {
  display: flex;
  background: var(--rst-cream-dk);
  border-radius: var(--rst-radius-md);
  padding: 3px;
  gap: 3px;
}
.rst-tab {
  flex: 1;
  padding: 0.5rem 0.75rem;
  border: none;
  background: transparent;
  border-radius: calc(var(--rst-radius-md) - 2px);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--rst-text-lt);
  cursor: pointer;
  transition: all 0.2s;
}
.rst-tab.active {
  background: var(--rst-white);
  color: var(--rst-charcoal);
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.rst-tab i { margin-right: 4px; }

/* QR Reader */
.rst-qr-reader-wrap {
  position: relative;
  width: 100%;
  max-width: 280px;
  margin: 0 auto;
  border-radius: var(--rst-radius-lg);
  overflow: hidden;
}
.rst-qr-reader {
  width: 100%;
  aspect-ratio: 1;
  background: #0a0a0a;
  border-radius: var(--rst-radius-lg);
  overflow: hidden;
}
.rst-qr-reader video { border-radius: var(--rst-radius-lg); }
.rst-qr-corners {
  position: absolute;
  inset: 20px;
  pointer-events: none;
}
.rst-qr-corner {
  position: absolute;
  width: 24px;
  height: 24px;
  border-color: var(--rst-gold);
  border-style: solid;
  border-width: 0;
}
.rst-qr-corner.tl { top: 0; left: 0; border-top-width: 3px; border-left-width: 3px; border-radius: 4px 0 0 0; }
.rst-qr-corner.tr { top: 0; right: 0; border-top-width: 3px; border-right-width: 3px; border-radius: 0 4px 0 0; }
.rst-qr-corner.bl { bottom: 0; left: 0; border-bottom-width: 3px; border-left-width: 3px; border-radius: 0 0 0 4px; }
.rst-qr-corner.br { bottom: 0; right: 0; border-bottom-width: 3px; border-right-width: 3px; border-radius: 0 0 4px 0; }

/* Manual entry */
.rst-manual-entry {
  padding: var(--rst-space-lg) var(--rst-space-md);
}
.rst-manual-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--rst-primary), rgba(27,67,50,0.7));
  color: var(--rst-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  margin: 0 auto var(--rst-space-md);
}
.rst-input-lg {
  padding: 0.75rem 1rem;
  font-size: 1.1rem;
}

/* Reservation tab */
.rst-badge-success {
  background: var(--rst-success-bg);
  color: var(--rst-success);
  padding: 2px 8px;
  border-radius: var(--rst-radius-sm);
  font-weight: 600;
}

/* Dark mode */
[data-theme="dark"] .rst-fab-table {
  background: rgba(45,139,94,0.3);
  border-color: var(--rst-gold);
  box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}
[data-theme="dark"] .rst-tab-bar {
  background: rgba(255,255,255,0.04);
}
[data-theme="dark"] .rst-tab.active {
  background: rgba(45,139,94,0.2);
  color: var(--rst-gold);
}
[data-theme="dark"] .rst-qr-reader {
  background: #060e0a;
}
[data-theme="dark"] .rst-manual-icon {
  background: linear-gradient(135deg, rgba(45,139,94,0.3), rgba(212,179,115,0.15));
}

/* ─── Homely Warm Touches ─── */
.rst-section { position: relative; }
.rst-section::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--rst-gold), transparent);
  border-radius: 2px;
  opacity: 0.5;
}
.rst-section:last-of-type::after { display: none; }

/* Warm hero glow */
.rst-hero {
  position: relative;
  overflow: hidden;
}

/* Gold accent underline animation */
.rst-gold-accent {
  position: relative;
}
.rst-gold-accent::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--rst-gold);
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.rst-visible .rst-gold-accent::after,
.rst-fade-in-up .rst-gold-accent::after {
  width: 100%;
}

/* Smooth page transition feel */
.rst-main {
  animation: rstPageIn 0.4s ease both;
}
@keyframes rstPageIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ─── Dark theme adjustments for new elements ─── */
[data-theme="dark"] .rst-lightbox-close { background: rgba(255,255,255,0.1); }
[data-theme="dark"] .rst-in-cart-badge { background: var(--rst-primary); }
[data-theme="dark"] .rst-help-btn {
  border-color: rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.8);
}
[data-theme="dark"] .rst-menu-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

/* ─── Mobile polish ─── */
@media (max-width: 480px) {
  .rst-lightbox-img { max-width: 96vw; max-height: 75vh; border-radius: 4px; }
  .rst-detail-img-wrap { height: 180px; }
  .rst-img-zoom-btn { opacity: 1; }
  .rst-modal-auth-body { padding: var(--rst-space-md) var(--rst-space-sm) calc(var(--rst-space-sm) + 70px); }
  .rst-modal-detail .rst-modal-body { padding: 1rem 0.85rem; }
  .rst-modal-detail-body { padding-bottom: calc(var(--rst-space-sm) + 70px) !important; }
  .rst-modal-detail .rst-modal-close { top: 10px; right: 10px; width: 44px; height: 44px; font-size: 1rem; }
  .rst-modal { max-height: 92dvh; }
  .rst-modal-detail-scroll { max-height: 92dvh; }
  .rst-detail-action-bar { flex-direction: column; gap: var(--rst-space-xs); }
  .rst-detail-action-bar .rst-qty { width: 100%; justify-content: center; }
  .rst-detail-action-bar .rst-btn { width: 100%; }
}
@media (max-width: 360px) {
  .rst-detail-img-wrap { height: 150px; }
  .rst-modal-detail .rst-modal-body { padding: 0.85rem 0.7rem; }
  .rst-auth-tab { font-size: 0.85rem; padding: var(--rst-space-xs) var(--rst-space-sm); }
}
@media (min-width: 768px) {
  .rst-modal-detail-body { padding-bottom: var(--rst-space-md) !important; }
  .rst-modal-auth-body { padding-bottom: var(--rst-space-md); }
  .rst-modal-detail-scroll { max-height: 85vh; }
}

/* ═══════════════════════════════════════════════════════════
   SweetAlert2 — Themed to match Deshen Restaurant styles
   ═══════════════════════════════════════════════════════════ */
.swal2-popup {
  background: var(--rst-white) !important;
  color: var(--rst-charcoal) !important;
  border-radius: var(--rst-radius-xl) !important;
  font-family: var(--rst-font-body) !important;
  box-shadow: var(--rst-shadow-xl) !important;
  border: 1px solid var(--rst-border) !important;
  padding: 1.75rem 1.5rem 1.5rem !important;
}
.swal2-popup .swal2-title {
  font-family: var(--rst-font-heading) !important;
  color: var(--rst-charcoal) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  margin-bottom: 0.5rem !important;
}
.swal2-popup .swal2-html-container {
  color: var(--rst-text) !important;
  font-size: 0.9rem !important;
  margin: 0.5rem 0 0 !important;
}
.swal2-popup .swal2-input,
.swal2-popup .swal2-select,
.swal2-popup .swal2-textarea {
  background: var(--rst-cream) !important;
  border: 1.5px solid var(--rst-border) !important;
  color: var(--rst-charcoal) !important;
  border-radius: var(--rst-radius-md) !important;
  font-family: var(--rst-font-body) !important;
  font-size: 0.9rem !important;
  box-shadow: none !important;
}
.swal2-popup .swal2-input:focus,
.swal2-popup .swal2-textarea:focus {
  border-color: var(--rst-primary) !important;
  box-shadow: 0 0 0 3px rgba(45, 139, 94, .15) !important;
}
.swal2-popup .swal2-actions { gap: 0.5rem !important; margin-top: 1.25rem !important; }
.swal2-popup .swal2-confirm {
  background: var(--rst-primary) !important;
  color: #fff !important;
  border-radius: var(--rst-radius-md) !important;
  font-family: var(--rst-font-body) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  padding: 0.6rem 1.25rem !important;
  border: none !important;
  box-shadow: none !important;
  transition: background 0.2s !important;
}
.swal2-popup .swal2-confirm:hover { background: var(--rst-primary-lt) !important; }
.swal2-popup .swal2-cancel {
  background: transparent !important;
  color: var(--rst-text-lt) !important;
  border: 1.5px solid var(--rst-border) !important;
  border-radius: var(--rst-radius-md) !important;
  font-family: var(--rst-font-body) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  padding: 0.6rem 1.25rem !important;
  box-shadow: none !important;
}
.swal2-popup .swal2-cancel:hover {
  background: var(--rst-cream-dk) !important;
  color: var(--rst-charcoal) !important;
}
.swal2-popup .swal2-icon { border-color: transparent !important; margin: 0.5rem auto 0.75rem !important; }
.swal2-popup .swal2-icon.swal2-success { border-color: var(--rst-success) !important; color: var(--rst-success) !important; }
.swal2-popup .swal2-icon.swal2-success [class^=swal2-success-line] { background: var(--rst-success) !important; }
.swal2-popup .swal2-icon.swal2-success .swal2-success-ring { border-color: var(--rst-success-bg) !important; }
.swal2-popup .swal2-icon.swal2-error { border-color: var(--rst-danger) !important; color: var(--rst-danger) !important; }
.swal2-popup .swal2-icon.swal2-error [class^=swal2-x-mark-line] { background: var(--rst-danger) !important; }
.swal2-popup .swal2-icon.swal2-warning { border-color: var(--rst-warning) !important; color: var(--rst-warning) !important; }
.swal2-popup .swal2-icon.swal2-info { border-color: var(--rst-primary) !important; color: var(--rst-primary) !important; }
.swal2-popup .swal2-icon.swal2-question { border-color: var(--rst-gold) !important; color: var(--rst-gold) !important; }
.swal2-popup .swal2-loader { border-color: var(--rst-primary) transparent var(--rst-primary) transparent !important; }
.swal2-popup .swal2-validation-message {
  background: var(--rst-danger-bg) !important;
  color: var(--rst-danger) !important;
  font-size: 0.82rem !important;
  border-radius: var(--rst-radius-sm) !important;
}
/* Dark theme overrides */
[data-theme="dark"] .swal2-popup {
  background: #122B1F !important;
  border-color: var(--rst-border) !important;
  color: var(--rst-charcoal) !important;
}
[data-theme="dark"] .swal2-popup .swal2-title { color: var(--rst-dark) !important; }
[data-theme="dark"] .swal2-popup .swal2-html-container { color: var(--rst-text) !important; }
[data-theme="dark"] .swal2-popup .swal2-input,
[data-theme="dark"] .swal2-popup .swal2-select,
[data-theme="dark"] .swal2-popup .swal2-textarea {
  background: #0C1F17 !important;
  border-color: var(--rst-border) !important;
  color: var(--rst-dark) !important;
}
[data-theme="dark"] .swal2-popup .swal2-cancel {
  border-color: var(--rst-border) !important;
  color: var(--rst-text-lt) !important;
}
[data-theme="dark"] .swal2-popup .swal2-cancel:hover {
  background: #0C1F17 !important;
  color: var(--rst-dark) !important;
}
[data-theme="dark"] .swal2-popup .swal2-validation-message {
  background: var(--rst-danger-bg) !important;
}
/* History Modal — full-sheet with scrollable body */
.rst-modal.rst-modal-history {
  max-width: 520px;
  padding: 0;
  overflow: hidden;
}
.rst-modal-history-scroll {
  overflow-y: auto;
  max-height: calc(90dvh - 0px);
  -webkit-overflow-scrolling: touch;
}
.rst-modal-history .rst-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--rst-cream-dk);
  color: var(--rst-text-lt);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  transition: all 0.2s;
}
.rst-modal-history .rst-modal-close:hover { background: var(--rst-border); color: var(--rst-charcoal); }
[data-theme="dark"] .rst-modal-history .rst-modal-close { background: rgba(255,255,255,0.08); color: var(--rst-text-lt); }
[data-theme="dark"] .rst-modal-history .rst-modal-close:hover { background: rgba(255,255,255,0.14); color: var(--rst-dark); }
.rst-modal-history-header {
  padding: 1.25rem 1.25rem 0;
  position: relative;
}
.rst-modal-history-body {
  padding: 0 1.25rem 1.5rem;
}
.rst-htab-bar {
  display: flex;
  border-bottom: 2px solid var(--rst-border);
  margin: 1rem 0 0;
  gap: 0;
}
.rst-htab {
  flex: 1;
  padding: 0.65rem 0.5rem;
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  font-family: var(--rst-font-body);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--rst-text-lt);
  cursor: pointer;
  transition: all 0.18s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.rst-htab:hover { color: var(--rst-primary); }
.rst-htab.active {
  color: var(--rst-primary);
  border-bottom-color: var(--rst-primary);
}
[data-theme="dark"] .rst-htab { color: var(--rst-text-lt); }
[data-theme="dark"] .rst-htab.active { color: var(--rst-primary); border-bottom-color: var(--rst-primary); }
.rst-history-list { padding-top: 1rem; }
.rst-history-empty {
  text-align: center;
  padding: 2.5rem 1rem;
  color: var(--rst-text-lt);
}
.rst-history-empty i { font-size: 2.5rem; display: block; margin-bottom: 0.75rem; opacity: 0.4; }

/* ─── QR Access Landing ─── */
.rst-qr-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 22%, rgba(197, 165, 114, 0.24), transparent 36%),
    radial-gradient(circle at 82% 10%, rgba(27, 67, 50, 0.16), transparent 42%),
    linear-gradient(135deg, #fff6e9 0%, #f7efe2 48%, #f2eadc 100%);
}
.rst-qr-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(90deg, rgba(27, 67, 50, 0.04) 1px, transparent 1px),
    linear-gradient(0deg, rgba(27, 67, 50, 0.04) 1px, transparent 1px);
  background-size: 26px 26px;
  opacity: 0.45;
}
.rst-qr-display-page {
  min-height: calc(100dvh - 180px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: var(--rst-space-lg);
  padding-bottom: var(--rst-space-lg);
}
.rst-qr-display-shell {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: clamp(1rem, 2.2vw, 2.4rem);
  padding: clamp(1rem, 2vw, 1.5rem);
  border: 1px solid color-mix(in srgb, var(--rst-gold) 28%, var(--rst-border));
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(251,247,240,0.98));
}
.rst-qr-display-info {
  min-width: 0;
}
.rst-qr-display-visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 0;
}
.rst-qr-section {
  padding-top: var(--rst-space-xl);
}
.rst-qr-card,
.rst-qr-help-card {
  border: 1px solid color-mix(in srgb, var(--rst-gold) 28%, var(--rst-border));
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(251,247,240,0.98));
}
.rst-qr-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rst-space-sm);
  margin-bottom: var(--rst-space-sm);
}
.rst-qr-display-wrap {
  margin-top: var(--rst-space-md);
  border-radius: var(--rst-radius-lg);
  border: 2px solid color-mix(in srgb, var(--rst-primary) 24%, var(--rst-border));
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 242, 231, 0.98));
  box-shadow: var(--rst-shadow-md);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.1rem;
}
.rst-qr-display-img {
  width: min(100%, 340px);
  height: auto;
  border-radius: var(--rst-radius-md);
  border: 1px solid color-mix(in srgb, var(--rst-border) 85%, transparent);
  background: #fff;
}
.rst-qr-target {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  padding: 18px;
  border-radius: calc(var(--rst-radius-md) + 2px);
  box-shadow: 0 0 0 6px #fff;
}
.rst-qr-target canvas,
.rst-qr-target img {
  width: clamp(220px, 28vw, 360px);
  height: clamp(220px, 28vw, 360px);
  max-width: 100%;
  border-radius: var(--rst-radius-md);
  border: 1px solid #ececec;
  background: #fff;
}
.rst-qr-caption {
  margin-top: 0.65rem;
  font-size: 0.85rem;
  color: var(--rst-text-lt);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}
.rst-qr-url-wrap .rst-input {
  font-size: 0.88rem;
  color: var(--rst-primary-dk);
  font-weight: 600;
}
.rst-qr-scanner-wrap {
  position: relative;
  margin-top: var(--rst-space-md);
  border-radius: var(--rst-radius-lg);
  overflow: hidden;
  border: 2px solid color-mix(in srgb, var(--rst-primary) 24%, var(--rst-border));
  box-shadow: var(--rst-shadow-md);
  background: #0f1f19;
}
.rst-qr-reader {
  width: 100%;
  min-height: 320px;
}
.rst-qr-reader video {
  object-fit: cover;
}
.rst-qr-scanline {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--rst-gold), transparent);
  box-shadow: 0 0 12px rgba(197, 165, 114, 0.7);
  z-index: 2;
  pointer-events: none;
  animation: rstScanLine 2.2s linear infinite;
}
@keyframes rstScanLine {
  0% { transform: translateY(0); }
  50% { transform: translateY(308px); }
  100% { transform: translateY(0); }
}
.rst-qr-status {
  margin-top: var(--rst-space-md);
  border-radius: var(--rst-radius-md);
  padding: 0.7rem 0.8rem;
  font-size: 0.9rem;
  background: color-mix(in srgb, var(--rst-info-bg) 72%, var(--rst-white));
  color: var(--rst-primary-dk);
  border: 1px solid color-mix(in srgb, var(--rst-primary) 20%, transparent);
}
.rst-qr-status.is-success {
  background: color-mix(in srgb, var(--rst-success-bg) 76%, var(--rst-white));
  border-color: color-mix(in srgb, var(--rst-success) 34%, transparent);
  color: #0b6b30;
}
.rst-qr-status.is-warning {
  background: color-mix(in srgb, var(--rst-warning-bg) 78%, var(--rst-white));
  border-color: color-mix(in srgb, var(--rst-warning) 35%, transparent);
  color: #8f4f04;
}
.rst-qr-status.is-error {
  background: color-mix(in srgb, var(--rst-danger-bg) 78%, var(--rst-white));
  border-color: color-mix(in srgb, var(--rst-danger) 35%, transparent);
  color: #a31616;
}
.rst-qr-help-list {
  margin: 0;
  padding-left: 1.15rem;
  color: var(--rst-text);
  display: grid;
  gap: 0.45rem;
}

[data-theme="dark"] .rst-qr-hero {
  background:
    radial-gradient(circle at 14% 20%, rgba(212, 179, 115, 0.14), transparent 34%),
    radial-gradient(circle at 86% 0%, rgba(29, 60, 45, 0.36), transparent 36%),
    linear-gradient(145deg, #0f2018 0%, #132920 52%, #0d1f18 100%);
}
[data-theme="dark"] .rst-qr-hero::after {
  background-image:
    linear-gradient(90deg, rgba(212, 179, 115, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(212, 179, 115, 0.06) 1px, transparent 1px);
}
[data-theme="dark"] .rst-qr-card,
[data-theme="dark"] .rst-qr-help-card {
  background: linear-gradient(180deg, rgba(16, 34, 26, 0.94), rgba(13, 27, 21, 0.98));
  border-color: rgba(212, 179, 115, 0.26);
}
[data-theme="dark"] .rst-qr-display-shell {
  background: linear-gradient(180deg, rgba(16, 34, 26, 0.94), rgba(13, 27, 21, 0.98));
  border-color: rgba(212, 179, 115, 0.26);
}
[data-theme="dark"] .rst-qr-scanner-wrap {
  border-color: rgba(212, 179, 115, 0.35);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.35);
}
[data-theme="dark"] .rst-qr-display-wrap {
  border-color: rgba(212, 179, 115, 0.35);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.35);
  background: linear-gradient(180deg, rgba(26, 46, 37, 0.95), rgba(19, 35, 28, 0.95));
}
[data-theme="dark"] .rst-qr-display-img {
  border-color: rgba(212, 179, 115, 0.22);
}
[data-theme="dark"] .rst-qr-target canvas,
[data-theme="dark"] .rst-qr-target img {
  border-color: rgba(212, 179, 115, 0.22);
}
[data-theme="dark"] .rst-qr-target {
  background: #fff;
  box-shadow: 0 0 0 6px #fff;
}
[data-theme="dark"] .rst-qr-caption {
  color: #d0d7cc;
}
[data-theme="dark"] .rst-qr-url-wrap .rst-input {
  color: #dfe7dc;
}
[data-theme="dark"] .rst-qr-status {
  background: rgba(29, 59, 45, 0.7);
  border-color: rgba(212, 179, 115, 0.22);
  color: #d7dfd4;
}
[data-theme="dark"] .rst-qr-status.is-success {
  background: rgba(23, 76, 46, 0.8);
  color: #b7f2cb;
}
[data-theme="dark"] .rst-qr-status.is-warning {
  background: rgba(93, 69, 18, 0.75);
  color: #ffe2a3;
}
[data-theme="dark"] .rst-qr-status.is-error {
  background: rgba(98, 27, 27, 0.75);
  color: #ffc0c0;
}
[data-theme="dark"] .rst-qr-help-list {
  color: #d0d7cc;
}

@media (max-width: 640px) {
  .rst-qr-display-page {
    min-height: auto;
    align-items: flex-start;
  }
  .rst-qr-display-shell {
    grid-template-columns: 1fr;
  }
  .rst-qr-display-visual {
    order: -1;
  }
  .rst-qr-reader {
    min-height: 260px;
  }
  @keyframes rstScanLine {
    0% { transform: translateY(0); }
    50% { transform: translateY(248px); }
    100% { transform: translateY(0); }
  }
}

/* ═══════════════════════════════════════════════════════════════
   Mobile UX Polish (Phase 8) — professional, accessible, touch-first
   ═══════════════════════════════════════════════════════════════ */

/* Prevent layout shift on long text & accidental horizontal scroll */
html, body { overflow-x: hidden; }
/* NOTE: overscroll-behavior-y:contain was removed because it blocks
   two-finger trackpad scroll on desktop. Only modals/drawers that need
   to contain scroll should set overscroll-behavior on their own container. */

/* Every interactive element gets a sensible tap target + clean tap flash */
button, a, .rst-btn, .rst-nav-item, .rst-modal-close, .rst-qty button,
.rst-menu-card, .rst-card, [role="button"] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* Keyboard-visible focus (a11y) */
:focus-visible {
  outline: 2px solid var(--rst-primary);
  outline-offset: 2px;
  border-radius: var(--rst-radius-sm, 4px);
}
.rst-input:focus-visible,
.rst-select:focus-visible,
.rst-textarea:focus-visible {
  outline: none;
  border-color: var(--rst-primary);
  box-shadow: 0 0 0 3px rgba(114, 47, 55, .2);
}

/* Prevent body scroll leak when modal is open (covers the JS toggle) */
body.rst-modal-open { overflow: hidden; position: relative; }

/* Menu card Add buttons: make sure primary action is thumb-friendly */
.rst-menu-card .rst-btn-sm,
.rst-menu-card .rst-btn {
  min-height: 40px;
  min-width: 40px;
}
@media (max-width: 480px) {
  .rst-menu-card .rst-btn,
  .rst-menu-card .rst-btn-sm {
    min-height: 44px;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* Tiny phone (<=360px) — squeeze spacing, keep text readable */
@media (max-width: 360px) {
  :root {
    --rst-space-md: 0.75rem;
    --rst-space-lg: 1rem;
  }
  .rst-container { padding-left: 0.75rem; padding-right: 0.75rem; }
  .rst-nav-item { font-size: 0.68rem; padding: 0.5rem 0.25rem; min-width: 48px; }
  .rst-nav-item i { font-size: 1.05rem; }
  .rst-modal-title { font-size: 1rem; }
}

/* Landscape phones: modals shouldn't exceed screen height */
@media (orientation: landscape) and (max-height: 500px) {
  .rst-modal { max-height: 94dvh; }
  .rst-modal-overlay { align-items: flex-start; padding-top: 0.5rem; }
  .rst-modal-header { padding: 0.625rem var(--rst-space-md); }
  .rst-modal-body { padding: 0.75rem var(--rst-space-md); }
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Improve images on small screens — never stretch */
.rst-menu-card-img, .rst-card-img, .rst-detail-img { object-fit: cover; }

/* Ensure cart bar never covers the bottom nav action area */
.rst-cart-bar {
  bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}
@media (min-width: 768px) {
  .rst-cart-bar { bottom: 24px; }
}

/* Toast: keep above notched devices, don't block top interactive bar */
.rst-toast-container {
  top: calc(env(safe-area-inset-top, 0px) + 0.75rem);
}

/* Form helpers */
.rst-input, .rst-select, .rst-textarea { -webkit-text-size-adjust: 100%; }

/* Password toggle button — proper size */
.rst-password-toggle {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Modal swipe-down visual affordance */
.rst-modal-handle {
  cursor: grab;
}
.rst-modal-handle:active { cursor: grabbing; }

/* Category pills: bigger tap + visible scroll cue */
.rst-category-pill {
  min-height: 36px;
  padding: 0.5rem 1rem;
}
@media (max-width: 480px) {
  .rst-category-pill { min-height: 40px; padding: 0.5rem 0.875rem; }
}

/* ─── Cart page — mobile polish ───────────────────────────────────────
   Tightens tap targets and stacks the order-type / payment cards on
   narrow screens. The "Place Order" button is enlarged on phones so
   it's always thumb-reachable. */
@media (max-width: 600px) {
  /* Order type cards — 2 across already; ensure tall enough touch target */
  .rst-order-type-card { min-height: 88px; padding: 14px 8px; }
  .rst-order-type-card .rst-type-icon { font-size: 1.6rem; }

  /* Payment-method card — full width on mobile (single option now) */
  .pay-method-card { min-height: 72px; }
  .pay-method-card i { font-size: 1.6rem !important; }

  /* Place order: bigger, with safe-area inset for notched phones */
  #placeOrderBtn {
    font-size: 1.05rem;
    min-height: 56px;
    padding-bottom: calc(0.875rem + env(safe-area-inset-bottom, 0px));
  }

  /* Split payment grid stacks nicely on very narrow screens */
  #splitPayDetails > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* PayBill / receipt code input — prevent zoom on iOS focus */
  .rst-receipt-input,
  #custName, #custPhone, #splitPhone2, #splitAmt1, #splitAmt2,
  #reservationCode {
    font-size: 16px !important;
  }

  /* FAB sits above bottom-bar safe area on iOS */
  .rst-fab-table {
    bottom: calc(var(--rst-fab-bottom, 80px) + env(safe-area-inset-bottom, 0px));
  }
}

/* Sticky place-order bar on phones (kicks in only when summary visible) */
@media (max-width: 480px) {
  /* keep bottom of page free for thumb reach */
  #cartSummary { padding-bottom: 4px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Reviews page — v3.4.3
   ═══════════════════════════════════════════════════════════════════════════ */
.rst-reviews-stat-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--rst-space-sm);
  margin: var(--rst-space-md) 0;
  flex-wrap: wrap;
}
.rst-reviews-avg {
  font-family: var(--rst-font-heading);
  font-size: 3rem;
  font-weight: 700;
  color: var(--rst-gold);
  line-height: 1;
}
.rst-reviews-avg-stars { font-size: 1.4rem; }
.rst-rating-bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 320px;
  margin: var(--rst-space-sm) auto 0;
}
.rst-rating-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--rst-text);
  padding: 3px 6px;
  border-radius: var(--rst-radius-sm);
  transition: background var(--rst-duration) var(--rst-ease);
}
.rst-rating-bar-row:hover,
.rst-rating-bar-row.active { background: var(--rst-border); }
.rst-rating-bar-track {
  flex: 1;
  height: 8px;
  background: var(--rst-border);
  border-radius: var(--rst-radius-full);
  overflow: hidden;
}
.rst-rating-bar-fill {
  height: 100%;
  background: var(--rst-gold);
  border-radius: var(--rst-radius-full);
  transition: width 0.6s var(--rst-ease);
}
/* Filter pills */
.rst-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  background: transparent;
  color: var(--rst-text-lt);
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-filter-pill:hover {
  border-color: var(--rst-gold);
  color: var(--rst-gold);
}
.rst-filter-pill.active {
  background: var(--rst-gold);
  border-color: var(--rst-gold);
  color: #fff;
}
/* Review card enhancements */
.rst-review-reply {
  margin-top: var(--rst-space-sm);
  padding: var(--rst-space-sm) var(--rst-space-sm);
  border-left: 3px solid var(--rst-primary);
  background: rgba(27,67,50,.06);
  border-radius: 0 var(--rst-radius-sm) var(--rst-radius-sm) 0;
}
.rst-review-reply-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--rst-primary);
  margin-bottom: 4px;
}
.rst-review-date {
  margin-top: var(--rst-space-sm);
  opacity: .6;
}
.rst-review-text { line-height: 1.55; }
/* Photo thumbnail clickable */
.rst-review-photo-link { border-radius: var(--rst-radius-md); transition: transform var(--rst-duration) var(--rst-ease); }
.rst-review-photo-link:hover { transform: scale(1.06); }
/* Anon form input */
.rst-input, .rst-textarea {
  width: 100%;
  padding: 0.6rem 0.85rem;
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-md);
  background: transparent;
  color: var(--rst-text);
  font-family: var(--rst-font-body);
  font-size: 0.95rem;
  transition: border-color var(--rst-duration) var(--rst-ease);
}
.rst-input:focus, .rst-textarea:focus {
  outline: none;
  border-color: var(--rst-primary);
  box-shadow: 0 0 0 3px rgba(27,67,50,.12);
}
.rst-label { display: block; font-weight: 600; font-size: 0.875rem; margin-bottom: 6px; }
.rst-d-block { display: block; }
.rst-mb-sm  { margin-bottom: var(--rst-space-sm); }
.rst-ms-xs  { margin-left: var(--rst-space-xs); }
.rst-text-danger { color: var(--rst-danger); }
/* Dark mode adjustments for review page */
[data-theme="dark"] .rst-review-reply,
[data-rst-theme="dark"] .rst-review-reply {
  background: rgba(197,165,114,.08);
}
[data-theme="dark"] .rst-rating-bar-row:hover,
[data-theme="dark"] .rst-rating-bar-row.active,
[data-rst-theme="dark"] .rst-rating-bar-row:hover,
[data-rst-theme="dark"] .rst-rating-bar-row.active {
  background: rgba(255,255,255,.08);
}
[data-theme="dark"] .rst-filter-pill,
[data-rst-theme="dark"] .rst-filter-pill {
  border-color: rgba(255,255,255,.2);
  color: rgba(255,255,255,.6);
}
[data-theme="dark"] .rst-input,
[data-theme="dark"] .rst-textarea,
[data-rst-theme="dark"] .rst-input,
[data-rst-theme="dark"] .rst-textarea {
  border-color: rgba(255,255,255,.2);
  background: rgba(255,255,255,.04);
  color: #fff;
}
/* Stars filled color */
.rst-star-filled { color: var(--rst-gold) !important; }
.rst-star-empty  { color: var(--rst-border) !important; }
.rst-stars-input i { font-size: 1.8rem; cursor: pointer; color: var(--rst-border); transition: color .15s; }
.rst-stars-input i.active,
.rst-stars-input i:hover { color: var(--rst-gold); }

/* ═══════════════════════════════════════════════════════════════════════════
   Reviews page v3.4.5 — mobile-first redesign
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hero summary card: 2-col on tablet+, stacked on mobile */
.rst-reviews-hero { padding-top: var(--rst-space-lg); padding-bottom: var(--rst-space-md); }
.rst-reviews-summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-lg);
  background: var(--rst-card-bg, rgba(0,0,0,.02));
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-xl);
  padding: var(--rst-space-lg);
  max-width: 640px;
  margin: 0 auto;
}
.rst-reviews-summary-left  { text-align: center; }
.rst-reviews-summary-right { display: flex; flex-direction: column; gap: 6px; }
.rst-reviews-avg { font-family: var(--rst-font-heading); font-size: 3.5rem; font-weight: 700; color: var(--rst-gold); line-height: 1; }
.rst-reviews-avg-stars { font-size: 1.4rem; margin: .35rem 0; display: inline-flex; gap: 2px; }
.rst-rating-bar-row {
  display: grid;
  grid-template-columns: 38px 1fr 32px;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--rst-text);
  padding: 6px 8px;
  border-radius: var(--rst-radius-sm);
  min-height: 36px;
  transition: background var(--rst-duration) var(--rst-ease);
}
.rst-rating-bar-row:hover,
.rst-rating-bar-row.active { background: var(--rst-cream-dk, rgba(212,175,55,.08)); }
.rst-rating-bar-label { font-size: .85rem; font-weight: 600; display: inline-flex; align-items: center; }
.rst-rating-bar-count { font-size: .8rem; opacity: .65; text-align: right; }
@media (min-width: 720px) {
  .rst-reviews-summary { grid-template-columns: 1fr 1.4fr; align-items: center; padding: var(--rst-space-xl); }
  .rst-reviews-summary-left { border-right: 1px solid var(--rst-border); padding-right: var(--rst-space-lg); }
  .rst-reviews-avg { font-size: 4rem; }
}

/* Sticky filter bar — sits below the site header on scroll */
.rst-reviews-filter-bar {
  position: sticky;
  top: var(--rst-header-height, 64px);
  z-index: 30;
  background: var(--rst-bg);
  border-bottom: 1px solid var(--rst-border);
  padding: 8px 0;
  backdrop-filter: saturate(180%) blur(8px);
  -webkit-backdrop-filter: saturate(180%) blur(8px);
}
.rst-filter-pills-scroll {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 4px;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}
.rst-filter-pills-scroll::-webkit-scrollbar { display: none; }
.rst-filter-pills-scroll .rst-filter-pill { scroll-snap-align: start; flex-shrink: 0; min-height: 38px; }
.rst-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  border: 1.5px solid var(--rst-border);
  border-radius: var(--rst-radius-full);
  background: transparent;
  color: var(--rst-text-lt);
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--rst-duration) var(--rst-ease);
}
.rst-filter-pill:hover { border-color: var(--rst-gold); color: var(--rst-gold); }
.rst-filter-pill.active {
  background: var(--rst-gold);
  border-color: var(--rst-gold);
  color: #fff;
  box-shadow: 0 2px 8px rgba(212,175,55,.35);
}

/* Review cards — single col mobile, 2 col tablet, 3 col desktop */
.rst-reviews-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rst-space-md);
}
@media (min-width: 640px)  { .rst-reviews-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .rst-reviews-grid { grid-template-columns: repeat(3, 1fr); } }

.rst-review-card {
  position: relative;
  background: var(--rst-card-bg, rgba(255,255,255,.02));
  border: 1px solid var(--rst-border);
  border-radius: var(--rst-radius-lg);
  padding: var(--rst-space-md);
  transition: transform var(--rst-duration) var(--rst-ease), box-shadow var(--rst-duration) var(--rst-ease);
}
.rst-review-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,.06); }
.rst-review-featured { border-color: var(--rst-gold); box-shadow: 0 0 0 1px rgba(212,175,55,.25); }

.rst-review-head {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 10px;
  align-items: center;
  margin-bottom: var(--rst-space-sm);
}
.rst-review-avatar {
  width: 44px; height: 44px; border-radius: 50%;
  background: linear-gradient(135deg, var(--rst-primary) 0%, var(--rst-gold) 100%);
  color: #fff;
  font-family: var(--rst-font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  user-select: none;
}
.rst-review-meta { min-width: 0; }
.rst-review-name { display: block; font-size: .92rem; line-height: 1.2; color: var(--rst-text); }
.rst-review-row {
  display: flex; align-items: center; gap: 8px; margin-top: 2px;
  flex-wrap: wrap;
}
.rst-stars-sm { font-size: .75rem; }
.rst-review-date-inline { font-size: .72rem; opacity: .55; }
.rst-review-text {
  font-size: .92rem;
  line-height: 1.55;
  color: var(--rst-text);
  margin: 0 0 var(--rst-space-sm);
}
.rst-tag-featured {
  background: var(--rst-gold) !important;
  color: #fff !important;
  font-size: .65rem;
  padding: 3px 6px;
  border-radius: var(--rst-radius-sm);
  display: inline-flex; align-items: center; gap: 3px;
}

/* Photo strip — horizontal scroll on mobile */
.rst-review-photos-strip {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  margin: var(--rst-space-sm) 0;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}
.rst-review-photos-strip::-webkit-scrollbar { display: none; }
.rst-review-photos-strip .rst-review-photo {
  width: 92px; height: 92px;
  object-fit: cover;
  border-radius: var(--rst-radius-md);
  cursor: pointer;
  flex-shrink: 0;
  scroll-snap-align: start;
  transition: transform var(--rst-duration) var(--rst-ease);
}
.rst-review-photos-strip .rst-review-photo:active { transform: scale(.96); }

/* Floating "Leave Review" FAB — visible on mobile until form scrolls into view */
.rst-reviews-fab {
  position: fixed;
  right: 16px;
  bottom: calc(var(--rst-bottom-nav-height, 64px) + 16px + env(safe-area-inset-bottom, 0));
  z-index: 50;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--rst-gold);
  color: #fff !important;
  padding: 12px 18px;
  border-radius: var(--rst-radius-full);
  box-shadow: 0 6px 20px rgba(212,175,55,.45);
  text-decoration: none;
  font-weight: 600;
  font-size: .9rem;
  transition: transform var(--rst-duration) var(--rst-ease), opacity var(--rst-duration) var(--rst-ease);
}
.rst-reviews-fab:hover { transform: translateY(-2px); }
.rst-reviews-fab.rst-fab-hidden { opacity: 0; pointer-events: none; transform: translateY(20px); }
@media (min-width: 768px) {
  /* On larger screens move it to bottom-right with no nav offset */
  .rst-reviews-fab { bottom: 24px; }
}

/* Touch target enlargement for star picker on mobile */
@media (max-width: 640px) {
  .rst-stars-input i { font-size: 2.2rem; padding: 4px 6px; }
  .rst-filter-pill { padding: 10px 18px; font-size: .9rem; }
}