/*
Theme Name: Flatsome Child
Description: Pioneer Puff Child Theme
Author: Dan Whalley
Template: flatsome
Version: 1.0.0
*/

/* ============================================================
   PIONEER PUFF — Design Tokens
   ============================================================ */

:root {
  --pp-parchment:    #F5EFE0;
  --pp-cream:        #FBF8F2;
  --pp-white:        #FFFFFF;
  --pp-ink:          #1A0D00;
  --pp-ink-light:    #3D2B12;
  --pp-amber:        #C8882A;
  --pp-amber-dark:   #A36A16;
  --pp-amber-light:  #E8A84A;
  --pp-copper:       #B87333;
  --pp-rust:         #8B3A22;
  --pp-tan:          #8B7355;
  --pp-tan-light:    #B8A88A;
  --pp-rule:         #D4C4A0;

  --pp-sativa:       #C8882A;
  --pp-indica:       #4A3580;
  --pp-hybrid:       #2A6E4A;
  --pp-edible:       #1A6A6A;
  --pp-concentrate:  #3D2B12;
  --pp-preroll:      #8B3A22;

  --pp-serif:        'Playfair Display', Georgia, serif;
  --pp-sans:         'Inter', system-ui, -apple-system, sans-serif;

  /* Flatsome primary color override */
  --primary-color:   #C8882A;
}

/* ============================================================
   GOOGLE FONTS
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400;1,700&family=Inter:wght@300;400;500;600&display=swap');

/* ============================================================
   BASE
   ============================================================ */

body {
  background-color: var(--pp-parchment);
  color: var(--pp-ink);
  font-family: var(--pp-sans);
}

h1, h2, h3, h4, h5, h6,
.product_title,
.woocommerce-loop-product__title,
.entry-title {
  font-family: var(--pp-serif);
  color: var(--pp-ink);
}

a {
  color: var(--pp-amber);
}
a:hover {
  color: var(--pp-amber-dark);
}

/* ============================================================
   SITE HEADER + NAV
   ============================================================ */

.header-main,
.header-wrapper {
  background-color: var(--pp-cream) !important;
  border-bottom: 1px solid var(--pp-rule);
}

/* Sticky top bar (announcement bar) */
.top-bar,
.header-top {
  background-color: var(--pp-ink) !important;
  color: var(--pp-amber-light);
}

.top-bar a,
.header-top a {
  color: var(--pp-amber-light);
}

/* Logo text */
.logo a,
.logo-text {
  font-family: var(--pp-serif);
  font-weight: 700;
  color: var(--pp-ink) !important;
}

/* Primary nav links */
.main-nav > ul > li > a,
.nav-column .nav > li > a {
  font-family: var(--pp-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--pp-ink-light) !important;
  transition: color 0.15s, border-color 0.15s;
}

.main-nav > ul > li > a:hover,
.main-nav > ul > li.current-menu-item > a,
.main-nav > ul > li.current-menu-ancestor > a {
  color: var(--pp-amber) !important;
}

/* Dropdown nav */
.nav-dropdown,
.sub-menu {
  background: var(--pp-cream) !important;
  border-top: 2px solid var(--pp-amber);
  border-bottom: 1px solid var(--pp-rule);
}

.nav-dropdown a,
.sub-menu a {
  color: var(--pp-ink-light) !important;
  font-size: 13px;
}

.nav-dropdown a:hover,
.sub-menu a:hover {
  color: var(--pp-amber) !important;
  background-color: transparent !important;
}

/* ============================================================
   BUTTONS
   ============================================================ */

.button,
button,
input[type="button"],
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .checkout-button,
.woocommerce #respond input#submit {
  background-color: var(--pp-ink) !important;
  color: #fff !important;
  font-family: var(--pp-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: none;
  border-radius: 0 !important;
  padding: 12px 22px !important;
  transition: background-color 0.2s;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .checkout-button:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--pp-amber) !important;
  color: #fff !important;
}

/* Primary / CTA buttons */
.button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.add_to_cart_button,
.single_add_to_cart_button {
  background-color: var(--pp-amber) !important;
}

.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.add_to_cart_button:hover,
.single_add_to_cart_button:hover {
  background-color: var(--pp-amber-dark) !important;
}

/* Outline / ghost button */
.button.outline,
.btn-ghost {
  background: transparent !important;
  color: var(--pp-ink) !important;
  border: 1.5px solid var(--pp-rule) !important;
}

.button.outline:hover,
.btn-ghost:hover {
  border-color: var(--pp-amber) !important;
  color: var(--pp-amber) !important;
}

