﻿/* One interaction standard for every WooCommerce and Elementor product loop. */
body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category) {
  transition: transform 220ms ease;
}

body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category):focus-within {
  transform: translateY(-4px);
}

@media (hover: hover) {
  :where(html:not([data-kiddee-input="touch"])) body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category):hover{
    transform: translateY(-4px);
  }
}

body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category):active {
  transform: translateY(-1px);
}

body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category) a img {
  box-shadow: 0 5px 16px color-mix(in srgb, var(--kv2-color-primary-dark) 7%, transparent);
  transition: box-shadow 220ms ease;
}

body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category):focus-within a img {
  box-shadow: 0 14px 30px color-mix(in srgb, var(--kv2-color-primary-dark) 16%, transparent);
}

@media (hover: hover) {
  :where(html:not([data-kiddee-input="touch"])) body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category):hover a img{
    box-shadow: 0 14px 30px color-mix(in srgb, var(--kv2-color-primary-dark) 16%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.kiddee-v2-has-woocommerce #page ul.products > :is(li.product, li.product-category) {
    transition: none;
  }
}

.yith-ywraq-mail-form-wrapper, .yith-ywraq-form-wrapper { max-width: var(--kv2-reading); }
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination { margin-block-start: var(--kv2-space-7); }
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--kv2-space-2); border: 0; margin: 0; }
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li { border: 0; }
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li .page-numbers { display: inline-flex; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; border: 1px solid var(--kv2-airbnb-ink); border-radius: var(--kv2-radius-sm); padding: var(--kv2-space-2); color: var(--kv2-airbnb-ink); background: var(--kv2-color-surface); line-height: 1; text-decoration: none; }
:where(html:not([data-kiddee-input="touch"])) .kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li a.page-numbers:hover,
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li a.page-numbers:focus,
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li a.page-numbers:focus-visible{ border-color: var(--kv2-airbnb-ink); color: var(--kv2-airbnb-ink); background: var(--kv2-color-surface-alt); }
.kiddee-v2-has-woocommerce .woocommerce nav.woocommerce-pagination ul li .page-numbers.current { border-color: var(--kv2-airbnb-ink); color: var(--kv2-airbnb-canvas); background: var(--kv2-airbnb-ink); font-weight: var(--font-weight-bold); }

@media (max-width: 47.99rem) {
  .woocommerce ul.products[class*="columns-"] li.product,
  .woocommerce-page ul.products[class*="columns-"] li.product { width: 100%; }

  .single-product.woocommerce div.product .kiddee-single-product > .summary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 10px;
  }

  .single-product.woocommerce div.product .kiddee-single-product .product_title {
    max-width: none;
    font-size: var(--kv2-type-display-lg-size);
  }

  .single-product.woocommerce div.product .kiddee-single-product .summary > .price {
    font-size: var(--kv2-type-display-xl-size);
  }

  .single-product.woocommerce div.product .kiddee-single-product .woocommerce-product-details__short-description a[href*="line.me"],
  .single-product.woocommerce div.product .kiddee-single-product .add-request-quote-button.button,
  .single-product.woocommerce div.product .kiddee-single-product .yith_ywraq_add_item_browse_message a {
    width: 100%;
    min-width: 0;
    padding-inline: 10px;
    white-space: normal;
    text-align: center;
  }

  .single-product.woocommerce div.product .kiddee-single-product .woocommerce-product-details__short-description a[href*="line.me"]::after {
    font-size: var(--kv2-type-caption-sm-size);
  }

  .single-product.woocommerce div.product .kiddee-single-product .yith_ywraq_add_item_browse_message a {
    padding-inline: 6px;
    font-size: 12px;
    white-space: nowrap;
  }

  .single-product.woocommerce div.product .kiddee-single-product .summary > .product_meta {
    width: 100%;
    font-size: var(--kv2-type-caption-sm-size);
  }

  .single-product.woocommerce div.product .kiddee-single-product .woocommerce-product-details__short-description > ul {
    width: 100%;
    padding-left: 10px;
  }

  .single-product.woocommerce div.product > .woocommerce-tabs {
    margin-top: 36px;
    margin-bottom: 20px;
    padding-bottom: 14px;
  }

  .single-product.woocommerce div.product > .woocommerce-tabs > .woocommerce-Tabs-panel ul {
    padding-left: 18px;
  }

  .single-product.woocommerce div.product > .related.products {
    margin-top: 28px;
  }

  .single-product.woocommerce div.product > .related.products ul.products {
    margin-top: 22px;
  }

  body.single-product.woocommerce .site-main--commerce {
    padding-bottom: 16px;
  }

  .single-product.woocommerce div.product .kiddee-single-product__quantity {
    margin-top: 16px;
  }
}
.kiddee-v2-has-woocommerce .woocommerce,
.kiddee-v2-has-woocommerce .woocommerce-page,
.yith-ywraq-mail-form-wrapper,
.yith-ywraq-form-wrapper,
.yith_ywraq_add_item_response_message,
.yith_ywraq_add_item_browse_message {
  font-family: var(--font-body);
}

