/**
 * Nubitix theme trial — "Fresh" (teal + coral)
 * Reversible: remove this file link from app.php (or restore app.css.v1-backup).
 * Does not replace app.css; overrides light + dark accents for a brighter look.
 */

:root {
  --v1: #0d9488;
  --v2: #14b8a6;
  --v3: #f97316;
  --grad-primary: linear-gradient(135deg, #0d9488 0%, #06b6d4 55%, #fb923c 100%);
  --nb-border: #e2e8f0;
  --nb-lead-pill-idle: #f0fdfa;
  --nb-fresh-bg: #f4fbf9;
  --nb-fresh-surface: #ffffff;
  --nb-fresh-accent: #0d9488;
  --nb-fresh-accent-hover: #0f766e;
  --nb-fresh-coral: #f97316;
  --nb-fresh-ink: #0f172a;
  --nb-fresh-muted: #64748b;
}

html.dark {
  --nb-bg: #0b1220;
  --nb-surface: #111827;
  --nb-surface2: #1e293b;
  --nb-border: #334155;
  --nb-accent: #2dd4bf;
  --nb-accent2: #fb923c;
  --nb-accent3: #f87171;
  --nb-text: #f1f5f9;
  --nb-muted: #94a3b8;
  --nb-dim: #64748b;
  --nb-lead-pill-idle: #1e293b;
  --grad-primary: linear-gradient(135deg, #14b8a6, #38bdf8 50%, #fb923c);
}

/* ── Light shell ── */
body {
  background: var(--nb-fresh-bg) !important;
  color: var(--nb-fresh-ink);
}

.nb-main {
  background: var(--nb-fresh-bg);
}

.nb-sidebar {
  background: linear-gradient(180deg, #0f766e 0%, #0d9488 48%, #0891b2 100%) !important;
  border-color: transparent !important;
  color: #ecfdf5;
}

.nb-sidebar .nb-sidebar-head {
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.nb-sidebar .nb-brand-icon {
  background: rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.nb-sidebar .text-gray-900,
.nb-sidebar .font-bold.text-gray-900 {
  color: #fff !important;
}

.nb-sidebar nav > p {
  color: rgba(236, 253, 245, 0.55) !important;
}

.nb-sidebar .nav-item {
  color: rgba(255, 255, 255, 0.82) !important;
}

.nb-sidebar .nav-item:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

.nb-sidebar .nav-item.bg-blue-50,
.nb-sidebar .nav-item.bg-blue-50\/80 {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 0 #115e59;
}

.nb-sidebar .nav-icon {
  opacity: 0.95;
  color: inherit;
}

.nb-sidebar .border-t.border-gray-100,
.nb-sidebar .border-l-2.border-gray-100 {
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.nb-sidebar .text-gray-500,
.nb-sidebar .text-gray-400,
.nb-sidebar .text-gray-600 {
  color: rgba(236, 253, 245, 0.7) !important;
}

/* Search ⌘K — light control on teal; keep dark text (don't inherit mint remap) */
.nb-sidebar button.bg-gray-50 {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  color: #0f766e !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}
.nb-sidebar button.bg-gray-50:hover {
  background: #ffffff !important;
}
.nb-sidebar button.bg-gray-50 .text-gray-400,
.nb-sidebar button.bg-gray-50.text-gray-400,
.nb-sidebar button.bg-gray-50 span,
.nb-sidebar button.bg-gray-50 svg {
  color: #0f766e !important;
}
.nb-sidebar button.bg-gray-50 kbd {
  background: #f0fdfa !important;
  border-color: #99f6e4 !important;
  color: #0f766e !important;
}

/* Support footer — solid surface so title + WA number stay readable */
.nb-sidebar > div.border-t.bg-gray-50\/80,
.nb-sidebar > div[class*="bg-gray-50"] {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}
.nb-sidebar > div.border-t.bg-gray-50\/80 .text-gray-800,
.nb-sidebar > div[class*="bg-gray-50"] .text-gray-800 {
  color: #134e4a !important;
}
.nb-sidebar > div.border-t.bg-gray-50\/80 a.text-green-600,
.nb-sidebar > div[class*="bg-gray-50"] a.text-green-600 {
  color: #15803d !important;
}
.nb-sidebar > div.border-t.bg-gray-50\/80 a.text-green-600:hover,
.nb-sidebar > div[class*="bg-gray-50"] a.hover\:text-green-700:hover {
  color: #166534 !important;
}

.nb-mobile-nav.mobile-nav {
  background: #fff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.06);
}

/* Primary actions → teal (maps common Tailwind blues) */
.bg-blue-600 {
  background-color: var(--nb-fresh-accent) !important;
}
.hover\:bg-blue-700:hover {
  background-color: var(--nb-fresh-accent-hover) !important;
}
.bg-blue-50 {
  background-color: #f0fdfa !important;
}
.bg-blue-100 {
  background-color: #ccfbf1 !important;
}
.text-blue-600,
.text-blue-700 {
  color: var(--nb-fresh-accent) !important;
}
.border-blue-600,
.border-l-blue-600,
.border-blue-300 {
  border-color: #5eead4 !important;
}
.focus\:ring-blue-500:focus {
  --tw-ring-color: rgba(13, 148, 136, 0.45) !important;
}

/* Violet CTAs (login) → coral energy */
.bg-violet-600 {
  background-color: var(--nb-fresh-coral) !important;
}
.hover\:bg-violet-700:hover {
  background-color: #ea580c !important;
}
.text-violet-600 {
  color: var(--nb-fresh-coral) !important;
}
.focus-visible\:ring-violet-500:focus-visible {
  --tw-ring-color: rgba(249, 115, 22, 0.45) !important;
}

/* Soft surfaces */
.bg-gray-50 {
  background-color: #f8fafc !important;
}
.bg-slate-50 {
  background-color: var(--nb-fresh-bg) !important;
}

.nav-item:hover {
  background: #ecfdf5;
}

/* Auth hero — teal ocean instead of purple wash */
.nb-auth-layout > .bg-gradient-to-br {
  background: linear-gradient(145deg, #0f766e 0%, #0e7490 45%, #fb923c 120%) !important;
}

.app-preload {
  background: var(--nb-fresh-bg);
}
.app-preload-spinner {
  border-color: #ccfbf1;
  border-top-color: var(--nb-fresh-accent);
}

/* Dark mode: keep structure, refresh accents to teal/coral */
html.dark .bg-blue-600 {
  background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
}
html.dark .hover\:bg-blue-700:hover {
  background: #0f766e !important;
}
html.dark .text-blue-600 {
  color: #2dd4bf !important;
}
html.dark .bg-blue-50,
html.dark .bg-blue-100 {
  background: rgba(45, 212, 191, 0.12) !important;
}
html.dark .nb-sidebar {
  background: linear-gradient(180deg, #0b1220 0%, #0f172a 100%) !important;
  border-color: var(--nb-border) !important;
}
html.dark .nb-sidebar .nav-item {
  color: var(--nb-muted) !important;
}
html.dark .nb-sidebar .nav-item:hover {
  background: rgba(45, 212, 191, 0.08) !important;
  color: var(--nb-text) !important;
}
html.dark .nb-sidebar .nav-item.bg-blue-50 {
  background: rgba(45, 212, 191, 0.12) !important;
  color: #2dd4bf !important;
  box-shadow: inset 3px 0 0 0 #115e59;
}
html.dark .nb-sidebar .nb-brand-icon {
  background: linear-gradient(135deg, #14b8a6, #fb923c) !important;
}
html.dark .nb-dash .nb-dash-stat-ico,
html.dark .nb-dash .nb-dash-avatar {
  background: linear-gradient(135deg, #14b8a6, #38bdf8 55%, #fb923c) !important;
}