@import url("https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600;700&display=swap");

:root {
  --dv-primary: #3063a0;
  --dv-primary-hover: #254d7e;
  --dv-primary-rgb: 48, 99, 160;
  --dv-success: #28a745;
  --dv-success-hover: #1f8f3a;
  --dv-danger: #dc3545;
  --dv-danger-hover: #c82333;
  --dv-bg: #f8f9fa;
  --dv-surface: #ffffff;
  --dv-surface-alt: #f2f4f6;
  --dv-border: #d9d9d9;
  --dv-text: #545454;
  --dv-text-muted: #a0a0a0;
  color-scheme: light dark;
}

html,
body,
#root {
  min-height: 100%;
}

body {
  font-family: "Hind Siliguri", sans-serif !important;
  background: var(--dv-bg);
  color: var(--dv-text);
  overflow-x: hidden;
}

body,
button,
input,
textarea,
select {
  font-family: "Hind Siliguri", sans-serif !important;
}

::selection {
  background: rgba(var(--dv-primary-rgb), 0.2);
  color: var(--dv-primary);
}

.font-anek,
.font-anek1,
.font-rubik,
.font-tiro,
.font-poppins,
.font-bengali,
.font-Nikosh,
.font-certificate,
.font-signature,
.font-display,
.font-override,
.font-arial,
.font-menium,
.font-inter,
.font-lato,
.font-nunito,
.font-league,
.font-sans {
  font-family: "Hind Siliguri", sans-serif !important;
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: var(--dv-primary);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--dv-primary-hover);
}

.dark ::-webkit-scrollbar-track {
  background: #1e1e1e;
}

.dark ::-webkit-scrollbar-thumb {
  background: #404040;
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: #505050;
}

.dv-notice {
  height: 40px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.28);
  background: rgba(var(--dv-primary-rgb), 0.08);
}

.dark .dv-notice {
  border-color: rgba(var(--dv-primary-rgb), 0.35);
  background: rgba(var(--dv-primary-rgb), 0.12);
}

.dv-theme-shell {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  pointer-events: none;
}

.dv-theme-launcher {
  pointer-events: auto;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 247, 250, 0.92));
  color: var(--dv-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 14px 35px rgba(34, 44, 69, 0.18);
  backdrop-filter: blur(14px);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dv-theme-launcher:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--dv-primary-rgb), 0.42);
  box-shadow: 0 18px 40px rgba(34, 44, 69, 0.24);
}

.dark .dv-theme-launcher {
  background: linear-gradient(180deg, rgba(34, 34, 34, 0.96), rgba(24, 24, 24, 0.92));
  border-color: rgba(var(--dv-primary-rgb), 0.28);
  color: #f4f7fb;
}

.dv-theme-panel {
  pointer-events: auto;
  width: min(340px, calc(100vw - 32px));
  border-radius: 24px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.18);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 24px 70px rgba(23, 34, 56, 0.18);
  backdrop-filter: blur(18px);
  overflow: hidden;
  transform-origin: bottom right;
  transform: translateY(10px) scale(0.96);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;
}

.dv-theme-panel.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.dark .dv-theme-panel {
  background: rgba(28, 28, 28, 0.94);
  border-color: rgba(var(--dv-primary-rgb), 0.22);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.35);
}

.dv-theme-panel__header {
  padding: 16px 18px 12px;
  border-bottom: 1px solid rgba(var(--dv-primary-rgb), 0.12);
}

.dv-theme-panel__title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--dv-text);
}

.dark .dv-theme-panel__title {
  color: #f3f4f6;
}

.dv-theme-panel__subtitle {
  margin-top: 4px;
  font-size: 12px;
  color: #7d8795;
}

.dark .dv-theme-panel__subtitle {
  color: #a0a0a0;
}

.dv-theme-panel__body {
  padding: 16px 18px 18px;
}

.dv-theme-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.dv-theme-mode-btn {
  border: 1px solid rgba(var(--dv-primary-rgb), 0.15);
  background: rgba(248, 249, 250, 0.9);
  color: var(--dv-text);
  padding: 12px 10px;
  border-radius: 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  transition: all 0.2s ease;
}

