/* ============================================================
   POSITIVUS THEME OVERRIDE for guest-pwa
   Inspired by Positivus Landing (Figma Community)
   Palette: lime #B9FF66, ink #191A23, gray #F3F3F3, white
   Font: Space Grotesk
   Loaded AFTER style.css — overrides only.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --bg:      #F3F3F3;
  --bg2:     #FFFFFF;
  --card:    #FFFFFF;
  --accent:  #B9FF66;
  --accent2: rgba(185,255,102,0.18);
  --ink:     #191A23;
  --text:    #191A23;
  --text2:   #6B6B74;
  --border:  #191A23;
  --success: #B9FF66;
  --warning: #FFD166;
  --shadow:  0 4px 0 0 #191A23;
}

::selection { background: #B9FF66; color: #191A23; }

html, body {
  background: var(--bg) !important;
  background-image: none !important;
  color: var(--text) !important;
  font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Scrollbar */
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #191A23; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #000; }

/* === PORTAL === */
.portal-page {
  background: var(--bg) !important;
  background-image:
    radial-gradient(circle at 20% 10%, #B9FF66 0 2px, transparent 3px),
    radial-gradient(circle at 80% 30%, #191A23 0 2px, transparent 3px),
    radial-gradient(circle at 50% 80%, #B9FF66 0 2px, transparent 3px) !important;
  background-size: 40px 40px !important;
}
.portal-card {
  background: #fff !important;
  border: 1px solid #191A23 !important;
  border-radius: 24px !important;
  box-shadow: 0 6px 0 0 #191A23 !important;
}
.portal-card h1 {
  font-family: 'Space Grotesk', sans-serif !important;
  font-weight: 700 !important;
  color: #191A23 !important;
}
.portal-card p, .hint, .step { color: #191A23 !important; }
.steps {
  background: #B9FF66 !important;
  border: 1px solid #191A23 !important;
  border-radius: 14px !important;
}

/* === BUTTONS === */
.btn {
  border-radius: 14px !important;
  font-weight: 600 !important;
  font-family: 'Space Grotesk', sans-serif !important;
  border: 1px solid #191A23 !important;
  transition: transform .12s ease, box-shadow .12s ease !important;
}
.btn-primary {
  background: #191A23 !important;
  color: #fff !important;
  box-shadow: 0 4px 0 0 #B9FF66 !important;
}
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 0 0 #B9FF66 !important;
}
.btn-primary:active { transform: translateY(2px); box-shadow: 0 2px 0 0 #B9FF66 !important; }
.btn-secondary {
  background: #B9FF66 !important;
  color: #191A23 !important;
  box-shadow: 0 4px 0 0 #191A23 !important;
}
.btn-secondary:hover { transform: translateY(-1px); }
.btn-ghost {
  background: #fff !important;
  color: #191A23 !important;
  border: 1px solid #191A23 !important;
}

/* === HEADER / BARS === */
.establishment-bar {
  background: #191A23 !important;
  color: #B9FF66 !important;
  border-bottom: 1px solid #191A23 !important;
  font-family: 'Space Grotesk', sans-serif !important;
}
.app-header {
  background: #fff !important;
  border-bottom: 1px solid #191A23 !important;
  color: #191A23 !important;
}
.app-header * { color: #191A23 !important; }
.game-menu-btn {
  background: #B9FF66 !important;
  border: 1px solid #191A23 !important;
  border-radius: 10px !important;
  color: #191A23 !important;
}

/* === PWA INSTALL BANNER === */
.pwa-install-banner {
  background: #B9FF66 !important;
  border-bottom: 1px solid #191A23 !important;
}
.pwa-install-text { color: #191A23 !important; }
.pwa-install-btn {
  background: #191A23 !important;
  color: #fff !important;
  border-radius: 10px !important;
}

/* === GENERIC CARDS / TILES === */
.card, .tile, .menu-item, .order-card, .reservation-card, .dish-card, .category-card {
  background: #fff !important;
  border: 1px solid #191A23 !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 0 0 #191A23 !important;
  color: #191A23 !important;
}

/* Highlighted / accent cards */
.card.accent, .tile.accent, .featured {
  background: #B9FF66 !important;
}

/* Inputs */
input, textarea, select {
  background: #fff !important;
  color: #191A23 !important;
  border: 1px solid #191A23 !important;
  border-radius: 12px !important;
  font-family: 'Space Grotesk', sans-serif !important;
}
input::placeholder, textarea::placeholder { color: #6B6B74 !important; }
input:focus, textarea:focus, select:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px #B9FF66 !important;
}

/* Tags / chips */
.tag, .chip, .badge {
  background: #B9FF66 !important;
  color: #191A23 !important;
  border: 1px solid #191A23 !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
}

/* Headings */
h1, h2, h3, h4 {
  font-family: 'Space Grotesk', sans-serif !important;
  color: #191A23 !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

/* Links */
a { color: #191A23; }
a:hover { color: #000; }
