/**
 * CoNect Global Technology — Admin
 * Black & gold only: override Filament's default blue to gold
 */

/* ========== Force gold everywhere (replace Filament blue) ========== */
.fi-body [class*="text-primary"],
.fi-body [class*="text-info"],
.dark [class*="text-primary"],
.dark [class*="text-info"] {
  color: #d4af37 !important;
}

/* Gold for primary (dropdown panel items overridden below — dark + white text only) */
.fi-body [class*="bg-primary"]:not([class*="bg-primary-500/10"]):not([class*="bg-primary-500/5"]),
.fi-body [class*="bg-info"],
.dark [class*="bg-primary"]:not([class*="/10"]):not([class*="/5"]),
.dark [class*="bg-info"] {
  background-color: #d4af37 !important;
}

.fi-body [class*="bg-primary-500/10"],
.fi-body [class*="bg-primary-500/5"],
.fi-body [class*="bg-primary-600/10"],
.dark [class*="bg-primary-500/10"],
.dark [class*="bg-primary-500/5"] {
  background-color: rgba(212, 175, 55, 0.1) !important;
}

.fi-body [class*="border-primary"],
.fi-body [class*="border-info"],
.fi-body [class*="focus:border-primary"],
.fi-body [class*="focus:ring-primary"],
.dark [class*="border-primary"],
.dark [class*="border-info"] {
  border-color: rgba(212, 175, 55, 0.5) !important;
}

.fi-body [class*="ring-primary"],
.fi-body [class*="focus:ring-primary"],
.fi-body input:focus,
.fi-body select:focus,
.fi-body textarea:focus,
.dark [class*="ring-primary"],
.dark [class*="focus:ring-primary"] {
  --tw-ring-color: rgba(212, 175, 55, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2) !important;
}

.fi-body a[class*="primary"],
.fi-body a[class*="hover:text-primary"],
.fi-body button[class*="primary"],
.dark a[class*="primary"],
.dark a[class*="hover:text-primary"] {
  color: #d4af37 !important;
}

.fi-body a:hover[class*="primary"],
.fi-body a[class*="hover:text-primary"]:hover,
.dark a:hover[class*="primary"] {
  color: #e8c547 !important;
}

/* Filament sidebar collapse/close buttons (often blue) */
.fi-body .filament-sidebar-collapse-button,
.fi-body .filament-sidebar-close-button,
.fi-body .filament-sidebar-open-button {
  color: #d4af37 !important;
}

.fi-body .filament-sidebar-collapse-button:hover,
.fi-body .filament-sidebar-close-button:hover,
.fi-body .filament-sidebar-open-button:hover {
  background-color: rgba(212, 175, 55, 0.1) !important;
  color: #e8c547 !important;
}

/* Links and hover states that use primary */
.fi-body .fi-link,
.fi-body a.fi-link {
  color: #d4af37 !important;
}

.fi-body .fi-link:hover,
.fi-body a.fi-link:hover {
  color: #e8c547 !important;
}

/* ========== Footer: dark in dark mode, light in light mode ========== */
.dark .filament-main-footer,
.dark .filament-footer,
.dark .fi-body .filament-main-footer,
.dark [class*="filament-footer"],
.dark [class*="filament-main-footer"] {
  background: #0a0a0c !important;
  background-color: #0a0a0c !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: var(--cgt-text-muted) !important;
}

.dark .filament-footer a,
.dark .fi-body .filament-footer a {
  color: var(--cgt-gold) !important;
}

.dark .filament-footer a:hover {
  color: var(--cgt-gold-bright) !important;
}

/* Light mode: footer matches light theme (no black bar) */
html:not(.dark) .filament-main-footer,
html:not(.dark) .filament-footer,
html:not(.dark) .fi-body .filament-main-footer,
html:not(.dark) [class*="filament-footer"],
html:not(.dark) [class*="filament-main-footer"] {
  background: #f4f4f5 !important;
  background-color: #f4f4f5 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #71717a !important;
}

html:not(.dark) .filament-footer a,
html:not(.dark) .fi-body .filament-footer a {
  color: #b45309 !important;
}

html:not(.dark) .filament-footer a:hover {
  color: #92400e !important;
}

/* ========== Neutral black backgrounds only (no blue) — only in dark mode so theme toggle works ========== */
/* Nuclear: in dark mode, replace ANY Tailwind blue-tinted gray (body, topbar, cards, etc.) */
html.dark .filament-body,
html.dark body.filament-body,
.dark .filament-body,
.dark body.filament-body {
  background: #08080a !important;
  background-color: #08080a !important;
}

.dark .fi-body [class*="bg-gray-800"],
.dark .fi-body [class*="bg-gray-700"],
.dark .fi-body [class*="bg-gray-900"],
.dark .filament-main [class*="bg-gray-800"],
.dark .filament-main [class*="bg-gray-700"],
.dark .filament-main-content [class*="bg-gray-800"],
.dark .filament-main-content [class*="bg-gray-700"],
.dark [class*="bg-gray-800"],
.dark [class*="bg-gray-700"] {
  background-color: #0e0e10 !important;
  background: #0e0e10 !important;
}

/* Light mode: let Filament default show (or use neutral light gray) */
html:not(.dark) .fi-body,
html:not(.dark) .filament-body {
  background: #f4f4f5 !important;
  background-image: none !important;
}

.fi-body.dark,
.dark .fi-body,
html.dark .fi-body,
html.dark .filament-body {
  background: #08080a !important;
  background-image: none !important;
}

/* Dark mode only for app layout */
html.dark .filament-app-layout,
.dark .filament-app-layout {
  background: #08080a !important;
}

html:not(.dark) .filament-app-layout {
  background: #f4f4f5 !important;
}

html.dark .filament-main,
html.dark .filament-main-content,
.dark .filament-main,
.dark .filament-main-content {
  background: #0a0a0c !important;
}

html:not(.dark) .filament-main,
html:not(.dark) .filament-main-content {
  background: #ffffff !important;
}

html.dark .filament-sidebar,
.dark .filament-sidebar {
  background: #0e0e10 !important;
}

