/**
 * WooCommerce Styles for impulsedesign theme
 *
 * Color scheme:
 * - Accent: #E5E28B
 * - Text: #231F20
 * - Background: #FFF
 * - Section bg: #FAF3E8, #F2EBE1
 * - Secondary text: #665A5D
 */

/* ==========================================================================
   Header Cart Icon
   ========================================================================== */

.header__cart {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-left: auto;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  transition: all 0.2s ease;
}

.header__cart:hover {
  background: rgba(255, 255, 255, 0.1);
}

.header__cart svg {
  width: 20px;
  height: 20px;
}

.header__cart .cart-count {
  position: absolute;
  top: -5px;
  right: -5px;
  background: #e5e28b;
  color: #231f20;
  font-size: 11px;
  font-weight: 600;
  min-width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header.scrolled .header__cart {
  color: #231f20;
  border-color: rgba(0, 0, 0, 0.2);
}

.header.scrolled .header__cart:hover {
  background: rgba(0, 0, 0, 0.05);
}

/* ==========================================================================
   Header Account Icon
   ========================================================================== */

.header__account {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  transition: all 0.2s ease;
}

.header__account:hover {
  background: rgba(255, 255, 255, 0.1);
}

.header__account svg {
  width: 20px;
  height: 20px;
}

.header.scrolled .header__account {
  color: #231f20;
  border-color: rgba(0, 0, 0, 0.2);
}

.header.scrolled .header__account:hover {
  background: rgba(0, 0, 0, 0.05);
}

@media (max-width: 999px) {
  .header__cart {
    width: 36px;
    height: 36px;
  }

  .header__cart svg {
    width: 18px;
    height: 18px;
  }

  .header__account {
    width: 36px;
    height: 36px;
  }

  .header__account svg {
    width: 18px;
    height: 18px;
  }
}

/* ==========================================================================
   Header Account Icon
   ========================================================================== */

.header__account {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  transition: all 0.2s ease;
}

.header__account:hover {
  background: rgba(255, 255, 255, 0.1);
}

.header__account svg {
  width: 20px;
  height: 20px;
}

.header.scrolled .header__account {
  color: #231f20;
  border-color: rgba(0, 0, 0, 0.2);
}

.header.scrolled .header__account:hover {
  background: rgba(0, 0, 0, 0.05);
}

@media (max-width: 999px) {
  .header__account {
    width: 36px;
    height: 36px;
  }

  .header__account svg {
    width: 18px;
    height: 18px;
  }
}

/* ==========================================================================
   General WooCommerce Styles
   ========================================================================== */

.woocommerce-main {
  padding-top: 40px;
  min-height: 100vh;
  background-color: #fff;
}

.woocommerce-main .container {
  max-width: 168.89vh;
  padding: 0 1.48vh;
  margin: 0 auto;
  width: 100%;
}

@media (max-width: 999px) {
  .woocommerce-main {
    padding-top: 70px;
  }

  .woocommerce-main .container {
    padding: 0 16px;
  }
}

.woocommerce-page-wrapper {
  padding: 80px 0 80px;
}

@media (max-width: 600px) {
  .woocommerce-page-wrapper {
    padding: 40px 0 40px;
  }
}

/* Breadcrumbs */
.woocommerce-breadcrumb {
  margin-bottom: 30px;
  font-size: 14px;
  color: #665a5d;
}

.woocommerce-breadcrumb a {
  color: #231f20;
  transition: color 0.2s ease;
}

.woocommerce-breadcrumb a:hover {
  color: #e5e28b;
}

.breadcrumb-separator {
  margin: 0 10px;
  color: #665a5d;
}

/* Page Title */
.woocommerce-products-header__title {
  font-size: 5.56vh;
  font-weight: 600;
  line-height: 120%;
  margin-bottom: 20px;
  color: #231f20;
}

@media (max-width: 999px) {
  .woocommerce-products-header__title {
    font-size: 32px;
  }
}

/* ==========================================================================
   Shop Page Layout
   ========================================================================== */

.woocommerce-shop-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  align-items: start;
}

@media (max-width: 999px) {
  .woocommerce-shop-layout {
    grid-template-columns: 1fr;
  }

  .woocommerce-sidebar {
    order: 2;
  }

  .woocommerce-shop-content {
    order: 1;
  }
}

/* Shop Sidebar */
.woocommerce-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: #faf3e8;
  border-radius: 12px;
  padding: 16px;
}

.shop-widget {
  margin-bottom: 16px;
}

.shop-widget:last-child {
  margin-bottom: 0;
}

.shop-widget__title,
.woocommerce-sidebar .widget-title {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #231f20;
  padding-bottom: 8px;
  border-bottom: 2px solid #e5e28b;
}

.shop-widget ul,
.woocommerce-sidebar .product-categories {
  list-style: none;
  padding: 0;
  margin: 0;
}

.shop-widget ul li,
.woocommerce-sidebar .product-categories li {
  margin-bottom: 4px;
}

.shop-widget ul li a,
.woocommerce-sidebar .product-categories li a {
  color: #231f20;
  font-size: 16px;
  transition: all 0.2s ease;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0;
  border: none;
}

.shop-widget ul li a:hover,
.woocommerce-sidebar .product-categories li a:hover {
  color: #231f20;
  text-decoration: underline;
}

.shop-widget .count,
.woocommerce-sidebar .count {
  background: #e5e28b;
  color: #231f20;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 10px;
}

/* Price Filter Widget */
.widget_price_filter .price_slider_wrapper {
  padding-top: 6px;
}

.widget_price_filter .ui-slider {
  background: #e5e28b;
  border-radius: 2px;
  height: 2px;
  margin-bottom: 8px;
}

.widget_price_filter .ui-slider .ui-slider-range {
  background: #231f20;
}

.widget_price_filter .ui-slider .ui-slider-handle {
  background: #231f20;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  top: -3px;
  cursor: pointer;
}

.widget_price_filter .price_slider_amount {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.widget_price_filter .price_slider_amount .price_label {
  font-size: 14px;
  color: #665a5d;
}

.widget_price_filter .price_slider_amount .button {
  background: #e5e28b;
  color: #231f20;
  border: none;
  padding: 6px 12px !important;
  border-radius: 20px;
  font-family: 'Nunito', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
  overflow: hidden;
}

.widget_price_filter .price_slider_amount .button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transition: left 0.4s ease;
}

.widget_price_filter .price_slider_amount .button:hover::before {
  left: 100%;
}

/* ==========================================================================
   Shop Loop / Before Loop
   ========================================================================== */

.woocommerce-shop-content .woocommerce-notices-wrapper {
  margin-bottom: 20px;
}

.woocommerce-result-count,
.woocommerce-ordering {
  margin-bottom: 20px;
}

.woocommerce-result-count {
  color: #665a5d;
  font-size: 14px;
}

.woocommerce-ordering select {
  padding: 10px 40px 10px 16px;
  border: 1px solid #e5e28b;
  border-radius: 20px;
  background-color: #fff;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px;
  color: #231f20;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 15.4L6 9.4L7.4 8L12 12.6L16.6 8L18 9.4L12 15.4Z' fill='%23231F20'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 20px;
}

.woocommerce-ordering select:focus {
  outline: none;
  border-color: #231f20;
}

/* Before Shop Loop Flex Container */
.woocommerce-shop-content > .woocommerce-notices-wrapper + .woocommerce-result-count,
.woocommerce-shop-content > .woocommerce-result-count {
  float: left;
}

.woocommerce-shop-content > .woocommerce-ordering {
  float: right;
}

.woocommerce-shop-content::after {
  content: '';
  display: table;
  clear: both;
}

/* ==========================================================================
   Products Grid
   ========================================================================== */

/* Reset WooCommerce default clearfix ::before/::after */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
ul.products::before,
ul.products::after,
.products-grid::before,
.products-grid::after {
  content: none !important;
  display: none !important;
}

/* Reset WooCommerce default product width */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  clear: none !important;
}

.products-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
  clear: both;
  width: 100%;
}

.products-grid.columns-3 {
  grid-template-columns: repeat(3, 1fr);
}

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

@media (max-width: 1200px) {
  .products-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .products-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   Product Card (in loop)
   ========================================================================== */

.product__item {
  position: relative;
  border-radius: 12px;
  background: #fff;
  padding: 8px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product__item:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

/* Sale Badge */
.product__item-details,
.product__item .onsale {
  position: absolute;
  z-index: 1;
  top: 12px;
  left: 12px;
  display: flex;
  padding: 2px 8px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  line-height: 140%;
  background: #e5e28b;
  color: #231f20;
}

.product__item-tag {
  top: auto;
}

.product__item-tag:first-of-type {
  top: 44px;
}

.product__item-tag:nth-of-type(2) {
  top: 64px;
}

.product__item-tag:nth-of-type(3) {
  top: 84px;
}

.product__item .onsale ~ .product__item-tag:first-of-type {
  top: 44px;
}

.product__item .onsale ~ .product__item-tag:nth-of-type(2) {
  top: 64px;
}

.product__item .onsale ~ .product__item-tag:nth-of-type(3) {
  top: 84px;
}

.product__item:not(:has(.onsale)) .product__item-tag:first-of-type {
  top: 12px;
}

.product__item:not(:has(.onsale)) .product__item-tag:nth-of-type(2) {
  top: 32px;
}

.product__item:not(:has(.onsale)) .product__item-tag:nth-of-type(3) {
  top: 52px;
}

@media (max-width: 999px) {
  .product__item-details,
  .product__item .onsale {
    font-size: 9px;
    padding: 2px 6px;
    top: 10px;
    left: 10px;
  }
}

/* Product Image */
.product__item-image {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

.product__item-image--wrapper {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
}

.product__item-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.product__item:hover .product__item-image img {
  transform: scale(1.05);
}

/* Product Content */
.product__item-content {
  margin-top: 8px;
  padding: 12px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.product__item-title-link {
  display: block;
}

.product__item-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 130%;
  color: #231f20;
  margin: 0;
  transition: color 0.2s ease;
}

.product__item-title-link:hover .product__item-title {
  color: #665a5d;
}

@media (max-width: 1279px) {
  .product__item-title {
    font-size: 17px;
  }
}

@media (max-width: 999px) {
  .product__item-title {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .product__item-title {
    font-size: 17px;
  }
}

.product__item-descr {
  margin-top: 8px;
  margin-bottom: auto;
  padding: 4px 0;
  color: #665a5d;
  font-size: 14px;
  line-height: 145%;
  max-width: 100%;
}

@media (max-width: 1279px) {
  .product__item-descr {
    font-size: 13px;
  }
}

@media (max-width: 999px) {
  .product__item-descr {
    font-size: 13px;
  }
}

@media (max-width: 767px) {
  .product__item-descr {
    font-size: 14px;
  }
}

/* Product Price */
.product__item-price {
  margin-top: auto;
  margin-top: 8px;
  margin-bottom: 8px;
}

.product__item-price .price {
  font-size: 20px;
  font-weight: 700;
  color: #231f20;
}

.product__item-price del {
  color: #665a5d;
  font-size: 15px;
  margin-right: 6px;
}

.product__item-price ins {
  text-decoration: none;
  color: #231f20;
}

@media (max-width: 999px) {
  .product__item-price .price {
    font-size: 18px;
  }

  .product__item-price del {
    font-size: 14px;
  }
}

/* Product Actions / Add to Cart Button */
.product__item-actions {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product__item-more,
.product__item .add_to_cart_button,
.product__item .button {
  transition: all 0.2s ease;
  border-radius: 100px !important;
  border: 1px solid #e5e28b !important;
  padding: 10px 12px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: none !important;
  background: transparent !important;
  color: #231f20;
  font-size: 16px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  text-decoration: none;
  max-width: none !important;
  margin-top: 0 !important;
}

.product__item-more:hover,
.product__item .add_to_cart_button:hover,
.product__item .button:hover {
  background-color: #e5e28b !important;
}

.product__item .add_to_cart_button::after {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M16.575 8.9V16.5C16.575 16.7833 16.6708 17.0208 16.8625 17.2125C17.0542 17.4042 17.2917 17.5 17.575 17.5C17.8583 17.5 18.0958 17.4042 18.2875 17.2125C18.4792 17.0208 18.575 16.7833 18.575 16.5V6.5C18.575 6.21667 18.4792 5.97917 18.2875 5.7875C18.0958 5.59583 17.8583 5.5 17.575 5.5H7.575C7.29167 5.5 7.05417 5.59583 6.8625 5.7875C6.67083 5.97917 6.575 6.21667 6.575 6.5C6.575 6.78333 6.67083 7.02083 6.8625 7.2125C7.05417 7.40417 7.29167 7.5 7.575 7.5H15.175L6.275 16.4C6.09167 16.5833 6 16.8167 6 17.1C6 17.3833 6.09167 17.6167 6.275 17.8C6.45833 17.9833 6.69167 18.075 6.975 18.075C7.25833 18.075 7.49167 17.9833 7.675 17.8L16.575 8.9Z' fill='%23231F20'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  width: 13px;
  height: 13px;
  min-width: 13px;
  flex-shrink: 0;
}

.product__item .add_to_cart_button.loading {
  position: relative;
}

.product__item .add_to_cart_button.loading::after {
  font-family: 'WooCommerce' !important;
  content: '\e01c' !important;
  background-image: none !important;
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  vertical-align: middle !important;
  font-weight: 400 !important;
  animation: spin 2s linear infinite !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  min-width: auto !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
  #respond
  input#submit.added::after,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.added::after,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.added::after,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor))
  .woocommerce
  #respond
  input#submit.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor))
  .woocommerce
  a.button.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor))
  .woocommerce
  button.button.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor))
  .woocommerce
  input.button.added::after {
  background-image: none;
}

@media (max-width: 999px) {
  .product__item-more,
  .product__item .add_to_cart_button,
  .product__item .button {
    font-size: 16px;
    padding: 10px 12px;
    gap: 8px;
  }

  .product__item .add_to_cart_button::after {
    width: 12px;
    height: 12px;
    min-width: 12px;
  }
}

/* Added to cart / View cart button */
.product__item .added_to_cart {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  width: 100%;
  padding: 10px 12px !important;
  border-radius: 100px;
  background: #e5e28b;
  color: #231f20;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

.product__item .added_to_cart:hover {
  background: #231f20;
  color: #fff;
}

/* Remove duplicate icon from view cart button */
.product__item .added_to_cart::after {
  display: none;
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.woocommerce-pagination {
  padding: 20px 0;
  text-align: center;
}

.woocommerce-pagination ul {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 15px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

.woocommerce-pagination ul li {
  display: block;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 40px;
  height: 40px;
  line-height: 40px !important;
  border-radius: 50%;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: #f0f0f0;
  color: #231f20;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s ease;
  text-decoration: none;
}

.woocommerce-pagination ul li a:hover {
  background: #e5e28b;
}

.woocommerce-pagination ul li span.current {
  background: #e5e28b;
  color: #231f20;
}

/* Reset WooCommerce default pagination borders */
nav.woocommerce-pagination ul,
.woocommerce nav.woocommerce-pagination ul {
  border: none !important;
}

nav.woocommerce-pagination ul li,
.woocommerce nav.woocommerce-pagination ul li {
  border: none !important;
}

/* ==========================================================================
   Single Product Page
   ========================================================================== */

.single-product-wrapper {
  background: #fff;
}

/* Product Gallery */
.single-product-gallery {
  position: relative;
}

.single-product-gallery .onsale {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 10;
  background: #e5e28b;
  color: #231f20;
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 600;
}

.single-product-gallery .woocommerce-product-gallery {
  position: relative;
}

.single-product-gallery .woocommerce-product-gallery__wrapper {
  margin: 0;
}

.single-product-gallery .woocommerce-product-gallery__image {
  border-radius: 12px;
  overflow: hidden;
}

.single-product-gallery .woocommerce-product-gallery__image img {
  width: 100%;
  height: auto;
  display: block;
}

.single-product-gallery .flex-control-thumbs {
  display: flex;
  gap: 10px;
  margin-top: 16px;
  list-style: none;
  padding: 0;
}

.single-product-gallery .flex-control-thumbs li {
  width: 80px;
  height: 80px;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color 0.2s ease;
}

.single-product-gallery .flex-control-thumbs li:hover,
.single-product-gallery .flex-control-thumbs li.flex-active {
  border-color: #e5e28b;
}

.single-product-gallery .flex-control-thumbs li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Product Info */
.single-product-info {
  padding: 20px 0;
}

.single-product-info .product_title {
  font-size: 4vh;
  font-weight: 600;
  line-height: 120%;
  color: #231f20;
  margin: 0 0 20px;
}

@media (max-width: 999px) {
  .single-product-info .product_title {
    font-size: 28px;
  }
}

/* Rating */
.single-product-info .woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.single-product-info .star-rating {
  color: #e5e28b;
  font-size: 14px;
}

.single-product-info .woocommerce-review-link {
  color: #665a5d;
  font-size: 14px;
}

/* Price */
.single-product-info .price {
  font-size: 3vh;
  font-weight: 700;
  color: #231f20;
  margin-bottom: 20px;
  display: block;
}

.single-product-info .price del {
  color: #665a5d;
  font-size: 2vh;
  margin-right: 10px;
}

.single-product-info .price ins {
  text-decoration: none;
}

@media (max-width: 999px) {
  .single-product-info .price {
    font-size: 24px;
  }

  .single-product-info .price del {
    font-size: 18px;
  }
}

/* Short Description */
.single-product-info .woocommerce-product-details__short-description {
  color: #665a5d;
  font-size: 16px;
  line-height: 160%;
  margin-bottom: 30px;
}

.single-product-info .woocommerce-product-details__short-description p {
  margin: 0 0 15px;
}

/* Add to Cart Form */
.single-product-info .cart {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-bottom: 30px;
}

.single-product-info .quantity {
  display: flex;
  align-items: center;
  border: 1px solid #e5e28b;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

.single-product-info .quantity .qty {
  width: 60px;
  height: 46px;
  border: none;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  color: #231f20;
  background: transparent;
  flex: 1;
}

.single-product-info .quantity .quantity-buttons {
  display: flex;
  flex-direction: column;
  height: 46px;
  border-left: 1px solid #e5e28b;
}

.single-product-info .quantity .quantity-button {
  flex: 1;
  width: 30px;
  border: none;
  background: transparent;
  color: #231f20;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
  padding: 0;
}

.single-product-info .quantity .quantity-button:hover {
  background: #e5e28b;
}

.single-product-info .quantity .quantity-button:active {
  background: #d4d078;
}

.single-product-info .quantity .quantity-button.decrease {
  border-bottom: 1px solid #e5e28b;
}

.woocommerce div.product form.cart::after,
.woocommerce div.product form.cart::before {
  display: none !important;
}

.single-product-info .quantity .qty:focus {
  outline: none;
}

.single-product-info .single_add_to_cart_button {
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  padding: 15px 40px !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.single-product-info .single_add_to_cart_button:hover {
  background: #231f20 !important;
  color: #fff !important;
}

.single-product-info .single_add_to_cart_button.loading {
  position: relative !important;
  padding-right: 50px !important;
}

.single-product-info .single_add_to_cart_button.loading::after {
  font-family: 'WooCommerce' !important;
  content: '\e01c' !important;
  position: absolute !important;
  top: 50% !important;
  right: 20px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  vertical-align: middle !important;
  font-weight: 400 !important;
  animation: spin 2s linear infinite !important;
  line-height: 1 !important;
}

@keyframes spin {
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}

.single-product-info .added_to_cart.wc-forward {
  display: inline-block;
  background: #231f20 !important;
  color: #fff !important;
  border: none !important;
  padding: 15px 40px !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 16px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.single-product-info .added_to_cart.wc-forward:hover {
  background: #e5e28b !important;
  color: #231f20 !important;
}

.single-product-info .added_to_cart.wc-forward::after {
  display: none !important;
}

/* Variations */
.single-product-info .variations {
  width: 100%;
  margin-bottom: 20px;
}

.single-product-info .variations tr {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}

.single-product-info .variations .label {
  font-weight: 600;
  margin-bottom: 8px;
  color: #231f20;
}

.single-product-info .variations select {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #e5e28b;
  border-radius: 12px;
  font-size: 14px;
  color: #231f20;
  background: #fff;
}

.single-product-info .reset_variations {
  color: #665a5d;
  font-size: 14px;
  margin-left: 10px;
}

/* Product Meta */
.single-product-info .product_meta {
  padding-top: 20px;
  border-top: 1px solid #f0f0f0;
  font-size: 14px;
  color: #665a5d;
}

.single-product-info .product_meta > span {
  display: block;
  margin-bottom: 8px;
}

.single-product-info .product_meta a {
  color: #231f20;
  transition: color 0.2s ease;
}

.single-product-info .product_meta a:hover {
  color: #e5e28b;
}

/* ==========================================================================
   Product Tabs
   ========================================================================== */

.single-product-tabs {
  margin-top: 60px;
}

.woocommerce-tabs {
  background: #faf3e8;
  border-radius: 12px;
  padding: 30px;
}

.woocommerce-tabs ul.tabs {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
  display: flex;
  gap: 10px;
  /* border-bottom: 2px solid #e5e28b; */
  padding-bottom: 15px;
}

.woocommerce-tabs ul.tabs li {
  margin: 0;
}

.woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 10px 20px;
  background: transparent !important;
  color: #665a5d !important;
  font-size: 16px;
  font-weight: 500;
  border-radius: 20px;
  transition: all 0.2s ease;
  text-decoration: none;
}

.woocommerce-tabs ul.tabs li.active,
.woocommerce-tabs ul.tabs li:hover {
  background: #e5e28b !important;
  color: #231f20 !important;
}

.woocommerce-tabs ul.tabs li.active::before,
.woocommerce-tabs ul.tabs li.active::after,
.woocommerce-tabs ul.tabs li:hover::before,
.woocommerce-tabs ul.tabs li:hover::after {
  box-shadow: none !important;
}

.woocommerce-tabs .panel {
  padding: 0;
}

.woocommerce-tabs .panel h2 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #231f20;
}

.woocommerce-tabs .panel p {
  color: #665a5d;
  line-height: 170%;
  margin-bottom: 15px;
}

/* Additional Information Table */
.woocommerce-tabs .shop_attributes {
  width: 100%;
  border-collapse: collapse;
}

.woocommerce-tabs .shop_attributes th,
.woocommerce-tabs .shop_attributes td {
  padding: 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  text-align: left;
}

.woocommerce-tabs .shop_attributes th {
  font-weight: 600;
  color: #231f20;
  width: 30%;
}

.woocommerce-tabs .shop_attributes td {
  color: #665a5d;
}

/* Reviews */
.woocommerce-tabs #reviews {
  padding: 0;
}

.woocommerce-tabs #reviews .commentlist {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
}

.woocommerce-tabs #reviews .comment {
  padding: 20px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.woocommerce-tabs #reviews .comment_container {
  display: flex;
  gap: 20px;
}

.woocommerce-tabs #reviews .comment_container img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
}

.woocommerce-tabs #reviews .comment-text {
  flex: 1;
}

.woocommerce-tabs #reviews .star-rating {
  color: #e5e28b;
  margin-bottom: 10px;
}

