/* ═══ $100B PREMIUM — Concierge Services (scoped to #concierge) ═══
   Only existing coverage is a font-family rule at line ~8147. Full
   conversion from green-dark theme to ZOOM blue $100B light palette.
   Uses globally-defined @keyframes z100bCardGlow. */

/* ── Base: force light page + dark text ── */
#concierge { background: #f0f2f7 !important; color: #111827 !important; }
#concierge, #concierge * {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}

/* ── Hero: dark green gradient → premium white glass + animated blue glow ── */
#concierge > div[style*="linear-gradient(135deg,#0a1e14"],
#concierge > div[style*="linear-gradient(135deg, #0a1e14"] {
  background: linear-gradient(145deg, rgba(255,255,255,0.94), rgba(0,101,241,0.04)) !important;
  border: 0.5px solid rgba(0,101,241,0.18) !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(0,101,241,0.05), 0 14px 40px rgba(0,101,241,0.08) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
#concierge > div[style*="linear-gradient(135deg,#0a1e14"]::before,
#concierge > div[style*="linear-gradient(135deg, #0a1e14"]::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #0055d4, #0065f1, #2d7af8, #0065f1, #0055d4) !important;
  background-size: 200% 100% !important;
  animation: z100bCardGlow 4s ease-in-out infinite !important;
  z-index: 2 !important;
}
/* Green radial halos → ZOOM blue */
#concierge [style*="radial-gradient(circle,rgba(80,200,120"],
#concierge [style*="radial-gradient(circle, rgba(80,200,120"] {
  background: radial-gradient(circle, rgba(0,101,241,0.08) 0%, transparent 70%) !important;
}

/* ── Green accents (#50C878) → ZOOM blue for the "Concierge" hero word ── */
#concierge [style*="color:#50C878"], #concierge [style*="color: #50C878"],
#concierge [style*="color:#2e8b57"], #concierge [style*="color: #2e8b57"] {
  color: #0065f1 !important;
  -webkit-text-fill-color: #0065f1 !important;
}
#concierge [style*="background:rgba(80,200,120"],
#concierge [style*="background: rgba(80,200,120"] {
  background: rgba(0,101,241,0.08) !important;
}
#concierge [style*="border:1px solid rgba(80,200,120"],
#concierge [style*="border: 1px solid rgba(80,200,120"] {
  border-color: rgba(0,101,241,0.22) !important;
}
/* Green gradient "Find Vendor" button → ZOOM blue + white text (was color:#000) */
#concierge button[style*="linear-gradient(135deg,#50C878"],
#concierge button[style*="linear-gradient(135deg, #50C878"] {
  background: linear-gradient(135deg, #0055d4, #0065f1) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(0,101,241,0.28) !important;
}
#concierge button[style*="linear-gradient(135deg,#50C878"] *,
#concierge button[style*="linear-gradient(135deg, #50C878"] * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* ── GOLD "Active Vendor Specials" banner → blue-wash glass ── */
#concierge [style*="linear-gradient(145deg,rgba(201,168,76,0.08)"],
#concierge [style*="linear-gradient(145deg, rgba(201,168,76,0.08)"] {
  background: linear-gradient(145deg, rgba(0,101,241,0.06), rgba(0,101,241,0.02)) !important;
  border: 0.5px solid rgba(0,101,241,0.22) !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(0,101,241,0.05), 0 10px 28px rgba(0,101,241,0.07) !important;
}
#concierge [style*="linear-gradient(145deg,rgba(201,168,76,0.08)"]::before,
#concierge [style*="linear-gradient(145deg, rgba(201,168,76,0.08)"]::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #0055d4, #0065f1, #2d7af8, #0065f1, #0055d4) !important;
  background-size: 200% 100% !important;
  animation: z100bCardGlow 4s ease-in-out infinite !important;
  z-index: 1 !important;
}
#concierge [style*="color:var(--gold)"], #concierge [style*="color: var(--gold)"],
#concierge [style*="color:#c9a84c"], #concierge [style*="color: #c9a84c"] {
  color: #0065f1 !important;
  -webkit-text-fill-color: #0065f1 !important;
}

/* ── Vendor Admin card (already blue tint) — add premium glow ── */
#concierge #cs-vendor-admin {
  background: linear-gradient(145deg, rgba(255,255,255,0.96), rgba(0,101,241,0.04)) !important;
  border: 0.5px solid rgba(0,101,241,0.22) !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(0,101,241,0.05), 0 10px 28px rgba(0,101,241,0.07) !important;
}
#concierge #cs-vendor-admin::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #0055d4, #0065f1, #2d7af8, #0065f1, #0055d4) !important;
  background-size: 200% 100% !important;
  animation: z100bCardGlow 4s ease-in-out infinite !important;
  z-index: 1 !important;
}