html:not(.dark) .filament-sidebar {
  background: #ffffff !important;
  border-right-color: rgba(0, 0, 0, 0.08) !important;
}

.filament-sidebar-close-overlay {
  background: rgba(0, 0, 0, 0.6) !important;
}

/* Topbar: force neutral dark (no blue) — header has dark:bg-gray-800 from Filament */
html.dark .fi-topbar,
.dark .fi-topbar,
html.dark .filament-main-topbar,
.dark .filament-main-topbar,
.dark header.filament-main-topbar,
.dark header[class*="filament-main-topbar"] {
  background: #0e0e10 !important;
  background-color: #0e0e10 !important;
  border-bottom-color: rgba(255, 255, 255, 0.07) !important;
}

html:not(.dark) .fi-topbar,
html:not(.dark) .filament-main-topbar {
  background: #ffffff !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

/* User avatar in topbar: no blue border/ring (neutral or gold) */
.dark .fi-topbar [class*="rounded-full"][class*="bg-"],
.dark .filament-user-avatar,
.dark .fi-topbar .filament-user-avatar {
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

.dark .fi-topbar button:focus [class*="rounded-full"],
.dark .fi-topbar [class*="rounded-full"]:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.4) !important;
}

/* Force neutral dark (no blue) on Tailwind gray in dark mode */
.fi-body .bg-gray-800,
.fi-body .bg-gray-900,
.fi-body.dark .bg-gray-800,
.fi-body.dark .bg-gray-900,
.dark .fi-body .bg-gray-800,
.dark .fi-body .bg-gray-900 {
  background-color: var(--cgt-bg-card) !important;
}

/* ========== Welcome card (account widget): no blue ========== */
.dark .filament-account-widget,
.dark .filament-account-widget > div,
.dark .filament-account-widget .rounded-xl,
.dark .filament-account-widget [class*="rounded-xl"],
.dark .filament-account-widget [class*="bg-gray-800"],
.dark .filament-account-widget [class*="dark:bg-gray"] {
  background: #141416 !important;
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

.dark .filament-account-widget h2 {
  color: #f4f4f5 !important;
}

.dark .filament-account-widget .filament-user-avatar,
.dark .filament-account-widget [class*="rounded-full"][class*="bg-"] {
  background-color: #1e1e22 !important;
}

.dark .filament-account-widget button.text-gray-300,
.dark .filament-account-widget button[class*="hover:text-primary"] {
  color: #f4f4f5 !important;
}

.dark .filament-account-widget button:hover {
  color: #e8c547 !important;
}

/* Stat card sparkline: force chart color refs to gold so Chart.js reads gold */
.filament-stats-card span[class*="primary"],
.filament-stats-card span[class*="text-primary"],
.filament-stats-overview-widget-card span[class*="primary"],
.filament-stats-overview-widget-card span[class*="text-primary"] {
  color: #d4af37 !important;
}

/* Chart widget (line chart): ref spans for Chart.js — gold for line; no blue-tinted gray */
.filament-widgets-chart-widget canvas span,
.filament-widgets-chart-widget .text-gray-50,
.filament-widgets-chart-widget .text-gray-500,
.filament-widgets-chart-widget .dark\\:text-gray-300,
.filament-widgets-chart-widget .dark\\:text-gray-200 {
  color: #d4af37 !important;
}

/* Chart section: remove all blue-tinted gray in dark mode (axis labels, grid, legend) */
.dark .filament-widgets-chart-widget [class*="text-gray"],
.dark .filament-widgets-chart-widget .text-gray-50,
.dark .filament-widgets-chart-widget .text-gray-200,
.dark .filament-widgets-chart-widget .text-gray-300,
.dark .filament-widgets-chart-widget .text-gray-400,
.dark .filament-widgets-chart-widget .text-gray-500 {
  color: rgba(255, 255, 255, 0.75) !important;
}

/* ========== Tokens ========== */
:root {
  --cgt-bg: #08080a;
  --cgt-bg-elevated: #0e0e10;
  --cgt-bg-card: #141416;
  --cgt-bg-card-hover: #18181c;
  --cgt-border: rgba(255, 255, 255, 0.07);
  --cgt-border-strong: rgba(255, 255, 255, 0.12);
  --cgt-border-gold: rgba(212, 175, 55, 0.35);
  --cgt-text: #f4f4f5;
  --cgt-text-muted: rgba(255, 255, 255, 0.5);
  --cgt-gold: #d4af37;
  --cgt-gold-bright: #e8c547;
  --cgt-gold-hover: #f5d654;
  --cgt-gold-solid: #c9a227;
  --cgt-radius: 12px;
  --cgt-radius-lg: 16px;
  --cgt-sidebar-width: 260px;
}

:root,
.dark {
  --primary-50: 254 252 232;
  --primary-100: 254 249 195;
  --primary-200: 254 240 138;
  --primary-300: 253 224 71;
  --primary-400: 250 204 21;
  --primary-500: 212 175 55;
  --primary-600: 184 134 11;
  --primary-700: 161 98 7;
  --primary-800: 133 77 14;
  --primary-900: 113 63 18;
}

/* ========== Base ========== */
.dark .fi-body,
html.dark .fi-body {
  color: var(--cgt-text) !important;
}

html:not(.dark) .fi-body {
  color: #18181b !important;
}

.fi-body {
  min-height: 100vh !important;
}

.dark .fi-main,
html.dark .fi-main {
  background: #0a0a0c !important;
}

html:not(.dark) .fi-main {
  background: #ffffff !important;
}

.fi-main {
  padding: 1.75rem 2rem !important;
}

/* ========== Sidebar: active = solid gold ========== */
.dark .fi-sidebar,
html.dark .fi-sidebar {
  background: var(--cgt-bg-elevated) !important;
  border-right: 1px solid var(--cgt-border) !important;
}

.fi-sidebar {
  width: var(--cgt-sidebar-width) !important;
}

.dark .fi-sidebar-header {
  border-bottom: 1px solid var(--cgt-border) !important;
}

.fi-sidebar-header {
  padding: 1.25rem 1.5rem !important;
}

html:not(.dark) .fi-sidebar-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.fi-sidebar-group-button {
  font-size: 0.6875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 0.5rem 0.75rem !important;
}

.dark .fi-sidebar-group-button {
  color: var(--cgt-text-muted) !important;
}

html:not(.dark) .fi-sidebar-group-button {
  color: #71717a !important;
}

/* Sidebar nav link */
.filament-sidebar-item a,
.fi-sidebar-item-button {
  border-radius: var(--cgt-radius) !important;
  padding: 0.75rem 1rem !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

.dark .filament-sidebar-item a:not(.bg-primary-500),
.dark .fi-sidebar-item-button:not(.fi-active) {
  color: var(--cgt-text-muted) !important;
}

.dark .filament-sidebar-item a:hover:not(.bg-primary-500),
.dark .fi-sidebar-item-button:hover:not(.fi-active) {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--cgt-text) !important;
}

html:not(.dark) .filament-sidebar-item a:not(.bg-primary-500),
html:not(.dark) .fi-sidebar-item-button:not(.fi-active) {
  color: #71717a !important;
}

html:not(.dark) .filament-sidebar-item a:hover:not(.bg-primary-500),
html:not(.dark) .fi-sidebar-item-button:hover:not(.fi-active) {
  background: rgba(0, 0, 0, 0.04) !important;
  color: #18181b !important;
}

/* Active sidebar item: gold background + dark text so label is visible (Filament uses .filament-sidebar-item-active) */
.filament-sidebar-item-active a,
.filament-sidebar-item a.bg-primary-500,
.fi-sidebar-item-button.fi-active {
  background: var(--cgt-gold) !important;
  color: #0a0a0b !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(212, 175, 55, 0.4) !important;
}

.filament-sidebar-item-active a span,
.filament-sidebar-item-active a .flex span,
.filament-sidebar-item-active a * {
  color: #0a0a0b !important;
}

.filament-sidebar-item-active a svg,
.filament-sidebar-item-active a [class*="icon"] {
  color: #0a0a0b !important;
  fill: currentColor !important;
}

.filament-sidebar-item-active a:hover,
.filament-sidebar-item a.bg-primary-500:hover {
  background: var(--cgt-gold-bright) !important;
  color: #0a0a0b !important;
}

.filament-sidebar-item-active a:hover span,
.filament-sidebar-item-active a:hover * {
  color: #0a0a0b !important;
}

/* ========== Topbar ========== */
.dark .fi-topbar,
html.dark .fi-topbar {
  background: rgba(14, 14, 16, 0.9) !important;
  border-bottom: 1px solid var(--cgt-border) !important;
}

.fi-topbar {
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  min-height: 3.5rem !important;
}

/* ========== Page title: big and bold ========== */
.dark .fi-header-heading,
html.dark .fi-header-heading {
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--cgt-text) !important;
}

