/*
Theme Name:   ADHD Medicatie Child Theme
Theme URI:    https://adhdmedicatiebestellen.net
Description:  Child theme voor ADHDmedicatiebestellen.net
Author:       ADHDmedicatie
Template:     storefront
Version:      1.0.0
Text Domain:  adhd-child
*/

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --purple:        #6c3af5;
  --purple-deep:   #4c1d95;
  --purple-mid:    #8b5cf6;
  --purple-soft:   #f0ebff;
  --purple-pale:   #f7f4ff;
  --purple-border: #ddd6fe;
  --white:         #ffffff;
  --bg:            #fafafa;
  --grey-line:     #e5e7eb;
  --grey-text:     #9ca3af;
  --text:          #0f0a1e;
  --text-mid:      #374151;
  --orange:        #f97316;
  --green:         #10b981;
  --green-soft:    #ecfdf5;
  --yellow:        #f59e0b;
  --r:    14px;
  --r-lg: 22px;
  --r-xl: 32px;
}

body {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  background: #ffffff !important;
  color: var(--text) !important;
  overflow-x: hidden;
}

/* HEADER */
.site-header {
  background: #ffffff !important;
  border-bottom: 1.5px solid var(--grey-line) !important;
  box-shadow: none !important;
  position: sticky;
  top: 0;
  z-index: 300;
}
.site-branding .site-title a { color: var(--text) !important; font-weight: 800 !important; }
.main-navigation ul li a { color: var(--text-mid) !important; font-weight: 700 !important; font-size: .9rem !important; }
.main-navigation ul li a:hover { color: var(--purple) !important; }

/* BUTTONS */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button {
  background: linear-gradient(135deg, var(--purple), var(--purple-mid)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--r-lg) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-weight: 800 !important;
  font-size: .95rem !important;
  padding: 14px 24px !important;
  transition: all .22s !important;
  box-shadow: 0 6px 20px rgba(108,58,245,.28) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button.alt:hover,
.woocommerce .single_add_to_cart_button:hover {
  background: linear-gradient(135deg, var(--purple-deep), var(--purple)) !important;
  box-shadow: 0 10px 30px rgba(108,58,245,.38) !important;
  transform: translateY(-1px) !important;
  color: #fff !important;
}
.woocommerce .single_add_to_cart_button {
  width: 100% !important;
  padding: 16px !important;
  font-size: 1rem !important;
}

/* PRODUCT CARDS */
.woocommerce ul.products li.product {
  border: 1.5px solid var(--grey-line) !important;
  border-radius: var(--r-lg) !important;
  overflow: hidden !important;
  transition: all .28s cubic-bezier(.34,1.56,.64,1) !important;
  background: #fff !important;
  box-shadow: none !important;
}
.woocommerce ul.products li.product:hover {
  border-color: var(--purple-border) !important;
  box-shadow: 0 10px 40px rgba(108,58,245,.14) !important;
  transform: translateY(-5px) !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-weight: 800 !important;
  font-size: .9rem !important;
  color: var(--text) !important;
}
.woocommerce ul.products li.product .price {
  color: var(--purple) !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
}

/* SINGLE PRODUCT */
.woocommerce div.product .product_title {
  font-weight: 800 !important;
  font-size: 1.55rem !important;
  line-height: 1.18 !important;
  color: var(--text) !important;
  word-break: break-word !important;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--text) !important;
  font-size: 1.8rem !important;
  font-weight: 800 !important;
}
.woocommerce div.product p.price del { color: var(--grey-text) !important; font-size: 1rem !important; }
.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: .88rem !important;
  color: var(--text-mid) !important;
  line-height: 1.75 !important;
}
.woocommerce .quantity .qty {
  border: 1.5px solid var(--grey-line) !important;
  border-radius: var(--r) !important;
  font-weight: 800 !important;
  font-size: .95rem !important;
  color: var(--text) !important;
  padding: 10px 14px !important;
  width: 70px !important;
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
  border-radius: var(--r-xl) !important;
  overflow: hidden !important;
  background: var(--purple-pale) !important;
}

/* TABS */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid var(--grey-line) !important;
  padding: 0 !important;
  background: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: none !important;
  border: none !important;
  border-bottom: 2.5px solid transparent !important;
  margin-bottom: -2px !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { border-bottom-color: var(--purple) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--grey-text) !important; font-weight: 800 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--purple) !important; }
.woocommerce div.product .woocommerce-tabs .panel { border: none !important; padding: 20px 0 !important; background: none !important; }

/* CART */
.woocommerce-cart .cart_totals {
  background: var(--purple-soft) !important;
  border: 1.5px solid var(--purple-border) !important;
  border-radius: var(--r-lg) !important;
  padding: 20px !important;
}

/* CHECKOUT */
.woocommerce-checkout #payment {
  background: var(--bg) !important;
  border: 1.5px solid var(--grey-line) !important;
  border-radius: var(--r-lg) !important;
}
.woocommerce-checkout #payment div.payment_box {
  background: var(--purple-soft) !important;
  border-radius: var(--r) !important;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
  border: 1.5px solid var(--grey-line) !important;
  border-radius: var(--r) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  padding: 12px 14px !important;
  transition: border-color .2s !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  border-color: var(--purple) !important;
  box-shadow: 0 0 0 3px rgba(108,58,245,.1) !important;
  outline: none !important;
}
.woocommerce form .form-row label { font-weight: 700 !important; font-size: .82rem !important; color: var(--text-mid) !important; }
#place_order {
  width: 100% !important;
  padding: 16px !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, var(--purple), var(--purple-mid)) !important;
  border-radius: 18px !important;
  box-shadow: 0 6px 20px rgba(108,58,245,.3) !important;
}

/* NOTICES */
.woocommerce-message, .woocommerce-info {
  background: var(--purple-soft) !important;
  border-top-color: var(--purple) !important;
  color: var(--text) !important;
}

/* SALE BADGE */
.woocommerce span.onsale {
  background: var(--purple) !important;
  border-radius: 20px !important;
  font-weight: 800 !important;
  font-size: .7rem !important;
  min-width: auto !important;
  padding: 4px 10px !important;
  min-height: auto !important;
  line-height: 1.4 !important;
}

/* STARS */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before { color: var(--yellow) !important; }

/* FOOTER */
.site-footer { background: var(--text) !important; color: rgba(255,255,255,.55) !important; }
.site-footer a { color: rgba(255,255,255,.55) !important; }
.site-footer a:hover { color: #c4b5fd !important; }

/* VARIATIES */
.woocommerce div.product form.cart .variations select {
  border: 1.5px solid var(--grey-line) !important;
  border-radius: var(--r) !important;
  padding: 10px 14px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  background: #fff !important;
}
.woocommerce div.product form.cart .variations select:focus {
  border-color: var(--purple) !important;
  box-shadow: 0 0 0 3px rgba(108,58,245,.1) !important;
  outline: none !important;
}

/* MOBILE */
@media (max-width: 768px) {
  .woocommerce div.product .product_title { font-size: 1.4rem !important; }
  .woocommerce div.product p.price { font-size: 1.5rem !important; }
}
