/* Storefront dark mode - shared across themes. Activated via html[data-theme="dark"] */

html[data-theme="dark"] {
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  --tw-border-opacity: 1;
}

html[data-theme="dark"] body {
  background-color: #111827 !important;
  color: #d1d5db !important;
}

/* Backgrounds */
html[data-theme="dark"] .bg-white { background-color: #1f2937 !important; }
html[data-theme="dark"] .bg-white\/70 { background-color: rgba(31, 41, 55, 0.7) !important; }
html[data-theme="dark"] .bg-white\/80 { background-color: rgba(31, 41, 55, 0.8) !important; }
html[data-theme="dark"] .bg-white\/90 { background-color: rgba(31, 41, 55, 0.9) !important; }
html[data-theme="dark"] .bg-gray-50 { background-color: #111827 !important; }
html[data-theme="dark"] .bg-gray-100 { background-color: #1f2937 !important; }
html[data-theme="dark"] .bg-gray-100\/80 { background-color: rgba(31, 41, 55, 0.8) !important; }
html[data-theme="dark"] .bg-gray-200 { background-color: #374151 !important; }
html[data-theme="dark"] .bg-gray-300 { background-color: #4b5563 !important; }
html[data-theme="dark"] .bg-slate-50 { background-color: #0f1722 !important; }
html[data-theme="dark"] .bg-slate-100 { background-color: #1f2937 !important; }
html[data-theme="dark"] .bg-slate-200 { background-color: #374151 !important; }
html[data-theme="dark"] .bg-\[#f8f9fa\] { background-color: #111827 !important; }
html[data-theme="dark"] .bg-\[#f5f8fa\] { background-color: #111827 !important; }
html[data-theme="dark"] .bg-\[#fafafa\] { background-color: #1f2937 !important; }
html[data-theme="dark"] .bg-\[#f7f7f7\] { background-color: #1f2937 !important; }
html[data-theme="dark"] .bg-\[#f9fafb\] { background-color: #111827 !important; }

/* Text */
html[data-theme="dark"] .text-black { color: #f3f4f6 !important; }
html[data-theme="dark"] .text-gray-900 { color: #f3f4f6 !important; }
html[data-theme="dark"] .text-gray-800 { color: #e5e7eb !important; }
html[data-theme="dark"] .text-gray-700 { color: #d1d5db !important; }
html[data-theme="dark"] .text-gray-600 { color: #9ca3af !important; }
html[data-theme="dark"] .text-gray-500 { color: #9ca3af !important; }
html[data-theme="dark"] .text-slate-900 { color: #f3f4f6 !important; }
html[data-theme="dark"] .text-slate-800 { color: #e5e7eb !important; }
html[data-theme="dark"] .text-slate-700 { color: #d1d5db !important; }
html[data-theme="dark"] .text-slate-600 { color: #9ca3af !important; }
html[data-theme="dark"] .text-slate-500 { color: #9ca3af !important; }

/* Borders */
html[data-theme="dark"] .border-gray-100 { border-color: #374151 !important; }
html[data-theme="dark"] .border-gray-200 { border-color: #374151 !important; }
html[data-theme="dark"] .border-gray-300 { border-color: #4b5563 !important; }
html[data-theme="dark"] .border-slate-100 { border-color: #374151 !important; }
html[data-theme="dark"] .border-slate-200 { border-color: #374151 !important; }
html[data-theme="dark"] .border-slate-300 { border-color: #4b5563 !important; }

/* Hover states */
html[data-theme="dark"] .hover\:bg-gray-50:hover { background-color: #1f2937 !important; }
html[data-theme="dark"] .hover\:bg-gray-100:hover { background-color: #1f2937 !important; }
html[data-theme="dark"] .hover\:bg-gray-200:hover { background-color: #374151 !important; }
html[data-theme="dark"] .hover\:bg-gray-300:hover { background-color: #4b5563 !important; }
html[data-theme="dark"] .hover\:text-gray-900:hover { color: #f3f4f6 !important; }
html[data-theme="dark"] .hover\:text-gray-700:hover { color: #d1d5db !important; }
html[data-theme="dark"] .hover\:text-gray-600:hover { color: #9ca3af !important; }

/* Divide */
html[data-theme="dark"] .divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #374151 !important; }
html[data-theme="dark"] .divide-gray-200 > :not([hidden]) ~ :not([hidden]) { border-color: #374151 !important; }

/* Ring */
html[data-theme="dark"] .ring-gray-200 { --tw-ring-color: #374151 !important; }
html[data-theme="dark"] .ring-gray-300 { --tw-ring-color: #4b5563 !important; }

/* Placeholder */
html[data-theme="dark"] ::placeholder { color: #6b7280 !important; }

/* select2 (checkout) */
html[data-theme="dark"] .select2-dropdown { background-color: #1f2937; border-color: #374151; }
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
  background-color: #1f2937;
  border-color: #374151;
}
html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #d1d5db;
}
html[data-theme="dark"] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #0d9488;
}

/* Dark toggle icon button */
.dark-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}