.woocommerce-tabs #reviews .meta {
  font-size: 14px;
  color: #665a5d;
  margin-bottom: 10px;
}

.woocommerce-tabs #reviews .description p {
  margin: 0;
}

/* Review Form */
.woocommerce-tabs #review_form_wrapper {
  margin-top: 30px;
}

.woocommerce-tabs #review_form .comment-reply-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}

.woocommerce-tabs #review_form label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
}

.woocommerce-tabs #review_form input[type='text'],
.woocommerce-tabs #review_form input[type='email'],
.woocommerce-tabs #review_form textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #e5e28b;
  border-radius: 12px;
  font-size: 14px;
  margin-bottom: 20px;
}

.woocommerce-tabs #review_form textarea {
  min-height: 120px;
  resize: vertical;
}

.woocommerce-tabs #review_form .submit {
  background: #e5e28b;
  color: #231f20;
  border: none;
  padding: 12px 30px;
  border-radius: 25px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.woocommerce-tabs #review_form .submit:hover {
  background: #231f20;
  color: #fff;
}

/* ==========================================================================
   Related Products / Upsells
   ========================================================================== */

.related.products,
.up-sells.upsells {
  margin-top: 60px;
}

.related.products > h2,
.up-sells.upsells > h2 {
  font-size: 3vh;
  font-weight: 600;
  margin-bottom: 30px;
  color: #231f20;
}

@media (max-width: 999px) {
  .related.products > h2,
  .up-sells.upsells > h2 {
    font-size: 24px;
  }
}

/* ==========================================================================
   WooCommerce Notices
   ========================================================================== */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-radius: 12px;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 15px;
}

.woocommerce-message {
  color: #231f20;
}

.woocommerce-info {
  color: #231f20;
  border-radius: 12px !important;
  font-family: 'Nunito', sans-serif;
}

.woocommerce-error {
  color: #dc3545;
  list-style: none;
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
  margin-left: auto;
  background: #e5e28b;
  color: #231f20;
  padding: 10px 24px;
  border-radius: 100px !important;
  border: none;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
  cursor: pointer;
  white-space: nowrap;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover {
  background: #231f20;
  color: #fff;
}

/* ==========================================================================
   Cart Page — card layout
   ========================================================================== */

/* NOTE: .cto-cart is already rendered inside
   <main.woocommerce-main><div.woocommerce-page-wrapper><div.container>
   (see woocommerce.php). The .container element already sets max-width and
   horizontal padding to match the rest of the site (same one checkout uses).
   We therefore do NOT set max-width or horizontal padding here — otherwise
   the cart's right edge would sit offset from checkout / header alignment. */
.cto-cart {
  width: 100%;
  margin: 0;
  padding: 0 0 40px;
  color: #231f20;
}

/* ---- Utility toolbar (item count · empty cart) -------------------------- */
.cto-cart__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 16px;
}

.cto-cart__count {
  margin: 0;
  font-size: 13px;
  color: #8a8184;
}

.cto-cart__clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid #ececec;
  border-radius: 12px;
  background: #fff;
  color: #dc3545;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.cto-cart__clear:hover {
  background: #fdecee;
  border-color: #f4c5cb;
  color: #b02a37;
}

.cto-cart__clear svg {
  flex-shrink: 0;
}

/* ---- Layout ------------------------------------------------------------- */
.cto-cart__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 480px;
  gap: 28px;
  align-items: start;
}

@media (max-width: 1024px) {
  .cto-cart__layout {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/* ---- Items list --------------------------------------------------------- */
.cto-cart__items {
  min-width: 0;
}

.cto-cart__list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.cto-item {
  position: relative;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  gap: 18px;
  /* stretch so info column and right column can match the thumbnail
     height — letting title sit at the top, qty / price at the bottom */
  align-items: stretch;
  min-height: 146px; /* 110 thumb + 18 + 18 padding */
  /* Symmetric horizontal padding — price aligns flush to the right
     edge (same line as the trash icon). Trash lives at the top, price
     at the bottom, so they never collide. */
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #efefef;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.cto-item:hover {
  box-shadow: 0 4px 14px rgba(20, 20, 20, 0.06);
  border-color: #e8e8e8;
}

/* AJAX loading state — dim the card and show a spinner over it */
.cto-item.is-loading {
  pointer-events: none;
  position: relative;
}

.cto-item.is-loading::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.55);
  border-radius: inherit;
  z-index: 2;
}

.cto-item.is-loading::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
  border: 2.5px solid rgba(229, 226, 139, 0.45);
  border-top-color: #231f20;
  border-radius: 50%;
  animation: cto-spin 0.7s linear infinite;
  z-index: 3;
}

@keyframes cto-spin {
  to { transform: rotate(360deg); }
}

/* Disable the qty input visually while saving */
.cto-item.is-loading .cto-qty,
.cto-item.is-loading input.qty {
  opacity: 0.6;
}

/* Thumbnail — fixed square, aligned to the top of the card so title
   aligns to its top edge and qty aligns to its bottom edge. */
.cto-item__thumb {
  width: 110px;
  height: 110px;
  align-self: start;
  border-radius: 12px;
  background: #faf3e8;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  box-sizing: border-box;
}

.cto-item__thumb a,
.cto-item__thumb > img,
.cto-item__thumb a > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  margin: 0;
}

.cto-item__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: transparent;
}

/* Info column — title stuck to the top, qty pushed to the bottom
   (via margin-top:auto on .cto-item__qty) so they align with the
   top and bottom edges of the 110 px thumbnail. */
.cto-item__info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 3px;
  text-align: left;
}

.cto-item__name {
  margin: 0 0 2px;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  color: #231f20;
  text-align: left;
  letter-spacing: -0.005em;
}

.cto-item__name a {
  color: inherit;
  text-decoration: none;
  transition: color 0.15s ease;
}

.cto-item__name a:hover {
  color: #665a5d;
}

.cto-item__meta {
  margin: 0;
  font-size: 13px;
  color: #665a5d;
  line-height: 1.4;
}

.cto-item__meta p,
.cto-item__meta dl,
.cto-item__meta dt,
.cto-item__meta dd {
  margin: 0;
  padding: 0;
  display: inline;
  font-size: inherit;
}

.cto-item__meta dt {
  font-weight: 500;
  margin-right: 4px;
}

.cto-item__meta dt:after {
  content: ':';
}

.cto-item__meta dd + dt:before {
  content: '';
  display: block;
  height: 2px;
}

.cto-item__sku {
  margin: 0;
  font-size: 13px;
  color: #8a8184;
  letter-spacing: 0.01em;
  line-height: 1.4;
}

.cto-item__backorder {
  margin: 4px 0 0;
  font-size: 12px;
  color: #cc8a00;
}

/* Push the quantity stepper to the bottom of the info column so it
   aligns horizontally with the bottom edge of the thumbnail. */
.cto-item__qty {
  margin-top: auto;
  padding-top: 10px;
}

/* Right column — subtotal + per-unit price, anchored to the BOTTOM
   of the card so they align with the quantity stepper on the left.
   The trash button lives on the card itself (see .cto-item__remove). */
.cto-item__right {
  position: static;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 2px;
  min-width: 130px;
  padding-top: 0;
  text-align: right;
}

/* Trash button: anchored to top-right corner of the card, vertically
   above the price (which sits at bottom-right). */
.cto-item__remove {
  position: absolute;
  top: 14px;
  right: 20px; /* same as card horizontal padding — aligns with the price */
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #fdecee;
  color: #dc3545;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.cto-item__remove:hover {
  background: #dc3545;
  color: #fff;
  transform: scale(1.03);
}

.cto-item__subtotal {
  font-size: 18px;
  font-weight: 700;
  color: #231f20;
  line-height: 1.2;
  white-space: nowrap;
}

.cto-item__subtotal .woocommerce-Price-amount,
.cto-item__subtotal bdi {
  color: inherit;
  font-weight: inherit;
}

.cto-item__unitprice {
  font-size: 12px;
  color: #8a8184;
  line-height: 1.4;
  white-space: nowrap;
}

.cto-item__unitprice .woocommerce-Price-amount,
.cto-item__unitprice bdi {
  color: inherit;
  font-size: inherit;
  font-weight: 500;
}

.cto-item__unitprice span {
  margin-left: 3px;
}

/* ---- Quantity stepper --------------------------------------------------- */
.cto-item__qty .quantity,
.cto-item__qty .cto-qty {
  display: inline-flex;
  align-items: stretch;
  height: 38px;
  border: 1px solid #e7e7e7;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  user-select: none;
}

.cto-qty__btn {
  width: 34px;
  min-width: 34px;
  border: none;
  background: transparent;
  color: #231f20;
  font-size: 18px;
  line-height: 1;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
  padding: 0;
}

.cto-qty__btn:hover {
  background: #faf3e8;
}

.cto-qty__btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.cto-item__qty input.qty,
.cto-item__qty input[type='number'] {
  width: 40px;
  height: 36px;
  padding: 0;
  border: none;
  border-left: 1px solid #f0f0f0;
  border-right: 1px solid #f0f0f0;
  background: transparent;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: #231f20;
  -moz-appearance: textfield;
  appearance: textfield;
  outline: none;
}

.cto-item__qty input.qty::-webkit-outer-spin-button,
.cto-item__qty input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.cto-item__qty input.qty:focus,
.cto-item__qty input[type='number']:focus {
  background: #faf3e8;
}

/* ---- Actions row (update cart) ----------------------------------------- */
.cto-cart__actions {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

.cto-cart__update {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border: 1px solid #e7e7e7;
  border-radius: 12px;
  background: #fff;
  color: #665a5d;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.cto-cart__update:hover:not(:disabled) {
  background: #231f20;
  color: #fff;
  border-color: #231f20;
}

.cto-cart__update:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ---- Summary sidebar ---------------------------------------------------- */
/* The site header is `position: fixed; top: 0` and ~90-100px tall, so the
   sticky summary needs to offset below it to avoid overlap when scrolling. */
.cto-cart__summary {
  position: sticky;
  top: 96px;
}

/* With the WordPress admin bar visible, push the sticky down by its height
   (32px desktop / 46px ≤782px) so it doesn't hide behind admin-bar+header. */
body.admin-bar .cto-cart__summary {
  top: 128px;
}
@media (max-width: 782px) {
  body.admin-bar .cto-cart__summary {
    top: 142px;
  }
}

@media (max-width: 1024px) {
  .cto-cart__summary,
  body.admin-bar .cto-cart__summary {
    position: static;
    top: auto;
  }
}

.cto-summary {
  background: #fff;
  border: 1px solid #efefef;
  border-radius: 18px;
  padding: 22px 22px 20px;
  box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
}

.cto-summary__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}

