/*
Theme Name: Shakiy (Astra Child)
Theme URI: https://shakiy.com
Description: Custom child theme for Shakiy — "Life's little wobbles, solved." Built on Astra.
Author: Shakiy
Template: astra
Version: 1.0.4
Text Domain: shakiy-astra-child
*/

/* ==========================================================================
   SHAKIY BRAND — COLOR SYSTEM
   Trust-first palette: deep teal/navy primary, warm coral accent for CTAs,
   off-white background, charcoal text.
   ========================================================================== */

:root {
  --shakiy-navy: #3E2A1F;        /* primary (brown) — headers, nav, trust elements */
  --shakiy-navy-dark: #2B1B14;   /* hover/darker states */
  --shakiy-coral: #FF6B4A;       /* accent — buttons, CTAs, sale badges */
  --shakiy-coral-dark: #E5502F;  /* button hover */
  --shakiy-bg: #FAFAF7;          /* page background */
  --shakiy-card-bg: #FFFFFF;     /* card/product backgrounds */
  --shakiy-text: #22292B;        /* body text */
  --shakiy-text-muted: #5C6B6E;  /* secondary text */
  --shakiy-border: #E3E7E6;      /* subtle borders/dividers */
  --shakiy-success: #2E8B57;     /* trust badges, in-stock, free shipping */
}

/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

body,
p,
li,
input,
textarea,
select {
  color: var(--shakiy-text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title {
  font-family: 'Poppins', 'Inter', sans-serif;
  font-weight: 600;
  color: var(--shakiy-navy);
  letter-spacing: -0.01em;
}

body {
  background-color: var(--shakiy-bg);
}

/* ==========================================================================
   HEADER / SITE BRANDING
   ========================================================================== */

.ast-primary-header-bar,
.main-header-bar {
  background-color: var(--shakiy-card-bg) !important;
  border-bottom: 1px solid var(--shakiy-border);
}

.site-title a {
  color: var(--shakiy-navy) !important;
  font-weight: 700;
  font-size: 1.6rem;
}

.site-description {
  color: var(--shakiy-text-muted);
  font-style: italic;
  font-size: 0.85rem;
}

.main-header-menu a {
  color: var(--shakiy-navy);
  font-weight: 500;
}

.main-header-menu a:hover {
  color: var(--shakiy-coral);
}

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

.ast-button,
button,
.button,
input[type="submit"],
.wp-block-button__link,
.single_add_to_cart_button,
a.button.add_to_cart_button {
  background-color: var(--shakiy-coral) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  padding: 12px 28px !important;
  transition: background-color 0.2s ease, transform 0.1s ease;
}

.ast-button:hover,
button:hover,
.button:hover,
.single_add_to_cart_button:hover,
a.button.add_to_cart_button:hover {
  background-color: var(--shakiy-coral-dark) !important;
  transform: translateY(-1px);
}

/* Secondary / outline buttons */
.button.secondary,
.ast-button.secondary {
  background-color: transparent !important;
  color: var(--shakiy-navy) !important;
  border: 2px solid var(--shakiy-navy) !important;
}

/* ==========================================================================
   TRUST ELEMENTS
   ========================================================================== */

.shakiy-trust-bar {
  background-color: var(--shakiy-navy);
  color: var(--shakiy-coral);
  text-align: center;
  padding: 8px 16px;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.shakiy-trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  padding: 20px 0;
  border-top: 1px solid var(--shakiy-border);
  border-bottom: 1px solid var(--shakiy-border);
  margin: 24px 0;
}

.shakiy-trust-badges .badge {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--shakiy-text-muted);
  font-size: 0.9rem;
  font-weight: 500;
}

.shakiy-trust-badges .badge svg {
  color: var(--shakiy-success);
  width: 18px;
  height: 18px;
}

/* Sale / stock badges */
.onsale {
  background-color: var(--shakiy-coral) !important;
  color: #fff !important;
  font-weight: 600;
  border-radius: 4px;
}

.stock.in-stock {
  color: var(--shakiy-success);
  font-weight: 600;
}

/* ==========================================================================
   PRODUCT CARDS / SHOP GRID
   ========================================================================== */

ul.products li.product,
.woocommerce ul.products li.product {
  background-color: var(--shakiy-card-bg);
  border-radius: 10px;
  border: 1px solid var(--shakiy-border);
  padding: 16px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

ul.products li.product:hover {
  box-shadow: 0 8px 24px rgba(18, 54, 64, 0.08);
  transform: translateY(-2px);
}

.woocommerce ul.products li.product .price {
  color: var(--shakiy-navy);
  font-weight: 700;
  font-size: 1.1rem;
}

.woocommerce ul.products li.product .price del {
  color: var(--shakiy-text-muted);
  opacity: 0.7;
}

.woocommerce ul.products li.product .price ins {
  color: var(--shakiy-coral);
  text-decoration: none;
}

/* ==========================================================================
   SINGLE PRODUCT PAGE
   ========================================================================== */

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--shakiy-navy);
  font-size: 1.6rem;
  font-weight: 700;
}

