/* MagspirePrep compat.css (minified) - colour fallbacks for browsers without
   color-mix(). Load it LAST in base.html. Editable source: compat.css */
@supports not (color:color-mix(in lab, red, red)) {
  :root {
    --divider-color: rgba(15, 23, 42, 0.1)
  }

  [data-theme="dark"] {
    --divider-color: rgba(241, 245, 249, 0.1)
  }

  .checkbox,
  .file-input,
  .otp {
    --input-color: rgba(15, 23, 42, 0.2)
  }

  .radio:not(.radio-primary, .radio-secondary, .radio-accent, .radio-neutral, .radio-info, .radio-success, .radio-warning, .radio-error) {
    border-color: rgba(15, 23, 42, 0.2)
  }

  .toggle:not(.toggle-primary, .toggle-secondary, .toggle-accent, .toggle-neutral, .toggle-info, .toggle-success, .toggle-warning, .toggle-error) {
    --input-color: rgba(15, 23, 42, 0.5)
  }

  [data-theme="dark"] .checkbox,
  [data-theme="dark"] .file-input,
  [data-theme="dark"] .otp {
    --input-color: rgba(241, 245, 249, 0.2)
  }

  [data-theme="dark"] .radio:not(.radio-primary, .radio-secondary, .radio-accent, .radio-neutral, .radio-info, .radio-success, .radio-warning, .radio-error) {
    border-color: rgba(241, 245, 249, 0.2)
  }

  [data-theme="dark"] .toggle:not(.toggle-primary, .toggle-secondary, .toggle-accent, .toggle-neutral, .toggle-info, .toggle-success, .toggle-warning, .toggle-error) {
    --input-color: rgba(241, 245, 249, 0.5)
  }

  .input,
  .select,
  .textarea,
  .file-input {
    border-color: rgba(15, 23, 42, 0.2)
  }

  .input:focus,
  .input:focus-within,
  .select:focus,
  .select:focus-within,
  .select:open,
  .textarea:focus,
  .textarea:focus-within,
  .file-input:focus {
    border-color: rgba(15, 23, 42, 1)
  }

  .input-error,
  .select-error,
  .textarea-error,
  .file-input-error,
  .input-error:focus,
  .input-error:focus-within,
  .select-error:focus,
  .select-error:focus-within,
  .select-error:open,
  .textarea-error:focus,
  .textarea-error:focus-within,
  .file-input-error:focus {
    border-color: #dc2626
  }

  [data-theme="dark"] .input,
  [data-theme="dark"] .select,
  [data-theme="dark"] .textarea,
  [data-theme="dark"] .file-input {
    border-color: rgba(241, 245, 249, 0.2)
  }

  [data-theme="dark"] .input:focus,
  [data-theme="dark"] .input:focus-within,
  [data-theme="dark"] .select:focus,
  [data-theme="dark"] .select:focus-within,
  [data-theme="dark"] .select:open,
  [data-theme="dark"] .textarea:focus,
  [data-theme="dark"] .textarea:focus-within,
  [data-theme="dark"] .file-input:focus {
    border-color: rgba(241, 245, 249, 1)
  }

  [data-theme="dark"] .input-error,
  [data-theme="dark"] .select-error,
  [data-theme="dark"] .textarea-error,
  [data-theme="dark"] .file-input-error,
  [data-theme="dark"] .input-error:focus,
  [data-theme="dark"] .input-error:focus-within,
  [data-theme="dark"] .select-error:focus,
  [data-theme="dark"] .select-error:focus-within,
  [data-theme="dark"] .select-error:open,
  [data-theme="dark"] .textarea-error:focus,
  [data-theme="dark"] .textarea-error:focus-within,
  [data-theme="dark"] .file-input-error:focus {
    border-color: #f87171
  }

  .progress {
    background-color: rgba(15, 23, 42, 0.2)
  }

  [data-theme="dark"] .progress {
    background-color: rgba(241, 245, 249, 0.2)
  }

  .table :where(thead, tfoot) {
    color: rgba(15, 23, 42, 0.6)
  }

  .table :where(thead tr :is(td, th), tbody tr:not(:last-child) :is(td, th)) {
    border-bottom-color: rgba(15, 23, 42, 0.05)
  }

  .table :where(tfoot tr:first-child :is(td, th)) {
    border-top-color: rgba(15, 23, 42, 0.05)
  }

  [data-theme="dark"] .table :where(thead, tfoot) {
    color: rgba(241, 245, 249, 0.6)
  }

  [data-theme="dark"] .table :where(thead tr :is(td, th), tbody tr:not(:last-child) :is(td, th)) {
    border-bottom-color: rgba(241, 245, 249, 0.05)
  }

  [data-theme="dark"] .table :where(tfoot tr:first-child :is(td, th)) {
    border-top-color: rgba(241, 245, 249, 0.05)
  }

  .tabs>.tab:not(.tab-active, [aria-selected="true"]) {
    color: rgba(15, 23, 42, 0.5)
  }

  [data-theme="dark"] .tabs>.tab:not(.tab-active, [aria-selected="true"]) {
    color: rgba(241, 245, 249, 0.5)
  }

  .stat-title,
  .stat-desc {
    color: rgba(15, 23, 42, 0.6)
  }

  [data-theme="dark"] .stat-title,
  [data-theme="dark"] .stat-desc {
    color: rgba(241, 245, 249, 0.6)
  }

  .label {
    color: rgba(15, 23, 42, 0.6)
  }

  [data-theme="dark"] .label {
    color: rgba(241, 245, 249, 0.6)
  }

  .menu :where(li:not(.menu-title, .disabled)>:not(ul, menu, details)):hover,
  .menu :where(li:not(.menu-title, .disabled)>:not(ul, menu, details)):focus-visible {
    background-color: rgba(15, 23, 42, 0.1)
  }

  [data-theme="dark"] .menu :where(li:not(.menu-title, .disabled)>:not(ul, menu, details)):hover,
  [data-theme="dark"] .menu :where(li:not(.menu-title, .disabled)>:not(ul, menu, details)):focus-visible {
    background-color: rgba(241, 245, 249, 0.1)
  }

  .menu :where(li).menu-disabled,
  .menu :where(li) [disabled] {
    color: rgba(15, 23, 42, 0.2)
  }

  [data-theme="dark"] .menu :where(li).menu-disabled,
  [data-theme="dark"] .menu :where(li) [disabled] {
    color: rgba(241, 245, 249, 0.2)
  }

  .list>:not(:last-child).list-row:after,
  .list>:not(:last-child) .list-row:after {
    border-color: rgba(15, 23, 42, 0.05)
  }

  [data-theme="dark"] .list>:not(:last-child).list-row:after,
  [data-theme="dark"] .list>:not(:last-child) .list-row:after {
    border-color: rgba(241, 245, 249, 0.05)
  }

  .btn:is(:disabled, [disabled], [aria-disabled="true"]):not(.btn-link, .btn-ghost),
  .btn-disabled:not(.btn-link, .btn-ghost) {
    background-color: rgba(15, 23, 42, 0.1)
  }

  [data-theme="dark"] .btn:is(:disabled, [disabled], [aria-disabled="true"]):not(.btn-link, .btn-ghost),
  [data-theme="dark"] .btn-disabled:not(.btn-link, .btn-ghost) {
    background-color: rgba(241, 245, 249, 0.1)
  }

  .feature-icon {
    background: rgba(79, 70, 229, 0.10)
  }

  [data-theme="dark"] .feature-icon {
    background: rgba(99, 102, 241, 0.10)
  }

  .sidebar-nav .active {
    background-color: rgba(79, 70, 229, 0.12)
  }

  [data-theme="dark"] .sidebar-nav .active {
    background-color: rgba(99, 102, 241, 0.12)
  }

  .option-wrapper.option-selected {
    background-color: rgba(22, 163, 74, 0.08)
  }

  [data-theme="dark"] .option-wrapper.option-selected {
    background-color: rgba(74, 222, 128, 0.08)
  }

  .btn.btn-outline {
    border-color: rgba(15, 23, 42, 0.15) !important
  }

  .btn.btn-outline:hover {
    background-color: rgba(15, 23, 42, 0.08) !important;
    border-color: rgba(15, 23, 42, 0.30) !important
  }

  [data-theme="dark"] .btn.btn-outline {
    border-color: rgba(241, 245, 249, 0.15) !important
  }

  [data-theme="dark"] .btn.btn-outline:hover {
    background-color: rgba(241, 245, 249, 0.08) !important;
    border-color: rgba(241, 245, 249, 0.30) !important
  }

  .badge.badge-outline {
    border-color: rgba(15, 23, 42, 0.20) !important
  }

  [data-theme="dark"] .badge.badge-outline {
    border-color: rgba(241, 245, 249, 0.20) !important
  }

  [class*="border-base-300"] {
    border-color: rgba(15, 23, 42, 0.10) !important
  }

  [data-theme="dark"] [class*="border-base-300"] {
    border-color: rgba(241, 245, 249, 0.10) !important
  }

  .verify-banner {
    background-color: rgba(217, 119, 6, 0.12)
  }

  [data-theme="dark"] .verify-banner {
    background-color: rgba(251, 191, 36, 0.12)
  }

  .site-footer {
    --footer-muted: #636875;
    --footer-line: #dddee1
  }

  [data-theme="dark"] .site-footer {
    --footer-muted: #a2a7b1;
    --footer-line: #2f3647
  }

  .site-footer__form button:hover {
    background: rgb(71, 63, 206)
  }

  [data-theme="dark"] .site-footer__form button:hover {
    background: rgb(89, 92, 217)
  }

  .news-carousel__frame {
    border: 0.1px solid rgba(15, 23, 42, 0.18)
  }

  [data-theme="dark"] .news-carousel__frame {
    border: 0.1px solid rgba(241, 245, 249, 0.18)
  }

  .news-slide__media {
    border: 1px solid rgba(15, 23, 42, 0.18);
    background: rgba(15, 23, 42, 0.08)
  }

  [data-theme="dark"] .news-slide__media {
    border: 1px solid rgba(241, 245, 249, 0.18);
    background: rgba(241, 245, 249, 0.08)
  }

  .news-slide__meta {
    color: rgba(15, 23, 42, 0.60)
  }

  [data-theme="dark"] .news-slide__meta {
    color: rgba(241, 245, 249, 0.60)
  }

  .news-slide__summary {
    color: rgba(15, 23, 42, 0.65)
  }

  [data-theme="dark"] .news-slide__summary {
    color: rgba(241, 245, 249, 0.65)
  }

  .news-carousel__arrow {
    border: 1px solid rgba(15, 23, 42, 0.20)
  }

  [data-theme="dark"] .news-carousel__arrow {
    border: 1px solid rgba(241, 245, 249, 0.20)
  }

  .news-carousel__dot {
    background: rgba(15, 23, 42, 0.25)
  }

  [data-theme="dark"] .news-carousel__dot {
    background: rgba(241, 245, 249, 0.25)
  }

  @supports not (backdrop-filter:blur(1px)) {
    header.navbar {
      background-color: var(--color-base-100)
    }
  }

  .border-base-200\/40 {
    border-color: rgba(248, 250, 252, 0.4)
  }

  .border-base-200\/50 {
    border-color: rgba(248, 250, 252, 0.5)
  }

  .border-base-200\/60 {
    border-color: rgba(248, 250, 252, 0.6)
  }

  .border-base-200\/80 {
    border-color: rgba(248, 250, 252, 0.8)
  }

  .border-error\/10 {
    border-color: rgba(220, 38, 38, 0.1)
  }

  .border-error\/20 {
    border-color: rgba(220, 38, 38, 0.2)
  }

  .border-error\/25 {
    border-color: rgba(220, 38, 38, 0.25)
  }

  .border-error\/30 {
    border-color: rgba(220, 38, 38, 0.3)
  }

  .border-info\/20 {
    border-color: rgba(2, 132, 199, 0.2)
  }

  .border-primary\/10 {
    border-color: rgba(79, 70, 229, 0.1)
  }

  .border-primary\/20 {
    border-color: rgba(79, 70, 229, 0.2)
  }

  .border-primary\/30 {
    border-color: rgba(79, 70, 229, 0.3)
  }

  .border-secondary\/15 {
    border-color: rgba(124, 58, 237, 0.15)
  }

  .border-success\/20 {
    border-color: rgba(22, 163, 74, 0.2)
  }

  .border-success\/30 {
    border-color: rgba(22, 163, 74, 0.3)
  }

  .border-success\/40 {
    border-color: rgba(22, 163, 74, 0.4)
  }

  .border-warning\/25 {
    border-color: rgba(217, 119, 6, 0.25)
  }

  .bg-base-100\/50 {
    background-color: rgba(255, 255, 255, 0.5)
  }

  .bg-base-100\/80 {
    background-color: rgba(255, 255, 255, 0.8)
  }

  .bg-base-200\/20 {
    background-color: rgba(248, 250, 252, 0.2)
  }

  .bg-base-200\/30 {
    background-color: rgba(248, 250, 252, 0.3)
  }

  .bg-base-200\/40 {
    background-color: rgba(248, 250, 252, 0.4)
  }

  .bg-base-200\/50 {
    background-color: rgba(248, 250, 252, 0.5)
  }

  .bg-base-200\/55 {
    background-color: rgba(248, 250, 252, 0.55)
  }

  .bg-base-200\/60 {
    background-color: rgba(248, 250, 252, 0.6)
  }

  .bg-base-300\/30 {
    background-color: rgba(226, 232, 240, 0.3)
  }

  .bg-base-300\/50 {
    background-color: rgba(226, 232, 240, 0.5)
  }

  .bg-error\/5 {
    background-color: rgba(220, 38, 38, 0.05)
  }

  .bg-error\/10 {
    background-color: rgba(220, 38, 38, 0.1)
  }

  .bg-error\/15 {
    background-color: rgba(220, 38, 38, 0.15)
  }

  .bg-info\/10 {
    background-color: rgba(2, 132, 199, 0.1)
  }

  .bg-info\/15 {
    background-color: rgba(2, 132, 199, 0.15)
  }

  .bg-primary\/5 {
    background-color: rgba(79, 70, 229, 0.05)
  }

  .bg-primary\/10 {
    background-color: rgba(79, 70, 229, 0.1)
  }

  .bg-primary\/15 {
    background-color: rgba(79, 70, 229, 0.15)
  }

  .bg-primary\/20 {
    background-color: rgba(79, 70, 229, 0.2)
  }

  .bg-success\/5 {
    background-color: rgba(22, 163, 74, 0.05)
  }

  .bg-success\/10 {
    background-color: rgba(22, 163, 74, 0.1)
  }

  .bg-success\/15 {
    background-color: rgba(22, 163, 74, 0.15)
  }

  .bg-warning\/10 {
    background-color: rgba(217, 119, 6, 0.1)
  }

  .bg-warning\/15 {
    background-color: rgba(217, 119, 6, 0.15)
  }

  .bg-warning\/20 {
    background-color: rgba(217, 119, 6, 0.2)
  }

  .from-primary\/10 {
    --tw-gradient-from: rgba(79, 70, 229, 0.1)
  }

  .from-secondary\/10 {
    --tw-gradient-from: rgba(124, 58, 237, 0.1)
  }

  .to-accent\/10 {
    --tw-gradient-to: rgba(14, 165, 233, 0.1)
  }

  .to-primary\/10 {
    --tw-gradient-to: rgba(79, 70, 229, 0.1)
  }

  .to-secondary\/10 {
    --tw-gradient-to: rgba(124, 58, 237, 0.1)
  }

  .text-base-content\/30 {
    color: rgba(15, 23, 42, 0.3)
  }

  .text-base-content\/40 {
    color: rgba(15, 23, 42, 0.4)
  }

  .text-base-content\/45 {
    color: rgba(15, 23, 42, 0.45)
  }

  .text-base-content\/50 {
    color: rgba(15, 23, 42, 0.5)
  }

  .text-base-content\/60 {
    color: rgba(15, 23, 42, 0.6)
  }

  .text-base-content\/70 {
    color: rgba(15, 23, 42, 0.7)
  }

  .text-base-content\/75 {
    color: rgba(15, 23, 42, 0.75)
  }

  .text-base-content\/80 {
    color: rgba(15, 23, 42, 0.8)
  }

  .text-base-content\/85 {
    color: rgba(15, 23, 42, 0.85)
  }

  .text-primary\/70 {
    color: rgba(79, 70, 229, 0.7)
  }

  .hover\:border-base-content\/25:hover {
    border-color: rgba(15, 23, 42, 0.25)
  }

  .hover\:border-primary\/40:hover {
    border-color: rgba(79, 70, 229, 0.4)
  }

  .hover\:border-primary\/50:hover {
    border-color: rgba(79, 70, 229, 0.5)
  }

  .hover\:bg-base-200\/10:hover {
    background-color: rgba(248, 250, 252, 0.1)
  }

  .hover\:bg-base-200\/20:hover {
    background-color: rgba(248, 250, 252, 0.2)
  }

  .hover\:bg-base-200\/30:hover {
    background-color: rgba(248, 250, 252, 0.3)
  }

  .hover\:bg-base-200\/50:hover {
    background-color: rgba(248, 250, 252, 0.5)
  }

  .hover\:bg-error\/10:hover {
    background-color: rgba(220, 38, 38, 0.1)
  }

  .hover\:bg-primary\/10:hover {
    background-color: rgba(79, 70, 229, 0.1)
  }

  .has-\[\:checked\]\:bg-primary\/5:has(:checked) {
    background-color: rgba(79, 70, 229, 0.05)
  }

  [data-theme="dark"] .border-base-200\/40 {
    border-color: rgba(26, 36, 54, 0.4)
  }

  [data-theme="dark"] .border-base-200\/50 {
    border-color: rgba(26, 36, 54, 0.5)
  }

  [data-theme="dark"] .border-base-200\/60 {
    border-color: rgba(26, 36, 54, 0.6)
  }

  [data-theme="dark"] .border-base-200\/80 {
    border-color: rgba(26, 36, 54, 0.8)
  }

  [data-theme="dark"] .border-error\/10 {
    border-color: rgba(248, 113, 113, 0.1)
  }

  [data-theme="dark"] .border-error\/20 {
    border-color: rgba(248, 113, 113, 0.2)
  }

  [data-theme="dark"] .border-error\/25 {
    border-color: rgba(248, 113, 113, 0.25)
  }

  [data-theme="dark"] .border-error\/30 {
    border-color: rgba(248, 113, 113, 0.3)
  }

  [data-theme="dark"] .border-info\/20 {
    border-color: rgba(56, 189, 248, 0.2)
  }

  [data-theme="dark"] .border-primary\/10 {
    border-color: rgba(99, 102, 241, 0.1)
  }

  [data-theme="dark"] .border-primary\/20 {
    border-color: rgba(99, 102, 241, 0.2)
  }

  [data-theme="dark"] .border-primary\/30 {
    border-color: rgba(99, 102, 241, 0.3)
  }

  [data-theme="dark"] .border-secondary\/15 {
    border-color: rgba(167, 139, 250, 0.15)
  }

  [data-theme="dark"] .border-success\/20 {
    border-color: rgba(74, 222, 128, 0.2)
  }

  [data-theme="dark"] .border-success\/30 {
    border-color: rgba(74, 222, 128, 0.3)
  }

  [data-theme="dark"] .border-success\/40 {
    border-color: rgba(74, 222, 128, 0.4)
  }

  [data-theme="dark"] .border-warning\/25 {
    border-color: rgba(251, 191, 36, 0.25)
  }

  [data-theme="dark"] .bg-base-100\/50 {
    background-color: rgba(15, 23, 42, 0.5)
  }

  [data-theme="dark"] .bg-base-100\/80 {
    background-color: rgba(15, 23, 42, 0.8)
  }

  [data-theme="dark"] .bg-base-200\/20 {
    background-color: rgba(26, 36, 54, 0.2)
  }

  [data-theme="dark"] .bg-base-200\/30 {
    background-color: rgba(26, 36, 54, 0.3)
  }

  [data-theme="dark"] .bg-base-200\/40 {
    background-color: rgba(26, 36, 54, 0.4)
  }

  [data-theme="dark"] .bg-base-200\/50 {
    background-color: rgba(26, 36, 54, 0.5)
  }

  [data-theme="dark"] .bg-base-200\/55 {
    background-color: rgba(26, 36, 54, 0.55)
  }

  [data-theme="dark"] .bg-base-200\/60 {
    background-color: rgba(26, 36, 54, 0.6)
  }

  [data-theme="dark"] .bg-base-300\/30 {
    background-color: rgba(41, 53, 74, 0.3)
  }

  [data-theme="dark"] .bg-base-300\/50 {
    background-color: rgba(41, 53, 74, 0.5)
  }

  [data-theme="dark"] .bg-error\/5 {
    background-color: rgba(248, 113, 113, 0.05)
  }

  [data-theme="dark"] .bg-error\/10 {
    background-color: rgba(248, 113, 113, 0.1)
  }

  [data-theme="dark"] .bg-error\/15 {
    background-color: rgba(248, 113, 113, 0.15)
  }

  [data-theme="dark"] .bg-info\/10 {
    background-color: rgba(56, 189, 248, 0.1)
  }

  [data-theme="dark"] .bg-info\/15 {
    background-color: rgba(56, 189, 248, 0.15)
  }

  [data-theme="dark"] .bg-primary\/5 {
    background-color: rgba(99, 102, 241, 0.05)
  }

  [data-theme="dark"] .bg-primary\/10 {
    background-color: rgba(99, 102, 241, 0.1)
  }

  [data-theme="dark"] .bg-primary\/15 {
    background-color: rgba(99, 102, 241, 0.15)
  }

  [data-theme="dark"] .bg-primary\/20 {
    background-color: rgba(99, 102, 241, 0.2)
  }

  [data-theme="dark"] .bg-success\/5 {
    background-color: rgba(74, 222, 128, 0.05)
  }

  [data-theme="dark"] .bg-success\/10 {
    background-color: rgba(74, 222, 128, 0.1)
  }

  [data-theme="dark"] .bg-success\/15 {
    background-color: rgba(74, 222, 128, 0.15)
  }

  [data-theme="dark"] .bg-warning\/10 {
    background-color: rgba(251, 191, 36, 0.1)
  }

  [data-theme="dark"] .bg-warning\/15 {
    background-color: rgba(251, 191, 36, 0.15)
  }

  [data-theme="dark"] .bg-warning\/20 {
    background-color: rgba(251, 191, 36, 0.2)
  }

  [data-theme="dark"] .from-primary\/10 {
    --tw-gradient-from: rgba(99, 102, 241, 0.1)
  }

  [data-theme="dark"] .from-secondary\/10 {
    --tw-gradient-from: rgba(167, 139, 250, 0.1)
  }

  [data-theme="dark"] .to-accent\/10 {
    --tw-gradient-to: rgba(56, 189, 248, 0.1)
  }

  [data-theme="dark"] .to-primary\/10 {
    --tw-gradient-to: rgba(99, 102, 241, 0.1)
  }

  [data-theme="dark"] .to-secondary\/10 {
    --tw-gradient-to: rgba(167, 139, 250, 0.1)
  }

  [data-theme="dark"] .text-base-content\/30 {
    color: rgba(241, 245, 249, 0.3)
  }

  [data-theme="dark"] .text-base-content\/40 {
    color: rgba(241, 245, 249, 0.4)
  }

  [data-theme="dark"] .text-base-content\/45 {
    color: rgba(241, 245, 249, 0.45)
  }

  [data-theme="dark"] .text-base-content\/50 {
    color: rgba(241, 245, 249, 0.5)
  }

  [data-theme="dark"] .text-base-content\/60 {
    color: rgba(241, 245, 249, 0.6)
  }

  [data-theme="dark"] .text-base-content\/70 {
    color: rgba(241, 245, 249, 0.7)
  }

  [data-theme="dark"] .text-base-content\/75 {
    color: rgba(241, 245, 249, 0.75)
  }

  [data-theme="dark"] .text-base-content\/80 {
    color: rgba(241, 245, 249, 0.8)
  }

  [data-theme="dark"] .text-base-content\/85 {
    color: rgba(241, 245, 249, 0.85)
  }

  [data-theme="dark"] .text-primary\/70 {
    color: rgba(99, 102, 241, 0.7)
  }

  [data-theme="dark"] .hover\:border-base-content\/25:hover {
    border-color: rgba(241, 245, 249, 0.25)
  }

  [data-theme="dark"] .hover\:border-primary\/40:hover {
    border-color: rgba(99, 102, 241, 0.4)
  }

  [data-theme="dark"] .hover\:border-primary\/50:hover {
    border-color: rgba(99, 102, 241, 0.5)
  }

  [data-theme="dark"] .hover\:bg-base-200\/10:hover {
    background-color: rgba(26, 36, 54, 0.1)
  }

  [data-theme="dark"] .hover\:bg-base-200\/20:hover {
    background-color: rgba(26, 36, 54, 0.2)
  }

  [data-theme="dark"] .hover\:bg-base-200\/30:hover {
    background-color: rgba(26, 36, 54, 0.3)
  }

  [data-theme="dark"] .hover\:bg-base-200\/50:hover {
    background-color: rgba(26, 36, 54, 0.5)
  }

  [data-theme="dark"] .hover\:bg-error\/10:hover {
    background-color: rgba(248, 113, 113, 0.1)
  }

  [data-theme="dark"] .hover\:bg-primary\/10:hover {
    background-color: rgba(99, 102, 241, 0.1)
  }

  [data-theme="dark"] .has-\[\:checked\]\:bg-primary\/5:has(:checked) {
    background-color: rgba(99, 102, 241, 0.05)
  }
}

/* Extra tints used by the dashboards (icon tiles). Same job as the rules above: a plain colour for browsers without color-mix(). */
@supports not (color:color-mix(in lab, red, red)) {
  .bg-amber-500\/10   { background-color: rgba(245, 158, 11, 0.10); }
  .bg-blue-500\/10    { background-color: rgba(59, 130, 246, 0.10); }
  .bg-emerald-500\/10 { background-color: rgba(16, 185, 129, 0.10); }
  .bg-purple-500\/10  { background-color: rgba(168, 85, 247, 0.10); }
}