/* ========================================
   NOVARINT Admin Theme
   Dark navy/teal overlay on HetPlein admin
   ======================================== */

.novarint-theme {
  --nvr-bg: #020617;
  --nvr-surface: #0f172a;
  --nvr-surface-elevated: #1e293b;
  --nvr-text: #f8fafc;
  --nvr-text-secondary: rgba(248, 250, 252, 0.7);
  --nvr-text-tertiary: rgba(248, 250, 252, 0.5);
  --nvr-primary: #1d4ed8;
  --nvr-accent: #10b981;
  --nvr-teal: #0d9488;
  --nvr-border: rgba(255, 255, 255, 0.08);
  --nvr-border-strong: rgba(255, 255, 255, 0.15);
  --nvr-hover: rgba(255, 255, 255, 0.06);
  --nvr-active: rgba(255, 255, 255, 0.1);
  --nvr-shadow: 0 2px 8px rgba(0, 0, 0, 0.4), 0 4px 16px rgba(0, 0, 0, 0.35);
}

/* ── Body & background ──────────────────────── */
.novarint-theme,
.novarint-theme .admin-bg,
.novarint-theme .bg-gray-100,
.novarint-theme .bg-gray-50,
.novarint-theme .bg-white {
  background: var(--nvr-bg) !important;
  color: var(--nvr-text) !important;
}

/* ── Sidebar ────────────────────────────────── */
.novarint-theme .glass-sidebar,
.novarint-theme #sidebar {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
  color: var(--nvr-text) !important;
}

.novarint-theme .glass-sidebar a,
.novarint-theme .glass-sidebar span,
.novarint-theme #sidebar a,
.novarint-theme #sidebar span {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme .glass-sidebar a:hover,
.novarint-theme #sidebar a:hover,
.novarint-theme .glass-sidebar .hover\:bg-white\/40:hover {
  color: var(--nvr-text) !important;
  background: var(--nvr-hover) !important;
}

.novarint-theme .glass-sidebar .bg-primary-500\/10,
.novarint-theme #sidebar .bg-primary-500\/10 {
  background: rgba(29, 78, 216, 0.15) !important;
  color: #93c5fd !important;
}

.novarint-theme .glass-sidebar .bg-primary-500\/10 span,
.novarint-theme .glass-sidebar .bg-primary-500\/10 i {
  color: #93c5fd !important;
}

.novarint-theme .sidebar-group-label,
.novarint-theme .nav-group-label,
.novarint-theme #sidebar .text-gray-400 {
  color: var(--nvr-text-tertiary) !important;
}

.novarint-theme #sidebar .border-white\/20,
.novarint-theme #sidebar .border-t {
  border-color: var(--nvr-border) !important;
}

