/*
Theme Name: OK Shop
Theme URI: https://shop.ok.la
Description: Light storefront child theme for OK Shop.
Author: OK Shop
Template: storefront
Version: 1.0.0
Text Domain: ok-shop
*/

:root {
  --ok-bg: #f7f4ef;
  --ok-surface: #ffffff;
  --ok-ink: #2c2a26;
  --ok-muted: #6b655c;
  --ok-line: #e4ddd3;
  --ok-accent: #3d6b5a;
  --ok-accent-hover: #2f5346;
}

body,
body.woocommerce,
.site {
  background-color: var(--ok-bg);
  color: var(--ok-ink);
}

.site-header,
.storefront-primary-navigation,
.main-navigation,
.woocommerce-breadcrumb,
.site-footer,
.col-full {
  background-color: transparent;
}

.site-header {
  background: var(--ok-surface);
  border-bottom: 1px solid var(--ok-line);
}

.site-footer {
  background: #efeae2;
  color: var(--ok-muted);
}

a {
  color: var(--ok-accent);
}

a:hover,
.site-header-cart .cart-contents:hover,
.main-navigation ul li a:hover {
  color: var(--ok-accent-hover);
}

button,
input[type="button"],
input[type="submit"],
.button,
.added_to_cart,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--ok-accent);
  border-color: var(--ok-accent);
  color: #fff;
  border-radius: 999px;
}

button:hover,
input[type="submit"]:hover,
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background-color: var(--ok-accent-hover);
  border-color: var(--ok-accent-hover);
  color: #fff;
}

.ok-hero {
  background: linear-gradient(180deg, #fff 0%, #f7f4ef 100%);
  border-bottom: 1px solid var(--ok-line);
  padding: 4.5rem 0 3.5rem;
  text-align: center;
}

.ok-hero h1 {
  font-size: 2.4rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin: 0 0 0.75rem;
  color: var(--ok-ink);
}

.ok-hero p {
  margin: 0 auto 1.75rem;
  max-width: 36rem;
  color: var(--ok-muted);
  font-size: 1.05rem;
}

.ok-hero .button {
  padding: 0.85rem 1.6rem;
}

.storefront-full-width-content .site-main,
.storefront-full-width-content.woocommerce-active .site-main {
  margin-bottom: 3rem;
}

ul.products li.product {
  background: var(--ok-surface);
  border: 1px solid var(--ok-line);
  border-radius: 16px;
  padding: 1rem 1rem 1.4rem;
  text-align: center;
}

ul.products li.product img {
  border-radius: 10px;
}

ul.products li.product .price {
  color: var(--ok-ink);
}

.site-search,
.storefront-handheld-footer-bar {
  background: var(--ok-surface);
}