.dv-theme-mode-btn:hover {
  border-color: rgba(var(--dv-primary-rgb), 0.35);
  transform: translateY(-1px);
}

.dv-theme-mode-btn.is-active {
  background: linear-gradient(135deg, var(--dv-primary), var(--dv-primary-hover));
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 12px 24px rgba(var(--dv-primary-rgb), 0.28);
}

.dark .dv-theme-mode-btn {
  background: rgba(44, 44, 44, 0.9);
  color: #e5e7eb;
  border-color: rgba(255, 255, 255, 0.08);
}

.dv-theme-swatch-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.dv-theme-swatch {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 14px rgba(32, 44, 66, 0.16);
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dv-theme-swatch:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 10px 20px rgba(32, 44, 66, 0.22);
}

.dv-theme-swatch.is-active::after {
  content: "";
  position: absolute;
  inset: 50%;
  width: 14px;
  height: 14px;
  margin: -7px;
  border-radius: 999px;
  border: 2px solid #ffffff;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}

.dark .dv-theme-swatch {
  border-color: rgba(255, 255, 255, 0.12);
}

.dv-theme-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--dv-primary-rgb), 0.22), transparent);
  margin: 16px 0;
}

.dv-theme-custom {
  display: block;
  margin-top: 2px;
}

.dv-theme-custom__label {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #6b7280;
}

.dark .dv-theme-custom__label {
  color: #cbd5e1;
}

.dv-theme-custom__row {
  display: flex;
  gap: 10px;
  align-items: center;
}

.dv-theme-color-input {
  width: 52px;
  height: 52px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.16);
  border-radius: 16px;
  background: transparent;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(32, 44, 66, 0.16);
}

.dv-theme-color-input::-webkit-color-swatch-wrapper {
  padding: 0;
}

.dv-theme-color-input::-webkit-color-swatch {
  border: none;
  border-radius: 14px;
}

.dv-theme-color-text {
  flex: 1;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.16);
  background: rgba(248, 249, 250, 0.95);
  color: var(--dv-text);
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
}

.dark .dv-theme-color-text {
  background: rgba(44, 44, 44, 0.95);
  color: #e5e7eb;
  border-color: rgba(255, 255, 255, 0.08);
}

@media (max-width: 640px) {
  .dv-theme-shell {
    right: 12px;
    bottom: 12px;
  }

  .dv-theme-panel {
    width: min(320px, calc(100vw - 24px));
  }
}

.dark body {
  background-color: #121212 !important;
  color: #e5e7eb !important;
}

.dark body *,
.dark main *,
.dark header *,
.dark aside *,
.dark section *,
.dark article *,
.dark footer * {
  border-color: inherit;
}

.dark .bg-white,
.dark .bg-gray-50,
.dark .bg-slate-50 {
  background-color: #1e1e1e !important;
}

.dark .bg-gray-100,
.dark .bg-slate-100 {
  background-color: #232323 !important;
}

.dark .bg-gray-200,
.dark .bg-slate-200 {
  background-color: #2a2a2a !important;
}

.dark .bg-gray-800,
.dark .bg-slate-800 {
  background-color: #2b2b2b !important;
}

.dark .text-gray-700,
.dark .text-gray-800,
.dark .text-gray-900,
.dark .text-slate-700,
.dark .text-slate-800,
.dark .text-slate-900,
.dark [class~="text-[#333]"],
.dark [class~="text-[#545454]"] {
  color: #f3f4f6 !important;
}

.dark .text-gray-600,
.dark .text-gray-500,
.dark .text-gray-400,
.dark .text-slate-600,
.dark .text-slate-500,
.dark .text-slate-400 {
  color: #cbd5e1 !important;
}

.dark .text-gray-300,
.dark .text-slate-300 {
  color: #e5e7eb !important;
}

.dark .border-gray-200,
.dark .border-gray-300,
.dark .border-slate-200,
.dark .border-slate-300 {
  border-color: #343434 !important;
}

