/* Per-vendor customer portal palette. Values are injected as CSS variables. */
:root { --primary-color: var(--site-primary, #111827); }

/* Customer portal controls use the portal palette, never the legacy admin template color. */
.qv-shell .btn-primary,
.qv-shell .btn-dark,
.qv-shell .btn-premium-dark,
body.portal-themed .btn-primary,
body.portal-themed .btn-dark,
body.portal-themed .btn-premium-dark {
  background-color: var(--site-primary) !important;
  border-color: var(--site-primary) !important;
}

.qv-shell .btn-primary:hover,
.qv-shell .btn-dark:hover,
.qv-shell .btn-premium-dark:hover,
body.portal-themed .btn-primary:hover,
body.portal-themed .btn-dark:hover,
body.portal-themed .btn-premium-dark:hover {
  background-color: var(--site-primary-dark) !important;
  border-color: var(--site-primary-dark) !important;
}

/* Service cards remain visually unchanged on hover; the link is still clickable. */
body.portal-themed .svc-card:hover,
.qv-shell .svc-card:hover {
  background-color: #f8fafc !important;
  border-color: #f1f5f9 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.portal-themed .svc-card:hover [class~="group-hover:text-[#111827]"],
.qv-shell .svc-card:hover [class~="group-hover:text-[#111827]"] {
  color: #0f172a !important;
}

body.portal-themed .svc-card:hover [class~="text-emerald-600"], .qv-shell .svc-card:hover [class~="text-emerald-600"] { color: #059669 !important; }
body.portal-themed .svc-card:hover [class~="text-blue-600"], .qv-shell .svc-card:hover [class~="text-blue-600"] { color: #2563eb !important; }
body.portal-themed .svc-card:hover [class~="text-purple-600"], .qv-shell .svc-card:hover [class~="text-purple-600"] { color: #9333ea !important; }
body.portal-themed .svc-card:hover [class~="text-amber-600"], .qv-shell .svc-card:hover [class~="text-amber-600"] { color: #d97706 !important; }
body.portal-themed .svc-card:hover [class~="text-pink-600"], .qv-shell .svc-card:hover [class~="text-pink-600"] { color: #db2777 !important; }
body.portal-themed .svc-card:hover [class~="text-red-600"], .qv-shell .svc-card:hover [class~="text-red-600"] { color: #dc2626 !important; }
body.portal-themed .svc-card:hover [class~="text-cyan-600"], .qv-shell .svc-card:hover [class~="text-cyan-600"] { color: #0891b2 !important; }
body.portal-themed .svc-card:hover [class~="text-indigo-600"], .qv-shell .svc-card:hover [class~="text-indigo-600"] { color: #4f46e5 !important; }
body.portal-themed .svc-card:hover [class~="text-teal-600"], .qv-shell .svc-card:hover [class~="text-teal-600"] { color: #0d9488 !important; }
body.portal-themed .svc-card:hover [class~="text-rose-600"], .qv-shell .svc-card:hover [class~="text-rose-600"] { color: #e11d48 !important; }
body.portal-themed .svc-card:hover [class~="text-violet-600"], .qv-shell .svc-card:hover [class~="text-violet-600"] { color: #7c3aed !important; }

body.portal-themed .svc-card:hover [class~="bg-emerald-50"], .qv-shell .svc-card:hover [class~="bg-emerald-50"] { background-color: #ecfdf5 !important; }
body.portal-themed .svc-card:hover [class~="bg-blue-50"], .qv-shell .svc-card:hover [class~="bg-blue-50"] { background-color: #eff6ff !important; }
body.portal-themed .svc-card:hover [class~="bg-purple-50"], .qv-shell .svc-card:hover [class~="bg-purple-50"] { background-color: #faf5ff !important; }
body.portal-themed .svc-card:hover [class~="bg-amber-50"], .qv-shell .svc-card:hover [class~="bg-amber-50"] { background-color: #fffbeb !important; }
body.portal-themed .svc-card:hover [class~="bg-pink-50"], .qv-shell .svc-card:hover [class~="bg-pink-50"] { background-color: #fdf2f8 !important; }
body.portal-themed .svc-card:hover [class~="bg-red-50"], .qv-shell .svc-card:hover [class~="bg-red-50"] { background-color: #fef2f2 !important; }
body.portal-themed .svc-card:hover [class~="bg-cyan-50"], .qv-shell .svc-card:hover [class~="bg-cyan-50"] { background-color: #ecfeff !important; }
body.portal-themed .svc-card:hover [class~="bg-indigo-50"], .qv-shell .svc-card:hover [class~="bg-indigo-50"] { background-color: #eef2ff !important; }
body.portal-themed .svc-card:hover [class~="bg-teal-50"], .qv-shell .svc-card:hover [class~="bg-teal-50"] { background-color: #f0fdfa !important; }
body.portal-themed .svc-card:hover [class~="bg-rose-50"], .qv-shell .svc-card:hover [class~="bg-rose-50"] { background-color: #fff1f2 !important; }
body.portal-themed .svc-card:hover [class~="bg-violet-50"], .qv-shell .svc-card:hover [class~="bg-violet-50"] { background-color: #f5f3ff !important; }

body.portal-themed .dash-service-card:hover,
.qv-shell .dash-service-card:hover {
  background-color: #f8fafc !important;
  border-color: #f1f5f9 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.portal-themed .dash-service-card:hover [class~="group-hover:bg-[#111827]"],
.qv-shell .dash-service-card:hover [class~="group-hover:bg-[#111827]"] {
  background-color: #f1f5f9 !important;
}

body.portal-themed .dash-service-card:hover [class~="group-hover:text-white"],
.qv-shell .dash-service-card:hover [class~="group-hover:text-white"] {
  color: #111827 !important;
}

body.portal-themed .dash-service-card:hover [class~="group-hover:text-[#111827]"],
.qv-shell .dash-service-card:hover [class~="group-hover:text-[#111827]"] {
  color: #1f2937 !important;
}

body.portal-themed .dash-service-card:hover [class~="group-hover:scale-105"],
.qv-shell .dash-service-card:hover [class~="group-hover:scale-105"] {
  transform: none !important;
}
body.portal-themed,
.qv-shell,
.portal-page-bg {
  background-color: var(--site-portal-bg) !important;
}

body.portal-themed [class~="bg-[#111827]"],
.qv-shell [class~="bg-[#111827]"] {
  background-color: var(--site-primary) !important;
}

body.portal-themed [class~="bg-[#1f2937]"],
.qv-shell [class~="bg-[#1f2937]"] {
  background-color: var(--site-primary-dark) !important;
}

body.portal-themed [class~="bg-[#111827]/95"],
.qv-shell [class~="bg-[#111827]/95"] {
  background-color: color-mix(in srgb, var(--site-primary) 95%, transparent) !important;
}

.site-accent-text {
  color: var(--site-accent) !important;
}

.site-accent-bg {
  background-color: var(--site-accent) !important;
}

body.portal-themed [class~="text-[#111827]"],
.qv-shell [class~="text-[#111827]"] {
  color: var(--site-primary) !important;
}

body.portal-themed [class~="text-[#1f2937]"],
.qv-shell [class~="text-[#1f2937]"] {
  color: var(--site-primary-dark) !important;
}

body.portal-themed [class~="border-[#111827]"],
.qv-shell [class~="border-[#111827]"] {
  border-color: var(--site-primary) !important;
}

body.portal-themed [class~="hover:bg-[#111827]"]:hover,
.qv-shell [class~="hover:bg-[#111827]"]:hover {
  background-color: var(--site-primary) !important;
}

body.portal-themed [class~="hover:bg-[#1f2937]"]:hover,
.qv-shell [class~="hover:bg-[#1f2937]"]:hover {
  background-color: var(--site-primary-dark) !important;
}

body.portal-themed [class~="hover:bg-[#374151]"]:hover,
.qv-shell [class~="hover:bg-[#374151]"]:hover {
  background-color: var(--site-primary-dark) !important;
}

body.portal-themed [class~="hover:bg-slate-800"]:hover,
.qv-shell [class~="hover:bg-slate-800"]:hover {
  background-color: var(--site-primary-dark) !important;
}

body.portal-themed .group:hover [class~="group-hover:bg-[#111827]"],
.qv-shell .group:hover [class~="group-hover:bg-[#111827]"] {
  background-color: var(--site-primary) !important;
}

body.portal-themed .group:hover [class~="group-hover:text-[#111827]"],
.qv-shell .group:hover [class~="group-hover:text-[#111827]"] {
  color: var(--site-primary) !important;
}

body.portal-themed [class~="from-[#111827]"],
.qv-shell [class~="from-[#111827]"] {
  --tw-gradient-from: var(--site-primary) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: color-mix(in srgb, var(--site-primary) 0%, transparent) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

body.portal-themed [class~="to-[#1f2937]"],
.qv-shell [class~="to-[#1f2937]"] {
  --tw-gradient-to: var(--site-primary-dark) var(--tw-gradient-to-position) !important;
}

body.portal-themed [class~="to-[#0f172a]"],
.qv-shell [class~="to-[#0f172a]"] {
  --tw-gradient-to: var(--site-primary-dark) var(--tw-gradient-to-position) !important;
}

body.portal-themed [class~="bg-[#f3f4f6]"],
.qv-shell [class~="bg-[#f3f4f6]"] {
  background-color: var(--site-portal-bg) !important;
}

.qv-shell .btn-primary,
.qv-shell .btn-dark,
.qv-shell .btn-premium-dark,
body.portal-themed .btn-primary,
body.portal-themed .btn-dark,
body.portal-themed .btn-premium-dark {
  background-color: var(--site-primary) !important;
  border-color: var(--site-primary) !important;
}

.qv-shell .btn-primary:hover,
.qv-shell .btn-dark:hover,
.qv-shell .btn-premium-dark:hover,
body.portal-themed .btn-primary:hover,
body.portal-themed .btn-dark:hover,
body.portal-themed .btn-premium-dark:hover {
  background-color: var(--site-primary-dark) !important;
  border-color: var(--site-primary-dark) !important;
}

.qv-shell .btn-outline-primary,
body.portal-themed .btn-outline-primary {
  color: var(--site-primary) !important;
  border-color: var(--site-primary) !important;
}

.qv-shell .btn-outline-primary:hover,
body.portal-themed .btn-outline-primary:hover {
  color: #fff !important;
  background-color: var(--site-primary) !important;
}

.qv-shell .form-control:focus,
.qv-shell .form-select:focus,
body.portal-themed .form-control:focus,
body.portal-themed .form-select:focus {
  border-color: var(--site-primary) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--site-primary) 12%, transparent) !important;
}

#ai-fab,
#ai-header,
.qv-capsule-nav {
  --primary-color: var(--site-primary);
}
