/* DarkTheme generated CSS - do not edit manually */

/* Light theme v2 */
:root,
[data-bs-theme='light'] {
  --bs-primary: hsl(214 100% 32%);
  --bs-secondary: hsl(0 0% 23%);
  --bs-body-color: hsl(0 0% 17%);
  --bs-body-bg: hsl(0 0% 97%);
  --bs-heading-color: hsl(0 0% 9%);
  --bs-box-shadow: 0 0 5px hsla(0 0% 17% / 0.3);
  --bs-link-hover-color: var(--bs-primary);
  --bs-border-color: var(--bs-primary);
}

/* Dark theme */
[data-bs-theme='dark'] {
  --bs-primary: hsl(211 100% 45%);
  --bs-secondary: hsl(0 0% 63%);
  --bs-body-color: hsl(0 0% 95%);
  --bs-body-bg: hsl(0 0% 12%);
  --bs-heading-color: hsl(0 0% 100%);
  --bs-box-shadow: 0 0 5px hsla(0 0% 95% / 0.5);
  --bs-link-hover-color: var(--bs-primary);
  --bs-border-color: var(--bs-primary);
}

@layer bs-base {
  /* Link colours */

  main a:not(.btn),
  header a:not(.btn) {
    color: var(--bs-body-color);
  }

  main a:not(.btn):hover,
  header a:not(.btn):hover {
    color: var(--bs-primary);
  }
   
  .product-flags .badge:not(.discount), .text-bg-primary {
  background-color: var(--bs-primary);
  }
 }

@layer bs-components {

  .btn:hover:not(.btn-outline-tertiary):not(.checkout-steps__btn) {
    background-color: color-mix(in hsl, var(--bs-primary) 100%, black);
    border-color: color-mix(in hsl, var(--bs-primary) 100%, black);
  }

  .btn-primary {
    --bs-btn-bg: color-mix(in hsl, var(--bs-primary) 90%, black);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
  }
  
  /* * * * * * * */

  .btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary)
  }

  .btn-outline-primary:hover{
    --bs-btn-color: var(--bs-primary);
    --bs-border-color: var(--bs-primary);
    --bs-background-color: var(--bs-primary)
  }
  
  /* * * * * * * */

  .btn-secondary {
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
  }
  
  /* * * * * * * */

  .btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
  }
  
  /* * * * * * * */
  
  .accordion-button:not(.collapsed) {
    color: var(--bs-primary)
  }
  
  .form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
  }
  
  /* Theme specific overrides */

  [data-bs-theme='light'] .btn-outline-secondary {
    --bs-btn-active-bg: hsl(0 0% 23%);
    --bs-btn-active-border-color: hsl(0 0% 23%);
  }

  [data-bs-theme='dark'] .btn-outline-secondary {
    --bs-btn-active-bg: hsl(0 0% 63%);
    --bs-btn-active-border-color: hsl(0 0% 63%);
  }
  
  [data-bs-theme='light'] .form-control:focus {
    border-color: color-mix(in hsl, var(--bs-primary) 50%, white);
    box-shadow: 0 0 0 .25rem color-mix(in hsl, var(--bs-primary) 40%, white);
  }
  [data-bs-theme='dark'] .form-control:focus {
    border-color: color-mix(in hsl, var(--bs-primary) 50%, black);
    box-shadow: 0 0 0 .25rem color-mix(in hsl, var(--bs-primary) 40%, black);
  }

  [data-bs-theme='light'] .btn:disabled:not(.checkout-steps__btn),
  [data-bs-theme='light'] fieldset:disabled .btn:not(.checkout-steps__btn) {
    background-color: color-mix(in hsl, var(--bs-primary) 50%, black);
    border-color: color-mix(in hsl, var(--bs-primary) 90%, black);
  }

}

@layer ps-base {
  .footer-block a:hover {
    color: var(--bs-primary);
  }
}

@layer ps-components { 
  .checkout-steps__step--success .checkout-steps__btn,
  .subcategory__link:hover {
    color: var(--bs-primary);
  }
  .checkout-steps__step--current::before, .checkout-steps__step--success .checkout-steps__number,
  .checkout-steps__step--success::after, .checkout-steps__step--success::before{
   background-color: var(--bs-primary) 
  }
}

@layer ps-modules {
   .ps-imageslider__figcaption {
    background-color: rgba(var(--bs-body-bg-rgb),.5);
    color: var(--bs-body-color);
  }
}