.cto-summary__icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #faf3e8;
  border-radius: 10px;
  color: #231f20;
}

.cto-summary__title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: #231f20;
  letter-spacing: -0.005em;
}

/* Coupon */
.cto-summary__coupon {
  margin-bottom: 18px;
}

.cto-summary__label {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 500;
  color: #665a5d;
  letter-spacing: 0.02em;
}

.cto-summary__coupon-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.cto-summary__coupon-input {
  position: relative;
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 12px;
  padding: 0 12px;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.cto-summary__coupon-input:focus-within {
  border-color: #cfcb66;
  background: #fffdf2;
}

.cto-summary__coupon-input svg {
  color: #9a9599;
  flex-shrink: 0;
}

.cto-summary__coupon-input input[type='text'] {
  flex: 1;
  min-width: 0;
  height: 40px;
  padding: 0 0 0 8px;
  border: none;
  background: transparent;
  font-size: 13px;
  color: #231f20;
  outline: none;
}

.cto-summary__coupon-input input[type='text']::placeholder {
  color: #9a9599;
}

.cto-summary__apply {
  height: 40px;
  padding: 0 18px;
  border: none;
  border-radius: 12px;
  background: #e5e28b;
  color: #231f20;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(229, 226, 139, 0.4);
}

.cto-summary__apply:hover {
  background: #231f20;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(35, 31, 32, 0.2);
}

/* Lines */
.cto-summary__lines {
  border-top: 1px solid #f0f0f0;
  padding-top: 14px;
  margin-bottom: 16px;
}

.cto-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-size: 14px;
  color: #665a5d;
  padding: 8px 0;
}

.cto-summary__row strong,
.cto-summary__row .woocommerce-Price-amount {
  color: #231f20;
  font-weight: 500;
}

.cto-summary__row--discount strong {
  color: #2f6a3d;
}

.cto-summary__row--total {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid #f0f0f0;
  font-size: 16px;
  color: #231f20;
}

.cto-summary__row--total span {
  font-weight: 700;
}

.cto-summary__row--total strong,
.cto-summary__row--total .woocommerce-Price-amount {
  font-size: 20px;
  font-weight: 700;
  color: #231f20;
}

/* Actions */
.cto-summary__actions,
.cto-summary__actions.wc-proceed-to-checkout {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 14px 0 14px !important;
  padding: 0 !important; /* kill WooCommerce default .wc-proceed-to-checkout padding: 1em 0 */
}

.cto-summary__actions::before,
.cto-summary__actions::after {
  display: none !important;
}

.cto-summary__actions > * {
  margin: 0 !important;
}

.cto-summary__actions .checkout-button,
.cto-summary__actions a.checkout-button.button.alt.wc-forward {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100% !important;
  padding: 14px 20px !important;
  background: #e5e28b !important;
  color: #231f20 !important;
  text-align: center;
  border: none !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 10px rgba(229, 226, 139, 0.45) !important;
  transition: all 0.2s ease !important;
  cursor: pointer;
}

.cto-summary__actions .checkout-button::after,
.cto-summary__actions a.checkout-button.button.alt.wc-forward::after {
  content: '→';
  font-size: 17px;
  line-height: 1;
}

.cto-summary__actions .checkout-button:hover,
.cto-summary__actions a.checkout-button.button.alt.wc-forward:hover {
  background: #231f20 !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(35, 31, 32, 0.28) !important;
}

.cto-summary__continue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 20px;
  background: #fff;
  color: #231f20;
  border: 1px solid #e7e7e7;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

.cto-summary__continue:hover {
  background: #faf3e8;
  border-color: #e5e28b;
  color: #231f20;
}

.cto-summary__trust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid #f0f0f0;
  flex-wrap: wrap;
}

.cto-summary__trust-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #8a8184;
}

.cto-summary__trust-item svg {
  color: #9a9599;
  flex-shrink: 0;
}

/* Cross-sells — already inside .container, so no wrapper width/padding needed */
.cto-cart__cross-sells {
  width: 100%;
  margin: 40px 0 0;
  padding: 0;
}

.cto-cart__cross-sells .cross-sells h2 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 20px;
  color: #231f20;
}

/* ---- Cart-page shipping UI: hide ONLY the "Зміна адреси" toggle ------
   The Nova Poshta / Morkva UA city & warehouse pickers, the list of
   shipping methods and the shipping destination info must stay
   visible — that's the whole point of the cart summary. All we hide
   is WC's native "Calculate shipping"/"Зміна адреси" collapse-toggle
   link (and its form) because the address picker is shown directly.
--------------------------------------------------------------------------- */
.woocommerce-cart .cto-summary .shipping-calculator-button,
.woocommerce-cart .cto-summary a.shipping-calculator-button,
.woocommerce-cart .cto-summary .shipping-calculator-form {
  display: none !important;
}

/* ---- Shipping block inside summary (kept for backward-compat) -----------
   Retained so other pages (checkout, review) that reuse .cto-summary
   classes don't break. On cart it's hidden by the rule above.
--------------------------------------------------------------------------- */
.cto-summary__shipping {
  display: block;
  padding: 14px 0 6px;
  font-size: 13px;
  color: #665a5d;
}

.cto-summary__shipping-header,
.cto-summary__shipping .shipping th,
.cto-summary__shipping th {
  display: block;
  padding: 0 0 10px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #8a8184;
  text-align: left;
}

/* WooCommerce renders totals as <tr><th>Shipping</th><td>...methods...</td></tr>.
   Unwrap it completely so it behaves like a flow block. */
.cto-summary__shipping table,
.cto-summary__shipping tbody,
.cto-summary__shipping tr,
.cto-summary__shipping td {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
}

.cto-summary__shipping td::before {
  content: none !important;
  display: none !important;
}

.cto-summary__shipping .shipping-calculator-button,
.cto-summary__shipping .woocommerce-shipping-destination {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  color: #8a8184;
}

.cto-summary__shipping .shipping-calculator-button {
  color: #2f6a3d;
  text-decoration: none;
  border-bottom: 1px dashed currentColor;
}

.cto-summary__shipping .shipping-calculator-button:hover {
  color: #255130;
}

/* Shipping methods list: stack vertical, one row per option, full width */
.cto-summary__shipping ul.woocommerce-shipping-methods,
.cto-summary .woocommerce-shipping-methods {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* ---- Shipping method pills (custom radios) ----------------------------
   Structure:
   <li>                 ← position: relative, no padding (label owns it)
     <input type=radio> ← hidden (kept for a11y + native click)
     <label>...</label> ← is the clickable pill, flex-centered
   </li>
*/
.cto-summary__shipping ul.woocommerce-shipping-methods li,
.cto-summary .woocommerce-shipping-methods li {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #faf8f2;
  border: 1px solid #efe9d9;
  border-radius: 12px;
  color: #231f20;
  cursor: pointer;
  align-items: initial !important; /* reset legacy align-items: flex-start */
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.cto-summary__shipping ul.woocommerce-shipping-methods li:hover,
.cto-summary .woocommerce-shipping-methods li:hover {
  border-color: #d6d06a;
  background: #fbf9ee;
}

/* Hide the native radio but keep it in flow for a11y / keyboard focus. */
.cto-summary__shipping ul.woocommerce-shipping-methods li input[type='radio'],
.cto-summary .woocommerce-shipping-methods li input[type='radio'] {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Neutralize legacy input::before / input::after radio drawn by older rules
   so only the label::before circle from the new pill design shows. */
.cto-summary__shipping ul.woocommerce-shipping-methods li input[type='radio']::before,
.cto-summary__shipping ul.woocommerce-shipping-methods li input[type='radio']::after,
.cto-summary .woocommerce-shipping-methods li input[type='radio']::before,
.cto-summary .woocommerce-shipping-methods li input[type='radio']::after {
  content: none !important;
  display: none !important;
}

/* The label IS the pill — covers full width, flex-centered, always clickable. */
.cto-summary__shipping ul.woocommerce-shipping-methods li label,
.cto-summary .woocommerce-shipping-methods li label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 16px 18px 16px 48px !important;
  box-sizing: border-box !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #231f20 !important;
  line-height: 1.3 !important;
  cursor: pointer !important;
  user-select: none !important;
  flex: initial !important; /* reset legacy .woocommerce-shipping-methods label flex:1 */
}

/* Custom radio circle — rendered on the left inside the label padding zone. */
.cto-summary__shipping ul.woocommerce-shipping-methods li label::before,
.cto-summary .woocommerce-shipping-methods li label::before {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 2px solid #cfc8b3;
  border-radius: 50%;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.cto-summary__shipping ul.woocommerce-shipping-methods li:hover label::before,
.cto-summary .woocommerce-shipping-methods li:hover label::before {
  border-color: #b9b17d;
}

/* Inner dot — scales from 0 to 1 when the radio is checked */
.cto-summary__shipping ul.woocommerce-shipping-methods li label::after,
.cto-summary .woocommerce-shipping-methods li label::after {
  content: '';
  position: absolute;
  left: 25px; /* 18 + (20 - 6) / 2 = 25 so dot is centered inside the circle */
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #231f20;
  transform: translateY(-50%) scale(0);
  transition: transform 0.15s ease;
}

/* ---- Selected state — soft brand-yellow fill, no thick outline -------- */
.cto-summary__shipping ul.woocommerce-shipping-methods li:has(input[type='radio']:checked),
.cto-summary .woocommerce-shipping-methods li:has(input[type='radio']:checked) {
  background: #f7f2c9;
  border-color: #e5e28b;
}

.cto-summary__shipping ul.woocommerce-shipping-methods li:has(input[type='radio']:checked) label::before,
.cto-summary .woocommerce-shipping-methods li:has(input[type='radio']:checked) label::before {
  border-color: #231f20;
  background: #fff;
}

.cto-summary__shipping ul.woocommerce-shipping-methods li:has(input[type='radio']:checked) label::after,
.cto-summary .woocommerce-shipping-methods li:has(input[type='radio']:checked) label::after {
  transform: translateY(-50%) scale(1);
}

.cto-summary__shipping ul.woocommerce-shipping-methods li:has(input[type='radio']:checked) label,
.cto-summary .woocommerce-shipping-methods li:has(input[type='radio']:checked) label {
  color: #231f20;
  font-weight: 600;
}

/* Keyboard focus ring on the pill, not the circle */
.cto-summary__shipping ul.woocommerce-shipping-methods li:has(input[type='radio']:focus-visible),
.cto-summary .woocommerce-shipping-methods li:has(input[type='radio']:focus-visible) {
  box-shadow: 0 0 0 3px rgba(229, 226, 139, 0.55);
  border-color: #c9c35a;
}

/* Shipping option price (e.g. "50,00 ₴") aligned nicely on the right */
.cto-summary__shipping ul.woocommerce-shipping-methods li label .amount,
.cto-summary__shipping ul.woocommerce-shipping-methods li label .woocommerce-Price-amount {
  float: right;
  margin-left: 8px;
  font-weight: 600;
  color: #231f20;
}

/* Extra content that some shipping plugins (Morkva UA / NP) inject inside
   the <li> — make it wrap below the label instead of spilling horizontally. */
.cto-summary__shipping ul.woocommerce-shipping-methods li > *:not(input):not(label) {
  flex-basis: 100%;
  margin-top: 6px;
  font-size: 12px;
  color: #665a5d;
}

/* Address / selected warehouse block underneath the radio list */
.cto-summary__shipping .shipping-address,
.cto-summary__shipping .np-warehouse,
.cto-summary__shipping .morkva-shipping-details,
.cto-summary__shipping .woocommerce-shipping-destination {
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 10px 12px;
  background: #fff;
  border: 1px dashed #ececec;
  border-radius: 10px;
  font-size: 12px;
  color: #665a5d;
  line-height: 1.4;
}

.cto-summary__shipping a {
  color: #2f6a3d;
  text-decoration: none;
}

.cto-summary__shipping a:hover {
  color: #255130;
  text-decoration: underline;
}

/* Shipping calculator form (zip / country) */
.cto-summary__shipping .shipping-calculator-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
}

.cto-summary__shipping .shipping-calculator-form input,
.cto-summary__shipping .shipping-calculator-form select {
  width: 100%;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #ececec;
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
  color: #231f20;
}

.cto-summary__shipping .shipping-calculator-form button {
  height: 38px;
  padding: 0 16px;
  border: none;
  border-radius: 10px;
  background: #231f20;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

/* ==========================================================================
   Radio Buttons (Shipping Methods)
   ========================================================================== */

/* Hide default radio button */
.woocommerce-shipping-methods input[type='radio'],
.cart_totals input[type='radio'],
.woocommerce-checkout input[type='radio'],
.shipping_method {
  position: relative;
  appearance: none;
  cursor: pointer;
  min-width: 20px;
  min-height: 20px;
}

/* Custom radio button container */
.woocommerce-shipping-methods li,
.cart_totals .shipping_methods li,
.woocommerce-checkout .shipping_methods li {
  position: relative;
  padding-left: 0;
  margin-bottom: 15px;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
}

/* Custom radio button circle */
.woocommerce-shipping-methods li input::before,
.cart_totals .shipping_methods li input::before,
.woocommerce-checkout .shipping_methods li input::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #e5e28b;
  border-radius: 50%;
  background: #fff;
  transition: all 0.2s ease;
  box-sizing: border-box;
}

/* Hover state */
.woocommerce-shipping-methods li input:hover::before,
.cart_totals .shipping_methods li input:hover::before,
.woocommerce-checkout .shipping_methods li input:hover::before {
  border-color: #231f20;
  background: #faf3e8;
}

/* Checked state - outer circle border */
.woocommerce-shipping-methods input[type='radio']:checked ~ label,
.cart_totals input[type='radio']:checked ~ label,
.woocommerce-checkout input[type='radio']:checked ~ label,
.shipping_method:checked ~ label {
  font-weight: 600;
  color: #231f20;
}

/* Checked state - change outer circle */
.woocommerce-shipping-methods input[type='radio']:checked::before,
.cart_totals input[type='radio']:checked::before,
.woocommerce-checkout input[type='radio']:checked::before,
.shipping_method:checked::before {
  border-color: #231f20;
  background: #fff;
}

/* Shipping method label */
.woocommerce-shipping-methods label,
.cart_totals .shipping_methods label,
.woocommerce-checkout .shipping_methods label {
  cursor: pointer;
  font-size: 15px;
  color: #231f20;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  display: block;
  flex: 1;
}

/* Shipping method description */
.woocommerce-shipping-methods .shipping-method-description,
.cart_totals .shipping-method-description,
.woocommerce-checkout .shipping-method-description {
  font-size: 13px;
  color: #665a5d;
  margin-top: 5px;
  padding-left: 0;
}

/* Inner circle when checked */
.woocommerce-shipping-methods input[type='radio']:checked::after,
.woocommerce-shipping-methods input[type='radio']:checked::after,
.cart_totals input[type='radio']:checked::after,
.cart_totals input[type='radio']:checked::after,
.woocommerce-checkout input[type='radio']:checked::after,
.woocommerce-checkout input[type='radio']:checked::after,
.shipping_method:checked::after,
.shipping_method:checked::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #e5e28b;
  transition: all 0.2s ease;
  z-index: 1;
}

@media (max-width: 768px) {
  .woocommerce-shipping-totals td:before {
    display: block;
    width: 100%;
    text-align: left;
    float: none !important;
  }
}

/* ==========================================================================
   Shipping Calculator Inputs
   ========================================================================== */

/* Shipping calculator input fields - matching checkout form inputs */
#calc_shipping_city,
#calc_shipping_postcode {
  max-width: 100% !important;
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  color: #231f20 !important;
  background: #fff !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
}

#calc_shipping_city:focus,
#calc_shipping_postcode:focus {
  outline: none !important;
  border-color: #231f20 !important;
  box-shadow: 0 0 0 3px rgba(35, 31, 32, 0.1) !important;
}

#calc_shipping_city:hover,
#calc_shipping_postcode:hover {
  border-color: #231f20 !important;
}

/* ==========================================================================
   Checkout Page
   ========================================================================== */

.woocommerce-checkout .checkout-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