html:not(.dark) .fi-header-heading {
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: #18181b !important;
}

.fi-header {
  margin-bottom: 1.75rem !important;
  padding-bottom: 1rem !important;
  border-bottom: 1px solid var(--cgt-border) !important;
}

html:not(.dark) .fi-header {
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

/* ========== Stat cards: Stakent-style ========== */
.filament-stats,
.fi-wi-stats-overview-stats {
  gap: 1.5rem !important;
}

/* Grid: 2 columns = big cards */
.filament-stats-overview-widget .filament-stats {
  grid-template-columns: repeat(2, 1fr) !important;
}

@media (max-width: 1023px) {
  .filament-stats-overview-widget .filament-stats {
    grid-template-columns: 1fr !important;
  }
}

/* Card: left gold bar, tall, bold number — dark mode */
.dark .filament-stats-overview-widget-card,
.dark .filament-stats-card,
.dark .fi-wi-stats-overview-stat,
.dark a.filament-stats-overview-widget-card {
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  border-left: 4px solid var(--cgt-gold) !important;
  border-radius: var(--cgt-radius-lg) !important;
  padding: 1.75rem 2rem !important;
  min-height: 160px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
  text-decoration: none !important;
  color: inherit !important;
}

/* Stat cards: light mode — white card, dark text, gold left border */
html:not(.dark) .filament-stats-overview-widget-card,
html:not(.dark) .filament-stats-card,
html:not(.dark) .fi-wi-stats-overview-stat,
html:not(.dark) a.filament-stats-overview-widget-card {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-left: 4px solid var(--cgt-gold) !important;
  border-radius: var(--cgt-radius-lg) !important;
  padding: 1.75rem 2rem !important;
  min-height: 160px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06) !important;
  text-decoration: none !important;
  color: #18181b !important;
}

html:not(.dark) .filament-stats-overview-widget-card:hover,
html:not(.dark) .filament-stats-card:hover,
html:not(.dark) a.filament-stats-overview-widget-card:hover {
  background: #fafafa !important;
  border-color: rgba(212, 175, 55, 0.3) !important;
  border-left-color: var(--cgt-gold-bright) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
  transform: translateY(-2px) !important;
  color: #18181b !important;
}

.filament-stats-overview-widget-card::before,
.filament-stats-card::before {
  display: none !important;
}

.dark .filament-stats-overview-widget-card:hover,
.dark .filament-stats-card:hover,
.dark .fi-wi-stats-overview-stat:hover,
.dark a.filament-stats-overview-widget-card:hover {
  background: var(--cgt-bg-card-hover) !important;
  border-color: var(--cgt-border-gold) !important;
  border-left-color: var(--cgt-gold-bright) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4), 0 0 0 1px var(--cgt-border-gold) !important;
  transform: translateY(-3px) !important;
  color: inherit !important;
}

/* Number: huge and bold — dark mode */
.dark .filament-stats-overview-widget-card .text-3xl,
.dark .filament-stats-card .text-3xl,
.dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value,
.dark [class*="filament-stats-overview-widget-card"] .text-3xl {
  font-size: 3rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.05em !important;
  color: var(--cgt-text) !important;
  line-height: 1.1 !important;
}

/* Number: light mode */
html:not(.dark) .filament-stats-overview-widget-card .text-3xl,
html:not(.dark) .filament-stats-card .text-3xl,
html:not(.dark) [class*="filament-stats-overview-widget-card"] .text-3xl {
  font-size: 3rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.05em !important;
  color: #18181b !important;
  line-height: 1.1 !important;
}

