/*
Theme Name:   Kadence Child - The New Kits
Theme URI:    https://thenewkits.com
Description:  Child theme for The New Kits store. All custom CSS, template overrides,
              and style changes go here — safe from Kadence parent theme updates.
Author:       The New Kits
Author URI:   https://thenewkits.com
Template:     kadence
Version:      2.0.0
Text Domain:  kadence-child
*/

/* ============================================================
   GLOBAL TOKENS — The New Kits Brand
   ============================================================ */
:root {
  --tnk-black:        #111111;
  --tnk-white:        #ffffff;
  --tnk-bg:           #f9f8f6;
  --tnk-surface:      #ffffff;
  --tnk-border:       #e4e4e0;
  --tnk-border2:      #cccccc;
  --tnk-ink2:         #444444;
  --tnk-ink3:         #777777;
  --tnk-ink4:         #bbbbbb;
  --tnk-red:          #c8102e;
  --tnk-red-bg:       #fff0f2;
  --tnk-red-text:     #7a0019;
  --tnk-green:        #1a7a3c;
  --tnk-green-bg:     #edf7f1;
  --tnk-green-text:   #0d4a23;
  --tnk-amber:        #b35c00;
  --tnk-amber-bg:     #fff7eb;
  --tnk-amber-text:   #7a3d00;
  --tnk-blue:         #1a4eb8;
  --tnk-blue-bg:      #eef3ff;
  --tnk-blue-text:    #0e2d70;
  --tnk-sale:         #ff3b30;
  --tnk-star:         #f5a623;
}


/* ============================================================
   FONTS — Google Fonts loaded in functions.php
   ============================================================ */

body,
.woocommerce,
.woocommerce-page {
  font-family: 'Manrope', sans-serif;
  font-size: 14px;
  color: var(--tnk-black);
  background-color: var(--tnk-bg);
}


/* ============================================================
   PRODUCT TITLE — beats Kadence Customizer with !important
   ============================================================
   Kadence outputs its own h1 font via inline <style> in <head>
   which has very high specificity. We match it with body class
   selectors + !important on every property that matters.
   ============================================================ */

body.single-product h1.product_title,
body.single-product .product_title,
body.woocommerce.single-product h1,
.tnk-page h1.tnk-title,
.tnk-right h1.tnk-title {
  font-family:             'Manrope', sans-serif !important;
  font-size:               22px !important;
  font-weight:             700 !important;
  color:                   #111111 !important;
  line-height:             1.25 !important;
  margin-bottom:           6px !important;
  letter-spacing:          -0.1px !important;
  font-style:              normal !important;
  text-transform:          none !important;
  background:              none !important;
  background-image:        none !important;
  -webkit-text-fill-color: #111111 !important;
  -webkit-background-clip: unset !important;
  background-clip:         unset !important;
}

/* h2 / h3 headings sitewide */
h2, h3 {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  color: var(--tnk-black);
}


/* ============================================================
   PRODUCT PAGE — PRICE
   ============================================================ */

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: 'Manrope', sans-serif;
  font-size:   28px;
  font-weight: 700;
  color:       #111111;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  font-size:   15px;
  color:       var(--tnk-ink3);
  font-weight: 500;
  opacity:     1;
}

/* Sale badge */
.woocommerce span.onsale {
  background:    var(--tnk-sale);
  color:         #fff;
  font-family:   'Manrope', sans-serif;
  font-size:     11px;
  font-weight:   800;
  letter-spacing: .4px;
  border-radius: 0;
  padding:       4px 10px;
  min-height:    unset;
  min-width:     unset;
  line-height:   1;
}


/* ============================================================
   ADD TO CART BUTTON
   ============================================================ */

.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button {
  background:     var(--tnk-black);
  color:          #fff;
  font-family:    'Manrope', sans-serif;
  font-size:      14px;
  font-weight:    700;
  letter-spacing: .3px;
  text-transform: uppercase;
  border:         none;
  border-radius:  0;
  padding:        15px 28px;
  transition:     background .15s ease;
}

.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: #2a2a2a;
  color: #fff;
}


/* ============================================================
   VARIATION SWATCHES (Kadence Shop Kit)
   ============================================================ */

.kadence-swatches-container .swatch-item {
  border:        1.5px solid var(--tnk-border2);
  border-radius: 0;
  font-family:   'Manrope', sans-serif;
  font-weight:   600;
  font-size:     12px;
  color:         var(--tnk-black);
  min-width:     44px;
  height:        44px;
  transition:    all .12s;
}

.kadence-swatches-container .swatch-item:hover {
  border-color: var(--tnk-black);
}

.kadence-swatches-container .swatch-item.active,
.kadence-swatches-container .swatch-item.selected {
  background:   var(--tnk-black);
  color:        #fff;
  border-color: var(--tnk-black);
}

.kadence-swatches-container .swatch-item.disabled {
  background:   #f7f7f7;
  color:        var(--tnk-ink4);
  border-color: #eeeeee;
  position:     relative;
  cursor:       not-allowed;
}


/* ============================================================
   PRODUCT TABS
   ============================================================ */

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family:    'Manrope', sans-serif;
  font-size:      12px;
  font-weight:    700;
  letter-spacing: .3px;
  color:          var(--tnk-ink3);
  text-transform: uppercase;
}

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


/* ============================================================
   PRODUCT GALLERY
   ============================================================ */

.woocommerce div.product div.images .woocommerce-product-gallery__image {
  border: 1px solid var(--tnk-border);
}

.woocommerce div.product div.images .flex-control-thumbs li img {
  border:     1.5px solid transparent;
  transition: border-color .15s;
}

.woocommerce div.product div.images .flex-control-thumbs li img:hover,
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
  border-color: var(--tnk-black);
}