.kiddee-v2-has-woocommerce :where(.woocommerce-products-header__title, .page-title, .product_title, .woocommerce-loop-category__title),
.kiddee-v2-has-woocommerce :where(.related.products, .upsells.products, .cross-sells) > h2,
.kiddee-v2-has-woocommerce .kiddee-related-heading {
  font-family: var(--font-heading);
  font-weight: var(--kv2-type-display-lg-weight);
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.kiddee-v2-has-woocommerce :where(.product_title, .woocommerce-products-header__title, .page-title) { font-weight: var(--kv2-type-display-lg-weight); }
.single-product.woocommerce .woocommerce-Reviews-title { font-weight: var(--kv2-type-display-lg-weight); }
.kiddee-v2-has-woocommerce :where(.price, .amount, .sku, .product_meta) { font-family: var(--font-body); }
.kiddee-v2-has-woocommerce :where(.price, .amount) { font-weight: var(--font-weight-semibold); }
.kiddee-v2-has-woocommerce :where(button, .button, input, select, textarea, label, .woocommerce-message, .woocommerce-info, .woocommerce-error, table, .woocommerce-pagination),
.yith-ywraq-mail-form-wrapper :where(button, .button, input, select, textarea, label),
.yith-ywraq-form-wrapper :where(button, .button, input, select, textarea, label) { font-family: var(--font-body); }

/* Shared WooCommerce and quote-request interaction states. */
.kiddee-v2-has-ywraq .yith-ywraq-add-to-quote img.ajax-loading,
.kiddee-v2-has-ywraq #yith-ywraq-form img.ajax-loading {
  --kiddee-ywraq-loader-color: var(--kv2-kiddee-quote-purple);
  --kiddee-ywraq-loader-size: 0.5px;
  content: url("data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=");
  width: calc(48 * var(--kiddee-ywraq-loader-size));
  height: calc(48 * var(--kiddee-ywraq-loader-size));
  border: calc(5 * var(--kiddee-ywraq-loader-size)) solid var(--kiddee-ywraq-loader-color);
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: kiddee-ywraq-loader-rotation 1s linear infinite;
  object-fit: none;
  object-position: -9999px -9999px;
  overflow: hidden;
  vertical-align: middle;
}

@keyframes kiddee-ywraq-loader-rotation {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.woocommerce :where(a.button, button.button, input.button) {
  border: 1px solid var(--kv2-color-primary);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-color-primary);
}

.woocommerce :where(a.button, button.button, input.button):focus-visible,
.yith-ywraq-add-to-quote a:focus-visible,
.yith_ywraq_add_item_browse_message a:focus-visible {
  outline: 3px solid var(--kv2-color-focus);
  outline-offset: 3px;
}

.woocommerce :where(button.button, input.button):disabled,
.woocommerce :where(a.button, button.button)[aria-disabled="true"],
.woocommerce :where(a.button, button.button).disabled {
  border-color: var(--kv2-color-border);
  color: var(--kv2-color-muted-text);
  background: var(--kv2-color-background);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.72;
  transform: none;
}