.novarint-theme .sidebar-user .text-gray-900,
.novarint-theme .sidebar-user .text-gray-500 {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme .sidebar-user .bg-primary-100 {
  background: rgba(29, 78, 216, 0.2) !important;
}

.novarint-theme .sidebar-user .text-primary-600 {
  color: #60a5fa !important;
}

.novarint-theme .nav-tooltip {
  background: var(--nvr-surface-elevated) !important;
  color: var(--nvr-text) !important;
}

.novarint-theme .nav-tooltip::before {
  border-right-color: var(--nvr-surface-elevated) !important;
}

.novarint-theme .glass-sidebar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(135deg, #1d4ed8, #0d9488, #10b981);
  z-index: 1;
}

/* ── Main content area ──────────────────────── */
.novarint-theme main,
.novarint-theme .admin-main,
.novarint-theme .flex-1 {
  background: var(--nvr-bg) !important;
}

/* ── Cards ──────────────────────────────────── */
.novarint-theme .glass-card,
.novarint-theme [class*="glass-card"],
.novarint-theme .rounded-md.p-6,
.novarint-theme .rounded-lg.p-6,
.novarint-theme .rounded-lg.shadow,
.novarint-theme .shadow-sm {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
  color: var(--nvr-text) !important;
  box-shadow: var(--nvr-shadow) !important;
}

/* ── Tables ─────────────────────────────────── */
.novarint-theme table {
  color: var(--nvr-text) !important;
}

.novarint-theme th,
.novarint-theme thead tr {
  background: rgba(15, 23, 42, 0.8) !important;
  color: var(--nvr-text-tertiary) !important;
  border-color: var(--nvr-border) !important;
}

.novarint-theme td {
  border-color: var(--nvr-border) !important;
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme tr:hover td {
  background: var(--nvr-hover) !important;
}

.novarint-theme tbody tr {
  border-color: var(--nvr-border) !important;
}

/* ── Tailwind text color overrides ──────────── */
.novarint-theme .text-gray-900,
.novarint-theme .text-gray-800,
.novarint-theme .text-gray-700 {
  color: var(--nvr-text) !important;
}

.novarint-theme .text-gray-600,
.novarint-theme .text-gray-500 {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme .text-gray-400,
.novarint-theme .text-gray-300 {
  color: var(--nvr-text-tertiary) !important;
}

.novarint-theme .text-primary-600,
.novarint-theme .text-primary-700 {
  color: #60a5fa !important;
}

/* ── Tailwind background overrides ──────────── */
.novarint-theme .bg-gray-50,
.novarint-theme .bg-gray-100,
.novarint-theme .bg-white,
.novarint-theme .hover\:bg-gray-50:hover {
  background: var(--nvr-surface) !important;
}

.novarint-theme .bg-gray-200,
.novarint-theme .bg-gray-300 {
  background: var(--nvr-surface-elevated) !important;
}

.novarint-theme .bg-primary-600,
.novarint-theme .hover\:bg-primary-700:hover,
.novarint-theme .bg-primary-500 {
  background: var(--nvr-primary) !important;
}

.novarint-theme .bg-primary-100,
.novarint-theme .bg-primary-50 {
  background: rgba(29, 78, 216, 0.15) !important;
}

/* ── Tailwind border overrides ──────────────── */
.novarint-theme .border-gray-200,
.novarint-theme .border-gray-300,
.novarint-theme .border-white\/10,
.novarint-theme .border-white\/20,
.novarint-theme .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
  border-color: var(--nvr-border) !important;
}

.novarint-theme .border-gray-400 {
  border-color: var(--nvr-border-strong) !important;
}

/* ── Headings & text ────────────────────────── */
.novarint-theme h1,
.novarint-theme h2,
.novarint-theme h3,
.novarint-theme h4 {
  color: var(--nvr-text) !important;
}

.novarint-theme p {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme label {
  color: var(--nvr-text-secondary) !important;
}

/* ── Form inputs ────────────────────────────── */
.novarint-theme input[type="text"],
.novarint-theme input[type="email"],
.novarint-theme input[type="password"],
.novarint-theme input[type="number"],
.novarint-theme input[type="url"],
.novarint-theme input[type="search"],
.novarint-theme input[type="tel"],
.novarint-theme input[type="date"],
.novarint-theme input[type="datetime-local"],
.novarint-theme select,
.novarint-theme textarea {
  background: var(--nvr-surface-elevated) !important;
  border-color: var(--nvr-border-strong) !important;
  color: var(--nvr-text) !important;
}

.novarint-theme input:focus,
.novarint-theme select:focus,
.novarint-theme textarea:focus {
  border-color: var(--nvr-primary) !important;
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.25) !important;
}

.novarint-theme input::placeholder,
.novarint-theme textarea::placeholder {
  color: var(--nvr-text-tertiary) !important;
}

/* Checkboxes */
.novarint-theme input[type="checkbox"] {
  accent-color: var(--nvr-primary) !important;
}

.novarint-theme .rounded.border-gray-300 {
  border-color: var(--nvr-border-strong) !important;
}

/* ── Buttons ────────────────────────────────── */
.novarint-theme .bg-primary-600,
.novarint-theme button[type="submit"],
.novarint-theme .btn-primary {
  background: linear-gradient(135deg, var(--nvr-primary) 0%, var(--nvr-teal) 50%, var(--nvr-accent) 100%) !important;
  color: white !important;
  border: none !important;
}

.novarint-theme .btn-secondary,
.novarint-theme .btn-ghost,
.novarint-theme .border.border-gray-300.rounded-md {
  background: var(--nvr-surface-elevated) !important;
  border-color: var(--nvr-border-strong) !important;
  color: var(--nvr-text) !important;
}

.novarint-theme .border.border-gray-300.rounded-md:hover {
  background: var(--nvr-active) !important;
}

/* ── Badges ─────────────────────────────────── */
.novarint-theme .bg-green-100,
.novarint-theme .bg-emerald-100 { background: rgba(16, 185, 129, 0.15) !important; }
.novarint-theme .text-green-700,
.novarint-theme .text-green-800,
.novarint-theme .text-emerald-700 { color: #34d399 !important; }

.novarint-theme .bg-red-100 { background: rgba(220, 38, 38, 0.15) !important; }
.novarint-theme .text-red-700,
.novarint-theme .text-red-600 { color: #f87171 !important; }

.novarint-theme .bg-yellow-100,
.novarint-theme .bg-amber-100 { background: rgba(217, 119, 6, 0.15) !important; }
.novarint-theme .text-yellow-700,
.novarint-theme .text-amber-700 { color: #fbbf24 !important; }

.novarint-theme .bg-blue-100 { background: rgba(29, 78, 216, 0.15) !important; }
.novarint-theme .text-blue-700,
.novarint-theme .text-blue-600 { color: #60a5fa !important; }

.novarint-theme .bg-orange-100 { background: rgba(234, 88, 12, 0.15) !important; }
.novarint-theme .text-orange-700 { color: #fb923c !important; }

.novarint-theme .bg-purple-100,
.novarint-theme .bg-purple-500\/10 { background: rgba(139, 92, 246, 0.15) !important; }
.novarint-theme .text-purple-700 { color: #a78bfa !important; }

/* ── Alerts ─────────────────────────────────── */
.novarint-theme .glass-alert-success {
  background: rgba(16, 185, 129, 0.15) !important;
  border-color: rgba(16, 185, 129, 0.3) !important;
  color: #34d399 !important;
}

.novarint-theme .glass-alert-error {
  background: rgba(220, 38, 38, 0.15) !important;
  border-color: rgba(220, 38, 38, 0.3) !important;
  color: #f87171 !important;
}

.novarint-theme .glass-alert-warning {
  background: rgba(217, 119, 6, 0.15) !important;
  border-color: rgba(217, 119, 6, 0.3) !important;
  color: #fbbf24 !important;
}

/* ── Stats cards ────────────────────────────── */
.novarint-theme .stat-card,
.novarint-theme [class*="stats"] .glass-card {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
}

/* ── Dropdowns & popovers ───────────────────── */
.novarint-theme [class*="dropdown"],
.novarint-theme [x-show],
.novarint-theme [x-cloak] {
  background: var(--nvr-surface-elevated) !important;
  border-color: var(--nvr-border-strong) !important;
  color: var(--nvr-text) !important;
}

/* ── Pagination ─────────────────────────────── */
.novarint-theme .pagination a,
.novarint-theme .pagination span,
.novarint-theme nav[role="navigation"] a,
.novarint-theme nav[role="navigation"] span {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme .pagination .active span,
.novarint-theme nav[role="navigation"] span[aria-current] {
  background: var(--nvr-primary) !important;
  color: white !important;
}

/* ── Modals & overlays ──────────────────────── */
.novarint-theme .modal-content,
.novarint-theme [class*="modal"],
.novarint-theme [role="dialog"] {
  background: var(--nvr-surface) !important;
  color: var(--nvr-text) !important;
}

/* ── Tab-like elements ──────────────────────── */
.novarint-theme .border-b-2.border-primary-500 {
  border-color: var(--nvr-primary) !important;
}

/* ── Ring/focus overrides ───────────────────── */
.novarint-theme .focus\:ring-primary-500:focus,
.novarint-theme .focus\:ring-2:focus {
  --tw-ring-color: rgba(29, 78, 216, 0.4) !important;
}

/* ── Hover states for clickable list items ──── */
.novarint-theme .hover\:bg-white\/40:hover,
.novarint-theme .hover\:bg-gray-50:hover,
.novarint-theme .hover\:bg-gray-100:hover {
  background: var(--nvr-hover) !important;
}

/* ── Scrollbars ─────────────────────────────── */
.novarint-theme ::-webkit-scrollbar-track { background: transparent; }
.novarint-theme ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.2); border-radius: 4px; }
.novarint-theme ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.35); }
.novarint-theme ::-webkit-scrollbar { width: 8px; }

/* ── Links ──────────────────────────────────── */
.novarint-theme a {
  color: #60a5fa;
}

.novarint-theme a:hover {
  color: #93c5fd;
}

/* Sidebar links should NOT be blue */
.novarint-theme #sidebar a {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme #sidebar a:hover {
  color: var(--nvr-text) !important;
}

/* White text buttons should stay white */
.novarint-theme .text-white,
.novarint-theme button .text-white {
  color: white !important;
}

/* ── Phosphor icons in dark context ─────────── */
.novarint-theme .text-gray-600 i[class*="ph-"],
.novarint-theme .text-gray-500 i[class*="ph-"] {
  color: var(--nvr-text-secondary) !important;
}

/* ── Admin header / top nav bar ─────────────── */
.novarint-theme .glass-header,
.novarint-theme .admin-header,
.novarint-theme header,
.novarint-theme [class*="admin-header"],
.novarint-theme .border-b.border-gray-200,
.novarint-theme .bg-white.border-b,
.novarint-theme .sticky.top-0 {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
  color: var(--nvr-text) !important;
}

/* ── Feedback button ────────────────────────── */
.novarint-theme #feedback-btn .bg-purple-600 {
  background: linear-gradient(135deg, var(--nvr-primary), var(--nvr-teal)) !important;
}

.novarint-theme #feedback-btn .bg-purple-600:hover,
.novarint-theme #feedback-btn .hover\:bg-purple-700:hover {
  background: linear-gradient(135deg, #1e40af, #0f766e) !important;
}

.novarint-theme #feedback-overlay .bg-white {
  background: var(--nvr-surface) !important;
  color: var(--nvr-text) !important;
}

.novarint-theme #feedback-overlay .bg-purple-50 {
  background: rgba(29, 78, 216, 0.1) !important;
}

.novarint-theme #feedback-overlay .border-gray-200 {
  border-color: var(--nvr-border) !important;
}

