/*
Theme Name: Kiekie — From Our Farm With Love
Theme URI: https://kiekiesa.co.za
Author: Kiekie (converted from approved HTML design)
Description: Premium, warm, farm-inspired WooCommerce theme for Kiekie — a South African family bakery. Handmade brownies, brookies, gift boxes and dessert sauces. Design preserved exactly from the approved artwork.
Version: 1.0.9
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
WC requires at least: 7.0
WC tested up to: 8.9
Text Domain: kiekie
*/

/* ============================================================
   Global resets + tokens (design is otherwise 100% inline,
   exactly as in the approved artwork — do not add layout CSS here)
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{margin:0;background:#FBF6EC;font-family:'Lato',sans-serif;color:#2E2823}
img{max-width:100%;display:block}
a{color:#9A763E;text-decoration:none}
a:hover{color:#BC9353}
::selection{background:#BC9353;color:#fff}

/* Accessibility */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;word-wrap:normal!important}
.skip-link{background:#2E2823;color:#F4EADB;padding:12px 20px;border-radius:0 0 12px 0;position:absolute;left:0;top:0;z-index:200}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;color:#F4EADB}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #BC9353;outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

@keyframes kkFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes kkFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes kkBlob{0%,100%{border-radius:60% 40% 55% 45%/55% 45% 55% 45%}50%{border-radius:42% 58% 45% 55%/52% 56% 44% 48%}}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#E0D2B8;border-radius:8px}

/* Hover / interaction helpers (mirror the inline style-hover states) */
.kk-hover-lift{transition:transform .3s,box-shadow .3s}
.kk-hover-lift:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(46,40,35,.13)}
.kk-img-zoom{transition:transform .5s ease}
.kk-card:hover .kk-img-zoom{transform:scale(1.04)}
.kk-btn-dark{transition:background .2s,color .2s,transform .2s}
.kk-btn-dark:hover{background:#BC9353 !important;color:#fff !important}
.kk-btn-outline{transition:background .2s,color .2s,border-color .2s}
.kk-btn-outline:hover{background:#BC9353 !important;color:#2E2823 !important;border-color:#BC9353 !important}
.kk-btn-lift{transition:transform .2s}
.kk-btn-lift:hover{transform:translateY(-2px)}
.kk-nav-link{transition:color .2s,padding-left .2s}
.kk-nav-link:hover{color:#BC9353;padding-left:8px}
.kk-foot-link{color:#C9BDA7;transition:color .2s}
.kk-foot-link:hover{color:#D8B978}
.kk-story-link{transition:color .2s}
.kk-chip{transition:all .2s}

/* Drawers */
.kk-overlay{position:fixed;inset:0;background:rgba(46,40,35,.5);z-index:80;animation:kkFadeUp .25s ease;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.kk-overlay.open{opacity:1;visibility:visible}

/* Drawer nav (wp_nav_menu markup, styled to match the design exactly) */
.kk-drawer-nav ul,.kk-drawer-nav li{list-style:none;margin:0;padding:0}
.kk-drawer-nav ul.kk-menu-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.kk-drawer-nav ul.kk-menu-list li{margin:0;padding:0}
.kk-drawer-nav ul.kk-menu-list li a{
  display:block;font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;color:#2E2823;
  padding:7px 0;border-bottom:1px solid #ECE0CB;transition:color .2s,padding-left .2s;text-decoration:none;
}
.kk-drawer-nav ul.kk-menu-list li a:hover{color:#BC9353;padding-left:8px}

/* Footer menus (wp_nav_menu markup) */
.kk-foot-menu,.kk-foot-menu li{list-style:none;margin:0;padding:0}
.kk-foot-menu li a{display:block;font-size:14px;color:#C9BDA7;padding:5px 0;text-decoration:none;transition:color .2s}
.kk-foot-menu li a:hover{color:#D8B978}

/* Responsive polish — mobile & tablet */
@media (max-width:640px){
  .kk-announce{font-size:10px !important;letter-spacing:.08em !important;padding:8px 12px !important;line-height:1.5}
  .kk-header-inner{padding:10px 16px !important}
  .kk-menu-label{display:none !important}
  .kk-cart-count{min-width:10px !important}
}
@media (max-width:900px){
  .kk-hero-actions button{flex:1 1 auto}
}

/* ---- WooCommerce loop → match the approved card grid ---- */
.woocommerce ul.products,
.woocommerce-page ul.products{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:24px;margin:0;padding:0;list-style:none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{content:none !important;display:none !important}
.woocommerce ul.products li.product{width:auto !important;margin:0 !important;float:none !important}
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering{margin-bottom:22px}

/* WooCommerce buttons → Kiekie styling */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button{
  background:#2E2823 !important;color:#F4EADB !important;border:none !important;
  border-radius:999px !important;padding:14px 30px !important;
  font-family:'Lato',sans-serif !important;font-size:12.5px !important;letter-spacing:.16em !important;
  text-transform:uppercase !important;font-weight:600 !important;transition:background .2s !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .single_add_to_cart_button:hover{background:#BC9353 !important;color:#fff !important}
.woocommerce .price{font-family:'Cormorant Garamond',serif !important;color:#2E2823 !important}
.woocommerce div.product .product_title{font-family:'Cormorant Garamond',serif !important;color:#2E2823 !important}

/* Mini-cart inside the drawer */
.widget_shopping_cart_content .cart_list{list-style:none;margin:0;padding:8px 24px}
.widget_shopping_cart_content .cart_list li{padding:16px 0;border-bottom:1px solid #ECE0CB;font-size:14px}
.widget_shopping_cart_content .cart_list img{width:54px;height:54px;object-fit:cover;border-radius:12px;float:right;margin-left:12px}
.widget_shopping_cart_content .total{padding:16px 24px;font-family:'Cormorant Garamond',serif;font-size:18px;background:#F5ECDD}
.widget_shopping_cart_content .buttons{padding:0 24px 24px;display:flex;flex-direction:column;gap:10px}
.widget_shopping_cart_content .buttons a{
  background:#2E2823;color:#F4EADB;border-radius:999px;padding:14px;text-align:center;
  font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
}
.widget_shopping_cart_content .buttons a.checkout{background:#BC9353;color:#fff}
.woocommerce-mini-cart__empty-message{padding:30px 24px;text-align:center;font-family:'Cormorant Garamond',serif;font-size:20px;color:#6B6157}

/* ===================================================================
   PREMIUM WOOCOMMERCE — single product, cart, checkout, my account
   =================================================================== */

/* Custom logo sizing to match the design height */
.custom-logo{height:clamp(62px,9vw,88px);width:auto;object-fit:contain}

/* Sale / featured badge */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale{
  position:absolute;top:12px;right:12px;left:auto;min-height:0;min-width:0;
  background:#BC9353;color:#fff;border-radius:999px;padding:6px 13px;margin:0;
  font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;line-height:1;
}

/* --- Single product layout --- */
.kk-pdp{max-width:1180px;margin:0 auto}
.kk-pdp-gallery{width:100%}
.kk-thumb:hover{border-color:#BC9353 !important}
.kk-thumb:hover img{opacity:1 !important}

/* One row per category on the Shop "All" view — cards keep a consistent
   size and never wrap; overflow scrolls sideways instead. */
.kk-cat-row{display:flex;gap:24px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.kk-cat-row>*{flex:0 0 calc((100% - 72px)/4);scroll-snap-align:start}
.kk-cat-row::-webkit-scrollbar{height:8px}
.kk-cat-row::-webkit-scrollbar-thumb{background:#E0D2B8;border-radius:8px}
@media (max-width:1000px){ .kk-cat-row>*{flex:0 0 calc((100% - 48px)/3)} }
@media (max-width:760px){ .kk-cat-row>*{flex:0 0 calc((100% - 24px)/2)} }
@media (max-width:520px){ .kk-cat-row>*{flex:0 0 78%} }
.woocommerce div.product .woocommerce-product-gallery__trigger{background:#FBF6EC;border-radius:999px}

.kk-pdp-summary .product_title{font-family:'Cormorant Garamond',serif !important;font-weight:700 !important;font-size:clamp(34px,5vw,50px) !important;line-height:1.08 !important;color:#2E2823 !important;margin:8px 0 !important}
.kk-pdp-summary .price{font-family:'Cormorant Garamond',serif !important;font-size:28px !important;color:#2E2823 !important;margin:14px 0 !important}
.kk-pdp-summary .price del{color:#B7A98F !important;opacity:.7}
.kk-pdp-summary .price ins{text-decoration:none}
.kk-pdp-summary .woocommerce-product-details__short-description{font-size:15.5px;line-height:1.7;color:#5C5349;margin-top:6px}
.kk-pdp-summary .stock{font-size:13px;color:#7C7266}

/* Quantity selector — pill style */
.woocommerce .quantity{display:inline-flex;align-items:center;border:1.5px solid #DDCFB6;border-radius:999px;overflow:hidden;background:#fff}
.woocommerce .quantity input.qty{
  width:56px;border:none;background:transparent;text-align:center;font-family:'Lato',sans-serif;
  font-size:16px;font-weight:700;color:#2E2823;padding:13px 4px;-moz-appearance:textfield;
}
.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:22px}
.woocommerce div.product form.cart .button{flex:1;min-width:200px}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0;margin:0 0 24px;border:none;display:flex;flex-wrap:wrap;gap:10px}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:#F5ECDD;border:1px solid #EFE5D2;border-radius:999px;margin:0;padding:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  font-family:'Lato',sans-serif;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:#7C7266;padding:11px 22px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#2E2823;border-color:#2E2823}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:#F4EADB}
.woocommerce div.product .woocommerce-Tabs-panel h2{font-family:'Cormorant Garamond',serif;color:#2E2823}
.woocommerce div.product .woocommerce-Tabs-panel{font-size:16px;line-height:1.78;color:#5C5349}

/* Related / upsells headings */
.woocommerce .related>h2,.woocommerce .upsells>h2,.woocommerce .cross-sells>h2{
  font-family:'Cormorant Garamond',serif;font-weight:700;font-size:clamp(26px,4vw,36px);color:#2E2823;text-align:center;margin:clamp(40px,6vw,72px) 0 30px;
}

/* --- Cart --- */
.woocommerce table.shop_table{border:1px solid #EFE5D2;border-radius:22px;border-collapse:separate;overflow:hidden;background:#fff}
.woocommerce table.shop_table th{background:#F5ECDD;font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#7C7266;padding:16px}
.woocommerce table.shop_table td{padding:18px 16px;border-top:1px solid #F0E7D6;vertical-align:middle}
.woocommerce table.cart img{width:72px;border-radius:14px}
.woocommerce a.remove{color:#B7A98F !important;border-radius:999px;font-weight:400}
.woocommerce a.remove:hover{background:#BC9353 !important;color:#fff !important}
.woocommerce .cart-collaterals .cart_totals{background:#F5ECDD;border:1px solid #EFE5D2;border-radius:22px;padding:26px}
.woocommerce .cart-collaterals .cart_totals h2{font-family:'Cormorant Garamond',serif;font-size:26px;color:#2E2823;margin-bottom:14px}
.woocommerce .cart_totals table.shop_table{border:none;background:transparent}

/* --- Checkout --- */
.woocommerce-checkout #customer_details{margin-bottom:24px}
.woocommerce form .form-row{margin-bottom:16px}
.woocommerce form .form-row label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9A8F82;font-weight:600;margin-bottom:7px;display:block}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection{
  border:1.5px solid #DDCFB6 !important;border-radius:12px !important;padding:13px !important;
  font-family:'Lato',sans-serif !important;font-size:14px !important;background:#FBF6EC !important;color:#2E2823 !important;min-height:auto;
}
.woocommerce #order_review,
.woocommerce-checkout #order_review{background:#F5ECDD;border:1px solid #EFE5D2;border-radius:22px;padding:26px}
.woocommerce-checkout #payment{background:transparent;border-radius:16px}
.woocommerce-checkout #payment ul.payment_methods{border:none;padding:0}
.woocommerce-checkout #payment div.payment_box{background:#fff;border-radius:12px}
.woocommerce .woocommerce-form-coupon .button{white-space:nowrap}

/* --- My Account --- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.woocommerce-account .woocommerce-MyAccount-navigation li{background:#fff;border:1px solid #EFE5D2;border-radius:14px;margin:0}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active{background:#2E2823;border-color:#2E2823}
.woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:13px 18px;font-family:'Lato',sans-serif;font-size:13px;letter-spacing:.06em;color:#3E382F;font-weight:600}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{color:#F4EADB}
.woocommerce-account .woocommerce-MyAccount-content{background:#fff;border:1px solid #EFE5D2;border-radius:22px;padding:clamp(24px,3vw,36px)}

/* Notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:#BC9353 !important;border-radius:12px;background:#F5ECDD}
.woocommerce-message::before,.woocommerce-info::before{color:#BC9353}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul{border:none;gap:8px;display:flex;justify-content:center}
.woocommerce nav.woocommerce-pagination ul li{border:none}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{border-radius:999px;background:#fff;border:1px solid #EFE5D2;color:#2E2823;padding:10px 16px}
.woocommerce nav.woocommerce-pagination ul li span.current{background:#2E2823;color:#F4EADB;border-color:#2E2823}

/* --- Quantity steppers (branded pill) --- */
.woocommerce .quantity.kk-qty{display:inline-flex;align-items:center;border:1.5px solid #DDCFB6;border-radius:999px;overflow:hidden;background:#fff}
.kk-qty .kk-qty-btn{background:none;border:none;cursor:pointer;padding:12px 16px;font-size:17px;line-height:1;color:#2E2823;font-family:'Lato',sans-serif}
.kk-qty .kk-qty-btn:hover{color:#BC9353}
.woocommerce .quantity.kk-qty input.qty{border:none;width:46px;padding:12px 2px}

/* --- Shop filters sidebar --- */
.kk-shop-filters .kk-filter-widget{background:#fff;border:1px solid #EFE5D2;border-radius:20px;padding:22px 22px 8px;margin-bottom:20px}
.kk-shop-filters .kk-filter-title{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:20px;color:#2E2823;margin:0 0 14px}
.kk-shop-filters ul{list-style:none;margin:0;padding:0}
.kk-shop-filters ul li{padding:6px 0;font-size:14px;color:#5C5349}
.kk-shop-filters ul li a{color:#5C5349}
.kk-shop-filters ul li a:hover{color:#BC9353}
.kk-shop-filters .count{color:#B7A98F;font-size:12px}
.kk-shop-filters .price_slider_wrapper .ui-slider{background:#EFE5D2;border-radius:999px;height:6px;margin:14px 0}
.kk-shop-filters .ui-slider .ui-slider-range{background:#BC9353}
.kk-shop-filters .ui-slider .ui-slider-handle{background:#2E2823;border:none;border-radius:50%;width:16px;height:16px;top:-6px}
.kk-shop-filters .price_slider_amount .button{padding:9px 18px !important;font-size:11px !important}
.kk-shop-filters .price_slider_amount{font-size:13px;color:#5C5349;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
@media (max-width:820px){ .kk-shop-grid{grid-template-columns:1fr !important} .kk-shop-filters{order:2} }

/* --- Result count + ordering --- */
.woocommerce .woocommerce-ordering select,
.woocommerce .woocommerce-ordering{margin-bottom:22px}
.woocommerce .woocommerce-ordering select{
  border:1.5px solid #DDCFB6;border-radius:999px;padding:11px 18px;background:#fff;
  font-family:'Lato',sans-serif;font-size:13px;color:#2E2823;cursor:pointer;
}
.woocommerce .woocommerce-result-count{font-size:13px;color:#7C7266;margin-top:8px}

/* --- Product category tiles (category archive) --- */
.woocommerce ul.products li.product-category a img{border-radius:22px 22px 22px 60px;background:#F1E8D7}
.woocommerce ul.products li.product-category h2.woocommerce-loop-category__title{
  font-family:'Cormorant Garamond',serif !important;font-weight:700;color:#2E2823;font-size:22px;text-align:center;padding-top:14px;
}
.woocommerce ul.products li.product-category .count{background:transparent;color:#9A763E;font-family:'Cormorant Garamond',serif}

/* --- WooCommerce product search widget --- */
.woocommerce-product-search{display:flex;gap:8px}
.woocommerce-product-search input[type="search"]{
  flex:1;border:1.5px solid #DDCFB6;border-radius:12px;padding:12px 14px;background:#FBF6EC;font-family:'Lato',sans-serif;font-size:14px;
}
.woocommerce-product-search button{
  background:#2E2823;color:#F4EADB;border:none;border-radius:12px;padding:12px 18px;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;cursor:pointer;
}
