@charset "UTF-8";
/*
Theme Name: Vivaldi Store
Theme URI: https://store.vivaldi.com
Author: Vivaldi Technologies
Author URI: https://vivaldi.com
Template: storefront
Description: A theme for the Vivaldi Store.
Version: 1.2.7
Text Domain:  vivaldistore
*/

body, button, input, textarea {
  font-family: system-ui, sans-serif;
}

/* Header styles */

.hero-section {
  margin-left: -24px;
  margin-right: -24px;
}

.site-header {
  padding-top: 1.25em;
  padding-bottom: 1.25em;
}

@media (max-width: 66.4989em) {
  .header-cols {
    margin-left: 2.617924em;
    margin-right: 2.617924em;
    padding: 0;
  }
}

@media (max-width: 568px) {
  .header-cols {
    margin-left: 1.41575em;
    margin-right: 1.41575em;
  }
}

@media (min-width: 569px) {
  .site-header {
    padding-top: 1.618em;
    padding-bottom: 1.618em;
  }
  .hero-section {
    margin-left: 0;
    margin-right: 0;
  }
}

@media (min-width: 768px) {

  .header-cols {
    max-width: 66.4989378333em;
    margin-left: auto;
    margin-right: auto;
    padding: 0 2.617924em;
    box-sizing: content-box;
    display: flex;
    align-items: center;
  }
  .col-one {
      flex: 1;
  }
  .col-two {
    width: 260px;
  }
  .woocommerce-active .site-header .site-header-cart {
    width: 100%;
  }
  .site-header-cart .cart-contents {
    padding: 0 !important;
  }
  .site-header {
    padding-top: 30px;
    padding-bottom: 30px;
  }

}

.site-header {
  margin: 0 !important;
}

/* Hero section */

.hero-img, .hero-img img {
  display: block;
  border-radius: 4px;
}


/* Home vector background */

.home, .archive {
  background: #FFFFFF url(img/vectors.svg) center top no-repeat;
  background-size: 1600px 960px;
}

/* Categories menu */

.wp-singular .product-categories { /* Hide on cart etc */
  display: none;
}

.home .product-categories {
  display: block;
}

.product-categories {
  list-style: none;
  text-align: center;
  margin: 0 0 30px 0;
}

.product-categories li {
  display: inline-block;
}

.product-categories a {
  display: block;
  padding: 6px;
  font-size: 16px;
  border-bottom: 2px solid transparent;
  transition: all .3s ease-in-out;
  color: #333;
}

.product-categories a.current-category {
  font-weight: bold;
  border-bottom-color: #ef3939;
}

.product-categories a:hover, .product-categories a:focus {
  border-bottom-color: #ef3939;
}

/* .product-categories:hover a.current-category {
  border-bottom-color: transparent;
} */

@media (min-width: 768px) {
  .product-categories {
    margin-bottom: 40px;
  }
  .product-categories li {
    padding: 0 6px;
  }
  .archive .product-categories li:first-child {
    padding-left: 0;
  }
  .archive .product-categories li:first-child a {
    padding-left: 0;
  }
  .product-categories a {
    padding: 10px;
    font-size: 20px;
  }
}

/* Override styles from main theme */

.storefront-full-width-content.woocommerce-cart .entry-header, .storefront-full-width-content.woocommerce-checkout .entry-header, .storefront-full-width-content.woocommerce-account .entry-header, .storefront-full-width-content .woocommerce-products-header {
  text-align: left;
  padding: 30px 0;
}

.archive .storefront-breadcrumb {
  display: none;
}

.storefront-full-width-content.woocommerce-cart .entry-header, .storefront-full-width-content.woocommerce-checkout .entry-header, .storefront-full-width-content.woocommerce-account .entry-header, .storefront-full-width-content .woocommerce-products-header {
  padding: 10px 0;
}

.site-main {
  margin-bottom: 20px;
}

.site-info {
  padding: 40px 0 0 0;
}

.site-footer {
  padding-top: 40px;
  padding-bottom: 40px;
}

.storefront-breadcrumb {
  padding: 0 0 20px 0;
  margin: 0;
}

.widget .widget-title, .widget .widgettitle {
  padding: 22px 0;
}

@media (min-width: 768px) {
  .storefront-breadcrumb, .content-area, .widget-area {
    margin-bottom: 20px;
  }
  .footer-widgets {
      padding: 0;
  }
  .widget, .widget_nav_menu {
    margin-bottom: 30px;
  }
}

.storefront-handheld-footer-bar ul.columns-3 li {
  width: 100%;
}

.storefront-handheld-footer-bar li.search, .storefront-handheld-footer-bar li.my-account {
  display: none;
}