/* ============================================================
   WOOCOMMERCE — PRODUCT CARDS (SHOP GRID)
   ============================================================ */

/* Wrapper background */
.woocommerce,
.woocommerce-page {
  background-color: var(--pp-parchment);
}

/* Product card */
.product-small,
ul.products li.product,
.products li.product {
  background-color: var(--pp-cream) !important;
  border: 1px solid var(--pp-rule) !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: box-shadow 0.2s, transform 0.2s;
}

.product-small:hover,
ul.products li.product:hover,
.products li.product:hover {
  box-shadow: 0 8px 28px rgba(26, 13, 0, 0.10) !important;
  transform: translateY(-2px);
}

/* Product image area */
.product-small .box-image,
.products li.product .woocommerce-loop-product__link img,
.products li.product a img {
  background-color: var(--pp-white);
}

/* Product title */
.product-small .title,
.woocommerce-loop-product__title,
.products li.product h2 {
  font-family: var(--pp-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--pp-ink) !important;
  line-height: 1.25;
  margin-bottom: 4px;
}

/* Product category label */
.product-small .category,
.products li.product .posted_in,
.woocommerce-breadcrumb {
  font-family: var(--pp-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pp-tan);
}

/* Product price */
.product-small .price,
.products li.product .price,
.woocommerce-Price-amount,
.price .woocommerce-Price-amount {
  font-family: var(--pp-serif) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--pp-ink) !important;
}

.product-small .price del,
.products li.product .price del {
  color: var(--pp-tan-light) !important;
  font-size: 13px !important;
}

/* "Add to Cart" on product cards */
.product-small .box-btn,
ul.products .add_to_cart_button {
  background-color: var(--pp-ink) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

ul.products .add_to_cart_button:hover,
.product-small .box-btn:hover {
  background-color: var(--pp-amber) !important;
}

/* Sale badge */
.product-small .badge,
.products li.product .onsale {
  background-color: var(--pp-amber) !important;
  color: #fff !important;
  font-family: var(--pp-sans);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: 0 !important;
}

/* Stars */
.star-rating,
.woocommerce-product-rating .star-rating {
  color: var(--pp-amber);
}

/* ============================================================
   STRAIN TYPE BADGES
   (Added by pp_strain_type_badge hook in functions.php)
   ============================================================ */

.pp-strain-badge {
  display: inline-block;
  font-family: var(--pp-sans);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #fff;
  padding: 3px 8px;
  margin-bottom: 6px;
  line-height: 1.4;
}

.pp-strain-badge--sativa      { background-color: var(--pp-sativa); }
.pp-strain-badge--indica      { background-color: var(--pp-indica); }
.pp-strain-badge--hybrid      { background-color: var(--pp-hybrid); }
.pp-strain-badge--edible      { background-color: var(--pp-edible); }
.pp-strain-badge--concentrate { background-color: var(--pp-concentrate); }
.pp-strain-badge--preroll     { background-color: var(--pp-preroll); }

/* ============================================================
   WOOCOMMERCE — SINGLE PRODUCT PAGE
   ============================================================ */

.product_title.entry-title {
  font-family: var(--pp-serif) !important;
  font-size: clamp(26px, 3vw, 38px) !important;
  font-weight: 700 !important;
  color: var(--pp-ink) !important;
}

.woocommerce-product-details__short-description {
  font-size: 15px;
  color: var(--pp-tan);
  line-height: 1.7;
}

.woocommerce-tabs .tabs li a {
  font-family: var(--pp-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pp-ink-light);
}

.woocommerce-tabs .tabs li.active a,
.woocommerce-tabs .tabs li a:hover {
  color: var(--pp-amber);
  border-bottom-color: var(--pp-amber);
}

/* Weight / variation selector pills */
.variations_form .variations label {
  font-family: var(--pp-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pp-ink-light);
}

.variations_form .variations select,
.variations_form .variations .select2-container {
  border: 1.5px solid var(--pp-rule) !important;
  border-radius: 0 !important;
  font-family: var(--pp-sans);
  font-size: 14px;
  color: var(--pp-ink);
  background-color: var(--pp-white);
}

/* Quantity input */
.quantity .qty {
  border: 1.5px solid var(--pp-rule) !important;
  border-radius: 0 !important;
  font-family: var(--pp-serif);
  font-size: 16px;
  font-weight: 700;
  color: var(--pp-ink);
  background-color: var(--pp-white);
  text-align: center;
}

/* ============================================================
   SIDEBAR WIDGETS
   ============================================================ */

.sidebar-widgets .widget,
.sidebar .widget,
#sidebar .widget {
  background-color: var(--pp-cream);
  border: 1px solid var(--pp-rule);
  border-radius: 0;
  margin-bottom: 24px;
  padding: 0;
  overflow: hidden;
}