.dark .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description,
.dark .filament-stats-card .text-sm,
.dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description {
  font-size: 0.875rem !important;
  color: var(--cgt-text-muted) !important;
  font-weight: 500 !important;
}

html:not(.dark) .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description,
html:not(.dark) .filament-stats-card .text-sm,
html:not(.dark) .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description {
  font-size: 0.875rem !important;
  color: #71717a !important;
  font-weight: 500 !important;
}

/* Sparkline in card: gold stroke */
.filament-stats-overview-widget-card canvas,
.filament-stats-card canvas {
  opacity: 0.9 !important;
}

/* ========== Modern dashboard UI (clean, minimal, professional) ========== */
.filament-dashboard-page.filament-page {
  padding: 0 !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.filament-dashboard-page.filament-page > .space-y-6 {
  padding: 2rem 0 3rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2.5rem !important;
  margin: 0 !important;
}

/* Stat cards: minimal — subtle border, soft shadow, no thick gold bar */
.filament-dashboard-page .dark .filament-stats-overview-widget-card,
.filament-dashboard-page .dark .fi-wi-stats-overview-stat,
.filament-dashboard-page .dark a.filament-stats-overview-widget-card {
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  border-left: none !important;
  border-radius: 12px !important;
  padding: 1.5rem 1.75rem !important;
  min-height: 120px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease !important;
}

.filament-dashboard-page .dark .filament-stats-overview-widget-card:hover,
.filament-dashboard-page .dark .fi-wi-stats-overview-stat:hover,
.filament-dashboard-page .dark a.filament-stats-overview-widget-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  border-color: var(--cgt-border-strong) !important;
  transform: none !important;
}

.filament-dashboard-page .dark .filament-stats-overview-widget-card .text-3xl,
.filament-dashboard-page .dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value,
.filament-dashboard-page .dark [class*="filament-stats-overview-widget-card"] .text-3xl {
  font-size: 2rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}

.filament-dashboard-page .dark .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description,
.filament-dashboard-page .dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description {
  font-size: 0.8125rem !important;
  color: var(--cgt-text-muted) !important;
  font-weight: 400 !important;
}

.filament-dashboard-page html:not(.dark) .filament-stats-overview-widget-card,
.filament-dashboard-page html:not(.dark) .fi-wi-stats-overview-stat,
.filament-dashboard-page html:not(.dark) a.filament-stats-overview-widget-card {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-left: none !important;
  border-radius: 12px !important;
  padding: 1.5rem 1.75rem !important;
  min-height: 120px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease !important;
}

.filament-dashboard-page html:not(.dark) .filament-stats-overview-widget-card:hover,
.filament-dashboard-page html:not(.dark) .fi-wi-stats-overview-stat:hover,
.filament-dashboard-page html:not(.dark) a.filament-stats-overview-widget-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  transform: none !important;
}

.filament-dashboard-page html:not(.dark) .filament-stats-overview-widget-card .text-3xl,
.filament-dashboard-page html:not(.dark) [class*="filament-stats-overview-widget-card"] .text-3xl {
  font-size: 2rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}

.filament-dashboard-page html:not(.dark) .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description,
.filament-dashboard-page html:not(.dark) .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description {
  font-size: 0.8125rem !important;
  color: #71717a !important;
  font-weight: 400 !important;
}

/* Stat grid: 3 columns on large screens for tighter, modern grid */
.filament-dashboard-page .filament-stats-overview-widget .filament-stats {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1.25rem !important;
}