@media (max-width: 1200px) {
  .woocommerce-checkout .checkout-columns {
    display: flex;
    flex-direction: column;
  }
}

.checkout-order-column > h3 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #231f20;
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #231f20;
}

.woocommerce-checkout .form-row {
  margin-bottom: 20px;
}

.woocommerce-checkout .form-row label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: #231f20;
}

.woocommerce-checkout .form-row .required {
  color: #dc3545;
}

/* Checkout Form Inputs - Unified Styles */
.woocommerce-checkout .form-row input[type='text'],
.woocommerce-checkout .form-row input[type='email'],
.woocommerce-checkout .form-row input[type='tel'],
.woocommerce-checkout .form-row input[type='password'],
.woocommerce-checkout .form-row input[type='number'],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-billing-fields input[type='text'],
.woocommerce-billing-fields input[type='email'],
.woocommerce-billing-fields input[type='tel'],
.woocommerce-billing-fields input[type='password'],
.woocommerce-billing-fields input[type='number'],
.woocommerce-billing-fields select,
.woocommerce-billing-fields textarea,
.woocommerce-shipping-fields input[type='text'],
.woocommerce-shipping-fields input[type='email'],
.woocommerce-shipping-fields input[type='tel'],
.woocommerce-shipping-fields input[type='password'],
.woocommerce-shipping-fields input[type='number'],
.woocommerce-shipping-fields select,
.woocommerce-shipping-fields textarea,
.woocommerce-additional-fields input[type='text'],
.woocommerce-additional-fields input[type='email'],
.woocommerce-additional-fields input[type='tel'],
.woocommerce-additional-fields textarea,
#billing_first_name,
#billing_last_name,
#billing_phone,
#billing_email,
#billing_city,
#billing_address_1,
#billing_address_2,
#shipping_first_name,
#shipping_last_name,
#shipping_city,
#shipping_address_1,
#shipping_address_2,
#order_comments {
  max-width: 100% !important;
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0;
  border-radius: 14px !important;
  font-size: 14px !important;
  color: #231f20 !important;
  background: #fff !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
}

.woocommerce-checkout .form-row input[type='text']:focus,
.woocommerce-checkout .form-row input[type='email']:focus,
.woocommerce-checkout .form-row input[type='tel']:focus,
.woocommerce-checkout .form-row input[type='password']:focus,
.woocommerce-checkout .form-row input[type='number']:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
  outline: none !important;
  border-color: #231f20 !important;
  box-shadow: 0 0 0 3px rgba(35, 31, 32, 0.1) !important;
}

.woocommerce-checkout .form-row input[type='text']:hover,
.woocommerce-checkout .form-row input[type='email']:hover,
.woocommerce-checkout .form-row input[type='tel']:hover,
.woocommerce-checkout .form-row input[type='password']:hover,
.woocommerce-checkout .form-row input[type='number']:hover,
.woocommerce-checkout .form-row select:hover,
.woocommerce-checkout .form-row textarea:hover {
  border-color: #231f20 !important;
}

/* Select dropdown styling */
.woocommerce-checkout .form-row select,
.woocommerce-billing-fields select,
.woocommerce-shipping-fields select,
#billing_city,
#shipping_city,
select[name*='billing'],
select[name*='shipping'] {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23231f20' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  background-size: 12px !important;
  padding-right: 40px !important;
  cursor: pointer !important;
  border-radius: 12px !important;
}

/* Textarea specific styles */
.woocommerce-checkout .form-row textarea {
  min-height: 100px !important;
  resize: vertical !important;
}

/* Checkbox styling in checkout */
.woocommerce-checkout input[type='checkbox'] {
  width: 20px !important;
  height: 20px !important;
  border: 2px solid #e5e28b !important;
  border-radius: 4px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background: #fff !important;
  cursor: pointer !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.woocommerce-checkout input[type='checkbox']:hover {
  border-color: #231f20 !important;
  background: #faf3e8 !important;
}

.woocommerce-checkout input[type='checkbox']:checked {
  background: #e5e28b !important;
  border-color: #e5e28b !important;
}

.woocommerce-checkout input[type='checkbox']:checked::after {
  content: '✓' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #231f20 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

.woocommerce-checkout input[type='checkbox']:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(35, 31, 32, 0.1) !important;
}

/* Checkout Coupon Section */
.woocommerce-checkout .checkout_coupon,
.woocommerce-form-coupon {
  background: #faf3e8;
  border: 1px solid #f0f0f0;
  border-radius: 12px !important;
  padding: 20px;
  margin-bottom: 30px;
}

.woocommerce-form-coupon {
  display: flex;
  flex-wrap: wrap;
}

.woocommerce-form-coupon .form-row::before,
.woocommerce-form-coupon .form-row::after {
  display: none !important;
}

@media (max-width: 768px) {
  .woocommerce-form-coupon {
    flex-direction: column;
  }
  .woocommerce-form-coupon > * {
    width: 100% !important;
    max-width: 100% !important;
  }
  .woocommerce-form-coupon .button {
    width: 100% !important;
  }
}

.woocommerce-checkout .checkout_coupon .form-row-first,
.woocommerce-checkout .checkout_coupon .form-row-last,
.woocommerce-form-coupon .form-row-first,
.woocommerce-form-coupon .form-row-last {
  margin-bottom: 0;
}

.woocommerce-checkout .checkout_coupon .form-row,
.woocommerce-form-coupon .form-row {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  margin-bottom: 0;
}

.woocommerce-checkout .checkout_coupon input[type='text'],
.woocommerce-form-coupon input[type='text'],
#coupon_code {
  flex: 1;
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0;
  border-radius: 14px !important;
  font-size: 14px !important;
  color: #231f20 !important;
  background: #fff !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
}

.woocommerce-checkout .checkout_coupon input[type='text']:focus,
.woocommerce-form-coupon input[type='text']:focus,
#coupon_code:focus {
  outline: none !important;
  border-color: #231f20 !important;
  box-shadow: 0 0 0 3px rgba(35, 31, 32, 0.1) !important;
}

.woocommerce-checkout .checkout_coupon input[type='text']:hover,
.woocommerce-form-coupon input[type='text']:hover,
#coupon_code:hover {
  border-color: #231f20 !important;
}

.woocommerce-checkout .checkout_coupon .button,
.woocommerce-form-coupon .button,
.woocommerce-checkout .checkout_coupon button[type='submit'],
.woocommerce-form-coupon button[type='submit'] {
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  padding: 14px 22px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.woocommerce-checkout .checkout_coupon .button:hover,
.woocommerce-form-coupon .button:hover,
.woocommerce-checkout .checkout_coupon button[type='submit']:hover,
.woocommerce-form-coupon button[type='submit']:hover {
  background: #231f20 !important;
  color: #fff !important;
}

/* Checkout Coupon Toggle Checkbox */
.woocommerce-checkout .checkout_coupon .showcoupon,
.woocommerce-form-coupon-toggle {
  margin-bottom: 15px;
}

.woocommerce-checkout .checkout_coupon .showcoupon label,
.woocommerce-form-coupon-toggle label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  color: #231f20 !important;
  margin: 0 !important;
}

.woocommerce-checkout .checkout_coupon .showcoupon input[type='checkbox'],
.woocommerce-form-coupon-toggle input[type='checkbox'] {
  width: 20px !important;
  height: 20px !important;
  border: 2px solid #e5e28b !important;
  border-radius: 4px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background: #fff !important;
  cursor: pointer !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.woocommerce-checkout .checkout_coupon .showcoupon input[type='checkbox']:hover,
.woocommerce-form-coupon-toggle input[type='checkbox']:hover {
  border-color: #231f20 !important;
  background: #faf3e8 !important;
}

.woocommerce-checkout .checkout_coupon .showcoupon input[type='checkbox']:checked,
.woocommerce-form-coupon-toggle input[type='checkbox']:checked {
  background: #e5e28b !important;
  border-color: #e5e28b !important;
}

.woocommerce-checkout .checkout_coupon .showcoupon input[type='checkbox']:checked::after,
.woocommerce-form-coupon-toggle input[type='checkbox']:checked::after {
  content: '✓' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #231f20 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

/* "Ship to different address" checkbox */
.woocommerce-checkout #ship-to-different-address {
  margin-bottom: 20px;
}

.woocommerce-checkout #ship-to-different-address label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  color: #231f20 !important;
  margin: 0 !important;
}

.woocommerce-checkout #ship-to-different-address input[type='checkbox'] {
  width: 20px !important;
  height: 20px !important;
  border: 2px solid #e5e28b !important;
  border-radius: 4px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background: #fff !important;
  cursor: pointer !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.woocommerce-checkout #ship-to-different-address input[type='checkbox']:hover {
  border-color: #231f20 !important;
  background: #faf3e8 !important;
}

.woocommerce-checkout #ship-to-different-address input[type='checkbox']:checked {
  background: #e5e28b !important;
  border-color: #e5e28b !important;
}

.woocommerce-checkout #ship-to-different-address input[type='checkbox']:checked::after {
  content: '✓' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #231f20 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

/* Order Review */
.woocommerce-checkout-review-order {
  background: #faf3e8;
  border-radius: 12px;
  padding: 30px;
}

.woocommerce-checkout-review-order-table {
  width: 100%;
  margin-bottom: 20px;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.woocommerce-checkout-review-order-table thead th {
  font-weight: 600;
  color: #231f20;
}

.woocommerce-checkout-review-order-table .product-name {
  color: #665a5d;
}

.woocommerce-checkout-review-order-table .product-total {
  text-align: right;
  font-weight: 600;
}

.woocommerce-checkout-review-order-table tfoot th {
  text-align: left;
}

.woocommerce-checkout-review-order-table tfoot td {
  text-align: right;
  font-weight: 600;
}

.woocommerce-checkout-review-order-table .order-total td {
  font-size: 20px;
  color: #231f20;
}

/* Payment Methods */
.woocommerce-checkout-payment {
  margin-top: 20px;
}

.woocommerce-checkout-payment .wc_payment_methods {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}

.woocommerce-checkout-payment .wc_payment_method {
  padding: 15px;
  border: 1px solid #e5e28b;
  border-radius: 12px;
  margin-bottom: 10px;
}

.woocommerce-checkout-payment .wc_payment_method label {
  font-weight: 500;
  cursor: pointer;
}

.woocommerce-checkout-payment .payment_box {
  padding: 15px;
  background: rgba(229, 226, 139, 0.2);
  border-radius: 12px;
  margin-top: 10px;
  font-size: 14px;
  color: #665a5d;
}

.woocommerce-checkout-payment #place_order {
  width: 100%;
  background: #231f20;
  color: #fff;
  border: none;
  padding: 18px 30px;
  border-radius: 30px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.woocommerce-checkout-payment #place_order:hover {
  background: #e5e28b;
  color: #231f20;
}

/* ==========================================================================
   My Account Page
   ========================================================================== */

.woocommerce-MyAccount-navigation {
  background: #faf3e8;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 30px;
}

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 10px 20px;
  background: transparent;
  color: #231f20;
  border-radius: 25px;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.2s ease;
  text-decoration: none;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
  background: #e5e28b;
}

/* .woocommerce-MyAccount-content {
  padding: 20px 0;
} */

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #231f20;
}

/* Orders Table */
.woocommerce-orders-table {
  width: 100%;
  border-collapse: collapse;
}

.woocommerce-orders-table th,
.woocommerce-orders-table td {
  padding: 15px;
  border-bottom: 1px solid #f0f0f0;
  text-align: left;
}

.woocommerce-orders-table th {
  background: #faf3e8;
  font-weight: 600;
}

.woocommerce-orders-table .button {
  background: #e5e28b;
  color: #231f20;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

.woocommerce-orders-table .button:hover {
  background: #231f20;
  color: #fff;
}

/* Address Fields - My Account Forms */
.woocommerce-address-fields .form-row,
.woocommerce-edit-account .form-row {
  margin-bottom: 20px;
}

.woocommerce-address-fields label,
.woocommerce-edit-account label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  font-family: 'Nunito', sans-serif;
  color: #231f20;
}

.woocommerce-address-fields input[type='text'],
.woocommerce-address-fields input[type='email'],
.woocommerce-address-fields input[type='tel'],
.woocommerce-edit-account input[type='text'],
.woocommerce-edit-account input[type='email'],
.woocommerce-edit-account input[type='password'] {
  width: 100%;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px;
  color: #231f20;
  transition: border-color 0.2s ease;
}

.woocommerce-address-fields input[type='text']:focus,
.woocommerce-address-fields input[type='email']:focus,
.woocommerce-address-fields input[type='tel']:focus,
.woocommerce-edit-account input[type='text']:focus,
.woocommerce-edit-account input[type='email']:focus,
.woocommerce-edit-account input[type='password']:focus {
  border-color: #e5e28b !important;
  outline: none !important;
  box-shadow: none !important;
}

.woocommerce-address-fields select,
.woocommerce-edit-account select {
  width: 100%;
  padding: 12px 40px 12px 16px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px;
  color: #231f20;
  background-color: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 15.4L6 9.4L7.4 8L12 12.6L16.6 8L18 9.4L12 15.4Z' fill='%23231F20'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 20px;
  transition: border-color 0.2s ease;
}

.woocommerce-address-fields select:focus,
.woocommerce-edit-account select:focus {
  border-color: #e5e28b !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Select2 styles for address forms */
.woocommerce-address-fields .select2-container,
.woocommerce-edit-account .select2-container,
.select2-container {
  width: 100% !important;
}

.woocommerce-address-fields .select2-container .select2-selection--single,
.woocommerce-edit-account .select2-container .select2-selection--single,
.select2-container .select2-selection--single {
  height: auto !important;
  min-height: 46px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 14px !important;
  padding: 0 !important;
  background-color: #fff !important;
  outline: none !important;
}

.woocommerce-address-fields
  .select2-container
  .select2-selection--single
  .select2-selection__rendered,
.woocommerce-edit-account
  .select2-container
  .select2-selection--single
  .select2-selection__rendered,
.select2-container .select2-selection--single .select2-selection__rendered {
  padding: 12px 40px 12px 16px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px !important;
  color: #231f20 !important;
  line-height: 1.5 !important;
}

.woocommerce-address-fields .select2-container .select2-selection--single .select2-selection__arrow,
.woocommerce-edit-account .select2-container .select2-selection--single .select2-selection__arrow,
.select2-container .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  right: 10px !important;
  width: 30px !important;
  top: 0 !important;
}

.woocommerce-address-fields
  .select2-container
  .select2-selection--single
  .select2-selection__arrow
  b,
.woocommerce-edit-account .select2-container .select2-selection--single .select2-selection__arrow b,
.select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: #231f20 transparent transparent transparent !important;
  border-width: 6px 6px 0 6px !important;
  margin-top: -3px !important;
  top: 50% !important;
  left: 50% !important;
  margin-left: -6px !important;
  position: absolute !important;
}

.woocommerce-address-fields .select2-container--open .select2-selection--single,
.woocommerce-edit-account .select2-container--open .select2-selection--single,
.select2-container--open .select2-selection--single {
  border-color: #e5e28b !important;
}