.dark .border-gray-400,
.dark .border-gray-500,
.dark .border-slate-400,
.dark .border-slate-500 {
  border-color: #4a4a4a !important;
}

.dark .shadow-sm,
.dark .shadow-md,
.dark .shadow-lg {
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22) !important;
}

.dark aside.fixed,
.dark #sidebar {
  background: linear-gradient(180deg, #1d1d1d 0%, #171717 100%) !important;
  border-right-color: #2f2f2f !important;
  box-shadow: 12px 0 40px rgba(0, 0, 0, 0.26) !important;
}

.dark aside.fixed a,
.dark #sidebar a {
  color: #d8dee9 !important;
}

.dark aside.fixed a:hover,
.dark #sidebar a:hover {
  background: rgba(var(--dv-primary-rgb), 0.10) !important;
  color: #ffffff !important;
}

.dark aside.fixed a.bg-\[\#3063A0\],
.dark #sidebar a.bg-\[\#3063A0\] {
  background: linear-gradient(135deg, var(--dv-primary), var(--dv-primary-hover)) !important;
  color: #ffffff !important;
}

.dark header.fixed,
.dark header {
  background: rgba(22, 22, 22, 0.92) !important;
  border-bottom-color: #2f2f2f !important;
  backdrop-filter: blur(14px);
}

.dark main {
  color: #e5e7eb !important;
}

.dark main h1,
.dark main h2,
.dark main h3,
.dark main h4,
.dark main h5,
.dark main h6 {
  color: #f8fafc !important;
}

.dv-notice__viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.dv-notice__marquee-inner {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;
  animation: dvNoticeMarquee var(--dv-notice-duration, 18s) linear infinite;
}

@keyframes dvNoticeMarquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.dv-notice__text {
  transition: transform 0.35s ease, opacity 0.35s ease;
  transform: translateY(0);
  opacity: 1;
}

.dv-notice__text.dv-out,
.dv-notice__text.dv-enter {
  transform: translateY(-100%);
  opacity: 0;
}

.dv-notice__text.dv-fade-in {
  opacity: 0;
}

.dv-music-quick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(var(--dv-primary-rgb), 0.28);
  background: rgba(var(--dv-primary-rgb), 0.08);
  color: var(--dv-primary);
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}

.dv-music-quick:hover {
  transform: translateY(-1px);
  border-color: rgba(var(--dv-primary-rgb), 0.55);
  background: rgba(var(--dv-primary-rgb), 0.12);
}

.dv-music-quick.dv-playing {
  animation: dvMusicPulse 1.25s ease-in-out infinite;
}

@keyframes dvMusicPulse {
  0%,
  100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-2px) rotate(-2deg);
  }
}

.dv-music-bars {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 12px;
  margin-left: 2px;
}

.dv-music-bars span {
  width: 2px;
  height: 6px;
  background: var(--dv-primary);
  border-radius: 2px;
  opacity: 0.85;
}

.dv-music-quick.dv-playing .dv-music-bars span:nth-child(1) {
  animation: dvBars 0.55s ease-in-out infinite;
}

.dv-music-quick.dv-playing .dv-music-bars span:nth-child(2) {
  animation: dvBars 0.45s ease-in-out infinite;
}

.dv-music-quick.dv-playing .dv-music-bars span:nth-child(3) {
  animation: dvBars 0.6s ease-in-out infinite;
}

@keyframes dvBars {
  0%,
  100% {
    height: 4px;
    opacity: 0.65;
  }
  50% {
    height: 12px;
    opacity: 1;
  }
}

.dv-input {
  background-color: #ffffff;
  border: 1px solid #d9d9d9;
  color: #545454;
  border-radius: 8px;
  padding: 10px 14px;
  transition: all 0.2s ease;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
}

.dark .dv-input {
  background-color: #2d2d2d;
  border-color: #404040;
  color: #e0e0e0;
}

.dv-input:focus {
  border-color: var(--dv-primary);
  outline: none;
  box-shadow: 0 0 0 3px rgba(var(--dv-primary-rgb), 0.14);
}