@media (max-width: 1023px) {
  .filament-dashboard-page .filament-stats-overview-widget .filament-stats {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .filament-dashboard-page .filament-stats-overview-widget .filament-stats {
    grid-template-columns: 1fr !important;
  }
  .filament-dashboard-page.filament-page > .space-y-6 {
    padding: 1.25rem 0 2rem !important;
  }
}

/* Account widget: minimal card on dashboard */
.filament-dashboard-page .dark .filament-account-widget,
.filament-dashboard-page .dark .filament-account-widget > div,
.filament-dashboard-page .dark .filament-account-widget .rounded-xl,
.filament-dashboard-page .dark .filament-account-widget [class*="rounded-xl"] {
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
}

.filament-dashboard-page .dark .filament-account-widget h2 {
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
}

.filament-dashboard-page html:not(.dark) .filament-account-widget,
.filament-dashboard-page html:not(.dark) .filament-account-widget > div,
.filament-dashboard-page html:not(.dark) .filament-account-widget .rounded-xl {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

/* Chart widgets: minimal card on dashboard */
.filament-dashboard-page .dark .filament-widgets-chart-widget > div,
.filament-dashboard-page .dark .filament-widgets-chart-widget [class*="rounded-xl"],
.filament-dashboard-page .dark .filament-widgets-chart-widget [class*="bg-gray-800"] {
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  border-left: none !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
  padding: 1.5rem 1.75rem !important;
}

.filament-dashboard-page html:not(.dark) .filament-widgets-chart-widget > div,
.filament-dashboard-page html:not(.dark) .filament-widgets-chart-widget [class*="rounded-xl"] {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-left: none !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  padding: 1.5rem 1.75rem !important;
}

.filament-dashboard-page .filament-widgets-chart-widget .fi-section-header-heading,
.filament-dashboard-page .filament-widgets-chart-widget [class*="card.heading"] {
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
}

/* ========== Charts: neutral black card in dark mode (no blue) ========== */
/* Override Filament card inside chart widget (it uses dark:bg-gray-800 = blue-tinted) */
.dark .filament-widgets-chart-widget,
.dark .filament-widgets-chart-widget .fi-section-content-ctn,
.dark .filament-widgets-chart-widget [class*="fi-fo-component-block"],
.dark .filament-widgets-chart-widget .fi-section,
.dark .fi-body .filament-widgets-chart-widget,
.dark .filament-widgets-chart-widget .fi-section-content-ctn,
/* Card is direct child: rounded-xl bg-white dark:bg-gray-800 */
.dark .filament-widgets-chart-widget > div,
.dark .filament-widgets-chart-widget [class*="rounded-xl"],
.dark .filament-widgets-chart-widget [class*="bg-gray-800"],
.dark .filament-widgets-chart-widget [class*="dark:bg-gray"] {
  background: #141416 !important;
  background-color: #141416 !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-left: 4px solid var(--cgt-gold) !important;
  border-radius: var(--cgt-radius-lg) !important;
  padding: 2rem !important;
  position: relative !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}

.filament-widgets-chart-widget .fi-section-content-ctn::before,
.filament-widgets-chart-widget [class*="fi-fo-component-block"]::before {
  display: none !important;
}

.dark .filament-widgets-chart-widget .fi-fo-field-wrp-label,
.dark .filament-widgets-chart-widget .fi-section-header-heading,
.dark .filament-widgets-chart-widget [class*="card.heading"] {
  color: var(--cgt-text) !important;
}

.filament-widgets-chart-widget .fi-fo-field-wrp-label,
.filament-widgets-chart-widget .fi-section-header-heading,
.filament-widgets-chart-widget [class*="card.heading"] {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}

.filament-widgets-chart-widget canvas {
  border-radius: 8px !important;
}

/* Chart widget filter select: dark = neutral dark; light = white */
.dark .filament-widgets-chart-widget select {
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: var(--cgt-text) !important;
}

html:not(.dark) .filament-widgets-chart-widget select {
  background-color: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #18181b !important;
}

/* Chart cards: light mode — white card, dark text, gold left border */
html:not(.dark) .filament-widgets-chart-widget > div,
html:not(.dark) .filament-widgets-chart-widget [class*="rounded-xl"] {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-left: 4px solid var(--cgt-gold) !important;
  border-radius: var(--cgt-radius-lg) !important;
  padding: 2rem !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06) !important;
}

html:not(.dark) .filament-widgets-chart-widget .fi-section-header-heading,
html:not(.dark) .filament-widgets-chart-widget [class*="card.heading"] {
  color: #18181b !important;
}

/* ========== User dropdown: dark panel, white text only (no gold background on items) ========== */
div.filament-dropdown-panel,
.fi-body .filament-dropdown-panel,
.filament-dropdown .filament-dropdown-panel,
.filament-dropdown-panel,
.dark .filament-dropdown-panel,
.fi-topbar .filament-dropdown-panel {
  background: #141416 !important;
  background-color: #141416 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: var(--cgt-radius-lg) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5) !important;
  color: #f4f4f5 !important;
}

/* Dropdown items: dark panel with white text — NO gold background anywhere in dropdown */
.dark .filament-dropdown-panel .filament-dropdown-list-item,
.dark .filament-dropdown-panel .filament-dropdown-list-item *,
.dark .filament-dropdown-panel button,
.dark .filament-dropdown-panel form,
.dark .filament-dropdown-panel form *,
.dark .filament-dropdown-panel a.filament-dropdown-item {
  background: transparent !important;
  background-color: transparent !important;
  color: #f4f4f5 !important;
}

.dark .filament-dropdown-panel .filament-dropdown-list-item:hover,
.dark .filament-dropdown-panel .filament-dropdown-list-item:hover *,
.dark .filament-dropdown-panel .filament-dropdown-list-item:focus,
.dark .filament-dropdown-panel .filament-dropdown-list-item button:hover,
.dark .filament-dropdown-panel .filament-dropdown-list-item a:hover,
.dark .filament-dropdown-panel button:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #f4f4f5 !important;
}

/* Force override any bg-primary / gold inside dropdown (nuclear) */
.dark .filament-dropdown-panel [class*="bg-primary"],
.dark .filament-dropdown-panel [class*="hover:bg-primary"] {
  background: transparent !important;
  background-color: transparent !important;
}

.dark .filament-dropdown-panel .filament-dropdown-list-item[class*="bg-primary"] {
  background: transparent !important;
  background-color: transparent !important;
}

/* Dropdown panel divide (no blue-gray) */
.dark .filament-dropdown-panel .divide-gray-100,
.dark .filament-dropdown-panel .divide-gray-700 {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.dark .filament-dropdown-panel .filament-dropdown-list-item .filament-dropdown-list-item-icon,
.dark .filament-dropdown-panel .filament-dropdown-list-item [class*="text-primary"],
.dark .filament-dropdown-panel .filament-dropdown-list-item .text-primary-500 {
  color: #f4f4f5 !important;
}

.dark .filament-dropdown-list,
.dark .filament-dropdown-header {
  color: #f4f4f5 !important;
}

.dark .filament-dropdown-header .filament-dropdown-list-item-label,
.dark .filament-dropdown-panel .filament-dropdown-list-item-label {
  color: #f4f4f5 !important;
}

/* Theme toggle item (dark): white text, no gold bg */
.dark .filament-theme-toggle .filament-dropdown-list-item,
.dark .filament-theme-toggle .filament-dropdown-list-item button {
  background: transparent !important;
  color: #f4f4f5 !important;
}

.dark .filament-theme-toggle .filament-dropdown-list-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f4f4f5 !important;
}

.filament-theme-toggle .filament-dropdown-list-item {
  cursor: pointer !important;
}

/* Light mode: dropdown white panel, dark text — ensure all text is visible */
html:not(.dark) .filament-dropdown-panel,
html:not(.dark) div.filament-dropdown-panel {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: #18181b !important;
}

html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item button,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item a,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item span,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item-label,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item *,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-header,
html:not(.dark) .filament-dropdown-panel .filament-dropdown-header * {
  color: #18181b !important;
}

html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item .filament-dropdown-list-item-icon,
html:not(.dark) .filament-dropdown-panel [class*="text-primary"],
html:not(.dark) .filament-dropdown-panel [class*="text-gray"] {
  color: #18181b !important;
}

html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item:hover {
  background: rgba(0, 0, 0, 0.04) !important;
  color: #18181b !important;
}

html:not(.dark) .filament-dropdown-panel .filament-dropdown-list-item:hover * {
  color: #18181b !important;
}