.woocommerce-address-fields .select2-container--focus .select2-selection--single,
.woocommerce-edit-account .select2-container--focus .select2-selection--single,
.select2-container--focus .select2-selection--single,
.select2-container.select2-container--focus .select2-selection--single {
  border-color: #e5e28b !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Select2 dropdown */
.woocommerce-address-fields .select2-dropdown,
.woocommerce-edit-account .select2-dropdown,
.select2-dropdown {
  border: 1px solid #f0f0f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
  margin-top: 4px !important;
}

.woocommerce-address-fields .select2-results__option,
.woocommerce-edit-account .select2-results__option,
.select2-results__option {
  padding: 10px 16px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px !important;
  color: #231f20 !important;
}

.woocommerce-address-fields .select2-results__option--highlighted,
.woocommerce-edit-account .select2-results__option--highlighted,
.select2-results__option--highlighted {
  background-color: #e5e28b !important;
  color: #231f20 !important;
}

.woocommerce-address-fields .select2-results__option[aria-selected='true'],
.woocommerce-edit-account .select2-results__option[aria-selected='true'],
.select2-results__option[aria-selected='true'] {
  background-color: #e5e28b !important;
  color: #231f20 !important;
}

.woocommerce-address-fields .button,
.woocommerce-edit-account .button {
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  padding: 12px 30px !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 15px;
}

.woocommerce-address-fields .button:hover,
.woocommerce-edit-account .button:hover {
  background: #231f20 !important;
  color: #fff !important;
}

/* Addresses List */
.woocommerce-Addresses,
.u-columns.woocommerce-Addresses.col2-set.addresses {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-top: 30px;
  padding: 0;
}

/* Hide before and after pseudo-elements */
.u-columns.woocommerce-Addresses.col2-set.addresses::before,
.u-columns.woocommerce-Addresses.col2-set.addresses::after {
  display: none !important;
  content: none !important;
}

@media (max-width: 768px) {
  .woocommerce-Addresses,
  .u-columns.woocommerce-Addresses.col2-set.addresses {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.woocommerce-Addresses .woocommerce-Address,
.woocommerce-Addresses .u-column1,
.woocommerce-Addresses .u-column2,
.woocommerce-Addresses .col-1,
.woocommerce-Addresses .col-2 {
  background: #faf3e8;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid rgba(35, 31, 32, 0.1);
  width: 100% !important;
  max-width: none;
}

.woocommerce-Addresses .woocommerce-Address-title {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 16px;
  font-size: 20px;
  font-weight: 600;
  color: #231f20;
  margin-bottom: 16px;
  font-family: 'Nunito', sans-serif;
}
.woocommerce-Addresses .woocommerce-Address-title > * {
  margin: 0 !important;
}

.woocommerce-Addresses .woocommerce-Address-title::before,
.woocommerce-Addresses .woocommerce-Address-title::after {
  display: none !important;
}

.woocommerce-Addresses .woocommerce-Address-title h3 {
  font-size: 20px;
  font-weight: 600;
  color: #231f20;
  margin: 0 0 16px 0;
  font-family: 'Nunito', sans-serif;
}

.woocommerce-Addresses .woocommerce-Address .edit {
  display: inline-block;
  background: #e5e28b;
  color: #231f20;
  padding: 10px 24px;
  border-radius: 100px;
  font-family: 'Nunito', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
  margin-bottom: 16px;
  border: none;
}

.woocommerce-Addresses .woocommerce-Address .edit:hover {
  background: #231f20;
  color: #fff;
}

.woocommerce-Addresses address {
  font-style: normal;
  color: #665a5d;
  line-height: 1.6;
  font-size: 14px;
  margin-top: 12px;
  font-family: 'Nunito', sans-serif;
}

.woocommerce-Addresses .woocommerce-Address address p {
  margin: 0 0 8px 0;
  color: #665a5d;
  font-size: 14px;
  line-height: 1.6;
  font-family: 'Nunito', sans-serif;
}

.woocommerce-Addresses .woocommerce-Address address p:last-child {
  margin-bottom: 0;
}

/* Empty address message */
.woocommerce-Addresses .woocommerce-Address p {
  color: #665a5d;
  font-size: 14px;
  line-height: 1.6;
  margin: 12px 0 0 0;
  font-family: 'Nunito', sans-serif;
}

/* Login / Register Forms */
.woocommerce-form-login,
.woocommerce-form-register {
  background: #faf3e8;
  border-radius: 12px !important;
  padding: 30px;
  max-width: none !important;
  width: 100%;
  border: 1px solid #cfc8d8;
}

.woocommerce-form-login .form-row,
.woocommerce-form-register .form-row {
  margin-bottom: 20px;
}

.woocommerce-form-login label,
.woocommerce-form-register label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  font-family: 'Nunito', sans-serif;
  font-size: 14px;
  color: #231f20;
}

.woocommerce-form-login input[type='text'],
.woocommerce-form-login input[type='email'],
.woocommerce-form-login input[type='password'],
.woocommerce-form-register input[type='text'],
.woocommerce-form-register input[type='email'],
.woocommerce-form-register input[type='password'] {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  font-size: 14px !important;
  font-family: 'Nunito', sans-serif !important;
  background-color: #fff !important;
  color: #231f20 !important;
  transition: border-color 0.2s ease;
}

.woocommerce-form-login input[type='text']:focus,
.woocommerce-form-login input[type='email']:focus,
.woocommerce-form-login input[type='password']:focus,
.woocommerce-form-register input[type='text']:focus,
.woocommerce-form-register input[type='email']:focus,
.woocommerce-form-register input[type='password']:focus {
  border-color: #e5e28b !important;
  outline: none !important;
  box-shadow: none !important;
}

.woocommerce-form-login .button,
.woocommerce-form-register .button,
.woocommerce-form-login button[type='submit'],
.woocommerce-form-register button[type='submit'] {
  background: #231f20 !important;
  color: #fff !important;
  border: none !important;
  padding: 15px 40px !important;
  border-radius: 100px !important;
  font-size: 16px !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.woocommerce-form-login .button:hover,
.woocommerce-form-register .button:hover,
.woocommerce-form-login button[type='submit']:hover,
.woocommerce-form-register button[type='submit']:hover {
  background: #231f20 !important;
  color: #fff !important;
  opacity: 0.9;
}

.woocommerce-LostPassword a {
  color: #665a5d;
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
  transition: color 0.2s ease;
}

.woocommerce-LostPassword a:hover {
  color: #e5e28b;
}

/* Remember me checkbox */
.woocommerce-form-login .woocommerce-form__label-for-checkbox,
.woocommerce-form-register .woocommerce-form__label-for-checkbox {
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px !important;
  color: #231f20 !important;
  display: flex !important;
  align-items: center !important;
  cursor: pointer;
}

.woocommerce-form-login .woocommerce-form__label-for-checkbox span,
.woocommerce-form-register .woocommerce-form__label-for-checkbox span {
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px !important;
  color: #231f20 !important;
}

.woocommerce-form-login .woocommerce-form__input-checkbox,
.woocommerce-form-register .woocommerce-form__input-checkbox {
  margin-right: 8px !important;
  width: 18px !important;
  height: 18px !important;
  cursor: pointer;
  accent-color: #e5e28b;
}

/* Lost password form */
.woocommerce-ResetPassword.lost_reset_password {
  background: #faf3e8;
  border-radius: 12px !important;
  padding: 30px;
  width: 100% !important;
  max-width: none !important;
  border: 1px solid #cfc8d8;
}

.woocommerce-ResetPassword.lost_reset_password p:first-child {
  font-family: 'Nunito', sans-serif;
  font-size: 14px;
  color: #231f20;
  margin-bottom: 20px;
}

.woocommerce-ResetPassword.lost_reset_password .form-row {
  margin-bottom: 20px;
}

.woocommerce-ResetPassword.lost_reset_password label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  font-family: 'Nunito', sans-serif !important;
  font-size: 14px !important;
  color: #231f20 !important;
}

.woocommerce-ResetPassword.lost_reset_password input[type='text'],
.woocommerce-ResetPassword.lost_reset_password input[type='email'],
.woocommerce-ResetPassword.lost_reset_password input[type='password'] {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  font-size: 14px !important;
  font-family: 'Nunito', sans-serif !important;
  background-color: #fff !important;
  color: #231f20 !important;
  transition: border-color 0.2s ease;
}

.woocommerce-ResetPassword.lost_reset_password input[type='text']:focus,
.woocommerce-ResetPassword.lost_reset_password input[type='email']:focus,
.woocommerce-ResetPassword.lost_reset_password input[type='password']:focus {
  border-color: #e5e28b !important;
  outline: none !important;
  box-shadow: none !important;
}

.woocommerce-ResetPassword.lost_reset_password .button,
.woocommerce-ResetPassword.lost_reset_password button[type='submit'] {
  background: #231f20 !important;
  color: #fff !important;
  border: none !important;
  padding: 15px 40px !important;
  border-radius: 100px !important;
  font-size: 16px !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.woocommerce-ResetPassword.lost_reset_password .button:hover,
.woocommerce-ResetPassword.lost_reset_password button[type='submit']:hover {
  background: #231f20 !important;
  color: #fff !important;
  opacity: 0.9;
}

/* Login/Register Two Column Layout */
.woocommerce-login-register {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

@media (max-width: 999px) {
  .woocommerce-login-register {
    grid-template-columns: 1fr;
  }
}

/* Hide before/after pseudo-elements for login/register columns */
.woocommerce-login-register::before,
.woocommerce-login-register::after,
.woocommerce-login-register .u-column1::before,
.woocommerce-login-register .u-column1::after,
.woocommerce-login-register .u-column2::before,
.woocommerce-login-register .u-column2::after,
.woocommerce-login-register .col-1::before,
.woocommerce-login-register .col-1::after,
.woocommerce-login-register .col-2::before,
.woocommerce-login-register .col-2::after {
  display: none !important;
  content: none !important;
}

.woocommerce-login-register .col-1,
.woocommerce-login-register .col-2,
.woocommerce-login-register .u-column1.col-1 {
  background: #faf3e8;
  border-radius: 12px !important;
  padding: 30px;
  width: 100% !important;
  max-width: none !important;
  grid-column: 1 / -1 !important;
  border: 1px solid #cfc8d8;
}

.woocommerce-login-register .woocommerce-form {
  margin-bottom: 0 !important;
}

.woocommerce-login-register .col-1::before,
.woocommerce-login-register .col-1::after,
.woocommerce-login-register .u-column1.col-1::before,
.woocommerce-login-register .u-column1.col-1::after {
  display: none !important;
  content: none !important;
}

.woocommerce-login-register .col-2 {
  background: #faf3e8;
  border-radius: 12px !important;
  padding: 30px;
  border: 1px solid #cfc8d8;
}

.woocommerce-login-register h2 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 25px;
  color: #231f20;
}

.woocommerce-login-register .form-row {
  margin-bottom: 20px;
}

.woocommerce-login-register label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: #231f20;
}

.woocommerce-login-register input[type='text'],
.woocommerce-login-register input[type='email'],
.woocommerce-login-register input[type='password'] {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #e5e28b;
  border-radius: 12px;
  font-size: 14px;
  color: #231f20;
  background: #fff;
}

.woocommerce-login-register input:focus {
  outline: none;
  border-color: #231f20;
}

.woocommerce-login-register .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 15px;
}

.woocommerce-login-register .woocommerce-form__label-for-checkbox input {
  width: auto;
}

.woocommerce-login-register .button {
  background: #e5e28b;
  color: #231f20;
  border: none;
  padding: 12px 30px;
  border-radius: 25px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.woocommerce-login-register .button:hover {
  background: #231f20;
  color: #fff;
}

.woocommerce-login-register .lost_password {
  margin-top: 15px;
}

.woocommerce-login-register .lost_password a {
  color: #665a5d;
  font-size: 14px;
  transition: color 0.2s ease;
}

.woocommerce-login-register .lost_password a:hover {
  color: #e5e28b;
}

/* ==========================================================================
   Star Rating
   ========================================================================== */

.star-rating {
  display: inline-block;
  font-family: 'WooCommerce';
  font-size: 14px;
  line-height: 1;
  color: #e5e28b;
  overflow: hidden;
  position: relative;
  height: 1em;
  width: 5.4em;
}

.star-rating::before {
  content: '\73\73\73\73\73';
  color: #ddd;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}

.star-rating span {
  overflow: hidden;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  padding-top: 1.5em;
}

.star-rating span::before {
  content: '\53\53\53\53\53';
  top: 0;
  position: absolute;
  left: 0;
}

/* ==========================================================================
   Responsive Adjustments — Cart
   ========================================================================== */

@media (max-width: 1024px) {
  .cto-cart__toolbar {
    padding: 0 0 12px;
  }
}

@media (max-width: 768px) {
  .cto-cart__clear span {
    display: none;
  }

  .cto-cart__clear {
    padding: 9px 10px;
  }

  .cto-item {
    grid-template-columns: 90px minmax(0, 1fr);
    grid-template-areas:
      'thumb info'
      'thumb right';
    padding: 14px;
    gap: 14px;
    align-items: start;
    min-height: auto;
  }

  .cto-item__thumb {
    grid-area: thumb;
    width: 90px;
    height: 90px;
    padding: 6px;
  }

  .cto-item__info {
    grid-area: info;
    padding-right: 42px; /* room for absolute remove button */
  }

  .cto-item__name {
    font-size: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .cto-item__sku {
    font-size: 12px;
  }

  .cto-item__right {
    grid-area: right;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-top: 0;
    min-width: 0;
    width: 100%;
    text-align: left;
  }

  .cto-item__remove {
    top: 14px;
    right: 14px;
    width: 30px;
    height: 30px;
    border-radius: 8px;
  }

  .cto-item__remove svg {
    width: 16px;
    height: 16px;
  }

  .cto-item__subtotal {
    font-size: 17px;
    order: 2;
  }

  .cto-item__unitprice {
    font-size: 11px;
    order: 3;
    text-align: right;
  }

  .cto-item__qty {
    margin-top: 8px;
  }

  .cto-cart__actions {
    justify-content: stretch;
  }

  .cto-cart__update {
    width: 100%;
    justify-content: center;
  }

  .cto-summary {
    padding: 18px;
  }
}

@media (max-width: 420px) {
  .cto-item {
    grid-template-columns: 72px minmax(0, 1fr);
    padding: 12px;
    gap: 12px;
  }

  .cto-item__thumb {
    width: 72px;
    height: 72px;
  }

  .cto-item__name {
    font-size: 14px;
  }

  .cto-item__subtotal {
    font-size: 15px;
  }

  .cto-summary__coupon-form {
    grid-template-columns: 1fr;
  }

  .cto-summary__apply {
    width: 100%;
  }
}

/* ==========================================================================
   Empty Cart
   ========================================================================== */

.return-to-shop {
  margin-top: 30px;
}

/* Button styles for "Return to shop" - matching site button style */

.woocommerce table.my_account_orders .woocommerce-orders-table__cell .woocommerce-button,
.woocommerce .woocommerce-order-details .woocommerce-button {
  margin: 2px;
}
.woocommerce .woocommerce-order-details .woocommerce-button,
.woocommerce table.my_account_orders .woocommerce-button,
.order-again .button,
.return-to-shop .button,
.button.wc-backward {
  background: #e5e28b !important;
  color: #231f20 !important;
  padding: 16px 40px !important;
  border-radius: 30px !important;
  font-size: 16px !important;
  font-weight: 600;
  text-decoration: none !important;
  display: inline-block;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(229, 226, 139, 0.3);
  border: none !important   ;
  cursor: pointer;
}

.woocommerce .woocommerce-order-details .woocommerce-button,
.woocommerce table.my_account_orders .woocommerce-button {
  padding: 10px 20px !important;
}
.woocommerce .woocommerce-order-details .woocommerce-button:hover,
.woocommerce table.my_account_orders .woocommerce-button:hover,
.order-again .button:hover,
.return-to-shop .button:hover,
.button.wc-backward:hover {
  background: #231f20 !important;
  color: #fff !important    ;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(35, 31, 32, 0.3) !important;
}

/* Additional styles for wc-backward button if used outside return-to-shop */
.cart-empty .button.wc-backward {
  margin-top: 30px;
}

.woocommerce-message .restore-item {
  background: #e5e28b !important;
  color: #231f20 !important;
  padding: 5px 20px;
  border-radius: 30px !important;
  font-size: 16px !important;
  font-weight: 600;
  text-decoration: none !important;
  display: inline-block;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(229, 226, 139, 0.3);
  border: none !important   ;
  cursor: pointer;
}
.woocommerce-message .restore-item:hover {
  background: #231f20 !important;
  color: #fff !important    ;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(35, 31, 32, 0.3) !important;
}

/* ==========================================================================
   No Products Found
   ========================================================================== */

.woocommerce-no-products-found {
  text-align: center;
  padding: 60px 20px;
}

/* Remove duplicate/inconsistent .woocommerce-info styles - using the ones above */

/* ==========================================================================
   Loading Spinner
   ========================================================================== */

.woocommerce .blockUI.blockOverlay {
  background: rgba(255, 255, 255, 0.8) !important;
}

.woocommerce .blockUI.blockOverlay::before {
  content: '';
  width: 40px;
  height: 40px;
  border: 3px solid #e5e28b;
  border-top-color: transparent;
  border-radius: 50%;
  animation: wc-spin 1s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -20px 0 0 -20px;
}

@keyframes wc-spin {
  to {
    transform: rotate(360deg);
  }
}

/* ==========================================================================
   WooCommerce Blocks - Cart & Checkout (colors only)
   ========================================================================== */

/* Cart Block - Product links */
.wc-block-cart .wc-block-components-product-name {
  color: #231f20;
  font-weight: 600;
  text-decoration: none;
}

.wc-block-cart .wc-block-components-product-name:hover {
  color: #665a5d;
}

/* Cart Block - Prices */
.wc-block-cart .wc-block-components-product-price,
.wc-block-cart .wc-block-components-totals-item__value,
.wc-block-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: #231f20;
  font-weight: 600;
}

/* Cart Block - Table headers */
.wc-block-cart .wc-block-cart-items__header span {
  color: #231f20;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 12px;
}

/* Cart Block - Quantity buttons */
.wc-block-cart .wc-block-components-quantity-selector {
  /* border: 1px solid #e5e28b; */
  border-radius: 30px;
  overflow: hidden;
}

.wc-block-cart .wc-block-components-quantity-selector__button {
  background: #e5e28b;
  color: #231f20;
  border: none;
}

.wc-block-cart .wc-block-components-quantity-selector__button:hover {
  background: #231f20;
  color: #fff;
}

.wc-block-cart .wc-block-components-quantity-selector__input {
  border: none;
  color: #231f20;
  font-weight: 600;
}

/* Cart Block - Remove link */
.wc-block-cart .wc-block-cart-item__remove-link {
  color: #dc3545;
  font-size: 13px;
}

.wc-block-cart .wc-block-cart-item__remove-link:hover {
  color: #231f20;
}

/* Cart Block - Sidebar totals */
.wc-block-cart .wc-block-components-totals-wrapper {
  border-color: #f0f0f0;
}

/* .wc-block-cart .wc-block-components-totals-footer-item {
  border-top: 2px solid #e5e28b;
} */

/* Cart Block - Checkout button */
.wc-block-cart .wc-block-cart__submit-button,
.wc-block-cart .wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-proceed-to-checkout-block a,
.wc-block-cart .wc-block-components-button {
  background: #231f20 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 30px !important;
  font-weight: 600 !important;
  padding: 14px 28px !important;
  transition: all 0.2s ease !important;
}

.wc-block-cart .wc-block-cart__submit-button:hover,
.wc-block-cart .wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-proceed-to-checkout-block a:hover,
.wc-block-cart .wc-block-components-button:hover {
  background: #e5e28b !important;
  color: #231f20 !important;
}

/* Cart Block - Coupon */
.wc-block-cart .wc-block-components-totals-coupon__form {
  display: flex;
  gap: 10px;
  border: 1px solid #e5e28b;
  border-radius: 30px;
  padding: 4px;
  background: #fff;
}

.wc-block-cart .wc-block-components-totals-coupon__input {
  flex: 1;
}

.wc-block-cart .wc-block-components-totals-coupon__input input {
  border: none !important;
  background: transparent !important;
  padding: 10px 16px !important;
  font-size: 14px;
}

.wc-block-cart .wc-block-components-totals-coupon__input input:focus {
  outline: none !important;
  box-shadow: none !important;
}

.wc-block-cart .wc-block-components-totals-coupon__input label {
  left: 16px !important;
  transition: all 0.2s ease !important;
}

.wc-block-cart .wc-block-components-totals-coupon__input.is-active label,
.wc-block-cart .wc-block-components-totals-coupon__input input:focus + label,
.wc-block-cart .wc-block-components-totals-coupon__input input:not(:placeholder-shown) + label {
  opacity: 0 !important;
  visibility: hidden !important;
}

.wc-block-cart .wc-block-components-totals-coupon__button {
  flex: 1 !important;
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  border-radius: 26px !important;
  padding: 10px 10px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

.wc-block-cart .wc-block-components-totals-coupon__button:hover {
  background: #231f20 !important;
  color: #fff !important;
}

/* Checkout Block - Buttons */
.wc-block-checkout .wc-block-components-checkout-place-order-button {
  background: #231f20 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 14px 28px !important;
}

.wc-block-checkout .wc-block-components-checkout-place-order-button:hover {
  background: #e5e28b !important;
  color: #231f20 !important;
}

/* Checkout Block - Inputs */
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-checkout .wc-block-components-address-form input[type='text'],
.wc-block-checkout .wc-block-components-address-form input[type='email'],
.wc-block-checkout .wc-block-components-address-form input[type='tel'] {
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  padding: 12px 16px !important;
  font-family: 'Nunito', sans-serif !important;
}

.wc-block-checkout .wc-block-components-text-input textarea,
.wc-block-checkout .wc-block-components-textarea {
  border: 1px solid #f0f0f0 !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  font-family: 'Nunito', sans-serif !important;
}

.wc-block-checkout .wc-block-components-text-input input:focus,
.wc-block-checkout .wc-block-components-combobox .wc-block-components-combobox-control input:focus,
.wc-block-checkout .wc-block-components-address-form input[type='text']:focus,
.wc-block-checkout .wc-block-components-address-form input[type='email']:focus,
.wc-block-checkout .wc-block-components-address-form input[type='tel']:focus {
  border-color: #e5e28b !important;
  box-shadow: none !important;
  outline: none !important;
}

.wc-block-checkout .wc-block-components-text-input textarea:focus,
.wc-block-checkout .wc-block-components-textarea:focus {
  border-color: #e5e28b !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Checkout Block - Select dropdown */
.wc-block-checkout .wc-blocks-components-select__select,
.wc-block-checkout select.wc-blocks-components-select__select {
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
  padding: 12px 40px 12px 16px !important;
  font-family: 'Nunito', sans-serif !important;
}

.wc-block-checkout .wc-blocks-components-select__select:focus,
.wc-block-checkout select.wc-blocks-components-select__select:focus {
  border-color: #e5e28b !important;
  outline: none !important;
}

/* Checkout Block - Select/Combobox */
.wc-block-checkout .wc-block-components-combobox .wc-block-components-combobox-control {
  border: 1px solid #f0f0f0 !important;
  border-radius: 100px !important;
}

.wc-block-checkout
  .wc-block-components-combobox
  .wc-block-components-combobox-control:focus-within {
  border-color: #e5e28b !important;
}

/* Checkout Block - Coupon form */
.wc-block-checkout .wc-block-components-totals-coupon__form {
  display: flex;
  gap: 10px;
  border: 1px solid #e5e28b;
  border-radius: 30px;
  padding: 4px;
  background: #fff;
}

.wc-block-checkout .wc-block-components-totals-coupon__input {
  flex: 1;
}

.wc-block-checkout .wc-block-components-totals-coupon__input input {
  border: none !important;
  background: transparent !important;
  padding: 10px 16px !important;
  font-size: 14px;
  border-radius: 0 !important;
}

.wc-block-checkout .wc-block-components-totals-coupon__input input:focus {
  outline: none !important;
  box-shadow: none !important;
}

.wc-block-checkout .wc-block-components-totals-coupon__input label {
  left: 16px !important;
  transition: all 0.2s ease !important;
}

.wc-block-checkout .wc-block-components-totals-coupon__input.is-active label,
.wc-block-checkout .wc-block-components-totals-coupon__input input:focus + label,
.wc-block-checkout .wc-block-components-totals-coupon__input input:not(:placeholder-shown) + label {
  opacity: 0 !important;
  visibility: hidden !important;
}

.wc-block-checkout .wc-block-components-totals-coupon__button {
  flex-shrink: 0;
  flex: 1 !important;
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  border-radius: 26px !important;
  padding: 10px 20px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

.wc-block-checkout .wc-block-components-totals-coupon__button:hover {
  background: #231f20 !important;
  color: #fff !important;
}

/* Checkout - Address card */
.wc-block-checkout .wc-block-components-address-card {
  border: 1px solid #f0f0f0 !important;
  border-radius: 12px !important;
}

/* Checkout - Order Summary Block */
.wp-block-woocommerce-checkout-order-summary-block {
  border-radius: 12px !important;
  overflow: hidden;
}

.wc-block-checkout .wc-block-components-order-summary {
  border-radius: 12px !important;
}

/* Checkout Block - Label transform when value entered (only for filled fields, not empty) */
.wc-block-checkout
  .wc-block-components-text-input
  input:not(:placeholder-shown):not([value=''])
  + label,
.wc-block-checkout .wc-block-components-address-form input[value]:not([value='']) + label,
.wc-block-checkout
  .wc-block-components-address-form
  input:not(:placeholder-shown):not([value=''])
  + label,
.wc-block-checkout
  .wc-block-components-combobox
  input:not(:placeholder-shown):not([value=''])
  + label,
.wc-block-checkout .wc-block-components-combobox input[value]:not([value='']) + label {
  transform: translate(10px, 4px) scale(0.6) !important;
}

/* Checkout Block - Select label transform when value selected (not default/empty option) */
.wc-block-checkout
  .wc-blocks-components-select:has(select:not([value='']):not([value='']):not([selectedIndex='0']))
  label,
.wc-block-checkout
  .wc-block-components-address-form
  select[value]:not([value='']):not([value=''])
  + label,
.wc-block-checkout .wc-blocks-components-select select:not([value='']):not([value='']) ~ label,
.wc-block-checkout
  .wc-block-components-address-form
  select:not([value='']):not([value=''])
  + label {
  transform: translate(10px, 4px) scale(0.6) !important;
}

/* Checkout - Shipping Methods */
.wc-block-checkout__shipping-option,
.wp-block-woocommerce-checkout-shipping-methods-block,
.wc-block-components-checkout-step,
.wc-block-components-checkout-step__content {
  border-radius: 12px !important;
}

/* Checkout - Notice Banner */
.wc-block-checkout__no-payment-methods-notice,
.wc-block-components-notice-banner {
  border-radius: 12px !important;
}

/* Checkout - Checkbox */
.wc-block-checkout .wc-block-components-checkbox__input {
  border-radius: 4px !important;
  border-color: #f0f0f0 !important;
}

.wc-block-checkout .wc-block-components-checkbox__input:checked {
  background-color: #e5e28b !important;
  border-color: #e5e28b !important;
}

/* Checkout - Radio Control (Shipping Methods) */
.wc-block-checkout .wc-block-components-radio-control__option {
  border-radius: 12px !important;
}

.wc-block-checkout .wc-block-components-radio-control__option--checked-option-highlighted {
  border-radius: 12px !important;
}

.wc-block-checkout .wc-block-components-radio-control--highlight-checked::after,
.wc-block-components-radio-control--highlight-checked::after {
  border-radius: 12px !important;
}

/* ==========================================================================
   WooCommerce Blocks - Product Grid (Empty Cart, Cross-sells)
   ========================================================================== */

.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 20px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 999px) {
  .wc-block-grid__products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 480px) {
  .wc-block-grid__products {
    grid-template-columns: 1fr !important;
  }
}

.wc-block-grid__product {
  background: #fff;
  border-radius: 12px;
  overflow: visible !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex !important;
  flex-direction: column !important;
  height: 100%;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 !important;
  padding: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.wc-block-grid__product:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  transform: translateY(-3px);
}

.wc-block-grid__product-image {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
  background: transparent;
  border-radius: 12px;
}

.wc-block-grid__product-image a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wc-block-grid__product-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.3s ease;
  padding: 0;
}

.wc-block-grid__product:hover .wc-block-grid__product-image img {
  transform: scale(1.05);
}

.wc-block-grid__product-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #231f20 !important;
  margin: 12px 12px 0 !important;
  line-height: 130% !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-align: left;
}

.wc-block-grid__product-title a {
  color: inherit !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.wc-block-grid__product-title a:hover {
  color: #665a5d !important;
}

.wc-block-grid__product-price {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #231f20 !important;
  text-align: left;
  margin: 6px 12px 12px !important;
}

.wc-block-grid__product-add-to-cart {
  margin-top: auto;
  padding: 12px;
  width: 100%;
}

.wc-block-grid__product-add-to-cart .wp-block-button {
  width: 100% !important;
  display: block !important;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-grid__product-add-to-cart .add_to_cart_button,
.wc-block-grid__product-add-to-cart a {
  background: transparent !important;
  color: #231f20 !important;
  border: 1px solid #e5e28b !important;
  border-radius: 100px !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link::after,
.wc-block-grid__product-add-to-cart .add_to_cart_button::after,
.wc-block-grid__product-add-to-cart a::after {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M16.575 8.9V16.5C16.575 16.7833 16.6708 17.0208 16.8625 17.2125C17.0542 17.4042 17.2917 17.5 17.575 17.5C17.8583 17.5 18.0958 17.4042 18.2875 17.2125C18.4792 17.0208 18.575 16.7833 18.575 16.5V6.5C18.575 6.21667 18.4792 5.97917 18.2875 5.7875C18.0958 5.59583 17.8583 5.5 17.575 5.5H7.575C7.29167 5.5 7.05417 5.59583 6.8625 5.7875C6.67083 5.97917 6.575 6.21667 6.575 6.5C6.575 6.78333 6.67083 7.02083 6.8625 7.2125C7.05417 7.40417 7.29167 7.5 7.575 7.5H15.175L6.275 16.4C6.09167 16.5833 6 16.8167 6 17.1C6 17.3833 6.09167 17.6167 6.275 17.8C6.45833 17.9833 6.69167 18.075 6.975 18.075C7.25833 18.075 7.49167 17.9833 7.675 17.8L16.575 8.9Z' fill='%23231F20'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  width: 13px;
  height: 13px;
  min-width: 13px;
  flex-shrink: 0;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-grid__product-add-to-cart .add_to_cart_button:hover,
.wc-block-grid__product-add-to-cart a:hover {
  background: #e5e28b !important;
  color: #231f20 !important;
}

/* Empty Cart styling */
.wc-block-cart--is-empty {
  text-align: center;
  width: 100% !important;
  max-width: 100% !important;
}

.wc-block-cart--is-empty > * {
  max-width: 100% !important;
}

.wc-block-cart--is-empty .wc-block-cart__empty-cart__title {
  margin-bottom: 40px;
}

/* New products block in empty cart */
.wc-block-cart--is-empty .wp-block-woocommerce-product-new,
.wc-block-cart--is-empty .wc-block-grid {
  margin-top: 40px;
}

/* Product grid container */
.wp-block-woocommerce-product-new,
.wp-block-woocommerce-product-best-sellers,
.wp-block-woocommerce-product-on-sale,
.wp-block-woocommerce-product-top-rated {
  width: 100% !important;
  max-width: 100% !important;
}

.wc-block-cart--is-empty .wc-block-cart__empty-cart__title {
  font-size: 24px;
  font-weight: 700;
  color: #231f20;
  margin-bottom: 30px;
}

/* New products block title */
.wp-block-woocommerce-product-new .wc-block-grid__title,
.wc-block-grid__title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #231f20 !important;
  text-align: center !important;
  margin-bottom: 30px !important;
  margin-top: 40px !important;
}
.wp-block-woocommerce-product-new {
  margin-top: 40px !important;
}
.wp-block-woocommerce-product-new .wc-block-grid__product .wc-block-grid__product-link {
  padding-top: 8px;
}
.wp-block-woocommerce-product-new
  .wc-block-grid__product
  .wp-block-button.wc-block-grid__product-add-to-cart {
  padding-bottom: 0px;
  margin-bottom: 0px;
}
.wc-block-components-radio-control--highlight-checked
  .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked
  label.wc-block-components-radio-control__option--checked-option-highlighted {
  box-shadow: inset 0 0 0 1px #d4d078 !important;
}
/* Hide only the country fields (Ukraine-only store — user never
   needs to pick country). Nova Poshta address/patronymic selectors
   stay visible so customers can actually enter their delivery info. */
#billing_country_field,
#shipping_country_field {
  display: none !important;
}
.woocommerce .checkout-order-column table.shop_table {
  border: none !important;
}
#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
  background: #fbf6ef;
  border-radius: 12px;
}
.woocommerce-terms-and-conditions-wrapper + .button {
  margin-top: 20px !important;
}
.woocommerce form .checkout-billing-column .form-row-first,
.woocommerce form .checkout-billing-column .form-row-last,
.woocommerce-page form .checkout-billing-column .form-row-first,
.woocommerce-page form .checkout-billing-column .form-row-last {
  width: 100% !important;
  float: none !important;
}
.woocommerce .checkout-order-column table.shop_table tbody th,
.woocommerce .checkout-order-column table.shop_table tfoot td,
.woocommerce .checkout-order-column table.shop_table tfoot th {
  border-top: none !important;
}
.woocommerce .checkout-order-column table.shop_table td {
  border-top: none !important;
}
.woocommerce .woocommerce-customer-details address,
.woocommerce table.shop_table {
  border-radius: 12px;
}
.woocommerce table.my_account_orders td,
.woocommerce table.my_account_orders th {
  border-radius: 12px;
}
@media (max-width: 768px) {
  .woocommerce .my_account_orders.shop_table_responsive {
    border: none !important;
  }
  .woocommerce .my_account_orders.shop_table_responsive tr td,
  .woocommerce-page .my_account_orders.shop_table_responsive tr td {
    min-height: 30px;
    border-radius: 0;
  }
}
h3#ship-to-different-address {
  display: none !important;
}
.woocommerce .blockUI.blockOverlay::before {
  background: none !important;
}
div#customer_details > * {
  width: 100% !important;
}
/* Nova Poshta / Morkva UA — keep ONLY the internal technical reference
   fields hidden (the ones that hold raw API ref-ids / labels that the
   plugin never wants to render). All user-facing selectors — warehouse
   number, poshtamat number, area name, city, etc. — stay visible. */
#mrkv_ua_shipping_nova-poshta_address_street_ref_field,
#mrkv_ua_shipping_nova-poshta_address_patronymic_enabled_field,
#mrkv_ua_shipping_nova-poshta_address_city_ref_field,
#mrkv_ua_shipping_nova-poshta_address_address_ref_field,
#mrkv_ua_shipping_nova-poshta_city_ref_field,
#mrkv_ua_shipping_nova-poshta_poshtamat_city_ref_field,
#mrkv_ua_shipping_nova-poshta_poshtamat_ref_field,
#mrkv_ua_shipping_nova-poshta_warehouse_ref_field {
  display: none !important;
}

/* =========================================================
   Cart AJAX — inline error banner (per item)
   ========================================================= */
.cto-item {
  position: relative;
}
.cto-item__error {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 8px 12px;
  background: #fdecea;
  color: #8a1f1f;
  border: 1px solid #f5c2c0;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.35;
  animation: ctoErrIn 0.18s ease both;
}
.cto-item__error svg {
  flex: 0 0 auto;
  color: #c0392b;
}
@keyframes ctoErrIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: none; }
}