/* ── Tour / Onboarding panels ───────────────── */
.novarint-theme .tour-panel,
.novarint-theme .tour-welcome-card,
.novarint-theme .tour-card,
.novarint-theme #tourWelcome .tour-welcome-card,
.novarint-theme #tourCard {
  background: var(--nvr-surface) !important;
  color: var(--nvr-text) !important;
  border: 1px solid var(--nvr-border) !important;
}

.novarint-theme .tour-card-arrow {
  border-color: var(--nvr-surface) !important;
}

.novarint-theme #tourWelcome .text-gray-900,
.novarint-theme #tourCard .text-gray-900 {
  color: var(--nvr-text) !important;
}

.novarint-theme #tourWelcome .text-gray-500,
.novarint-theme #tourCard .text-gray-500 {
  color: var(--nvr-text-secondary) !important;
}

.novarint-theme #tourWelcome .text-gray-400,
.novarint-theme #tourCard .text-gray-400 {
  color: var(--nvr-text-tertiary) !important;
}

.novarint-theme #tourWelcome .hover\:bg-gray-100:hover {
  background: var(--nvr-hover) !important;
}

.novarint-theme #tourWelcome .text-gray-600 {
  color: var(--nvr-text-secondary) !important;
}

/* ── Progress bars ──────────────────────────── */
.novarint-theme .bg-gray-200[class*="rounded-full"],
.novarint-theme [class*="progress"] .bg-gray-200,
.novarint-theme .h-2.bg-gray-200,
.novarint-theme .h-3.bg-gray-200 {
  background: var(--nvr-surface-elevated) !important;
}