/* ========== Buttons: primary = bold gold, text BLACK on gold (not white) ========== */
.fi-btn {
  border-radius: var(--cgt-radius) !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

.fi-btn-primary,
.fi-body .fi-btn-primary,
.dark .fi-btn-primary {
  background: linear-gradient(180deg, var(--cgt-gold-bright) 0%, var(--cgt-gold) 100%) !important;
  color: #0a0a0b !important;
  border: none !important;
  font-weight: 700 !important;
  padding: 0.625rem 1.25rem !important;
  font-size: 0.9375rem !important;
  box-shadow: 0 4px 12px rgba(212, 175, 55, 0.35) !important;
}

/* Filament uses .filament-button + .text-white for primary filled — force black text on gold */
.fi-body .filament-button[class*="bg-primary"],
.fi-body .filament-button[class*="bg-primary"] *,
.dark .filament-button[class*="bg-primary"],
.dark .filament-button[class*="bg-primary"] *,
.fi-body [class*="bg-primary"].text-white,
.fi-body [class*="bg-primary"] .text-white,
.dark [class*="bg-primary"].text-white,
.dark [class*="bg-primary"] .text-white {
  color: #0a0a0b !important;
  fill: currentColor !important;
}

/* Override global text-primary (gold) so button label and icon stay black on gold */
.fi-btn-primary *,
.fi-body .fi-btn-primary *,
.dark .fi-btn-primary *,
.fi-btn-primary [class*="text-primary"],
.fi-body .fi-btn-primary [class*="text-primary"],
.dark .fi-btn-primary [class*="text-primary"],
[class*="fi-btn-primary"] *,
[class*="fi-btn-primary"] [class*="text-primary"] {
  color: #0a0a0b !important;
  fill: currentColor !important;
}

.fi-btn-primary:hover,
.fi-body .fi-btn-primary:hover,
.dark .fi-btn-primary:hover {
  background: linear-gradient(180deg, var(--cgt-gold-hover) 0%, var(--cgt-gold-bright) 100%) !important;
  box-shadow: 0 6px 16px rgba(212, 175, 55, 0.5) !important;
  transform: translateY(-2px) !important;
  color: #0a0a0b !important;
}

.fi-btn-primary:hover *,
.fi-body .fi-btn-primary:hover *,
.dark .fi-btn-primary:hover *,
.fi-body .filament-button[class*="bg-primary"]:hover,
.fi-body .filament-button[class*="bg-primary"]:hover *,
.dark .filament-button[class*="bg-primary"]:hover,
.dark .filament-button[class*="bg-primary"]:hover * {
  color: #0a0a0b !important;
  fill: currentColor !important;
}

.fi-btn-secondary,
.fi-btn-gray {
  background: var(--cgt-bg-card-hover) !important;
  color: var(--cgt-text) !important;
  border: 1px solid var(--cgt-border-strong) !important;
}

.fi-btn-secondary:hover,
.fi-btn-gray:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--cgt-border-gold) !important;
  color: var(--cgt-text) !important;
}