/* =========================================================
   Cart AJAX — Undo toast (bottom-left)
   ========================================================= */
.cto-toast-host {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.cto-toast {
  pointer-events: auto;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-width: 260px;
  max-width: 360px;
  padding: 12px 14px 12px 16px;
  background: #231f20;
  color: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
  font-size: 14px;
  line-height: 1.3;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.22s ease, transform 0.22s ease;
  overflow: hidden;
}
.cto-toast.is-visible {
  opacity: 1;
  transform: none;
}
.cto-toast__msg {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  color: #fff;
}
.cto-toast__msg svg {
  flex: 0 0 auto;
  opacity: 0.9;
}
.cto-toast__undo {
  appearance: none;
  background: transparent;
  color: #e5e28b;
  border: 1px solid rgba(229, 226, 139, 0.4);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.02em;
  padding: 6px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.cto-toast__undo:hover {
  background: #e5e28b;
  color: #231f20;
  border-color: #e5e28b;
}
.cto-toast__close {
  appearance: none;
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.6);
  font-size: 18px;
  line-height: 1;
  padding: 0 2px;
  cursor: pointer;
  transition: color 0.15s ease;
}
.cto-toast__close:hover {
  color: #fff;
}
.cto-toast__progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 100%;
  background: #e5e28b;
  transform-origin: left center;
  animation: ctoToastBar 5.5s linear forwards;
}
@keyframes ctoToastBar {
  from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}