.dv-btn {
  background-color: var(--dv-primary);
  color: #ffffff;
  font-weight: 600;
  border-radius: 8px;
  padding: 10px 20px;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.dv-btn:hover {
  background-color: var(--dv-primary-hover);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--dv-primary-rgb), 0.18);
}

.dv-btn:active {
  transform: translateY(0);
}

.dv-card-3d {
  transform-style: preserve-3d;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.dv-card-3d:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 45px rgba(48, 99, 160, 0.12);
  border-color: rgba(48, 99, 160, 0.55);
}

.dv-fade-up {
  opacity: 0;
  transform: translateY(12px);
  animation: dvFadeUp 0.55s ease forwards;
}

@keyframes dvFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Core surfaces */
.bg-white {
  background-color: var(--dv-surface) !important;
}

.bg-gray-50,
.bg-slate-50,
[class~="bg-[#f8f9fa]"] {
  background-color: var(--dv-bg) !important;
}

.bg-gray-100,
.bg-slate-100,
[class~="bg-[#f4f6f9]"],
[class~="bg-[#f4f7f6]"],
[class~="bg-[#f2f4f6]"],
[class~="bg-[#eeeeee]"],
[class~="bg-[#eee]"],
[class~="bg-[#fbfbfb]"] {
  background-color: var(--dv-surface-alt) !important;
}

.bg-gray-200,
.bg-slate-200,
[class~="bg-[#e2e8f0]"],
[class~="bg-[#ced4da]"],
[class~="bg-[#ccc]"],
[class~="bg-[#d9d9d9]"] {
  background-color: #e9ecef !important;
}

.bg-gray-300,
.bg-slate-300,
[class~="bg-[#c1c1c1]"] {
  background-color: #c1c1c1 !important;
}

.text-gray-700,
.text-gray-800,
.text-gray-900,
.text-slate-700,
.text-slate-800,
.text-slate-900,
[class~="text-[#333]"],
[class~="text-[#222]"],
[class~="text-[#111827]"],
[class~="text-[#0f172a]"],
[class~="text-[#545454]"] {
  color: var(--dv-text) !important;
}

.text-gray-600,
.text-gray-500,
.text-gray-400,
.text-slate-600,
.text-slate-500,
.text-slate-400,
[class~="text-[#999]"],
[class~="text-[#a0a0a0]"],
[class~="text-[#4a5568]"],
[class~="text-[#4c5b6b]"],
[class~="text-[#5a6a85]"],
[class~="text-[#666]"] {
  color: var(--dv-text-muted) !important;
}

.text-gray-300,
.text-slate-300,
[class~="text-[#e0e0e0]"] {
  color: #e0e0e0 !important;
}

.border,
.border-gray-200,
.border-gray-300,
.border-slate-200,
.border-slate-300,
[class~="border-[#d9d9d9]"],
[class~="border-[#efefef]"],
[class~="border-[#e5e7eb]"],
[class~="border-[#e2e8f0]"],
[class~="border-[#ccc]"],
[class~="border-[#ced4da]"] {
  border-color: var(--dv-border) !important;
}

