/*Home page logo animation sequence*/
/* Consistent animation properties */
@keyframes backgroundFade {
  0%, 10%, 90%, 100% { background-color: black; }
  50% { background-color: white; }
}

@keyframes logoFade {
  0%, 10%, 90%, 100% { filter: invert(0%); }
  50% { filter: invert(100%); }
}

@keyframes buttonFade {
  0%, 10%, 90%, 100% {
    background-color: white;
    color: black;
  }
  50% {
    background-color: black;
    color: white;
  }
}

/* Applying animations with consistent timing */
.home-button-animation {
  animation: backgroundFade 2s ease-in-out infinite;
}

/*End of Home page logo animation sequence*/

/* Make vertical simple 3d coverflow slider background colour transparent */
div.fwdvs3dcov {
  background-color: rgba(255 255 255 / 0%) !important;
}
/* End of vertical simple 3d coverflow slider background colour transparent */

/* This snippet styles the password protection page */
:root {
  --padding-form-x: clamp(5rem, 4.78vw + 3.47rem, 10rem);
  --padding-form-y: clamp(1rem, 3.824vw + -0.224rem, 5rem);
}

form.post-password-form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--padding-form-x) var(--padding-form-y);
}

input[type=submit]:not(.wpcf7-form-control) {
  background-color: red;
}

input[type=submit]:not(.wpcf7-form-control):hover {
  background-color: rgb(243, 69, 69);
}

/* The end of this snippet which styles the password protection page */

/* Video Container Buttons Styles */
.video-cta{
    position: absolute;
    left: 50% !important;
    transform: translateX(-50%)!important;
    bottom: 100px;
}

/* Styling Woocommerce Theme Elements
--------------------------------------*/

/* Important Special Fonts For Suppressor Product Names */
@font-face {
    font-family: 'Amarurgt';
    src: url('/wp-content/uploads/amarurgt.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham-Bold';
    src: url('/wp-content/uploads/Gotham-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham-Book';
    src: url('/wp-content/uploads/Gotham-Book.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
  font-family: 'Gotham-Book', sans-serif;
}

.main-header__layout .main-header__nav ul {
  font-family: 'Gotham-Bold', sans-serif;
}

/* Woocommerce Checkout Experience Title Fonts */
.ms-sp--header .ms-sp--title {
  font-family: 'Amarurgt', sans-serif;
}

/* Woocommerce Single Product Price */
.ms-single-product .ms-single-product__content .price bdi {
  font-weight: 500;
  font-size: 0.5em;
  font-family: 'Gotham-Bold', sans-serif;
}

/* Woocommerce Single Product Name */
.ms-single-product .ms-single-product__content .ms-single-product_title {
  font-size: calc(4em + (2 * ((100vw - 320px) / 1000)));
  font-family: 'Amarurgt', sans-serif;
}

.ms-product .ms-product-title {
    font-size: 2.2em;
    font-weight: 600;
    font-family: 'Amarurgt';
}

/* Adjusting the logo based on the theme toggle 
------------------------------------------------*/
/* Initially hide all theme images */
.theme-image {
    display: none !important;
}

/* Show the appropriate image based on the data-theme attribute */
[data-theme="light"] .light-theme {
    display: block !important;
}

[data-theme="dark"] .dark-theme {
    display: block !important;
}

/* End of theme image toggle */

/* Justify P for products */
.woocommerce p {
   text-align: justify;
}

/* Changing Shop Sidebar Styles
--------------------------------*/

/*Sidebar Font Size*/
.ms-sb-wc {
    font-size: smaller;
    font-weight: 400;
}

/*Sidebar font heading weight & margin bottom*/
.text-lg, h3 {
  font-weight: 500;
  margin-bottom: 0.8em;
}

/*Sidebar spacing between elements*/
.ms-sidebar aside {
    margin-bottom: calc(var(--space-xs) + 1rem);
}

.wc-block-components-checkbox {
  margin: 0 !important;
}