/* ========== Cards & panels (no blue) — edit pages, forms, sections ========== */
.dark .fi-section-content-ctn,
.dark .fi-section,
.dark [class*="fi-section-content"],
.dark [class*="fi-section"][class*="rounded-xl"],
.dark [class*="fi-section"][class*="bg-gray"],
.dark [class*="rounded-xl"][class*="bg-gray"],
.dark .filament-forms-fieldset-component,
.dark .filament-forms-repeater-component-item,
.dark .filament-forms-tabs-component,
.dark .fi-fo-component-block,
.dark form [class*="rounded-xl"][class*="border"],
.dark .fi-section-content {
  background: #141416 !important;
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

.dark .filament-form-actions-sticky-panel {
  background: #141416 !important;
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

/* Form field wrappers and labels (edit pages) — no blue */
.dark [class*="fi-fo-field-wrp"],
.dark [class*="fi-fo-component-block"][class*="bg-gray"],
.dark .fi-fo-field-wrp-label {
  color: #f4f4f5 !important;
}

.dark [class*="fi-fo-component-block"] {
  background: #141416 !important;
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

.fi-section-content-ctn {
  border-radius: var(--cgt-radius-lg) !important;
  padding: 1.75rem 2rem !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
}

html:not(.dark) .fi-section-content-ctn {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* ========== SEO & Analytics: Google Tag Code textarea — full width + tall ========== */
/* Force section, grid, column and field wrapper to use 100% width so the textarea is not squeezed */
.fi-section:has(textarea.cgt-google-tag-code),
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-section-content-ctn,
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-component-container,
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-component-container > div,
.fi-section:has(textarea.cgt-google-tag-code) [class*="fi-fo-component-block"],
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-field-wrapper,
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-field-wrapper.space-y-2,
.fi-section:has(textarea.cgt-google-tag-code) .filament-forms-field-wrapper .space-y-2 {
  max-width: 100% !important;
  width: 100% !important;
}

textarea.cgt-google-tag-code,
textarea[id="data.google_tag_code"],
textarea[id="data\[google_tag_code\]"],
#data\\.google_tag_code {
  min-height: 480px !important;
  height: auto !important;
  resize: vertical !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ========== Forms (no blue on inputs) ========== */
.dark .fi-input,
.dark .fi-input[class*="bg-gray"],
.dark input[type="text"],
.dark input[type="email"],
.dark input[type="number"],
.dark input[type="search"],
.dark textarea,
.dark select.fi-input {
  background: #1e1e22 !important;
  background-color: #1e1e22 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #f4f4f5 !important;
}

.fi-input {
  border-radius: var(--cgt-radius) !important;
  padding: 0.625rem 1rem !important;
  font-size: 0.9375rem !important;
}

html:not(.dark) .fi-input {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #18181b !important;
}

.fi-input:focus {
  border-color: rgba(212, 175, 55, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.15) !important;
  outline: none !important;
}

/* ========== Tables (no blue) ========== */
.dark .fi-ta-table,
.dark .fi-ta-header,
.dark [class*="fi-ta-"][class*="bg-gray"]:not(.fi-ta-row),
.dark .fi-table,
.dark [class*="filament-tables"] > div[class*="rounded-xl"],
.dark [class*="filament-tables"] [class*="bg-gray"]:not(.fi-ta-row) {
  background: #141416 !important;
  background-color: #141416 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

.fi-ta-table {
  border-radius: var(--cgt-radius-lg) !important;
  overflow: hidden !important;
  border: 1px solid var(--cgt-border) !important;
  background: var(--cgt-bg-card) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
}

.fi-ta-row {
  border-bottom: 1px solid var(--cgt-border) !important;
  transition: background 0.2s ease !important;
}

.fi-ta-row:hover {
  background: rgba(212, 175, 55, 0.08) !important;
}

.fi-ta-row:nth-child(even) {
  background: rgba(255, 255, 255, 0.02) !important;
}

.fi-ta-row:nth-child(even):hover {
  background: rgba(212, 175, 55, 0.08) !important;
}

.fi-ta-cell {
  padding: 1rem 1.25rem !important;
  font-size: 0.9375rem !important;
  color: var(--cgt-text) !important;
}

.fi-ta-header {
  border-radius: var(--cgt-radius-lg) !important;
  padding: 1.25rem !important;
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  margin-bottom: 1.5rem !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

.fi-ta-header-content .fi-input {
  min-height: 44px !important;
  border-radius: var(--cgt-radius) !important;
}

.fi-ta-header-content .fi-input:focus {
  border-color: rgba(212, 175, 55, 0.5) !important;
  box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.15) !important;
}

/* ========== Links & badges ========== */
a.fi-link {
  color: var(--cgt-gold) !important;
  font-weight: 600 !important;
}

a.fi-link:hover {
  color: var(--cgt-gold-bright) !important;
}

.fi-badge-success,
.fi-badge-primary {
  background: rgba(212, 175, 55, 0.2) !important;
  color: var(--cgt-gold-bright) !important;
  border-radius: 9999px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.625rem !important;
}

.fi-badge-danger {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #f87171 !important;
  border-radius: 9999px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.625rem !important;
}

.fi-badge-warning {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
  border-radius: 9999px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.625rem !important;
}

/* ========== Modals ========== */
.fi-modal-window {
  background: var(--cgt-bg-card) !important;
  border: 1px solid var(--cgt-border) !important;
  border-radius: var(--cgt-radius-lg) !important;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5) !important;
}

.fi-modal-header {
  border-bottom: 1px solid var(--cgt-border) !important;
  padding: 1.25rem 1.5rem !important;
  background: rgba(0, 0, 0, 0.2) !important;
}

/* ========== Focus ========== */
*:focus-visible {
  box-shadow: 0 0 0 2px var(--cgt-bg), 0 0 0 4px rgba(212, 175, 55, 0.5) !important;
}


/* ========== Enhanced Dashboard Layout ========== */

/* Improved Stats Grid - Better spacing and layout */
.filament-stats-overview-widget .filament-stats {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 1.75rem !important;
    margin-bottom: 2rem !important;
}

@media (max-width: 1024px) {
    .filament-stats-overview-widget .filament-stats {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
        gap: 1.25rem !important;
    }
}

@media (max-width: 768px) {
    .filament-stats-overview-widget .filament-stats {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
}

/* Enhanced Stat Cards - Better visual hierarchy */
.dark .filament-stats-card,
.dark .fi-wi-stats-overview-stat,
.dark a.filament-stats-overview-widget-card {
    background: linear-gradient(135deg, var(--cgt-bg-card) 0%, #1a1a1e 100%) !important;
    border: 1px solid var(--cgt-border) !important;
    border-left: 4px solid var(--cgt-gold) !important;
    border-radius: var(--cgt-radius-lg) !important;
    padding: 2rem 1.75rem !important;
    min-height: 180px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.35) !important;
    text-decoration: none !important;
    color: inherit !important;
    position: relative !important;
    overflow: hidden !important;
}

html:not(.dark) .filament-stats-card,
html:not(.dark) .fi-wi-stats-overview-stat,
html:not(.dark) a.filament-stats-overview-widget-card {
    background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-left: 4px solid var(--cgt-gold) !important;
    border-radius: var(--cgt-radius-lg) !important;
    padding: 2rem 1.75rem !important;
    min-height: 180px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08) !important;
    text-decoration: none !important;
    color: #18181b !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Enhanced card hover effects */
.dark .filament-stats-overview-widget-card:hover,
.dark .filament-stats-card:hover,
.dark .fi-wi-stats-overview-stat:hover,
.dark a.filament-stats-overview-widget-card:hover {
    background: linear-gradient(135deg, var(--cgt-bg-card-hover) 0%, #1e1e22 100%) !important;
    border-color: var(--cgt-border-gold) !important;
    border-left-color: var(--cgt-gold-bright) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5) !important;
    transform: translateY(-4px) scale(1.02) !important;
    color: inherit !important;
}

html:not(.dark) .filament-stats-overview-widget-card:hover,
html:not(.dark) .filament-stats-card:hover,
html:not(.dark) .fi-wi-stats-overview-stat:hover,
html:not(.dark) a.filament-stats-overview-widget-card:hover {
    background: linear-gradient(135deg, #fafafa 0%, #f4f4f5 100%) !important;
    border-color: rgba(212, 175, 55, 0.3) !important;
    border-left-color: var(--cgt-gold-bright) !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12) !important;
    transform: translateY(-3px) scale(1.01) !important;
    color: #18181b !important;
}

/* Enhanced card numbers - Better typography */
.dark .filament-stats-card .text-3xl,
.dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value,
.dark [class*="filament-stats-overview-widget-card"] .text-3xl {
    font-size: 3.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.06em !important;
    color: var(--cgt-text) !important;
    line-height: 1 !important;
    margin-bottom: 0.75rem !important;
    position: relative !important;
    z-index: 2 !important;
}

html:not(.dark) .filament-stats-card .text-3xl,
html:not(.dark) .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value,
html:not(.dark) [class*="filament-stats-overview-widget-card"] .text-3xl {
    font-size: 3.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.06em !important;
    color: #18181b !important;
    line-height: 1 !important;
    margin-bottom: 0.75rem !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Enhanced card descriptions */
.dark .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description,
.dark .filament-stats-card .text-sm,
.dark .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description {
    font-size: 0.9rem !important;
    color: var(--cgt-text-muted) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    position: relative !important;
    z-index: 2 !important;
}

html:not(.dark) .filament-stats-overview-widget-card .fi-wi-stats-overview-stat-description,
html:not(.dark) .filament-stats-card .text-sm,
html:not(.dark) .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description {
    font-size: 0.9rem !important;
    color: #64748b !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Subtle background pattern for cards */
.dark .filament-stats-card::before,
.dark .fi-wi-stats-overview-stat::before,
.dark a.filament-stats-overview-widget-card::before {
    content: '' !important;
    position: absolute !important;
    top: -50% !important;
    right: -50% !important;
    width: 200% !important;
    height: 200% !important;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.03) 0%, transparent 70%) !important;
    animation: float 20s ease-in-out infinite !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

@keyframes float {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    33% { transform: translate(30px, -30px) rotate(120deg); }
    66% { transform: translate(-20px, 20px) rotate(240deg); }
}

/* Enhanced Chart Containers */
.dark .filament-widgets-chart-widget [class*="rounded-xl"],
.dark .filament-widgets-chart-widget [class*="bg-gray-800"],
.dark .filament-widgets-chart-widget [class*="dark:bg-gray"] {
    background: linear-gradient(135deg, #141416 0%, #1a1a1e 100%) !important;
    border: 1px solid var(--cgt-border) !important;
    border-left: 4px solid var(--cgt-gold) !important;
    border-radius: var(--cgt-radius-lg) !important;
    padding: 2.25rem !important;
    position: relative !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
    overflow: hidden !important;
}

html:not(.dark) .filament-widgets-chart-widget [class*="rounded-xl"] {
    background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-left: 4px solid var(--cgt-gold) !important;
    border-radius: var(--cgt-radius-lg) !important;
    padding: 2.25rem !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
}

/* Enhanced Chart Headers */
.filament-widgets-chart-widget .fi-section-header-heading,
.filament-widgets-chart-widget [class*="card.heading"] {
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.04em !important;
    color: var(--cgt-text) !important;
    margin-bottom: 1.5rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
}

html:not(.dark) .filament-widgets-chart-widget .fi-section-header-heading,
html:not(.dark) .filament-widgets-chart-widget [class*="card.heading"] {
    color: #18181b !important;
}

/* Improved Dashboard Header */
.fi-header {
    background: linear-gradient(135deg, var(--cgt-bg-card) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border: 1px solid var(--cgt-border) !important;
    border-radius: var(--cgt-radius-lg) !important;
    padding: 2.5rem 2rem !important;
    margin-bottom: 2.5rem !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
    position: relative !important;
    overflow: hidden !important;
}

html:not(.dark) .fi-header {
    background: linear-gradient(135deg, #ffffff 0%, rgba(212, 175, 55, 0.03) 100%) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06) !important;
}

.fi-header::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, var(--cgt-gold), var(--cgt-gold-bright), var(--cgt-gold)) !important;
}

.dark .fi-header-heading,
html.dark .fi-header-heading {
    font-size: 2.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.05em !important;
    color: var(--cgt-text) !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
}

html:not(.dark) .fi-header-heading {
    font-size: 2.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.05em !important;
    color: #18181b !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Better spacing and rhythm */
.filament-main-content {
    padding: 2rem !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

@media (max-width: 1200px) {
    .filament-main-content {
        padding: 1.5rem !important;
    }
}

/* Enhanced responsiveness */
@media (max-width: 640px) {
    .fi-header {
        padding: 2rem 1.5rem !important;
        margin-bottom: 2rem !important;
    }
    
    .fi-header-heading {
        font-size: 1.875rem !important;
    }
    
    .dark .filament-stats-card,
    .dark .fi-wi-stats-overview-stat,
    .dark a.filament-stats-overview-widget-card {
        padding: 1.75rem 1.5rem !important;
        min-height: 160px !important;
    }
    
    html:not(.dark) .filament-stats-card,
    html:not(.dark) .fi-wi-stats-overview-stat,
    html:not(.dark) a.filament-stats-overview-widget-card {
        padding: 1.75rem 1.5rem !important;
        min-height: 160px !important;
    }
}



/* ========== View Live Site Button in Header ========== */

/* Add View Live Site button to header actions */
.fi-header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    flex-wrap: wrap !important;
}

/* Custom View Live Site button for header */
.cgt-header-view-site-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.75rem 1.5rem !important;
    background: linear-gradient(135deg, var(--cgt-gold-bright) 0%, var(--cgt-gold) 100%) !important;
    color: #0a0a0b !important;
    border: none !important;
    border-radius: var(--cgt-radius) !important;
    font-weight: 700 !important;
    font-size: 0.9375rem !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.35) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    overflow: hidden !important;
}

.cgt-header-view-site-btn:hover {
    background: linear-gradient(135deg, var(--cgt-gold-hover) 0%, var(--cgt-gold-bright) 100%) !important;
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.5) !important;
    transform: translateY(-2px) !important;
    color: #0a0a0b !important;
}

.cgt-header-view-site-btn svg {
    width: 16px !important;
    height: 16px !important;
    transition: transform 0.3s ease !important;
}

.cgt-header-view-site-btn:hover svg {
    transform: scale(1.1) !important;
}

/* Shimmer effect for header button */
.cgt-header-view-site-btn::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent) !important;
    transition: left 0.5s ease !important;
}

.cgt-header-view-site-btn:hover::before {
    left: 100% !important;
}

/* Enhanced header layout with better spacing */
.fi-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 1.5rem !important;
}

.fi-header-heading {
    flex: 1 !important;
    margin: 0 !important;
}

/* Responsive header */
@media (max-width: 768px) {
    .fi-header {
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
    }
    
    .fi-header-actions {
        justify-content: center !important;
        margin-top: 1rem !important;
    }
    
    .cgt-header-view-site-btn {
        width: 100% !important;
        justify-content: center !important;
    }
}



/* View Live Site: icon + text in topbar via TopbarServiceProvider (user-menu.start); no background, floating icon animation in provider */
.fi-topbar {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
}

.fi-topbar .fi-topbar-right {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
}

/* Hide the dashboard header actions widget (View Live Site is in topbar) */
.cgt-dashboard-header-actions {
    display: none !important;
}