.shadow-sm {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

.shadow,
.shadow-md {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.shadow-lg {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
}

.shadow-xl {
  box-shadow: 0 18px 45px rgba(48, 99, 160, 0.12) !important;
}

.rounded-lg {
  border-radius: 10px !important;
}

.rounded-xl {
  border-radius: 14px !important;
}

.rounded-2xl {
  border-radius: 18px !important;
}

[class~="rounded-[15px]"] {
  border-radius: 14px !important;
}

[class~="rounded-[2rem]"] {
  border-radius: 18px !important;
}

/* Header.html brand tokens and bundle tokens */
.text-theme_color,
.text-theme_color2,
[class~="text-[#00a8ff]"],
[class~="text-[#007bff]"],
[class~="text-[#01b1f3]"],
[class~="text-[#0d5f9a]"],
[class~="text-[#0ea5e9]"],
[class~="text-[#1877f2]"],
[class~="text-[#1abc9c]"],
[class~="text-[#16a085]"],
[class~="text-[#0088cc]"],
[class~="text-[#00838f]"],
[class~="text-[#00b37a]"],
[class~="text-[#1bb386]"],
[class~="text-[#00c689]"] {
  color: var(--dv-primary) !important;
}

.bg-theme_color,
.bg-theme_color2,
[class~="bg-[#00a8ff]"],
[class~="bg-[#007bff]"],
[class~="bg-[#01b1f3]"],
[class~="bg-[#0d5f9a]"],
[class~="bg-[#0ea5e9]"],
[class~="bg-[#1877f2]"],
[class~="bg-[#1abc9c]"],
[class~="bg-[#16a085]"],
[class~="bg-[#0088cc]"],
[class~="bg-[#00838f]"],
[class~="bg-[#00b37a]"],
[class~="bg-[#1bb386]"] {
  background-color: var(--dv-primary) !important;
}

.border-theme_color,
.border-theme_color2,
[class~="border-[#00a8ff]"],
[class~="border-[#007bff]"],
[class~="border-[#01b1f3]"],
[class~="border-[#0d5f9a]"],
[class~="border-[#0ea5e9]"],
[class~="border-[#1877f2]"],
[class~="border-[#1abc9c]"],
[class~="border-[#16a085]"],
[class~="border-[#0088cc]"],
[class~="border-[#00838f]"],
[class~="border-[#00b37a]"],
[class~="border-[#1bb386]"] {
  border-color: var(--dv-primary) !important;
}

[class~="hover:bg-[#0097e6]"]:hover,
[class~="hover:bg-[#264f80]"]:hover,
[class~="hover:bg-[#254d7e]"]:hover,
[class~="hover:bg-[#00b37a]"]:hover,
[class~="hover:bg-[#16a085]"]:hover,
[class~="hover:bg-[#1bb386]"]:hover,
[class~="hover:bg-theme_color"]:hover,
[class~="hover:bg-theme_color2"]:hover {
  background-color: var(--dv-primary-hover) !important;
}

[class~="hover:text-[#00a8ff]"]:hover,
[class~="hover:text-[#1abc9c]"]:hover,
[class~="hover:text-theme_color"]:hover,
[class~="hover:text-theme_color2"]:hover {
  color: var(--dv-primary) !important;
}

[class~="focus:border-theme_color"]:focus,
[class~="focus:border-theme_color2"]:focus,
[class~="focus:border-[#00a8ff]"]:focus,
[class~="focus:border-[#1abc9c]"]:focus {
  border-color: var(--dv-primary) !important;
}

[class~="focus:ring-theme_color"]:focus,
[class~="focus:ring-theme_color2"]:focus,
[class~="focus:ring-[#00a8ff]"]:focus,
[class~="focus:ring-[#1abc9c]"]:focus {
  --tw-ring-color: rgba(var(--dv-primary-rgb), 0.35) !important;
}

[class~="ring-[#00a8ff]"],
[class~="ring-theme_color"],
[class~="ring-theme_color2"] {
  --tw-ring-color: rgba(var(--dv-primary-rgb), 0.45) !important;
}

/* Arbitrary opacity utilities used by the bundle */
[class~="bg-[#00a8ff]/5"] {
  background-color: rgba(var(--dv-primary-rgb), 0.05) !important;
}

[class~="bg-[#00a8ff]/10"] {
  background-color: rgba(var(--dv-primary-rgb), 0.1) !important;
}

[class~="bg-[#00a8ff]/20"] {
  background-color: rgba(var(--dv-primary-rgb), 0.2) !important;
}

[class~="bg-[#00a8ff]/30"] {
  background-color: rgba(var(--dv-primary-rgb), 0.3) !important;
}

[class~="border-[#00a8ff]/20"] {
  border-color: rgba(var(--dv-primary-rgb), 0.2) !important;
}

[class~="border-[#00a8ff]/30"] {
  border-color: rgba(var(--dv-primary-rgb), 0.3) !important;
}

[class~="bg-[#1abc9c]/20"] {
  background-color: rgba(var(--dv-primary-rgb), 0.12) !important;
}

/* Semantic families used across the bundle */
.bg-blue-50,
.bg-blue-100,
.bg-blue-200 {
  background-color: #e9f7fd !important;
}

.bg-blue-300,
.bg-blue-400 {
  background-color: #b8daff !important;
}

.bg-blue-500,
.bg-blue-600,
.bg-blue-700,
.bg-blue-800,
.bg-blue-900 {
  background-color: var(--dv-primary) !important;
}

.text-blue-200,
.text-blue-300,
.text-blue-400,
.text-blue-500,
.text-blue-600,
.text-blue-700,
.text-blue-800,
.text-blue-900 {
  color: var(--dv-primary) !important;
}

.border-blue-100,
.border-blue-200,
.border-blue-300,
.border-blue-400,
.border-blue-500,
.border-blue-600,
.border-blue-700,
.border-blue-800 {
  border-color: rgba(var(--dv-primary-rgb), 0.28) !important;
}

.hover\:bg-blue-200:hover,
.hover\:bg-blue-600:hover,
.hover\:bg-blue-700:hover,
.hover\:bg-blue-800:hover {
  background-color: var(--dv-primary-hover) !important;
}

.bg-green-50,
.bg-green-100,
.bg-green-200 {
  background-color: #e8f8f3 !important;
}

.bg-green-300,
.bg-green-400 {
  background-color: #a2ebd0 !important;
}

.bg-green-500,
.bg-green-600,
.bg-green-700,
.bg-green-800,
.bg-green-900 {
  background-color: var(--dv-success) !important;
}

.text-green-200,
.text-green-300,
.text-green-400,
.text-green-500,
.text-green-600,
.text-green-700,
.text-green-800,
.text-green-900 {
  color: var(--dv-success) !important;
}

.border-green-100,
.border-green-200,
.border-green-300,
.border-green-400,
.border-green-500,
.border-green-600,
.border-green-700,
.border-green-800,
.border-green-900 {
  border-color: rgba(40, 167, 69, 0.28) !important;
}

.hover\:bg-green-200:hover,
.hover\:bg-green-500:hover,
.hover\:bg-green-600:hover,
.hover\:bg-green-700:hover,
.hover\:bg-green-800:hover,
.hover\:bg-green-900:hover {
  background-color: var(--dv-success-hover) !important;
}

.bg-red-50,
.bg-red-100,
.bg-red-200 {
  background-color: #f8d7da !important;
}

.bg-red-300,
.bg-red-400 {
  background-color: #f4c2c8 !important;
}

.bg-red-500,
.bg-red-600,
.bg-red-700,
.bg-red-800,
.bg-red-900 {
  background-color: var(--dv-danger) !important;
}

.text-red-200,
.text-red-300,
.text-red-400,
.text-red-500,
.text-red-600,
.text-red-700,
.text-red-800,
.text-red-900 {
  color: var(--dv-danger) !important;
}

.border-red-100,
.border-red-200,
.border-red-300,
.border-red-400,
.border-red-500,
.border-red-600,
.border-red-700,
.border-red-800,
.border-red-900 {
  border-color: rgba(220, 53, 69, 0.28) !important;
}

.hover\:bg-red-200:hover,
.hover\:bg-red-500:hover,
.hover\:bg-red-600:hover,
.hover\:bg-red-700:hover,
.hover\:bg-red-800:hover,
.hover\:bg-red-900:hover {
  background-color: var(--dv-danger-hover) !important;
}

.bg-amber-100,
.bg-amber-200,
.bg-amber-300,
.bg-amber-400,
.bg-amber-500,
.bg-amber-600,
.bg-amber-700,
.bg-amber-800,
.bg-amber-900,
.bg-yellow-100,
.bg-yellow-200,
.bg-yellow-300,
.bg-yellow-400,
.bg-yellow-500,
.bg-yellow-600,
.bg-yellow-700,
.bg-yellow-800,
.bg-yellow-900,
.bg-orange-100,
.bg-orange-200,
.bg-orange-300,
.bg-orange-400,
.bg-orange-500,
.bg-orange-600,
.bg-orange-700,
.bg-orange-800,
.bg-orange-900,
.bg-purple-100,
.bg-purple-200,
.bg-purple-300,
.bg-purple-400,
.bg-purple-500,
.bg-purple-600,
.bg-purple-700,
.bg-purple-800,
.bg-purple-900,
.bg-pink-100,
.bg-pink-200,
.bg-pink-300,
.bg-pink-400,
.bg-pink-500,
.bg-pink-600,
.bg-pink-700,
.bg-pink-800,
.bg-pink-900,
.bg-indigo-100,
.bg-indigo-200,
.bg-indigo-300,
.bg-indigo-400,
.bg-indigo-500,
.bg-indigo-600,
.bg-indigo-700,
.bg-indigo-800,
.bg-indigo-900,
.bg-cyan-100,
.bg-cyan-200,
.bg-cyan-300,
.bg-cyan-400,
.bg-cyan-500,
.bg-cyan-600,
.bg-cyan-700,
.bg-cyan-800,
.bg-cyan-900,
.bg-teal-100,
.bg-teal-200,
.bg-teal-300,
.bg-teal-400,
.bg-teal-500,
.bg-teal-600,
.bg-teal-700,
.bg-teal-800,
.bg-teal-900,
.bg-emerald-100,
.bg-emerald-200,
.bg-emerald-300,
.bg-emerald-400,
.bg-emerald-500,
.bg-emerald-600,
.bg-emerald-700,
.bg-emerald-800,
.bg-emerald-900 {
  background-color: var(--dv-surface-alt) !important;
}

.text-amber-200,
.text-amber-300,
.text-amber-400,
.text-amber-500,
.text-amber-600,
.text-amber-700,
.text-amber-800,
.text-yellow-300,
.text-yellow-400,
.text-yellow-500,
.text-yellow-600,
.text-yellow-700,
.text-yellow-800,
.text-orange-200,
.text-orange-300,
.text-orange-400,
.text-orange-500,
.text-orange-600,
.text-orange-700,
.text-orange-800,
.text-purple-200,
.text-purple-300,
.text-purple-400,
.text-purple-500,
.text-purple-600,
.text-purple-700,
.text-purple-800,
.text-pink-200,
.text-pink-300,
.text-pink-400,
.text-pink-500,
.text-pink-600,
.text-pink-700,
.text-pink-800,
.text-indigo-200,
.text-indigo-300,
.text-indigo-400,
.text-indigo-500,
.text-indigo-600,
.text-indigo-700,
.text-indigo-800,
.text-cyan-200,
.text-cyan-300,
.text-cyan-400,
.text-cyan-500,
.text-cyan-600,
.text-cyan-700,
.text-cyan-800,
.text-teal-200,
.text-teal-300,
.text-teal-400,
.text-teal-500,
.text-teal-600,
.text-teal-700,
.text-teal-800,
.text-emerald-200,
.text-emerald-300,
.text-emerald-400,
.text-emerald-500,
.text-emerald-600,
.text-emerald-700,
.text-emerald-800 {
  color: var(--dv-primary) !important;
}

.border-amber-200,
.border-amber-300,
.border-amber-400,
.border-amber-500,
.border-amber-700,
.border-yellow-200,
.border-yellow-300,
.border-yellow-400,
.border-yellow-500,
.border-yellow-600,
.border-yellow-700,
.border-yellow-800,
.border-orange-200,
.border-orange-300,
.border-orange-400,
.border-orange-500,
.border-purple-200,
.border-purple-300,
.border-purple-400,
.border-purple-500,
.border-pink-200,
.border-pink-300,
.border-pink-400,
.border-pink-500,
.border-indigo-200,
.border-indigo-300,
.border-indigo-400,
.border-indigo-500,
.border-cyan-200,
.border-cyan-300,
.border-cyan-400,
.border-cyan-500,
.border-teal-200,
.border-teal-300,
.border-teal-400,
.border-teal-500,
.border-emerald-200,
.border-emerald-300,
.border-emerald-400,
.border-emerald-500 {
  border-color: var(--dv-border) !important;
}

.hover\:bg-amber-100:hover,
.hover\:bg-amber-500:hover,
.hover\:bg-amber-600:hover,
.hover\:bg-amber-700:hover,
.hover\:bg-amber-900:hover,
.hover\:bg-yellow-200:hover,
.hover\:bg-yellow-600:hover,
.hover\:bg-yellow-700:hover,
.hover\:bg-yellow-900:hover {
  background-color: var(--dv-primary-hover) !important;
}

/* Dark mode surfaces */
.dark body {
  background-color: #121212 !important;
  color: #e0e0e0 !important;
}

.dark .bg-white {
  background-color: #1e1e1e !important;
  color: #e0e0e0 !important;
}

.dark .bg-gray-50,
.dark .bg-slate-50,
.dark [class~="bg-[#f8f9fa]"] {
  background-color: #121212 !important;
}

.dark .bg-gray-100,
.dark .bg-slate-100,
.dark [class~="bg-[#f4f6f9]"],
.dark [class~="bg-[#f4f7f6]"],
.dark [class~="bg-[#f2f4f6]"],
.dark [class~="bg-[#eeeeee]"],
.dark [class~="bg-[#eee]"],
.dark [class~="bg-[#fbfbfb]"] {
  background-color: #1e1e1e !important;
}

.dark .bg-gray-200,
.dark .bg-slate-200 {
  background-color: #2d2d2d !important;
}

.dark .bg-gray-800,
.dark .bg-slate-800 {
  background-color: #2d2d2d !important;
}

.dark [class*="bg-gray-700/"],
.dark [class*="bg-gray-800/"],
.dark [class*="bg-gray-900/"] {
  background-color: #1e1e1e !important;
}

.dark [class*="bg-blue-900/"] {
  background-color: rgba(var(--dv-primary-rgb), 0.12) !important;
}

.dark [class*="bg-green-900/"] {
  background-color: rgba(40, 167, 69, 0.12) !important;
}

.dark [class*="bg-red-900/"] {
  background-color: rgba(220, 53, 69, 0.12) !important;
}

.dark [class*="bg-yellow-900/"],
.dark [class*="bg-amber-900/"],
.dark [class*="bg-orange-900/"] {
  background-color: rgba(var(--dv-primary-rgb), 0.08) !important;
}

.dark .bg-gray-900,
.dark .bg-slate-900,
.dark [class~="bg-[#1a1a1a]"],
.dark [class~="bg-[#0f172a]"],
.dark [class~="bg-[#111827]"],
.dark [class~="bg-[#0b0f1a]"] {
  background-color: #1a1a1a !important;
}

.dark .text-gray-300,
.dark .text-gray-400,
.dark .text-gray-500,
.dark .text-slate-300,
.dark .text-slate-400,
.dark .text-slate-500 {
  color: #a0a0a0 !important;
}

.dark .text-gray-100,
.dark .text-gray-200,
.dark .text-white,
.dark .text-slate-100,
.dark .text-slate-200 {
  color: #e0e0e0 !important;
}

.dark .border,
.dark .border-gray-200,
.dark .border-gray-300,
.dark .border-slate-200,
.dark .border-slate-300 {
  border-color: #333333 !important;
}

.dark [class*="border-blue-800/"],
.dark [class*="border-blue-700/"] {
  border-color: rgba(var(--dv-primary-rgb), 0.24) !important;
}

.dark [class*="border-green-800/"] {
  border-color: rgba(40, 167, 69, 0.24) !important;
}

.dark [class*="border-red-800/"] {
  border-color: rgba(220, 53, 69, 0.24) !important;
}

.dark .dv-notice {
  border-color: rgba(var(--dv-primary-rgb), 0.35);
  background: rgba(var(--dv-primary-rgb), 0.12);
}