.yith-ywraq-add-to-quote a,
.yith_ywraq_add_item_browse_message a,
.woocommerce .add-request-quote-button.button {
  border: 1px solid var(--kv2-color-quote-cta);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-color-quote-cta);
  font-size: var(--kv2-type-button-size);
  font-weight: var(--kv2-type-button-weight);
}

:where(html:not([data-kiddee-input="touch"])) .yith-ywraq-add-to-quote a:hover,
:where(html:not([data-kiddee-input="touch"])) .yith_ywraq_add_item_browse_message a:hover,
:where(html:not([data-kiddee-input="touch"])) .woocommerce .add-request-quote-button.button:hover{
  border-color: var(--kv2-color-error);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-color-error);
}

.woocommerce-message { border-top-color: var(--kv2-color-success); background: var(--kv2-color-soft-teal); }
.woocommerce-info { border-top-color: var(--kv2-airbnb-ink); background: var(--kv2-color-soft-blue); }
.woocommerce-error { border-top-color: var(--kv2-color-error); background: var(--kv2-color-soft-red); }

/* Keep the product archive search state neutral instead of inheriting WooCommerce blue. */
body.kiddee-v2-has-woocommerce:is(.post-type-archive-product, .tax-product_cat, .tax-product_tag) #page .woocommerce-info {
  border: 1px dashed var(--kv2-airbnb-ink);
  color: var(--kv2-airbnb-ink);
  background: var(--kv2-airbnb-canvas);
}

body.kiddee-v2-has-woocommerce:is(.post-type-archive-product, .tax-product_cat, .tax-product_tag) #page .woocommerce-info::before {
  color: var(--kv2-airbnb-ink);
}

#page .yith-ywraq-add-to-quote a,
#page .yith_ywraq_add_item_browse_message a,
#page .woocommerce .add-request-quote-button.button {
  border-color: var(--kv2-color-quote-cta);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-color-quote-cta);
  font-size: var(--kv2-type-button-size);
  font-weight: var(--kv2-type-button-weight);
}

:where(html:not([data-kiddee-input="touch"])) #page .yith-ywraq-add-to-quote a:hover,
:where(html:not([data-kiddee-input="touch"])) #page .yith_ywraq_add_item_browse_message a:hover,
:where(html:not([data-kiddee-input="touch"])) #page .woocommerce .add-request-quote-button.button:hover{
  border-color: var(--kv2-color-error);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-color-error);
}

#page .yith-ywraq-add-to-quote a[aria-disabled="true"],
#page .yith_ywraq_add_item_browse_message a[aria-disabled="true"],
#page .woocommerce .add-request-quote-button.button:disabled,
#page .woocommerce .add-request-quote-button.button.disabled {
  border-color: var(--kv2-color-border);
  color: var(--kv2-color-muted-text);
  background: var(--kv2-color-background);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.72;
  transform: none;
}

/* Single-product Request Quote is the approved purple sibling of the LINE CTA.
 * This late interaction layer intentionally resolves the generic YITH quote color. */
#page :where(.kiddee-single-product) .add-request-quote-button.button,
#page :where(.kiddee-single-product) .yith_ywraq_add_item_browse_message a {
  border-color: var(--kv2-kiddee-quote-purple);
  color: var(--kv2-color-on-dark);
  background: var(--kv2-kiddee-quote-purple);
  font-size: var(--kv2-product-action-font-size);
  font-weight: var(--kv2-product-action-font-weight);
  line-height: var(--kv2-type-button-line);
}

:where(html:not([data-kiddee-input="touch"])) #page :where(.kiddee-single-product) .add-request-quote-button.button:hover,
:where(html:not([data-kiddee-input="touch"])) #page :where(.kiddee-single-product) .yith_ywraq_add_item_browse_message a:hover{
  border-color: color-mix(in srgb, var(--kv2-kiddee-quote-purple) 86%, var(--kv2-airbnb-ink));
  color: var(--kv2-color-on-dark);
  background: color-mix(in srgb, var(--kv2-kiddee-quote-purple) 86%, var(--kv2-airbnb-ink));
}