.sidebar-widgets .widget-title,
.sidebar .widget-title,
#sidebar .widget-title {
  font-family: var(--pp-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pp-amber);
  padding: 12px 16px;
  border-bottom: 1px solid var(--pp-rule);
  margin: 0;
  background: transparent;
}

.sidebar-widgets .widget > *:not(.widget-title),
.sidebar .widget > *:not(.widget-title),
#sidebar .widget > *:not(.widget-title) {
  padding: 12px 16px;
}

/* Widget category list */
.widget_product_categories ul,
.widget_categories ul,
.sidebar .cat-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.widget_product_categories li,
.widget_categories li {
  border-bottom: 1px solid var(--pp-rule);
}

.widget_product_categories li:last-child,
.widget_categories li:last-child {
  border-bottom: none;
}

.widget_product_categories li a,
.widget_categories li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 0;
  font-size: 13px;
  color: var(--pp-ink-light);
  font-weight: 500;
  transition: color 0.15s;
}

.widget_product_categories li a:hover,
.widget_categories li a:hover,
.widget_product_categories li.current-cat > a,
.widget_categories li.current-cat > a {
  color: var(--pp-amber);
}

.widget_product_categories .count,
.widget_categories .count {
  font-size: 11px;
  color: var(--pp-tan-light);
  font-weight: 400;
}

/* Price filter widget */
.widget_price_filter .price_slider_wrapper .ui-widget-content {
  background: var(--pp-rule);
}

.widget_price_filter .price_slider_wrapper .ui-slider-range {
  background: var(--pp-amber);
}

.widget_price_filter .price_slider_wrapper .ui-slider-handle {
  background: var(--pp-amber);
  border-color: var(--pp-amber);
  border-radius: 0;
}

.widget_price_filter .price_slider_amount .button {
  background-color: var(--pp-ink) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding: 10px 18px !important;
  border-radius: 0 !important;
  width: 100%;
}

.widget_price_filter .price_slider_amount .button:hover {
  background-color: var(--pp-amber) !important;
}

/* Layered nav / filter widget */
.widget_layered_nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.widget_layered_nav li {
  border-bottom: 1px solid var(--pp-rule);
}

.widget_layered_nav li:last-child {
  border-bottom: none;
}

.widget_layered_nav li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 13px;
  color: var(--pp-ink-light);
  font-weight: 500;
  transition: color 0.15s;
}

.widget_layered_nav li a:hover {
  color: var(--pp-amber);
}

.widget_layered_nav li .count {
  font-size: 11px;
  color: var(--pp-tan-light);
}

/* ============================================================
   SHOP PAGE HEADER
   ============================================================ */

.page-title-inner,
.page-title .container,
.shop-breadcrumb-wrapper {
  background-color: var(--pp-ink) !important;
}

.page-title h1,
.shop-title h1 {
  font-family: var(--pp-serif) !important;
  color: #fff !important;
  font-size: 36px !important;
  font-weight: 700 !important;
}

.woocommerce-breadcrumb {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
}

.woocommerce-breadcrumb a {
  color: rgba(255, 255, 255, 0.5);
}

/* Shop result count + ordering */
.woocommerce-result-count {
  font-size: 13px;
  color: var(--pp-tan);
}

.woocommerce-ordering select {
  border: 1px solid var(--pp-rule) !important;
  border-radius: 0 !important;
  font-family: var(--pp-sans);
  font-size: 12px;
  font-weight: 500;
  color: var(--pp-ink-light);
  background-color: var(--pp-cream);
  padding: 6px 28px 6px 12px;
  appearance: none;
}

/* ============================================================
   FOOTER
   ============================================================ */

.footer-wrapper,
.footer-area,
.absolute-footer,
.footer {
  background-color: var(--pp-ink) !important;
  color: rgba(255, 255, 255, 0.5);
}

.footer-1 .col,
.footer-2 .col,
.footer-3 .col,
.footer-top .widget-area {
  background-color: var(--pp-ink) !important;
}

/* Footer widget titles */
.footer-wrapper .widget-title,
.footer-area .widget-title,
.footer .widget-title {
  font-family: var(--pp-sans) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--pp-amber) !important;
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
  margin-bottom: 14px;
}