.wp-embed {
  font-family: system-ui, sans-serif !important;
}

.product_meta .posted_in {
  display: none;
}

/* Colors */

.site-header {
  background-color: transparent;
}

a.cart-contents:hover, .site-header-cart .widget_shopping_cart a:hover, .site-header-cart:hover>li>a {
  color: #333;
}

input[type=text], input[type=number], input[type=email], input[type=tel], input[type=url], input[type=password], input[type=search], textarea, .input-text {
  background-color: #fff;
  border: 1px solid #c7c5c0;
  box-shadow: none;
}

.site-footer {
  background-color: #FFF;
}

.widget .widget-title, .widget .widgettitle, .footer-widgets {
  border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.site-header {
  border: none;
}

button, input[type="button"], input[type="reset"], input[type="submit"], .button, .widget a.button {
  background-color: #fff;
  border: 1px solid #ccc;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .button:hover, .widget a.button:hover {
  background-color: #fff;
  border-color: #666;
}

.woocommerce-cart-form button, .woocommerce-cart-form input[type="button"], .woocommerce-cart-form input[type="reset"], .woocommerce-cart-form  input[type="submit"], .woocommerce-cart-form .button {
  background-color: #eee;
}

.woocommerce-tabs ul.tabs {
  border-top: 1px solid rgba(0,0,0,.1); 
}

.woocommerce-tabs ul.tabs li {
  border-bottom: 1px solid rgba(0,0,0,.1); 
}

table:not( .has-background ) th, #payment .payment_methods > li:not(.woocommerce-notice) {
  background-color: #eee;
}

#payment .payment_methods > li:not(.woocommerce-notice) {
  background-color: #f1f1f1;
}

.added_to_cart, .site-header-cart .widget_shopping_cart a.button, .wc-block-grid__products .wc-block-grid__product .wp-block-button__link, .added_to_cart:hover, .site-header-cart .widget_shopping_cart a.button:hover, .wc-block-grid__products .wc-block-grid__product .wp-block-button__link:hover {
  background-color: #ddd;
  border-color: #ddd;
}

@media screen and (min-width: 768px) {
  .site-header-cart.menu {
    font-size: 18px;
  }
  .site-header-cart .widget_shopping_cart {
    background-color: #fff;
    font-size: 16px;
  }
  .site-header-cart .widget_shopping_cart .buttons, .site-header-cart .widget_shopping_cart .total {
    background-color: #f1f1f1;
  }

}

/* Adjust margins below products */

ul.products li.product, ul.products .wc-block-grid__product, .wc-block-grid__products li.product, .wc-block-grid__products .wc-block-grid__product {
  margin-bottom: 20px;
}

/* link colors */

a {
    color: #111;
}

a:focus, button:focus, .button.alt:focus, input:focus, textarea:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, .button.added_to_cart:focus, .button.wc-forward:focus {
  outline-color: #111;
}

a:focus, input:focus, textarea:focus, button:focus {
    outline: 2px solid #111;
}

/* Red buttons */

button.alt, input[type="button"].alt, input[type="reset"].alt, input[type="submit"].alt, .button.alt, .widget-area .widget a.button.alt, .added_to_cart.alt, .added_to_cart, .widget a.button.checkout {
  background: #ef3939 !important;
  border-color: #ef3939 !important;
  color: #fff !important;
}

/* Hide buttons in listings */

.columns-3 .button {
  display: none;
}

/* Custom color for messages */

.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments {
  background-color: #f2f2f2;
  color: #111;
}

.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before, .woocommerce-noreviews::before, p.no-comments::before,
.woocommerce-message .button, .woocommerce-info .button, .woocommerce-error .button, .woocommerce-noreviews .button, p.no-comments .button,
.woocommerce-message .button:hover, .woocommerce-info .button:hover, .woocommerce-error .button:hover, .woocommerce-noreviews .button:hover, p.no-comments .button:hover,
.woocommerce-message a, .woocommerce-info a, .woocommerce-error a, .woocommerce-noreviews a, p.no-comments a {
  color: #111;
}

/* Slider */

.slider {
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.75s ease;
}

.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slide.active {
  opacity: 1;
  pointer-events: auto;
}

/* Arrows */
.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  border: none;
  color: white;
  font-size: 18px;
  padding: 4px 7px;
  cursor: pointer;
  z-index: 10;
}

@media (min-width: 768px) {
  .arrow {
    font-size: 28px;
    padding: 8px 12px;
  }
}

.arrow:focus {
  outline: 2px solid yellow;
}

.prev { left: 10px; }
.next { right: 10px; }
