/* Keranjang Kenangan · approved warm editorial system · ENERGY 2 / RHYTHM 3 / MOTION 1.
 * Scoped to storefront body. WooCommerce templates and order behavior remain native.
 */
@font-face {
  font-family: 'Fraunces';
  src: url('fonts/fraunces-600.woff2') format('woff2'), url('fonts/fraunces-600.ttf') format('truetype');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('fonts/manrope-400.woff2') format('woff2'), url('fonts/manrope-400.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('fonts/manrope-500.woff2') format('woff2'), url('fonts/manrope-500.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('fonts/manrope-600.woff2') format('woff2'), url('fonts/manrope-600.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Manrope';
  src: url('fonts/manrope-700.woff2') format('woff2'), url('fonts/manrope-700.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}
.kk-store {
  --kk-primary: var(--color-primary);
  --kk-primary-hover: var(--color-primary-hover);
  --kk-primary-light: var(--color-paper-2);
  --kk-secondary: var(--color-whatsapp);
  --kk-amber: var(--color-accent);
  --kk-dark: var(--color-ink);
  --kk-muted: var(--color-muted);
  --kk-light-bg: var(--color-paper);
  --kk-card-bg: var(--color-surface);
  --kk-wa-color: var(--color-whatsapp);
  --kk-wa-hover: var(--color-whatsapp-hover);
  --kk-border: var(--color-rule);
  --kk-border-focus: var(--color-focus);
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.65;
}
.kk-store h1, .kk-store h2, .kk-store .entry-title,
.kk-store .woocommerce-products-header__title {
  font-family: var(--font-display);
  color: var(--color-ink);
  font-weight: 600;
  font-style: normal;
  letter-spacing: -.035em;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.kk-store h1, .kk-store .entry-title { font-size: clamp(2rem, 4vw, 3.5rem); }
.kk-store h2 { font-size: clamp(1.5rem, 2.7vw, 2rem); }
.kk-store h3, .kk-store h4, .kk-store h5, .kk-store h6 { color: var(--color-ink); }
.kk-store a { color: var(--color-primary); text-underline-offset: 4px; }
.kk-store a:hover { color: var(--color-primary-hover); }
.kk-store :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 4px;
}
.kk-store #content, .kk-store.ast-separate-container { background: var(--color-paper); }
.kk-store .ast-container { max-width: var(--layout-max); }
.kk-store :is(.ast-primary-header-bar, .ast-above-header-bar, .ast-below-header-bar, .ast-mobile-header-content, .ast-mobile-popup-drawer) {
  background: var(--color-paper);
  border-color: var(--color-rule);
}
.kk-store .site-header .custom-logo { width: 58px; max-height: 90px; object-fit: contain; }
.kk-store .site-title, .kk-store .site-title a { font-family: var(--font-display); color: var(--color-ink); }
.kk-store .main-header-menu .menu-link { color: var(--color-ink); font-family: var(--font-body); font-size: 14px; }
.kk-store .ast-site-header-cart :is(.ast-icon-shopping-cart, .ast-cart-menu-wrap),
.kk-store .ast-header-break-point .main-header-menu .menu-link { color: var(--color-primary); }
.kk-store :is(.site-below-footer-wrap, .site-primary-footer-wrap, .ast-small-footer) {
  background: var(--color-paper-2);
  color: var(--color-muted);
  border-color: var(--color-rule);
}
.kk-store .woocommerce-breadcrumb { font-size: 12px; color: var(--color-muted); margin-bottom: 24px; }
.kk-store .kk-shopping-note { color: var(--color-muted); font-size: 14px; max-width: 65ch; margin: 0 0 28px; }
.kk-store :is(.woocommerce-result-count, .ast-woo-product-category, .product_meta) { color: var(--color-muted); }
.kk-store :is(input[type='text'], input[type='email'], input[type='number'], input[type='tel'], input[type='search'], input[type='password'], select, textarea) {
  min-height: var(--control-height);
  border: 1px solid var(--color-input);
  border-radius: var(--radius-control);
  color: var(--color-ink);
  background: var(--color-surface);
  font-family: var(--font-body);
  font-size: 14px;
  box-shadow: none;
  max-width: 100%;
}
.kk-store input::placeholder, .kk-store textarea::placeholder { color: var(--color-muted); }
.kk-store select { padding: 10px 36px 10px 12px; }
.kk-store :is(.woocommerce, #main) .woocommerce-ordering select { border: 1px solid var(--color-input); border-radius: var(--radius-control); }
.kk-store :is(button, input[type='submit'], .button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .wp-block-button__link, .elementor-button) {
  min-height: var(--control-height);
  padding: 13px 20px;
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-control);
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
  box-shadow: none;
  text-decoration: none;
  transition: background-color var(--dur-fast) var(--ease-standard);
}
.kk-store :is(.button, .woocommerce a.button, .woocommerce button.button, button, input[type='submit']):hover {
  color: var(--color-on-primary);
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  box-shadow: none;
  transform: none;
}
.kk-store :is(button:disabled, .button.disabled, .woocommerce button.button:disabled, .woocommerce button.button:disabled[disabled]) {
  background: var(--color-disabled);
  color: var(--color-muted);
  border-color: var(--color-rule);
  opacity: 1;
  cursor: not-allowed;
}
.kk-store :is(.woocommerce, #main) ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px 24px;
  margin: 0 0 48px;
}
.kk-store :is(.woocommerce, #main) ul.products::before, .kk-store :is(.woocommerce, #main) ul.products::after { display: none; }
.kk-store :is(.woocommerce, #main) ul.products li.product {
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
  display: flex;
  flex-direction: column;
}
.kk-store :is(.woocommerce, #main) ul.products li.product:hover { box-shadow: none; transform: none; }
.kk-store :is(.woocommerce, #main) ul.products li.product .astra-shop-thumbnail-wrap {
  aspect-ratio: 1;
  background: var(--color-surface);
  border-radius: var(--radius-card);
  overflow: clip;
  position: relative;
}
.kk-store :is(.woocommerce, #main) ul.products li.product .woocommerce-loop-product__link { display: block; }
.kk-store :is(.woocommerce, #main) ul.products li.product .astra-shop-thumbnail-wrap > a,
.kk-store :is(.woocommerce, #main) ul.products li.product .astra-shop-thumbnail-wrap > a img {
  width: 100%; height: 100%;
}
.kk-store :is(.woocommerce, #main) ul.products li.product a img {
  position: static;
  inset: auto;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 16px;
  margin: 0;
  border-radius: var(--radius-card);
  background: var(--color-surface);
  transition: none;
  transform: none;
}
.kk-store .astra-shop-thumbnail-wrap:has(.kk-photo-unavailable) {
  background: var(--color-paper-2);
}
.kk-store .astra-shop-thumbnail-wrap:has(.kk-photo-unavailable) img.woocommerce-placeholder {
  opacity: 0.25;
  filter: grayscale(100%);
}
.kk-store .kk-photo-unavailable {
  position: absolute;
  inset: auto 12px 14px;
  background: rgba(255, 253, 248, 0.92);
  border: 1px solid var(--color-rule);
  border-radius: 9999px;
  padding: 4px 10px;
  color: var(--color-muted);
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 1px 3px rgba(43,33,25,0.06);
}
.kk-store :is(.woocommerce, #main) ul.products li.product .astra-shop-summary-wrap { padding: 16px 0 0; flex: 1; display: flex; flex-direction: column; align-items: stretch; text-align: left; }
.kk-store :is(.woocommerce, #main) ul.products li.product .ast-woo-product-category { font-size: 12px; opacity: 1; margin-bottom: 8px; }
.kk-store :is(.woocommerce, #main) ul.products li.product .woocommerce-loop-product__title {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  margin: 0 0 12px;
  color: var(--color-ink);
}
.kk-store :is(.woocommerce, #main) :is(ul.products li.product .price, div.product p.price, div.product span.price) {
  color: var(--color-ink);
  font-family: var(--font-body);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: 18px;
}
.kk-store :is(.woocommerce, #main) ul.products li.product .button {
  background: none;
  color: var(--color-ink);
  border-color: var(--color-input);
  width: 100%;
  margin: auto 0 0;
  text-align: center;
}
.kk-store :is(.woocommerce, #main) ul.products li.product .button:hover { background: var(--color-paper-2); }
.kk-store :is(.woocommerce, #main) ul.products li.product .price { margin-bottom: 16px; }
.kk-store :is(.woocommerce, #main) nav.woocommerce-pagination ul { border: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.kk-store :is(.woocommerce, #main) nav.woocommerce-pagination ul li { border: 0; }
.kk-store :is(.woocommerce, #main) nav.woocommerce-pagination ul li :is(a, span) { min-width: 44px; min-height: 44px; padding: 12px; border-radius: var(--radius-sm); color: var(--color-ink); }
.kk-store :is(.woocommerce, #main) nav.woocommerce-pagination ul li span.current { background: var(--color-primary); color: var(--color-on-primary); }
.kk-store :is(.woocommerce, #main) div.product .product_title { font-size: clamp(1.8rem, 3vw, 2.8rem); }
.kk-store :is(.woocommerce, #main) div.product div.images img { object-fit: contain; background: var(--color-surface); border-radius: var(--radius-card); }
.kk-store :is(.woocommerce, #main) div.product .summary { color: var(--color-muted); }
.kk-store :is(.woocommerce, #main) .quantity .qty { width: 76px; padding: 10px; color: var(--color-ink); }
.kk-store :is(.woocommerce, #main) div.product form.cart { display: flex; align-items: start; flex-wrap: wrap; gap: 12px; }
.kk-store :is(.woocommerce, #main) div.product form.variations_form { display: block; }
.kk-store :is(.woocommerce, #main) div.product form.cart .quantity { margin: 0; }
.kk-store :is(.woocommerce, #main) div.product .woocommerce-tabs ul.tabs li.active::before { background: var(--color-primary); }
.kk-store :is(.woocommerce, #main) .related.products { margin-top: 64px; }
.kk-store :is(.woocommerce, #main) table.shop_table { border-color: var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.kk-store :is(.woocommerce, #main) table.shop_table :is(th, td) { border-color: var(--color-rule); padding: 20px 16px; color: var(--color-ink); }
.kk-store :is(.woocommerce, #main) table.shop_table th { font-size: 12px; font-weight: 600; }
.kk-store :is(.woocommerce, #main) table.shop_table td { font-size: 14px; }
.kk-store .woocommerce-cart-form .product-thumbnail img { width: 80px; max-width: none; object-fit: contain; }
.kk-store :is(.woocommerce, #main) .cart-collaterals .cart_totals { padding: 28px; border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.kk-store :is(.woocommerce, #main) .cart-collaterals .cart_totals h2 { background: none; border: none; margin: 0 0 20px; padding: 0; }
.kk-store :is(.woocommerce, #main) .cart_totals table.shop_table { border: 0; margin: 0; border-radius: 0; }
.kk-store :is(.woocommerce, #main) .cart_totals table.shop_table :is(td, th) { padding: 16px 0; }
.kk-store :is(.woocommerce, #main) .cart_totals table.shop_table tr:first-child :is(th, td) { border-top: 0; }
.kk-store :is(.woocommerce, #main) .wc-proceed-to-checkout { padding: 20px 0 0; }
.kk-store :is(.woocommerce, #main) .wc-proceed-to-checkout p { font-size: 13px; line-height: 1.75; color: var(--color-muted); }
.kk-store :is(.woocommerce, #main) a.kk-cart-whatsapp,
.kk-store .kk-floating-wa-btn, .kk-store .kk-btn-whatsapp-order {
  background: var(--color-whatsapp);
  color: var(--color-on-primary);
  border-color: var(--color-whatsapp);
  border-radius: var(--radius-control);
  box-shadow: none;
  transform: none;
}
.kk-store :is(.woocommerce, #main) a.kk-cart-whatsapp { display: block; font-size: 14px; padding: 16px 12px; margin: 20px 0 0; line-height: 1.5; }
.kk-store :is(.woocommerce, #main) a.kk-cart-whatsapp:hover, .kk-store .kk-floating-wa-btn:hover { background: var(--color-whatsapp-hover); color: var(--color-on-primary); box-shadow: none; transform: none; }
.kk-store .kk-cart-whatsapp[aria-disabled='true'] { background: var(--color-disabled); color: var(--color-muted); cursor: not-allowed; border-color: var(--color-rule); }
.kk-store .kk-floating-wa-btn { min-width: 48px; min-height: 48px; padding: 12px; }
.kk-store .kk-floating-wa-container { right: 16px; bottom: 16px; }
.kk-store.woocommerce-cart .kk-floating-wa-container { display: none; }
.kk-store :is(.woocommerce, #main) :is(.woocommerce-message, .woocommerce-info) {
  border: 1px solid rgba(40, 88, 63, 0.22);
  border-left: 4px solid var(--color-success);
  background: var(--color-success-soft);
  color: var(--color-success);
  border-radius: 10px;
  padding: 14px 18px;
  box-shadow: 0 2px 6px rgba(40, 88, 63, 0.05);
}
.kk-store :is(.woocommerce, #main) :is(.woocommerce-message, .woocommerce-info)::before { color: var(--color-success); }
.kk-store :is(.woocommerce, #main) .woocommerce-error {
  border: 1px solid rgba(162, 52, 40, 0.22);
  border-left: 4px solid var(--color-error);
  color: var(--color-error);
  background: var(--color-error-soft);
  border-radius: 10px;
  padding: 14px 18px;
  box-shadow: 0 2px 6px rgba(162, 52, 40, 0.05);
}
.kk-store :is(.woocommerce, #main) .woocommerce-error::before { color: var(--color-error); }
.kk-store .ast-cart-drawer { background: var(--color-surface); color: var(--color-ink); }
.kk-store .kk-order-note { margin: 24px 0; padding: 20px 0; border-top: 1px solid var(--color-rule); color: var(--color-ink); }
.kk-store .kk-order-note strong { font-weight: 600; font-size: 14px; }
.kk-store .kk-order-note p { color: var(--color-muted); font-size: 14px; margin: 8px 0 0; }
.kk-store .ast-cart-drawer .ast-cart-drawer-header { border-color: var(--color-rule); }
.kk-store .ast-cart-drawer :is(.ast-cart-drawer-title, .woocommerce-mini-cart__total) { color: var(--color-ink); }
.kk-store .elementor { --e-global-color-primary: var(--color-primary); --e-global-color-text: var(--color-ink); --e-global-color-secondary: var(--color-muted); --e-global-color-accent: var(--color-accent); --e-global-typography-primary-font-family: var(--font-display); --e-global-typography-text-font-family: var(--font-body); }
.kk-store .ast-header-button-1 .ast-custom-button { background: var(--color-primary); color: var(--color-on-primary); border-radius: var(--radius-control); min-height: 48px; align-content: center; }
.kk-store .ast-site-header-cart .ast-cart-menu-wrap .count { background: var(--color-primary); color: var(--color-on-primary); }
.kk-store .ast-site-header-cart .ast-icon { color: var(--color-primary); }
.kk-store :is(.woocommerce, #main) ul.products li.product .ast-on-card-button { display: none; }
@media (min-width: 1025px) {
  .kk-store.woocommerce-cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(300px, 1fr); gap: 32px; align-items: start; }
  .kk-store.woocommerce-cart .woocommerce > :is(.woocommerce-notices-wrapper, .kk-shopping-note, .cart-empty, .return-to-shop) { grid-column: 1 / -1; }
  .kk-store.woocommerce-cart .cart-collaterals .cart_totals { float: none; width: 100%; }
}
@media (max-width: 1024px) {
  .kk-store :is(.woocommerce, #main) ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 20px; }
  .kk-store :is(.woocommerce, #main) .cart-collaterals .cart_totals { float: none; width: 100%; }
}
@media (max-width: 767px) {
  .kk-store .ast-container { padding-left: 20px; padding-right: 20px; }
  .kk-store .site-header .custom-logo { max-height: 64px; width: 42px; }
  .kk-store :is(.woocommerce, #main) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
  .kk-store :is(.woocommerce, #main) ul.products li.product .woocommerce-loop-product__title { font-size: 14px; }
  .kk-store :is(.woocommerce, #main) ul.products li.product .price { font-size: 16px; }
  .kk-store :is(.woocommerce, #main) ul.products li.product .button { font-size: 12px; padding: 12px 8px; }
  .kk-store :is(.woocommerce, #main) ul.products li.product a img { padding: 12px; }
  .kk-store :is(.woocommerce, #main) .cart-collaterals .cart_totals { padding: 20px; margin-top: 28px; }
  .kk-store :is(.woocommerce, #main) table.shop_table :is(th, td) { padding: 16px 12px; }
  .kk-store :is(.woocommerce, #main) table.shop_table_responsive tr td { background: var(--color-surface); border-color: var(--color-rule); }
  .kk-store .woocommerce-cart-form .product-thumbnail { display: none; }
  .kk-store .woocommerce-cart-form .product-remove { text-align: right; }
  .kk-store :is(.woocommerce, #main) table.cart td.actions .coupon { display: flex; flex-wrap: wrap; gap: 12px; }
  .kk-store :is(.woocommerce, #main) table.cart td.actions .coupon :is(input, button) { width: 100%; margin: 0; }
  .kk-store :is(.woocommerce, #main) table.cart td.actions > button { width: 100%; margin-top: 12px; }
  .kk-store :is(.woocommerce, #main) .woocommerce-ordering { float: none; margin: 0 0 28px; }
  .kk-store :is(.woocommerce, #main) .woocommerce-ordering select { width: 100%; }
}
@media (max-width: 359px) {
  .kk-store :is(.woocommerce, #main) ul.products { grid-template-columns: minmax(0, 1fr); }
  .kk-store :is(.woocommerce, #main) ul.products li.product .woocommerce-loop-product__title { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .kk-store *, .kk-store *::before, .kk-store *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