/* ============================================================
   PRODUCT CARDS — Shop / Category pages
   ============================================================ */

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Manrope', sans-serif;
  font-size:   13px;
  font-weight: 700;
  color:       var(--tnk-black);
  line-height: 1.3;
}

.woocommerce ul.products li.product .price {
  font-family: 'Manrope', sans-serif;
  font-size:   15px;
  font-weight: 800;
  color:       var(--tnk-black);
}

.woocommerce ul.products li.product .price del {
  color:     var(--tnk-ink3);
  font-size: 12px;
}

.woocommerce ul.products li.product a.button {
  border-radius:  0;
  font-family:    'Manrope', sans-serif;
  font-size:      12px;
  font-weight:    700;
  background:     var(--tnk-black);
  color:          #fff;
  letter-spacing: .3px;
}

.woocommerce ul.products li.product a.button:hover {
  background: #333;
}


/* ============================================================
   CART + CHECKOUT
   ============================================================ */

.woocommerce-cart table.cart td,
.woocommerce-checkout .woocommerce-checkout {
  font-family: 'Manrope', sans-serif;
  font-size:   14px;
}

.woocommerce-cart .cart_totals h2,
.woocommerce-checkout h3 {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
}

.woocommerce .checkout-button,
.woocommerce #place_order {
  border-radius:  0 !important;
  font-family:    'Manrope', sans-serif !important;
  font-weight:    700 !important;
  letter-spacing: .3px !important;
  text-transform: uppercase !important;
}


/* ============================================================
   REVIEWS — ReviewX compatible
   ============================================================ */

.woocommerce #reviews #comments ol.commentlist li {
  font-family: 'Manrope', sans-serif;
  font-size:   13px;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta strong {
  font-weight: 700;
  color:       var(--tnk-black);
}


/* ============================================================
   ANNOUNCE BAR — removed, site uses Kadence theme's own bar
   ============================================================ */
/* .tnk-announce-bar was intentionally removed */


/* ============================================================
   SALE BANNER — above product (on-sale products only)
   ============================================================ */

.tnk-sale-banner {
  background:      var(--tnk-sale);
  color:           #fff;
  display:         flex;
  align-items:     center;
  justify-content: center;
  gap:             14px;
  padding:         11px 24px;
  font-family:     'Manrope', sans-serif;
  font-size:       12px;
  flex-wrap:       wrap;
}

.tnk-sale-banner strong {
  font-family: 'Manrope', sans-serif;
  font-size:   15px;
  font-weight: 800;
}

.tnk-sale-tag {
  background:    #fff;
  color:         var(--tnk-sale);
  font-size:     11px;
  font-weight:   800;
  padding:       4px 10px;
  letter-spacing: .5px;
}

.tnk-sale-countdown {
  background:    rgba(0,0,0,.22);
  color:         #fff;
  font-size:     12px;
  font-weight:   700;
  padding:       4px 12px;
  letter-spacing: .4px;
  font-family:   'Manrope', sans-serif;
}


/* ============================================================
   DELIVERY BOX
   ============================================================ */

.tnk-delivery-box {
  background: var(--tnk-green-bg);
  border:     1px solid #b8dfc6;
  padding:    13px 16px;
  margin:     18px 0;
}

.tnk-delivery-row {
  display:     flex;
  align-items: flex-start;
  gap:         12px;
  padding:     7px 0;
  font-size:   12px;
}

.tnk-delivery-row + .tnk-delivery-row {
  border-top: 1px solid #d0ead8;
}

.tnk-delivery-row .del-ico {
  font-size:   15px;
  flex-shrink: 0;
  line-height: 1;
  margin-top:  1px;
}

.tnk-delivery-row .del-name {
  font-weight: 700;
  color:       var(--tnk-green-text);
}

.tnk-delivery-row .del-sub {
  font-size:  11px;
  color:      var(--tnk-green);
  margin-top: 1px;
}


/* ============================================================
   TRUST STRIP
   ============================================================ */

.tnk-trust-strip {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  border:                1px solid var(--tnk-border);
  margin-top:            16px;
}

.tnk-trust-item {
  display:         flex;
  flex-direction:  column;
  align-items:     center;
  justify-content: center;
  padding:         11px 8px;
  text-align:      center;
  border-right:    1px solid var(--tnk-border);
  gap:             4px;
}

.tnk-trust-item:last-child { border-right: none; }

.tnk-trust-item .t-ico {
  font-size:   16px;
  line-height: 1;
}

.tnk-trust-item .t-label {
  font-size:   10px;
  font-weight: 600;
  color:       var(--tnk-ink2);
  line-height: 1.3;
}


/* ============================================================
   FAQ / ACCORDION — text always black
   ============================================================ */

.tnk-faq-a p,
.tnk-faq-item .tnk-faq-a p,
.tnk-faq-item.open .tnk-faq-a p {
  color: #111111 !important;
}


/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */

@media (max-width: 767px) {

  body.single-product h1.product_title,
  body.single-product .product_title {
    font-size: 20px !important;
  }

  .woocommerce div.product p.price {
    font-size: 24px;
  }

  .tnk-trust-strip {
    grid-template-columns: repeat(2, 1fr);
  }

  .tnk-trust-item {
    border-bottom: 1px solid var(--tnk-border);
  }

  .tnk-trust-item:nth-child(odd)  { border-right: 1px solid var(--tnk-border); }
  .tnk-trust-item:nth-child(even) { border-right: none; }
  .tnk-trust-item:nth-last-child(-n+2) { border-bottom: none; }

  .tnk-sale-banner {
    flex-direction: column;
    gap:            6px;
    padding:        10px 14px;
    text-align:     center;
  }
}