.novarint-theme .bg-primary-500,
.novarint-theme .bg-primary-600[class*="rounded-full"],
.novarint-theme [class*="progress"] .bg-primary-500,
.novarint-theme [class*="progress"] .bg-primary-600 {
  background: linear-gradient(90deg, var(--nvr-primary), var(--nvr-teal)) !important;
}

.novarint-theme .bg-green-500,
.novarint-theme .bg-emerald-500 {
  background: var(--nvr-accent) !important;
}

/* ── Onboarding specific ────────────────────── */
.novarint-theme .bg-white.rounded-lg,
.novarint-theme .bg-white.rounded-xl,
.novarint-theme .bg-white.rounded-md {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
}

.novarint-theme .bg-gray-50.rounded-lg,
.novarint-theme .bg-gray-50.rounded-xl,
.novarint-theme .bg-gray-100.rounded-lg {
  background: var(--nvr-surface-elevated) !important;
}

/* ── Dashboard charts / graph areas ─────────── */
.novarint-theme canvas {
  filter: brightness(0.9);
}

.novarint-theme .bg-white.shadow,
.novarint-theme .bg-white.shadow-sm,
.novarint-theme .bg-white.shadow-md {
  background: var(--nvr-surface) !important;
  border-color: var(--nvr-border) !important;
  box-shadow: var(--nvr-shadow) !important;
}

/* ── Select/option elements ─────────────────── */
.novarint-theme option {
  background: var(--nvr-surface-elevated) !important;
  color: var(--nvr-text) !important;
}

/* ── Code / pre blocks ──────────────────────── */
.novarint-theme pre,
.novarint-theme code {
  background: rgba(15, 23, 42, 0.8) !important;
  color: #e2e8f0 !important;
}

/* ── Dividers ───────────────────────────────── */
.novarint-theme hr,
.novarint-theme .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.novarint-theme .border-t.border-gray-200,
.novarint-theme .border-b.border-gray-200 {
  border-color: var(--nvr-border) !important;
}

/* ── Rounded colored backgrounds ────────────── */
.novarint-theme .bg-primary-100.rounded-full,
.novarint-theme .bg-primary-100 {
  background: rgba(29, 78, 216, 0.2) !important;
}

.novarint-theme .text-primary-600 {
  color: #60a5fa !important;
}