/* Footer nav links */
.footer-wrapper a,
.footer-area a,
.footer a {
  color: rgba(255, 255, 255, 0.45) !important;
  font-size: 13px;
  transition: color 0.2s;
}

.footer-wrapper a:hover,
.footer-area a:hover,
.footer a:hover {
  color: #fff !important;
}

/* Footer bottom bar */
.absolute-footer,
.footer-bar {
  background-color: var(--pp-ink) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.25) !important;
  font-size: 12px;
}

.absolute-footer a,
.footer-bar a {
  color: rgba(255, 255, 255, 0.25) !important;
}

/* ============================================================
   WOOCOMMERCE — CART + CHECKOUT
   ============================================================ */

.cart-collaterals .cart_totals,
#order_review,
.woocommerce-checkout-review-order {
  background-color: var(--pp-cream);
  border: 1px solid var(--pp-rule);
  padding: 24px;
}

.woocommerce-cart-form table.cart td.actions .coupon input,
.woocommerce .input-text,
.woocommerce textarea,
.woocommerce select {
  border: 1.5px solid var(--pp-rule) !important;
  border-radius: 0 !important;
  background-color: var(--pp-white);
  font-family: var(--pp-sans);
  color: var(--pp-ink);
}

.woocommerce .input-text:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
  border-color: var(--pp-amber) !important;
  outline: none;
}

/* Cart table */
.woocommerce table.cart td,
.woocommerce table.cart th {
  border-color: var(--pp-rule);
}

.woocommerce-cart table.cart .product-name a {
  font-family: var(--pp-serif);
  font-weight: 600;
  color: var(--pp-ink);
}

/* Checkout */
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading {
  font-family: var(--pp-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--pp-ink);
  border-bottom: 1px solid var(--pp-rule);
  padding-bottom: 12px;
  margin-bottom: 20px;
}

/* ============================================================
   WOOCOMMERCE — MY ACCOUNT
   ============================================================ */

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
}

.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--pp-ink-light);
  border-bottom: 1px solid var(--pp-rule);
  transition: color 0.15s, background-color 0.15s;
}

.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation li.is-active a {
  color: var(--pp-amber);
  background-color: rgba(200, 136, 42, 0.05);
}

/* ============================================================
   PAGINATION
   ============================================================ */

.woocommerce-pagination,
.pagination {
  text-align: center;
  margin-top: 48px;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span,
.page-numbers a,
.page-numbers span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--pp-rule);
  background: var(--pp-cream);
  font-size: 13px;
  font-weight: 500;
  color: var(--pp-ink-light);
  margin: 0 2px;
  transition: all 0.15s;
  border-radius: 0;
  text-decoration: none;
}

.woocommerce-pagination ul li a:hover,
.page-numbers a:hover {
  border-color: var(--pp-amber);
  color: var(--pp-amber);
}

.woocommerce-pagination ul li span.current,
.page-numbers span.current {
  background: var(--pp-amber);
  border-color: var(--pp-amber);
  color: #fff;
  font-weight: 700;
}

/* ============================================================
   NOTICES + MESSAGES
   ============================================================ */

.woocommerce-message,
.woocommerce-info {
  background-color: rgba(200, 136, 42, 0.08) !important;
  border-top-color: var(--pp-amber) !important;
  color: var(--pp-ink-light);
}

.woocommerce-error {
  border-top-color: var(--pp-rust) !important;
}

/* ============================================================
   UTILITY CLASSES
   ============================================================ */

.pp-eyebrow {
  font-family: var(--pp-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pp-amber);
  display: block;
  margin-bottom: 8px;
}

.pp-ornament {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--pp-tan-light);
  font-size: 10px;
  letter-spacing: 0.15em;
  padding: 12px 0;
}

.pp-ornament::before,
.pp-ornament::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--pp-rule);
}

.pp-section--cream { background-color: var(--pp-cream); }
.pp-section--white { background-color: var(--pp-white); }
.pp-section--ink   { background-color: var(--pp-ink); color: #fff; }

.pp-serif  { font-family: var(--pp-serif); }
.pp-sans   { font-family: var(--pp-sans); }
.pp-amber  { color: var(--pp-amber); }
.pp-ink    { color: var(--pp-ink); }

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 849px) {
  .products li.product {
    width: calc(50% - 12px) !important;
  }
}

@media (max-width: 549px) {
  .products li.product {
    width: 100% !important;
  }
}