.woocommerce div.product .product_title {
  color: var(--shakiy-navy);
}

.woocommerce-product-details__short-description {
  color: var(--shakiy-text);
  line-height: 1.6;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--shakiy-navy);
  font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--shakiy-coral);
}

/* Reviews */
.woocommerce-Reviews .star-rating span,
.star-rating span {
  color: var(--shakiy-coral);
}

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

footer.site-footer,
.ast-footer-wrap {
  background-color: var(--shakiy-navy) !important;
  color: #E6ECEC !important;
}

footer.site-footer a,
.ast-footer-wrap a {
  color: #E6ECEC !important;
}

footer.site-footer a:hover,
.ast-footer-wrap a:hover {
  color: var(--shakiy-coral) !important;
}

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

@media (max-width: 768px) {
  .site-title a {
    font-size: 1.3rem;
  }

  .shakiy-trust-badges {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
}

/* ==========================================================================
   SINGLE PRODUCT PAGE — REFINED LAYOUT
   Fixes: cramped spacing, unstyled select/quantity fields, default red
   strikethrough pricing, badges wrapping awkwardly in the narrow summary column.
   ========================================================================== */

.woocommerce div.product {
  padding: 8px 0 16px;
}

.woocommerce div.product .product_title {
  font-size: 2rem;
  margin-bottom: 8px;
}

.woocommerce span.onsale {
  position: static;
  display: none;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 12px 0 20px;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  color: var(--shakiy-text-muted) !important;
  opacity: 0.6;
  font-size: 1.1rem;
  font-weight: 400;
  text-decoration: line-through;
}

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
  color: var(--shakiy-coral) !important;
  font-size: 1.8rem;
  font-weight: 700;
  text-decoration: none;
}

.woocommerce div.product table.variations select,
.woocommerce div.product .variations select {
  border: 1.5px solid var(--shakiy-border);
  border-radius: 8px;
  padding: 12px 40px 12px 16px;
  font-size: 1rem;
  line-height: 1.4;
  height: auto !important;
  min-height: 48px;
  box-sizing: border-box;
  font-family: 'Inter', sans-serif;
  color: var(--shakiy-text);
  background-color: #fff;
  min-width: 240px;
  cursor: pointer;
  transition: border-color 0.2s ease;
}

.woocommerce div.product table.variations select:focus,
.woocommerce div.product .variations select:focus {
  border-color: var(--shakiy-coral);
  outline: none;
}

.woocommerce div.product table.variations td.label {
  font-weight: 600;
  color: var(--shakiy-navy);
  padding-bottom: 6px;
}

.woocommerce div.product .reset_variations {
  color: var(--shakiy-text-muted);
  font-size: 0.8rem;
  letter-spacing: 0.03em;
}

.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 20px 0;
  flex-wrap: wrap;
}

.woocommerce div.product form.cart .quantity {
  margin: 0;
}

.woocommerce div.product form.cart .quantity input.qty {
  border: 1.5px solid var(--shakiy-border);
  border-radius: 8px;
  height: 48px;
  width: 64px;
  text-align: center;
  font-size: 1rem;
  color: var(--shakiy-text);
}

.woocommerce div.product form.cart .single_add_to_cart_button {
  height: 48px;
  display: flex;
  align-items: center;
  font-size: 1rem;
}

.woocommerce div.product p.stock {
  width: 100%;
  margin: 4px 0 0;
  font-size: 0.9rem;
}

.single-product .shakiy-trust-badges {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 10px;
  padding: 16px 0;
  margin: 16px 0 0;
  width: 100%;
  flex-basis: 100%;
  order: 99;
}

.single-product .shakiy-trust-badges .badge {
  font-size: 0.85rem;
}

.woocommerce div.product .product_meta {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--shakiy-border);
  font-size: 0.85rem;
  color: var(--shakiy-text-muted);
}

.woocommerce div.product .product_meta a {
  color: var(--shakiy-coral);
}

.woocommerce div.product div.images img {
  border-radius: 12px;
}

.woocommerce div.product .posted_in,
.woocommerce-breadcrumb {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--shakiy-coral);
}