@media (max-width: 600px) {
  .cto-toast-host {
    left: 12px;
    right: 12px;
    bottom: 12px;
  }
  .cto-toast {
    min-width: 0;
    max-width: none;
    width: 100%;
  }
}

/* Clear-cart button: loading + disabled states while the AJAX runs. */
.cto-cart__clear.is-loading {
  pointer-events: none;
  opacity: 0.55;
  position: relative;
}
.cto-cart__clear.is-loading::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  vertical-align: middle;
  animation: ctoSpin 0.7s linear infinite;
}
@keyframes ctoSpin {
  to { transform: rotate(360deg); }
}

/* Clear-cart toast gets a slightly louder accent so it reads as a
   bigger/destructive action than a single-item remove. */
.cto-toast--clear {
  border-left: 3px solid #e5e28b;
}
.cto-toast--clear .cto-toast__msg {
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* ==========================================================================
   Checkout page — clean card redesign (CSS-only).

   This block intentionally lives at the end so it wins over older chunks
   earlier in this file. Important: NO WooCommerce / Nova Poshta / WayForPay
   / BotPay markup is touched. Form field names, IDs, nonces, radio values,
   AJAX endpoints and submission flow stay exactly as core/plugin code
   outputs them — only the visual presentation changes.
   ========================================================================== */

/* Clamp any possible horizontal overflow on the checkout page.
   Rationale: checkout has many plugin-injected fields (Nova Poshta,
   WayForPay, BotPay, Morkva UA) that occasionally emit markup or inline
   styles which can exceed the grid cell width. We use `overflow-x: clip`
   (not `hidden`) so the body does NOT become a scroll container — that
   preserves the sticky behaviour of `.checkout-order-column`. `clip`
   falls back to `hidden` on browsers that don't support it. */
html {
  overflow-x: clip;
}
body.woocommerce-checkout,
body.woocommerce-cart {
  overflow-x: clip;
}

/* Column layout — matches the cart layout exactly (.cto-cart__layout):
   a flexible left column and a fixed 480px right column, 28px gap, with
   each column sitting at its natural height (no stretching). */
body.woocommerce-checkout .checkout-columns {
  grid-template-columns: minmax(0, 1fr) 480px !important;
  gap: 28px !important;
  align-items: start !important;
}
@media (max-width: 1024px) {
  body.woocommerce-checkout .checkout-columns {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

body.woocommerce-checkout .checkout-billing-column,
body.woocommerce-checkout .checkout-order-column {
  min-width: 0;
}

/* Keep the right panel visible while scrolling through the billing form
   (same behaviour as the cart summary). The site header is `position:
   fixed; top: 0` and ~90-100px tall, so we offset the sticky below it. */
@media (min-width: 1025px) {
  body.woocommerce-checkout .checkout-order-column {
    position: sticky;
    top: 96px;
    align-self: start;
  }
  body.admin-bar.woocommerce-checkout .checkout-order-column {
    top: 128px;
  }
}

/* LEFT COLUMN — wrap the entire customer-details column in ONE card so
   that plugin-injected fields (Nova Poshta city/warehouse, Morkva UA, etc.)
   flow visually inside the same card as the billing fields instead of
   appearing as disjointed extra cards. */
body.woocommerce-checkout .checkout-billing-column {
  background: #fff;
  border: 1px solid #efe9d9;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

/* Sub-sections inside the left card: transparent, no extra bottom margin
   so the card's bottom padding is symmetric with the left/right padding. */
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Separator before the additional-fields (notes) block. Kept to the same
   12px rhythm as between fields so the whole left card feels uniform. */
body.woocommerce-checkout .woocommerce-additional-fields {
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid #f3ecda !important;
}

/* If the shipping-fields block only contains the toggle + hidden address
   rows, collapse its spacing entirely. */
body.woocommerce-checkout .woocommerce-shipping-fields {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
body.woocommerce-checkout .woocommerce-shipping-fields > h3#ship-to-different-address {
  margin: 18px 0 12px !important;
  padding-top: 18px !important;
  border-top: 1px solid #f3ecda !important;
}

/* RIGHT COLUMN — the "Ваше замовлення" heading is a <h3> rendered as a
   SIBLING of #order_review (WooCommerce template structure). To make it
   appear INSIDE the same card, we give both elements matching side borders
   and treat the heading as the card's top half (radius top, no bottom
   border) and #order_review as the card's bottom half (radius bottom, no
   top border). Payment cards remain their own cards below. */
body.woocommerce-checkout #order_review_heading {
  background: #fff !important;
  border: 1px solid #efe9d9 !important;
  border-bottom: none !important;
  border-radius: 16px 16px 0 0 !important;
  padding: 22px 22px 14px !important;
  margin: 0 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #231f20 !important;
  letter-spacing: -0.005em;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
  /* hide the shadow on the shared edge so the seam is invisible */
  clip-path: inset(-6px -6px 0 -6px);
}
body.woocommerce-checkout #order_review {
  background: #fff !important;
  border: 1px solid #efe9d9 !important;
  border-top: 1px solid #f3ecda !important; /* thin divider beneath heading */
  border-radius: 0 0 16px 16px !important;
  padding: 14px 22px 22px !important;
  margin: 0 !important; /* no outer gap — this is the last card on the right */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
  clip-path: inset(0 -6px -6px -6px);
}

/* `.woocommerce-checkout-payment` is rendered INSIDE `#order_review` by
   WooCommerce (both hang off the `woocommerce_checkout_order_review`
   action), which used to produce a visible "card inside a card" with
   doubled borders and bottom padding. Flatten the inner one so only the
   outer #order_review card has borders/background; this keeps the right
   panel's bottom padding consistent with the left column. */
body.woocommerce-checkout .woocommerce-checkout-payment {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 16px 0 0 !important; /* small gap below the product table only */
  box-shadow: none !important;
}

@media (max-width: 640px) {
  body.woocommerce-checkout .checkout-billing-column {
    padding: 16px !important;
    border-radius: 14px !important;
  }
  body.woocommerce-checkout .woocommerce-checkout-payment {
    /* stay flattened on mobile too — padding/border handled by #order_review */
    padding: 0 !important;
    margin: 14px 0 0 !important;
  }
  body.woocommerce-checkout #order_review_heading {
    padding: 16px 16px 12px !important;
    border-radius: 14px 14px 0 0 !important;
  }
  body.woocommerce-checkout #order_review {
    padding: 10px 16px 16px !important;
    border-radius: 0 0 14px 14px !important;
  }
}

/* Section headings inside the left card (billing, shipping, additional).
   The divider beneath each heading is stretched to the FULL card width
   (flush with the card's outer edges) using negative horizontal margins,
   so it mirrors the "Ваше замовлення" divider on the right panel exactly. */
body.woocommerce-checkout .woocommerce-billing-fields h3,
body.woocommerce-checkout .woocommerce-shipping-fields h3,
body.woocommerce-checkout .woocommerce-additional-fields h3 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #231f20 !important;
  margin: 0 -22px 18px !important;     /* pull sides flush to card edges */
  padding: 0 22px 14px !important;     /* restore inner horizontal spacing */
  border-bottom: 1px solid #f3ecda !important;
  letter-spacing: -0.005em;
}

/* The FIRST heading (Платіжні дані) sits at the very top of the card —
   pull its top edge flush too so the divider visually becomes the card's
   inner "title bar", identical to "Ваше замовлення" on the right. */
body.woocommerce-checkout .checkout-billing-column .woocommerce-billing-fields h3,
body.woocommerce-checkout .checkout-billing-column > form > .woocommerce-billing-fields h3,
body.woocommerce-checkout .checkout-billing-column > .woocommerce-billing-fields h3 {
  margin-top: -22px !important;
  padding-top: 22px !important;
}

@media (max-width: 640px) {
  body.woocommerce-checkout .woocommerce-billing-fields h3,
  body.woocommerce-checkout .woocommerce-shipping-fields h3,
  body.woocommerce-checkout .woocommerce-additional-fields h3 {
    margin: 0 -16px 14px !important;
    padding: 0 16px 12px !important;
  }
  body.woocommerce-checkout .checkout-billing-column .woocommerce-billing-fields h3 {
    margin-top: -16px !important;
    padding-top: 16px !important;
  }
}

/* When WooCommerce renders plugin fields after `.woocommerce-billing-fields`
   but WITHOUT a heading (e.g. Nova Poshta city/warehouse), fabricate a
   subtle visual break so it doesn't feel headless. */
body.woocommerce-checkout .woocommerce-shipping-fields:empty,
body.woocommerce-checkout .woocommerce-additional-fields:empty {
  display: none !important;
}

/* Collapse the outer form spacing — cards own the rhythm */
body.woocommerce-checkout form.checkout.woocommerce-checkout {
  background: transparent;
}

/* Form row tightening — uniform 12px rhythm between every field in the
   left card, whether it's a native WooCommerce billing/shipping/additional
   field OR a plugin-injected one (Nova Poshta / Morkva UA city+warehouse).
   The plugin wraps its fields inside non-.form-row wrapper <div>s
   (.mrkv_ua_shipping_checkout_fields > #..._fields > #...-shipping-info),
   which would otherwise stack their own vertical space on top of each
   form-row's margin. We zero those wrappers and keep the rhythm on the
   .form-row itself. */
body.woocommerce-checkout .form-row,
body.woocommerce-checkout .checkout-billing-column .form-row {
  margin: 0 0 12px !important;
  padding: 0 !important;
}
body.woocommerce-checkout .checkout-billing-column .form-row:last-child {
  margin-bottom: 0 !important;
}
body.woocommerce-checkout .checkout-billing-column .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .checkout-billing-column .woocommerce-shipping-fields__field-wrapper,
body.woocommerce-checkout .checkout-billing-column .woocommerce-additional-fields__field-wrapper,
body.woocommerce-checkout .checkout-billing-column .mrkv_ua_shipping_checkout_fields,
body.woocommerce-checkout .checkout-billing-column .mrkv_ua_shipping_checkout_fields > div,
body.woocommerce-checkout .checkout-billing-column [id$='-shipping-info'] {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
body.woocommerce-checkout .form-row label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #665a5d !important;
  margin-bottom: 6px !important;
}
body.woocommerce-checkout .form-row .required {
  color: #d35152 !important;
  text-decoration: none !important;
}

/* Ship-to-different-address heading inside its own card */
body.woocommerce-checkout #ship-to-different-address {
  margin: 0 0 10px !important;
}
body.woocommerce-checkout #ship-to-different-address label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #231f20 !important;
}

