/* Phase 9: extracted from index.html so CSP no longer needs inline styles for this block. */
html:not(.dark) .theme-toggle-btn,
body:not(.dark) .theme-toggle-btn,
html:not(.dark) #admin-backoffice-container .theme-toggle-btn,
.theme-toggle-btn {
  background-color: #090d16 !important;
  color: #ffffff !important;
  border: 1.5px solid #1e293b !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 1rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

html:not(.dark) .theme-toggle-btn .theme-label,
body:not(.dark) .theme-toggle-btn .theme-label,
html:not(.dark) #admin-backoffice-container .theme-toggle-btn .theme-label,
.theme-toggle-btn .theme-label {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  display: inline !important;
}

html:not(.dark) .theme-toggle-btn [data-lucide="moon"],
body:not(.dark) .theme-toggle-btn [data-lucide="moon"],
html:not(.dark) #admin-backoffice-container .theme-toggle-btn [data-lucide="moon"],
.theme-toggle-btn [data-lucide="moon"],
html:not(.dark) .theme-toggle-btn svg,
body:not(.dark) .theme-toggle-btn svg,
html:not(.dark) #admin-backoffice-container .theme-toggle-btn svg {
  color: #818cf8 !important;
}

html:not(.dark) .theme-toggle-btn:hover,
body:not(.dark) .theme-toggle-btn:hover,
html:not(.dark) #admin-backoffice-container .theme-toggle-btn:hover,
.theme-toggle-btn:hover {
  background-color: #000000 !important;
  border-color: #334155 !important;
}

html.dark .theme-toggle-btn,
body.dark .theme-toggle-btn,
html.dark #admin-backoffice-container .theme-toggle-btn {
  background-color: #ffffff !important;
  color: #090d16 !important;
  border: 1.5px solid #ffffff !important;
  box-shadow: 0 2px 8px rgba(255, 255, 255, 0.25) !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 1rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

html.dark .theme-toggle-btn .theme-label,
body.dark .theme-toggle-btn .theme-label,
html.dark #admin-backoffice-container .theme-toggle-btn .theme-label {
  color: #090d16 !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  display: inline !important;
}

html.dark .theme-toggle-btn [data-lucide="sun"],
html.dark .theme-toggle-btn svg,
html.dark #admin-backoffice-container .theme-toggle-btn svg {
  color: #f59e0b !important;
}

html.dark .theme-toggle-btn:hover,
html.dark #admin-backoffice-container .theme-toggle-btn:hover {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
}