/* ── Dark #0d0f14 panels (AI Search bar, admin add, modal) → white glass + premium glow ── */
#concierge div[style*="background:#0d0f14"],
#concierge div[style*="background: #0d0f14"] {
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(0,101,241,0.035)) !important;
  border: 0.5px solid rgba(0,101,241,0.18) !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(0,101,241,0.05), 0 8px 24px rgba(0,101,241,0.06) !important;
}
#concierge div[style*="background:#0d0f14"]::before,
#concierge div[style*="background: #0d0f14"]::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #0055d4, #0065f1, #2d7af8, #0065f1, #0055d4) !important;
  background-size: 200% 100% !important;
  animation: z100bCardGlow 4s ease-in-out infinite !important;
  z-index: 1 !important;
}

/* ── Inputs / selects / textareas — white + blue border + blue focus ── */
#concierge input, #concierge select, #concierge textarea {
  background: rgba(255,255,255,0.96) !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border: 0.5px solid rgba(0,101,241,0.18) !important;
}
#concierge input::placeholder, #concierge textarea::placeholder {
  color: #9ca3af !important;
  -webkit-text-fill-color: #9ca3af !important;
}
#concierge input:focus, #concierge select:focus, #concierge textarea:focus {
  outline: none !important;
  border-color: #0065f1 !important;
  box-shadow: 0 0 0 3px rgba(0,101,241,0.10) !important;
}
/* Form labels */
#concierge .form-group label, #concierge label {
  color: #0065f1 !important;
  -webkit-text-fill-color: #0065f1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* ── Dark hairline borders ── */
#concierge [style*="border:1px solid #1e2028"],
#concierge [style*="border: 1px solid #1e2028"],
#concierge [style*="border:1px solid #2a2d38"],
#concierge [style*="border: 1px solid #2a2d38"] {
  border-color: rgba(0,101,241,0.18) !important;
}

/* ── Muted text tokens ── */
#concierge [style*="color:#aaa"], #concierge [style*="color: #aaa"],
#concierge [style*="color:#888"], #concierge [style*="color: #888"],
#concierge [style*="color:#999"], #concierge [style*="color: #999"],
#concierge [style*="color:#ccc"], #concierge [style*="color: #ccc"],
#concierge [style*="color:#ddd"], #concierge [style*="color: #ddd"],
#concierge [style*="color:#eee"], #concierge [style*="color: #eee"],
#concierge [style*="color:rgba(255,255,255,0.3"],
#concierge [style*="color:rgba(255,255,255,0.4"],
#concierge [style*="color:rgba(255,255,255,0.5"],
#concierge [style*="color:rgba(255,255,255,0.6"],
#concierge [style*="color:rgba(255,255,255,0.7"] {
  color: #6b7280 !important;
  -webkit-text-fill-color: #6b7280 !important;
}
/* Near-white text tokens → dark */
#concierge [style*="color:#e8eaf0"], #concierge [style*="color: #e8eaf0"],
#concierge [style*="color:#E8EDFB"], #concierge [style*="color: #E8EDFB"] {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}

/* Any remaining white text → dark */
#concierge [style*="color:#fff"], #concierge [style*="color: #fff"] {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}
/* But gradient buttons MUST keep white text — override above */
#concierge button[style*="linear-gradient"] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
#concierge button[style*="linear-gradient"] * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* ── Primary blue gradient buttons (Add Vendor, etc.) — premium shadow ── */
#concierge button[style*="linear-gradient(145deg,#0065f1"],
#concierge button[style*="linear-gradient(145deg, #0065f1"] {
  background: linear-gradient(135deg, #0055d4, #0065f1) !important;
  box-shadow: 0 4px 14px rgba(0,101,241,0.28) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}
#concierge button[style*="linear-gradient(145deg,#0065f1"]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0,101,241,0.36) !important;
}

/* ── Specials grid items (JS-generated) and vendor cards — hover lift ── */
#concierge #cs-specials-grid > *,
#concierge #cs-vendor-list > *,
#concierge [id^="conc-results"] > *,
#concierge .concierge-vendor-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}
#concierge #cs-specials-grid > *:hover,
#concierge #cs-vendor-list > *:hover,
#concierge .concierge-vendor-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,101,241,0.10), 0 12px 32px rgba(0,101,241,0.08) !important;
  border-color: rgba(0,101,241,0.28) !important;
}