/* Order review "table" — rebuilt as flex rows so every row (including the
   shipping row with its stacked pills) aligns identically to the card
   width. No markup change: the <table>/<thead>/<tbody>/<tfoot>/<tr>/<th>/<td>
   elements are just re-styled as block/flex containers. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table thead,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot {
  display: block !important;
  width: 100% !important;
}

/* When there are many products, cap the product list to ~3 rows and let
   it scroll vertically inside the card instead of expanding the whole
   right panel. thead (column header) and tfoot (subtotals/shipping/total)
   remain pinned outside the scroll area. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody {
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
  /* reserve the gutter so rows don't jump width when the scrollbar
     appears/disappears across updates */
  scrollbar-gutter: stable;
  /* Firefox — on-brand thumb */
  scrollbar-width: thin;
  scrollbar-color: #e7dfc7 transparent;
}
/* When JS detects the list actually overflows, force the scrollbar to
   render (even on macOS where overlay scrollbars auto-hide) and use
   stronger brand colours so users immediately see the scroll affordance. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable {
  overflow-y: scroll;
  padding-right: 6px !important;
  scrollbar-color: #c8bf4a #f3ecda;
}
/* WebKit (Chrome/Safari/Edge) — subtle by default. When the list is
   scrollable we force the scrollbar to render via `overflow-y: scroll`
   on `.is-scrollable` above, and paint the thumb in brand yellow so
   users see the scroll affordance immediately on load (not on hover). */
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody::-webkit-scrollbar {
  width: 8px;
  -webkit-appearance: none;
  background: transparent;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 8px;
  margin: 4px 0;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody::-webkit-scrollbar-thumb {
  background: #e7dfc7;
  border-radius: 8px;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable::-webkit-scrollbar-track {
  background: #f3ecda;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable::-webkit-scrollbar-thumb {
  background: #c8bf4a;
  border: 1px solid #b8ad3f;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable::-webkit-scrollbar-thumb:hover {
  background: #b8ad3f;
}

/* Subtle bottom fade inside the tbody scroll area to visually hint that
   more rows exist below the viewport. Positioned via the parent table
   so it overlays only the scrollable list, not thead/tfoot. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table {
  position: relative;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody {
  position: relative;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable::after {
  content: "";
  position: sticky;
  display: block;
  bottom: 0;
  left: 0;
  right: 0;
  height: 32px;
  margin-top: -32px;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 70%, #fff 100%);
  transition: opacity .2s ease;
}
/* Once the user scrolls to the very bottom, fade the gradient out so
   it doesn't look like a permanent visual line under the last row. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody.is-scrollable.is-at-bottom::after {
  opacity: 0;
}

/* Keep the thead "ТОВАР / ПРОМІЖНА СУМА" header visually above the
   scrollable list, with a subtle divider. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table thead tr {
  border-bottom: 1px solid #f3ecda !important;
  padding-bottom: 10px !important;
  margin-bottom: 4px !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tr {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid #f3ecda !important;
  box-sizing: border-box !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tr:last-child {
  border-bottom: none !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td {
  display: block !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  font-size: 14px !important;
  flex: 0 1 auto !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #8a7a77 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody .cart_item td.product-name {
  color: #231f20 !important;
  font-weight: 500;
  flex: 1 1 auto !important;
  min-width: 0;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody .cart_item td.product-total {
  text-align: right !important;
  font-weight: 600 !important;
  color: #231f20 !important;
  white-space: nowrap;
}

/* Review-order items — thumbnail + name + qty layout */
body.woocommerce-checkout .cto-review-item {
  display: flex !important;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
body.woocommerce-checkout .cto-review-item__thumb {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border-radius: 10px;
  overflow: hidden;
  background: #faf7ef;
  border: 1px solid #f3ecda;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.woocommerce-checkout .cto-review-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
body.woocommerce-checkout .cto-review-item__info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 8px;
  line-height: 1.35;
}
body.woocommerce-checkout .cto-review-item__name {
  flex: 1 1 100%;
  font-weight: 500;
  color: #231f20;
  font-size: 14px;
  /* wrap nicely for 1-2 lines without overflowing the narrow card */
  word-break: break-word;
}
body.woocommerce-checkout .cto-review-item__qty,
body.woocommerce-checkout .cto-review-item .product-quantity {
  font-weight: 600;
  color: #665a5d;
  font-size: 13px;
}
body.woocommerce-checkout .cto-review-item .variation,
body.woocommerce-checkout .cto-review-item dl.variation {
  margin: 2px 0 0;
  font-size: 12px;
  color: #8a7a77;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th {
  font-weight: 500 !important;
  color: #231f20 !important;
  text-align: left !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
  text-align: right !important;
  font-weight: 600 !important;
  white-space: nowrap;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total {
  padding-top: 16px !important;
  border-top: 1px solid #e7dfc7 !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #231f20 !important;
}

/* Shipping methods row — column layout so the label sits on its own line and
   the pill list takes the full card width below it. */
body.woocommerce-checkout tr.woocommerce-shipping-totals,
body.woocommerce-checkout tr.shipping {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
}
body.woocommerce-checkout tr.woocommerce-shipping-totals th,
body.woocommerce-checkout tr.shipping th {
  width: 100% !important;
  text-align: left !important;
  font-weight: 600 !important;
  color: #231f20 !important;
}
body.woocommerce-checkout tr.woocommerce-shipping-totals td,
body.woocommerce-checkout tr.shipping td {
  width: 100% !important;
  text-align: left !important;
}
body.woocommerce-checkout #shipping_method {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  text-align: left !important;
}
body.woocommerce-checkout #shipping_method li {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #faf8f2 !important;
  border: 1px solid #efe9d9 !important;
  border-radius: 12px !important;
  color: #231f20 !important;
  cursor: pointer;
  align-items: initial !important;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
body.woocommerce-checkout #shipping_method li:hover {
  border-color: #d6d06a !important;
  background: #fbf9ee !important;
}
body.woocommerce-checkout #shipping_method li input[type='radio'] {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
body.woocommerce-checkout #shipping_method li input[type='radio']::before,
body.woocommerce-checkout #shipping_method li input[type='radio']::after {
  content: none !important;
  display: none !important;
}
body.woocommerce-checkout #shipping_method li label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 14px 18px 14px 48px !important;
  box-sizing: border-box !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #231f20 !important;
  line-height: 1.3 !important;
  cursor: pointer !important;
  user-select: none !important;
  flex: initial !important;
  text-align: left !important;
}
body.woocommerce-checkout #shipping_method li label::before {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 2px solid #c8c3a3;
  border-radius: 50%;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.15s ease, background 0.15s ease;
}
body.woocommerce-checkout #shipping_method li label::after {
  content: '';
  position: absolute;
  left: 25px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #231f20;
  transform: translateY(-50%) scale(0);
  transition: transform 0.15s ease;
}
body.woocommerce-checkout #shipping_method li:has(input[type='radio']:checked) {
  background: #f7f2c9 !important;
  border-color: #c8bf4a !important;
  box-shadow: 0 0 0 1px #c8bf4a inset !important;
}
body.woocommerce-checkout #shipping_method li:has(input[type='radio']:checked) label {
  font-weight: 600 !important;
}
body.woocommerce-checkout #shipping_method li:has(input[type='radio']:checked) label::before {
  border-color: #231f20;
  background: #fff;
}
body.woocommerce-checkout #shipping_method li:has(input[type='radio']:checked) label::after {
  transform: translateY(-50%) scale(1);
}
body.woocommerce-checkout #shipping_method li:has(input[type='radio']:focus-visible) {
  box-shadow: 0 0 0 3px rgba(229, 226, 139, 0.6) !important;
}
/* Secondary content some plugins inject inside the li (e.g. a price span) */
body.woocommerce-checkout #shipping_method li > *:not(input):not(label) {
  padding: 0 18px 12px 48px;
  font-size: 12px;
  color: #665a5d;
}

/* Payment methods — card list with selected state */
body.woocommerce-checkout .woocommerce-checkout-payment .wc_payment_methods {
  display: grid !important;
  gap: 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
  border: none !important;
  background: transparent !important;
}
body.woocommerce-checkout .wc_payment_method {
  padding: 14px 16px !important;
  border: 1px solid #efe9d9 !important;
  border-radius: 12px !important;
  margin: 0 !important;
  background: #fff !important;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
body.woocommerce-checkout .wc_payment_method:hover {
  border-color: #d6d06a !important;
  background: #fbf9ee !important;
}
body.woocommerce-checkout .wc_payment_method:has(input[type='radio']:checked) {
  border-color: #c8bf4a !important;
  background: #f7f2c9 !important;
  box-shadow: 0 0 0 1px #c8bf4a inset !important;
}
body.woocommerce-checkout .wc_payment_method > label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  font-weight: 600 !important;
  color: #231f20 !important;
  cursor: pointer !important;
}
body.woocommerce-checkout .wc_payment_method > label img {
  max-height: 24px;
  width: auto;
  margin-left: auto;
}
body.woocommerce-checkout .wc_payment_method > input[type='radio'] {
  /* keep native radio visible here for clarity — existing checkout radio
     styles drawn above already give it a yellow/dark appearance. */
  flex-shrink: 0 !important;
  margin: 0 !important;
}
body.woocommerce-checkout .wc_payment_method .payment_box {
  margin: 10px 0 0 !important;
  padding: 12px 14px !important;
  background: #fff !important;
  border: 1px solid #efe9d9 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  color: #665a5d !important;
}
body.woocommerce-checkout .wc_payment_method .payment_box::before {
  display: none !important;
}

/* Place order — brand yellow to match the cart CTA; consistent radius */
body.woocommerce-checkout .woocommerce-checkout-payment #place_order {
  width: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: #e5e28b !important;
  color: #231f20 !important;
  border: none !important;
  padding: 16px 24px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 10px rgba(229, 226, 139, 0.45) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}
body.woocommerce-checkout .woocommerce-checkout-payment #place_order:hover {
  background: #231f20 !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(35, 31, 32, 0.28) !important;
}

/* Terms / privacy text — same left/right edges as the payment cards
   (WayForPay / BotPay) and the Place Order button below them. */
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper,
body.woocommerce-checkout .woocommerce-privacy-policy-text {
  font-size: 12px !important;
  color: #665a5d !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  line-height: 1.5;
  box-sizing: border-box !important;
  width: 100% !important;
}
body.woocommerce-checkout .woocommerce-privacy-policy-text p {
  margin: 0 0 6px !important;
  padding: 0 !important;
}

/* Payment wrapper: every direct child (payment list, terms, privacy,
   place-order form-row, hidden inputs) must sit flush with the card's
   inner padding — no extra horizontal indent from default WC / UL rules. */
body.woocommerce-checkout .woocommerce-checkout-payment > * {
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body.woocommerce-checkout .woocommerce-checkout-payment .form-row.place-order {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
body.woocommerce-checkout .wc_payment_method {
  list-style: none !important;
}

/* Catch-all: normalise border-radius on ANY input/select/textarea inside
   the checkout-billing card, including plugin-injected fields (Nova Poshta
   city/warehouse, Morkva UA pickers, Select2 containers). Nothing else is
   changed — just the radius so every field matches. */
body.woocommerce-checkout .checkout-billing-column input[type='text'],
body.woocommerce-checkout .checkout-billing-column input[type='email'],
body.woocommerce-checkout .checkout-billing-column input[type='tel'],
body.woocommerce-checkout .checkout-billing-column input[type='password'],
body.woocommerce-checkout .checkout-billing-column input[type='number'],
body.woocommerce-checkout .checkout-billing-column input[type='search'],
body.woocommerce-checkout .checkout-billing-column input[type='url'],
body.woocommerce-checkout .checkout-billing-column input:not([type]),
body.woocommerce-checkout .checkout-billing-column select,
body.woocommerce-checkout .checkout-billing-column textarea {
  border-radius: 14px !important;
}
body.woocommerce-checkout .checkout-billing-column .select2-container .select2-selection--single,
body.woocommerce-checkout .checkout-billing-column .select2-container--default .select2-selection--single,
body.woocommerce-checkout .checkout-billing-column .select2-selection {
  border-radius: 14px !important;
}
body.woocommerce-checkout .checkout-billing-column .select2-dropdown {
  border-radius: 14px !important;
}

/* ==========================================================================
   CHECKOUT INPUTS — EYE-FRIENDLY THEME
   Pure #fff + 1px #f0f0f0 borders read as "bright card inside bright card"
   and the eye can't tell where a field begins. We switch to a very soft
   warm off-white surface inside the white card + a clearly visible 1.5px
   beige border. Focus uses the brand yellow with a soft glow (no harsh
   black ring). Placeholders and labels get lower-contrast colours so the
   form feels calm, not neon.
   ==========================================================================*/
body.woocommerce-checkout .checkout-billing-column input[type='text'],
body.woocommerce-checkout .checkout-billing-column input[type='email'],
body.woocommerce-checkout .checkout-billing-column input[type='tel'],
body.woocommerce-checkout .checkout-billing-column input[type='password'],
body.woocommerce-checkout .checkout-billing-column input[type='number'],
body.woocommerce-checkout .checkout-billing-column input[type='search'],
body.woocommerce-checkout .checkout-billing-column input[type='url'],
body.woocommerce-checkout .checkout-billing-column input:not([type]),
body.woocommerce-checkout .checkout-billing-column select,
body.woocommerce-checkout .checkout-billing-column textarea,
body.woocommerce-checkout .checkout-billing-column .select2-container--default .select2-selection--single {
  /* EXACT copy of the selected shipping-pill / WayForPay payment card
     style: pale yellow fill + 1px yellow border + 1px yellow inset shadow
     (→ a solid, uniform 2px yellow edge). */
  background-color: #f7f2c9 !important;
  border: 1px solid #c8bf4a !important;
  box-shadow: 0 0 0 1px #c8bf4a inset !important;
  color: #231f20 !important;
  padding: 0 44px 0 16px !important; /* leave room for the chevron on selects */
  height: 50px !important;
  min-height: 50px !important;
  line-height: 1.5 !important;
  font-size: 14px !important;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
}

/* Native text inputs + textarea get their own padding (no arrow room). */
body.woocommerce-checkout .checkout-billing-column input[type='text'],
body.woocommerce-checkout .checkout-billing-column input[type='email'],
body.woocommerce-checkout .checkout-billing-column input[type='tel'],
body.woocommerce-checkout .checkout-billing-column input[type='password'],
body.woocommerce-checkout .checkout-billing-column input[type='number'],
body.woocommerce-checkout .checkout-billing-column input[type='search'],
body.woocommerce-checkout .checkout-billing-column input[type='url'],
body.woocommerce-checkout .checkout-billing-column input:not([type]) {
  padding: 0 16px !important;
  height: 50px !important;
  min-height: 50px !important;
  line-height: 1.5 !important;
}
body.woocommerce-checkout .checkout-billing-column textarea {
  padding: 14px 16px !important;
  min-height: 96px !important;
  line-height: 1.5 !important;
  height: auto !important;
}
body.woocommerce-checkout .checkout-billing-column select {
  padding: 0 44px 0 16px !important;
  height: 50px !important;
  min-height: 50px !important;
  line-height: 1.5 !important;
}

/* Hover — slightly darker yellow edge; keep the pale-yellow fill */
body.woocommerce-checkout .checkout-billing-column input[type='text']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='email']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='tel']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='password']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='number']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='search']:hover,
body.woocommerce-checkout .checkout-billing-column input[type='url']:hover,
body.woocommerce-checkout .checkout-billing-column input:not([type]):hover,
body.woocommerce-checkout .checkout-billing-column select:hover,
body.woocommerce-checkout .checkout-billing-column textarea:hover,
body.woocommerce-checkout .checkout-billing-column .select2-container--default:hover .select2-selection--single {
  border-color: #b8ad3f !important;
  box-shadow: 0 0 0 1px #b8ad3f inset !important;
}

/* Focus — keep the same 2px yellow edge, add an outer 3px halo */
body.woocommerce-checkout .checkout-billing-column input[type='text']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='email']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='tel']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='password']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='number']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='search']:focus,
body.woocommerce-checkout .checkout-billing-column input[type='url']:focus,
body.woocommerce-checkout .checkout-billing-column input:not([type]):focus,
body.woocommerce-checkout .checkout-billing-column select:focus,
body.woocommerce-checkout .checkout-billing-column textarea:focus,
body.woocommerce-checkout .checkout-billing-column .select2-container--default.select2-container--focus .select2-selection--single,
body.woocommerce-checkout .checkout-billing-column .select2-container--default.select2-container--open .select2-selection--single {
  outline: none !important;
  border-color: #c8bf4a !important;
  background-color: #fffdf3 !important;
  /* inset yellow (keeps visual 2px edge) + outer soft glow */
  box-shadow: 0 0 0 1px #c8bf4a inset, 0 0 0 3px rgba(200, 191, 74, 0.25) !important;
}

/* Filled-but-not-focused — lighter cream fill so the typed text is easy
   to read; the 1px border + 1px inset yellow shadow stays intact. */
body.woocommerce-checkout .checkout-billing-column input:not(:placeholder-shown):not(:focus) {
  background-color: #fffdf3 !important;
}

/* Labels — slightly softer and medium weight so the field dominates */
body.woocommerce-checkout .checkout-billing-column label,
body.woocommerce-checkout .checkout-billing-column .form-row > label {
  color: #4a4647 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

/* Placeholder — calm gray, same across browsers */
body.woocommerce-checkout .checkout-billing-column input::placeholder,
body.woocommerce-checkout .checkout-billing-column textarea::placeholder,
body.woocommerce-checkout .checkout-billing-column .select2-selection__placeholder,
body.woocommerce-checkout .checkout-billing-column .select2-selection__rendered {
  color: #9a938a !important;
  opacity: 1 !important;
  font-weight: 400 !important;
}

/* Required asterisk — softer red, don't scream */
body.woocommerce-checkout .checkout-billing-column .required,
body.woocommerce-checkout .checkout-billing-column abbr.required {
  color: #c85c5c !important;
  border: none !important;
  text-decoration: none !important;
  margin-left: 2px;
}

/* Select2 selection row — same height as native inputs so they align.
   The Select2 container (.select2-container) needs its own height so it
   lines up with native <input> fields — the plugin picks up its width
   from WC but height from us. */
body.woocommerce-checkout .checkout-billing-column .select2-container {
  width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  display: block !important;
  box-sizing: border-box !important;
}
body.woocommerce-checkout .checkout-billing-column .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 !important;
  line-height: 1.5 !important;
  color: #231f20 !important;
}

/* Replace old triangle arrow with a clean modern chevron SVG. We hide
   Select2's default `<b>` triangle and paint the chevron as a background
   on the arrow container. Same chevron is used for native <select> below
   so both look identical. */
body.woocommerce-checkout .checkout-billing-column .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  top: 0 !important;
  right: 12px !important;
  width: 20px !important;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23231f20' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat center center !important;
  background-size: 16px 16px !important;
  transition: transform .18s ease !important;
}
body.woocommerce-checkout .checkout-billing-column .select2-container--default .select2-selection--single .select2-selection__arrow b {
  display: none !important; /* hide the legacy CSS-border triangle */
}
/* Flip chevron when the dropdown is open */
body.woocommerce-checkout .checkout-billing-column .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow {
  transform: rotate(180deg) !important;
}

/* Native <select> chevron — same SVG, same size */
body.woocommerce-checkout .checkout-billing-column select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23231f20' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 16px 16px !important;
}

/* Invalid state — muted red tint, matches the calm vibe */
body.woocommerce-checkout .checkout-billing-column .woocommerce-invalid input.input-text,
body.woocommerce-checkout .checkout-billing-column .woocommerce-invalid select,
body.woocommerce-checkout .checkout-billing-column .woocommerce-invalid textarea {
  border-color: #d88a8a !important;
  background-color: #fdf4f4 !important;
  box-shadow: 0 0 0 3px rgba(216, 138, 138, 0.15) !important;
}
body.woocommerce-checkout .checkout-billing-column .woocommerce-validated input.input-text {
  border-color: #a9c9a0 !important;
}