/*
Theme Name: Allbirds
Description: A basic WordPress theme
Version: 1.0
Author: Your Name
*/

/* Add your CSS styles here */

:root {
  --primary-background: #e0dacf;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  background-color: #ebe8e1;
}

#page {
  max-width: 100%;
  width: 100%;
  overflow-x: hidden;
}

.entry-header .entry-title {
  display: none;
}

.custom-link-shop-page-list {
  display: flex;
  gap: 10px;
  padding: 0;
}

.custom-link-shop-page {
  width: 100%;
  text-align: center;
  border: 1px solid #fff;
  font-size: 12px;
  padding: 8px 16px;
  border-radius: 20px;
  text-transform: uppercase;
  text-decoration: none !important;
  color: #fff;
}

.custom-link-shop-page:hover {
  background-color: #fff;
  color: #000;
}

.btn-shop-page {
  display: flex;
  gap: 10px;
  padding: 0;
  list-style: none;
  margin: 0;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.banner-header-menu-list {
  margin: 0 auto;
  position: absolute;
  top: 20px;
  left: 20px;
  right: 20px;
  height: 100%;
  z-index: 9999;
}

.banner-header-menu-list.fixed {
  position: fixed !important;
  top: 20px;
  left: 20px;
  right: 20px;
}

.banner-header-menu-list-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  width: 100%;
}

.banner-header-menu-list-inner-menu {
  flex: 1;
  display: flex;
  justify-content: center;
}

.banner-header-menu-list-inner-menu-right {
  flex: 1;
  display: flex;
  justify-content: end;
  align-items: center;
}
.banner-header-menu-list-inner-menu-right ul {
  gap: 8px;
}

.banner-header-menu-list-inner-menu ul {
  gap: 32px;
}

.banner-header-menu-list-inner-menu-right ul,
.banner-header-menu-list-inner-menu ul {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.banner-header-menu-list-wrapper
  .banner-header-menu-list-inner
  .banner-header-menu-list-inner-menu-right
  ul
  li
  a,
.banner-header-menu-list-wrapper
  .banner-header-menu-list-inner
  .banner-header-menu-list-inner-menu
  ul
  li
  a {
  text-decoration: none;
}

.banner-header-menu-list-wrapper
  .banner-header-menu-list-inner
  .banner-header-menu-list-inner-menu
  ul
  li
  a {
  font-weight: 600;
}

.banner-header-menu-list-inner-logo img {
  width: 100px;
  height: 35px;
}

.banner-img-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.banner-img-info {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  width: 100%;
}

.banner-img-info * {
  text-align: center;
  text-wrap: balance;
}

.banner-img-button {
  top: 90% !important;
  left: 50% !important;
  transform: translateX(-50%);
}

.footer-wrapper {
  background-color: #212121;
  padding: 80px 40px 20px;
}

.footer-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 40px;
}
.footer-bottom h2,
.footer-left .footer-title {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-top: 0;
  margin-bottom: 24px;
}

.footer-form {
  width: 50%;
  display: flex;
  justify-content: start;
  align-items: center;
  position: relative;
}

.footer-form input {
  padding: 10px;
  border: 1px solid #000;
  border-radius: 5px;
  width: 100%;
}

.footer-form button {
  position: absolute;
  right: 5px;
  width: 25%;
  background-color: white;
  border: none;
  outline: none;
  padding: 0;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: 600;
}

.menu-footer a:hover {
  text-decoration: underline;
}

.footer-right {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

.footer-right h2 {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  margin-bottom: 32px;
}

.footer-menu {
  padding: 0;
}

.footer-menu li {
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  padding: 0;
  line-height: 20px;
  list-style: none;
  margin-bottom: 15px;
}

.footer-menu li a {
  color: #fff;
  text-decoration: none;
}

.footer-menu li a:hover {
  text-decoration: underline;
}

.icon-social {
  padding: 8px;
  border: 1px solid #fff;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
  text-decoration: none;
}

.icon-social i {
  color: #fff;
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
}

.icon-social:hover {
  background-color: #fff;
  color: #212121;
}

.icon-social:hover i {
  color: #212121;
}

.footer-logo {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 32px;
  margin-bottom: 24px;
}

.select-language select {
  padding: 5px 10px;
  border-radius: 5px;
}

.footer-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding-top: 24px;
  border-top: 1px solid #fff;
}

.footer-inner a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}

.footer-inner p {
  color: #fff;
  margin: 0;
  padding: 0;
  font-size: 14px;
}

.footer-inner a:hover {
  text-decoration: underline;
}

.sub-menu-wrapper li > a,
.banner-header-menu li > a {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  line-height: 40px;
  text-decoration: none;
  color: #000;
}

.banner-header-menu-list-inner-menu-right li > a {
  font-weight: 500;
  font-size: 16px;
  line-height: 40px;
  text-decoration: none;
  opacity: 0.7;
  color: #000;
}

.banner-header-menu-list-inner-menu-right li > a:hover {
  opacity: 1;
  text-decoration: underline;
}

.sub-menu-wrapper .sub-menu {
  margin: 0;
  z-index: 100 !important;
  padding: 10px !important;
}

.sub-menu-wrapper {
  position: absolute;
  inset: 0;
  height: 0vh;
}

.sub-menu-wrapper-inner {
  opacity: 0;
  animation: fadeIn 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  display: none;
}
.sub-menu-wrapper-inner-1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #ece9e2;
  z-index: 100;
  padding-top: 100px;
  padding-bottom: 40px;
  min-height: 50vh;
  display: block;
  opacity: 1;
  animation: fadeIn 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.sub-menu-child {
  display: flex;
  gap: 32px;
}

.sub-menu-child li {
  list-style: none;
}

.has-submenu-wrapper .sub-menu {
  padding: 0 !important;
}

.has-submenu-wrapper ul {
  margin: 0;
}

.has-submenu-wrapper > ul > li:first-child > a {
  color: #000;
  opacity: 1;
  text-transform: uppercase;
  font-weight: 600;
}

.has-submenu-wrapper li a {
  line-height: 40px;
  color: #000;
  font-size: 16px;
  opacity: 0.5;
}

.has-submenu-wrapper li a:hover {
  text-decoration: underline;
  opacity: 1;
}

/* .sub-menu-wrapper-inner > .sub-menu{
  display: flex !important;
  justify-content: center;
  gap: 32px;
} */

.sub-menu-wrapper-inner > .sub-menu li {
  list-style: none;
}

.sub-menu-wrapper-inner > .sub-menu li a {
  font-size: 16px;
  font-weight: 600;
  color: #000;
  line-height: 40px;
  text-transform: uppercase;
}
.sub-menu-wrapper-inner .sub-menu.sub-menu-child {
  display: none !important;
}
/* 
.sub-menu-wrapper-inner > ul.sub-menu:first-of-type{
  display: inline-flex !important;
} */

.sub-menu .sub-menu-child-item {
  padding: 0 !important;
}

.has-submenu-group li .sub-menu-child-item a {
  font-size: 16px;
  font-weight: 400;
  color: #000;
  line-height: 40px;
  opacity: 0.5;
  text-transform: none;
}

.has-submenu-group li .sub-menu-child-item a:hover {
  opacity: 1;
  text-decoration: underline;
}

.sub-menu-wrapper-inner > ul.sub-menu {
  background-color: var(--primary-background);
  margin: 0 30px;
  border-radius: 20px;
  width: calc(100% - 60px);
  height: 48px;
  padding: 0 !important;
}

.sub-menu.sub-menu-child.menu-item-active {
  display: inline-flex !important;
  gap: 32px;
  height: 53vh;
}

.menu-wrapper {
  display: none;
}

.menu-item-active-parent {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  gap: 32px;
}

.sub-menu-wrapper-inner .menu-wrapper > li > a {
  color: #000 !important;
  opacity: 0.5 !important;
}

.sub-menu-wrapper-inner .menu-wrapper > li > a:hover {
  opacity: 1 !important;
  text-decoration: underline !important;
}

.sub-menu-wrapper-inner .menu-wrapper .menu-item-default a {
  opacity: 1 !important;
  text-decoration: underline !important;
}

#menu-header li .sub-menu {
  display: none !important;
}

.sub-menu-child .image-menu-item {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 20px;
}

.image-menu-item img {
  height: 100% !important;
  border-radius: 20px;
  transform: scale(1.3);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.image-menu-item img:hover {
  transform: scale(1.5);
  transition: all 0.5s ease-in-out;
}

.sub-menu-child {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 60px);
}

.content-menu-group {
  display: flex;
  gap: 32px;
}

.image-menu-group {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  max-width: 70vh;
  padding-top: 20px;
  padding-right: 25px;
}

.menu-mobile,
.cart-mobile {
  display: none;
}

.menu-mobile-wrapper {
  display: none;
}

.hamburger {
  cursor: pointer;
}

.hamburger input {
  display: none;
}

.hamburger svg {
  /* The size of the SVG defines the overall size */
  height: 2em;
  /* Define the transition for transforming the SVG */
  transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line {
  fill: none;
  stroke: #000;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  /* Define the transition for transforming the Stroke */
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line-top-bottom {
  stroke-dasharray: 12 63;
}

.hamburger input:checked + svg {
  transform: rotate(-45deg);
}

.hamburger input:checked + svg .line-top-bottom {
  stroke-dasharray: 20 300;
  stroke-dashoffset: -32.42;
}

.menu-mobile-wrapper {
  position: fixed;
  inset: 0;
  z-index: 999;
  overflow: hidden;
  max-height: 0;
  background-color: #ece9e2;
  transition: max-height 0.5s ease-in-out;
}

.menu-mobile-wrapper.show {
  max-height: 100vh;
}

@media (max-width: 1024px) {
  .menu-mobile-wrapper-inner {
    padding-top: 100px;
    display: flex;
  }
  .banner-header-menu {
    width: 100vw;
  }

  .banner-header-menu-list-inner-menu-right,
  .banner-header-menu-list-inner-menu {
    display: none;
  }
  .banner-header-menu-list-inner-logo {
    flex: 0;
  }
  .menu-mobile,
  .cart-mobile {
    display: block;
  }

  .menu-mobile-wrapper {
    display: block !important;
  }

  .menu-mobile-wrapper-inner-sub-menu {
    display: none;
  }
  .banner-header-menu #menu-header-1 {
    padding: 0;
  }
  .menu-mobile-wrapper-inner-sub-menu > .sub-menu > li,
  .banner-header-menu li {
    list-style: none;
    padding: 0 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .menu-mobile-wrapper-inner-sub-menu > .sub-menu > li:hover,
  .banner-header-menu li:hover {
    background-color: var(--primary-background);
    cursor: pointer;
  }
  .menu-mobile-wrapper-inner-sub-menu > .sub-menu > li span,
  .banner-header-menu li span {
    text-decoration: none;
    color: #000;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    line-height: 40px;
  }
  .icon-down,
  .icon-arrow {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid #000;
    border-radius: 50%;
    padding: 4px;
    margin-left: 8px;
  }

  .icon-down svg,
  .icon-arrow svg {
    width: 12px;
    height: 12px;
    color: #000;
  }

  .button-back {
    background-color: var(--primary-background);
    border: none;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    color: #000;
    width: calc(100% - 30px);
    margin: 0 15px;
    padding: 15px 0;
    border-radius: 50px;
  }

  .hide-scrollbar {
    overflow: hidden;
  }

  .menu-mobile-wrapper {
    overflow-y: scroll; /* hoặc auto nếu muốn */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
  }

  .menu-mobile-wrapper::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
  }

  .menu-mobile-dropdown-menu .menu-mobile-wrapper-inner-sub-menu ul {
    padding: 0;
  }

  .menu-mobile-wrapper-inner-sub-menu-child {
    padding: 0;
  }

  .menu-mobile-wrapper-inner-sub-menu-child li {
    list-style: none;
  }

  .menu-mobile-wrapper-inner-sub-menu-child li > span,
  .menu-mobile-wrapper-inner-sub-menu-child > li > a {
    text-decoration: none;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
    text-transform: uppercase;
  }
  .menu-mobile-wrapper-inner-sub-menu-child ul > li > a {
    color: #000;
    opacity: 0.5;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
  }

  .menu-mobile-wrapper-inner-sub-menu-child ul > li > a:hover {
    opacity: 1;
    text-decoration: underline;
  }

  .menu-down-link {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: calc(100% - 60px);
    padding: 0 30px;
  }

  .menu-mobile-wrapper-inner-sub-menu-child .menu-no-dropdown {
    padding: 0 30px;
  }
  .menu-down-link:hover,
  .menu-mobile-wrapper-inner-sub-menu-child .menu-no-dropdown:hover {
    background-color: var(--primary-background);
    cursor: pointer;
  }

  .menu-dropdown-child {
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
  }

  .menu-dropdown-child--open {
    transition: all 0.3s ease-in-out;
    overflow: hidden;
  }

  .icon-down.active svg {
    transform: rotate(-180deg);
    transition: all 0.3s ease-in-out;
  }

  .icon-down svg {
    transform: rotate(0deg);
    transition: all 0.3s ease-in-out;
  }

  .menu-mobile-img {
    margin-top: 20px;
  }
  .menu-mobile-wrapper-inner-sub-menu-child .menu-mobile-img:hover {
    background-color: transparent !important;
    cursor: pointer;
  }

  .menu-mobile-img > .menu-link > img {
    width: 100%;
    border-radius: 10px;
  }
}

@media (max-width: 766px) {
  #button-tab-2 {
    margin-top: 40px !important;
  }
}

.banner-img-product {
  overflow: hidden !important;
}

@media (max-width: 1024px) {
  .footer-wrapper {
    padding: 80px 10px 20px;
  }

  .footer-container {
    grid-template-columns: 1fr !important;
  }

  .footer-title {
    text-align: center;
  }

  .footer-form {
    width: 100%;
  }

  .footer-form button {
    width: 15%;
  }

  .footer-bottom {
    text-align: center;
  }
}

@media (max-width: 600px) {
  .footer-form button {
    width: 25%;
  }

  .icon-social {
    margin-top: 10px;
  }
}

/* Product */
.woocommerce ul.product-list {
  padding: 0 80px 0px;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  margin: 0 10px 2.992em 0;
  width: 24.4%;
}

.woocommerce ul.products li.last,
.woocommerce-page ul.products li.last {
  margin-right: 0;
}

.detail-product {
  background-color: #fff;
  border-radius: 20px;
  overflow: hidden;
}

.product-info {
  padding: 20px;
}

.product-title {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

.product-info-bottom {
  display: flex;
  align-items: center;
}
.woocommerce ul.products li.product .cart-product-link {
  margin-top: 0;
  background-color: transparent;
  border: 1px solid #000;
  border-radius: 50%;
  padding: 5px;
}

.woocommerce ul.products li.product .cart-product-link:hover {
  background-color: #000;
}

.product-info-bottom-right {
  width: 100%;
}

.woocommerce:where(body:not(.woocommerce-uses-block-theme))
  ul.products
  li.product
  .price {
  color: #000;
  font-size: 16px;
  font-weight: 600;
  margin: 0;
  padding: 0;
}

.custom-color-swatches {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.custom-color-swatches .swatch {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid #ccc;
  display: inline-block;
}

.price-product {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin-bottom: 10px;
  width: 100%;
}

.selected-color-name {
  display: block;
  line-height: 20px;
  height: 20px;
  font-size: 16px;
  font-weight: 400;
  color: #000;
  margin: 0;
  padding: 5px 0;
}

.shop-loop-header-wrapper {
  margin: 20px 80px;
  background-color: var(--primary-background);
  height: 65px;
  position: relative;
  padding: 0 20px;
  border-radius: 100px;
}

.shop-loop-header-wrapper.border-circle {
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background-color: #fff;
  transition: all 0.3s ease-in-out;
}

.shop-loop-header-wrapper > *:nth-child(-n + 3) {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.woocommerce-result-count {
  color: #4a5565;
}

.woocommerce .woocommerce-ordering {
  height: 41px;
  margin: 0;
}

.woocommerce-ordering .orderby {
  height: 100%;
  border-radius: 100px;
  background-color: transparent;
  border: 1px solid #000;
  padding: 8px 40px 8px 16px;
}

.woocommerce-ordering .orderby:hover {
  background-color: #000;
  color: #fff;
  cursor: pointer;
}

.woocommerce-ordering .orderby:hover option {
  background-color: #000;
  color: #fff;
}

select {
  -webkit-appearance: none; /* Chrome, Safari, Opera */
  -moz-appearance: none; /* Firefox */
  appearance: none;
}

.orderby-wrapper {
  position: relative;
  height: 100%;
}

.icon-orderby-down {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.orderby-wrapper:hover .icon-orderby-down {
  border: 1px solid #fff;
  color: #fff;
}

.filter-product-count {
  cursor: pointer;
}

.filter-product-count i {
  border: 1px solid #000;
  border-radius: 100px;
  padding: 5px;
  margin-right: 10px;
}

.product-image {
  margin-top: -14px;
}

.filters-wrapper {
  position: absolute;
  top: 100%;
  z-index: 99999;
  left: 0;
  width: 100%;
  opacity: 0;
  display: none;
  transition: all 0.3s ease-in-out;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.filters-wrapper.active {
  opacity: 1;
  transition: all 0.3s ease-in-out;
  display: block;
}

.yith-wcan-filters {
  margin-bottom: 0;
}

.yith-wcan-filters .yith-wcan-filter {
  margin-bottom: 0;
}

.filter-title {
  margin-bottom: 10px;
}

.filters-wrapper .filters-container > form {
  display: flex;
  justify-content: space-around;
}

.filters-container {
  padding: 20px 20px 40px;
}

.yith-wcan-reset-filters {
  position: absolute;
  bottom: 10px;
  border: 1px solid #000;
  background-color: transparent;
  border-radius: 50px;
  padding: 10px 25px;
}

.yith-wcan-reset-filters:hover {
  background-color: #000;
  color: #fff;
  cursor: pointer;
  border: 1px solid #fff;
}

div[data-taxonomy="filter_size"] .filter-item {
  width: 24px;
  height: 24px;
}

/* Pagination */

.woocommerce nav.pagination-product {
  margin-bottom: 20px;
}

.woocommerce nav.pagination-product ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border: none;
}

.woocommerce nav.pagination-product ul li {
  border: 1px solid #000;
  border-radius: 50%;
}
.woocommerce nav.pagination-product ul li span.current,
.woocommerce nav.pagination-product ul li a:hover,
.woocommerce nav.pagination-product ul li:hover {
  background-color: #000;
  color: #fff;
}

.pagination-product
  .woocommerce-LoopProduct-link.woocommerce-loop-product__link {
  padding: 0;
}

/* Banner tag product */
.banner-tag-product {
  padding: 10px;
  background: #ffe;
  margin-bottom: 20px;
  position: relative;
}

.banner-tag-product img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}

.banner-tag-product-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.banner-tag-product-content .banner-tag-product-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
  margin: 0;
  padding: 0;
}
.banner-tag-product-content .banner-tag-product-description {
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
  padding-top: 10px;
  width: 50%;
}

.term-description {
  display: none;
}

.breadcrumbs-container {
  margin-top: 10px;
}
.breadcrumbs-container span,
.breadcrumbs-container a {
  color: #fff;
  text-decoration: none;
}

.breadcrumbs-container a:hover {
  text-decoration: underline;
  cursor: pointer;
}

.footer-top {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  padding: 20px;
  border-radius: 20px;
  min-height: 240px;
}

.footer-card {
  background-color: #fff;
  padding: 32px;
  border-radius: 20px;
  font-family: "Roboto", sans-serif;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.footer-card h2 {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
}

.footer-card p {
  padding-top: 20px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
  text-transform: none;
  color: #000;
  text-decoration: none;
}

.product-tags {
  position: absolute;
  top: 0;
  left: 0;
}

.product-first-tag {
  padding: 6px 10px;
  margin: 10px;
}

.product-first-tag span {
  color: #000;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  text-transform: uppercase;
  text-decoration: none;
  background: var(--primary-background);
  padding: 5px 10px;
  border-radius: 20px;
}

.product-wrapper-single-product {
  margin-top: 100px;
  margin-bottom: 25px;
}

.swiper-content-single-product {
  width: 100%;
  height: 100%;
}

.product-list-single-product .swiper-slide {
  text-align: center;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  width: 760px !important;
  height: 440px;
  justify-content: center;
  align-items: center;
}

.swiper-button-single-product {
  border: 1px solid #000;
  border-radius: 50%;
  cursor: pointer;
  background-color: #fff;
  color: #000;
  width: 40px;
  display: none;
}

.product-list-single-product .swiper-button-prev:after,
.product-list-single-product .swiper-button-next:after {
  font-size: 16px;
}

.product-wrapper-single-product:hover .swiper-button-single-product {
  display: inline-flex;
}

.product-info-single-product {
  padding-left: 26px;
}

.product-info-single-product-title-text {
  font-size: 30px;
  font-weight: 600;
  line-height: 40px;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
}

.product-info-single-product {
  display: flex;
  flex-direction: column;
  align-self: flex-end;
  gap: 10px;
}

.product-info-left {
  display: flex;
  gap: 10px;
  align-items: end;
}

.product-info-single-product-price-text {
  font-size: 20px;
  font-weight: 400;
}

.product-info-single-product-price-text del span {
  opacity: 0.5;
}

.product-info-single-product-price-text ins span {
  color: #9c0f0f;
}

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

.product-info-single-product-description-text {
  margin: 0;
}

.product-info-single-product-rating {
  display: flex;
}

.summary.entry-summary {
  padding-right: 10px;
}

.my-swatch-container {
  background-color: #fff;
  padding: 20px;
  border-radius: 20px;
}

.reset_variations {
  display: none !important;
}

.woocommerce div.product form.cart {
  margin: 0;
}

.product-tab-color-text {
  margin: 0;
  font-size: 14px;
  text-decoration: underline;
  cursor: pointer;
}

.woocommerce div.product form.cart .variations {
  margin-bottom: 0;
}

.color-content-product {
  margin: 10px 0;
}

.xoo-wsc-sc-bki {
  font-size: 20px;
}

span.xoo-wsc-sc-count {
  top: -10px;
}

.product-info-single-product-option {
  padding: 0 10px;
}

.product-info-single-product-option-item {
  padding: 32px 40px 36px;
  background-color: #fff;
  border-radius: 20px;
  position: relative;
}

.product-info-single-product-option-item-button {
  background-color: transparent;
  outline: none;
  border: none;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #000;
  text-decoration: underline;
}

.product-info-single-product-option-item {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.product-info-single-product-option-item-select-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}

.product-info-single-product-option-item-select {
  width: 260px;
  padding: 8px 16px;
  border: 1px solid #000;
  border-radius: 20px;
  outline: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: #000;
}

.product-info-single-product-option-item-select.active,
.product-info-single-product-option-item-select:hover {
  background-color: #000;
  color: #fff;
}

.product-info-single-product-option-item-select-option {
  position: absolute;
  bottom: 120%;
  left: 0;
  right: 0;
  z-index: 1000;
  border: 1px solid #000;
  border-radius: 20px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: #000;
  cursor: pointer;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 0;
  transition: all 0.5s ease-in-out;
  display: none;
}

.product-info-single-product-option-item-select-option.show {
  max-height: 100vh;
  transition: all 0.5s ease-in-out;
  display: inline-flex;
}
.product-info-single-product-option-item-select-option span {
  font-size: 14px;
}

.product-info-single-product-option-item-select-option-list {
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.product-info-single-product-option-item-select-option-list li {
  list-style: none;
  width: 40px;
  height: 40px;
}

.product-info-single-product-option-item-select-option-list li:hover {
  background-color: #57575730;
}

.product-info-single-product-option-item-select-option-list button {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  cursor: pointer;
  background-color: transparent;
  border: 1px solid #cdcdcd;
  padding: 0;
  font-weight: 500;
}

.size-chart-product {
  text-decoration: underline;
}

.size-chart-product,
.size-chart-product-description {
  font-size: 14px;
  line-height: 20px;
  color: #000;
  opacity: 0.5;
  cursor: pointer;
}

.size-product-item.active button {
  background-color: #000;
  color: #fff;
}

.hidden-button {
  display: none;
}

[swatches-attr="attribute_pa_size"] > div,
[swatches-attr="attribute_pa_size-shoe"] > div {
  display: none;
}

.button-add-to-cart-product {
  background-color: #000 !important;
  color: #fff !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-transform: uppercase !important;
  width: 342px !important;
  border-radius: 20px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
}

.button-add-to-cart-product:hover {
  background-color: #fff !important;
  color: #000 !important;
  border: 1px solid #000 !important;
}

.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
  width: 42%;
}

.notice-free-shipping {
  position: absolute;
  bottom: 11px;
  right: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.notice-free-shipping-text {
  font-size: 14px;
}

.notice-free-shipping-circle {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #000;
  display: inline-block;
}

.my-swatch-container span.price {
  color: #000 !important;
}

.my-swatch-container .single_variation_wrap {
  margin-top: 10px;
}

.woocommerce-Tabs-panel.woocommerce-Tabs-panel--description.panel.entry-content.wc-tab
  > h2,
.tabs.wc-tabs {
  display: none;
}
.icon-play,
.icon-pause {
  cursor: pointer;
}

.icon-play {
  display: none;
}

.made-to-move {
  background-image: linear-gradient(to right, #ffffff 0%, #ffffff 100%);
  background-repeat: no-repeat;
  background-size: 0% 100%; /* Bắt đầu với 0% chiều rộng */
  transition: background-size 0.1s linear;
}

.made-to-move span {
  mix-blend-mode: difference;
}

.position-title-center {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.animation-single-product-inner {
  position: relative;
}

.animation-single-product-video {
  border-radius: 24px;
}

.animation-single-product-content {
  position: absolute;
  margin: auto;
  max-width: 65vh;
  width: 50%;
  inset: 0;
  height: fit-content;
}

.cr-ajax-reviews-cus-images-div {
  display: none;
}

.swiper-button-block {
  display: none;
}

.related-products-wrapper {
  padding: 0 10px;
}

.related-products-wrapper-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.swiper-button {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  border: 1px solid #000;
  border-radius: 50%;
  padding: 0 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
}

.swiper-button-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.swiper-button-wrapper .swiper-button:after {
  font-size: 20px !important;
}

.swiper-button:hover {
  background-color: #000;
  color: #fff;
  border: 1px solid #000;
}

/* CSS for plugin */
.yith-wcwl-add-to-wishlist-button {
  top: 40px !important;
}

.cfvsw-more-link {
  display: none !important;
}

.product-list .star-rating {
  display: none !important;
}

.products.product-list.columns-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.woocommerce .products ul::after,
.woocommerce .products ul::before,
.woocommerce ul.products::after,
.woocommerce ul.products::before {
  display: none !important;
}

.products.product-list li {
  width: 100% !important;
}

.product-info-single-product-wrapper-mobile {
  display: none;
}

.product-list .product-info {
  padding: 10px;
}

.related.products.related-products-wrapper .star-rating {
  display: none;
}

/* CSS for checkout page */
.checkout-page {
  padding-top: 100px;
}

.form-checkout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  width: 80%;
  margin: 0 auto;
  margin-bottom: 20px;
}

.checkout-info {
  width: 100%;
}

.form-row-wide input,
.form-row-last input,
.form-row-first input {
  padding: 11px !important;
}

.field_country,
.field_city {
  clear: none !important;
  width: 47%;
}

.field_country {
  float: left;
}
.field_city {
  float: right;
}

.form-row {
  height: 48px;
  padding: 0;
  margin: 0;
}

.form-row span {
  height: 100%;
  display: block;
}

.form-row span span,
.form-row span input {
  height: 100% !important;
}

.form-row span span .select2-selection__rendered {
  line-height: 2 !important;
}

.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
  display: none;
}

.title-info {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
}

dd.variation-Sizeshoe {
  display: math;
}

.checkout-right {
  background: #ebe8e1;
  padding: 0 20px 20px;
  border-radius: 20px;
}

.woocommerce-privacy-policy-text p {
  margin: 0;
}

.woocommerce form .checkout-left .form-row {
  margin-bottom: 30px !important;
}

.form-row.place-order {
  display: inline-table;
}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  float: left;
  width: 100%;
  margin-top: 10px;
  background-color: #000;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  border-radius: 24px;
}

.woocommerce #payment #place_order:hover,
.woocommerce-page #payment #place_order:hover {
  background-color: #fff;
  color: #000;
  border: 1px solid #000;
}

.woocommerce-checkout #payment {
  border-radius: 20px;
}

/* CSS for thankyou page */
.thankyou-page {
  width: 90%;
  margin: 0 auto;
  background-color: #fff;
  padding: 24px;
  border-radius: 20px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.woocommerce ul.order_details::after,
.woocommerce ul.order_details::before {
  display: none;
}

.thankyou-info-detail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0;
}

.bacs_details li,
.thankyou-info-detail li {
  text-transform: capitalize !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
}

.bacs_details li,
.thankyou-info-detail li {
  border-right: none !important;
  font-size: 16px !important;
}
.bacs_details li p,
.thankyou-info-detail li p {
  margin: 10px 0;
}

.bacs_details li p .order-number,
.bacs_details li p > span:first-child,
.thankyou-info-detail li p > span:first-child {
  font-weight: 600;
  text-transform: uppercase !important;
}

.woocommerce-thankyou-order-received {
  font-size: 24px;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 20px;
}

.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-bacs-bank-details .wc-bacs-bank-details-heading {
  border-bottom: 2px solid #c6a664;
  padding-bottom: 10px;
}

.bacs_details {
  padding: 0;
}

.bacs_details li {
  float: none !important;
}

.bacs_details li:not(:last-child) {
  margin-bottom: 18px;
}

.bacs_details li strong {
  display: inline-block !important;
}

.th-title-order-details {
  background-color: #c6a664;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 10px 20px;
}

.order_item > td > a {
  color: #b24d4d;
  text-decoration: none;
}

.order_item > td > a:hover {
  color: #7a2e2e;
}

.billing-address {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
}

.billing-address span {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: #000;
  text-decoration: none;
}

.note-payment {
  text-transform: lowercase !important;
  font-size: 12px !important;
  font-style: italic !important;
}

.note-payment strong {
  font-size: 16px !important;
}

/* Cart page */
.cart-table-wrapper thead tr th {
  background: #c6a664;
  color: #fff;
  font-size: 16px;
  border-right: 1px solid #fff;
}

dt.variation-Color,
dt.variation-Sizeshoe {
  float: left !important;
  clear: both !important;
  padding-right: 5px !important;
}

.variation-Color p,
.variation-Sizeshoe p {
  font-weight: 400 !important;
}

.cart-page-wrapper {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 15px;
  padding: 50px 20px 0;
  box-sizing: border-box;
  width: 90%;
  margin: 0 auto;
}

.cart-table-wrapper,
.cart-checkout-wrapper {
  background: #fff;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
  padding: 20px;
  border-radius: 20px;
}

.cart-checkout-wrapper .cart_totals {
  float: none !important;
  width: 100% !important;
  margin-bottom: 20px;
}

.cart-checkout-wrapper .cart-totals-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 10px;
  color: #000;
  text-decoration: none;
}

.proceed-to-checkout-wrapper a {
  background-color: #000 !important;
  color: #fff;
  border-radius: 50px !important;
  border: 1px solid #000 !important;
}

.proceed-to-checkout-wrapper a:hover {
  background-color: #fff !important;
  color: #000 !important;
  border: 1px solid #000 !important;
}

.woocommerce-remove-coupon {
  position: relative;
  color: red;
  text-decoration: none;
  font-size: 0; /* Ẩn chữ */
}

.woocommerce-remove-coupon::before {
  padding-left: 10px;
  content: "\f1f8"; /* hoặc dùng Font Awesome */
  font-family: "Font Awesome 7 Free";
  font-size: 14px;
  color: red;
  font-weight: 900;
}

.cart-item-name {
  color: #b24d4d;
  text-decoration: none;
}

.cart-actions-wrapper .coupon {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  height: 38px;
}

.cart-actions-wrapper .coupon input[name="coupon_code"] {
  width: 100% !important;
  height: 100% !important;
  border-radius: 5px !important;
  
}

.cart-actions-wrapper .coupon button {
  width: 30% !important;
  height: 100% !important;
  border-radius: 5px !important;
  background-color: #e5e2dd;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.cart-actions-wrapper .coupon button:hover {
  background-color: #caa865;
}

/* Account page Order*/
.account-page{
  padding-top: 100px;
}

.account-page .woocommerce{
  width: 80%;
  margin: 0 auto;
}

.account-content-wrapper,
.account-menu-wrapper{
  background-color: #fff;
  padding: 20px;
  border-radius: 20px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.account-menu-list li{
  list-style: none;
  line-height: 2;
  padding: 10px;
  cursor: pointer;
  border-radius: 20px;
  
}
.account-menu-list li:hover{
  background-color: #c3b59c;
}
.account-menu-list li:hover .account-menu-item{
  color: #fff;
}

.account-menu-list .account-menu-item{
  width: 100%;
  display: block;
  text-decoration: none;
  color: #000;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  text-decoration: none;
}

.account-dashboard-title{
  margin-bottom: 10px;
}

.my-address-title a,
.account-orders-table .order-number-link,
.account-dashboard-title a{
  color: #b24d4d;
  text-decoration: none;
}

.my-address-title a:hover,
.account-orders-table .order-number-link:hover,
.account-dashboard-title a:hover{
  color: #7a2e2e;
  text-decoration: underline;
}

.status-completed {
  background-color: #00ff00; /* xanh lá tươi */
  color: #000; /* chữ đen */
}

.status-on-hold {
  background-color: #ffcc00; /* vàng */
  color: #000;
}

.status-processing {
  background-color: #3399ff; /* xanh dương */
  color: #fff;
}

.status-cancelled {
  background-color: #ff4d4d; /* đỏ nhạt */
  color: #fff;
}

.status-refunded {
  background-color: #999999; /* xám */
  color: #fff;
}

.account-details-submit button,
.action-view-order{
  background-color: #666 !important; 
  color: white !important;
  border-radius: 5px;
}

.account-details-submit button:hover,
.action-view-order:hover{
  background-color: #4d4d4d !important;
}

.status-completed,
.status-on-hold,
.status-processing,
.status-cancelled,
.status-refunded{
  padding: 3px 10px;
  border-radius: 5px;
  font-weight: 600;
}


.my-address-title{
  display: flex;
  align-items: center;
  margin:15px 0 10px 0;
}

.my-address-title a{
  margin-left: auto;
}

.u-column2 .billing-address{
  display: inline-block;
}

#account_display_name_description {
  display: none !important;
}

.account-details-submit{
  margin-top: 10px;
  text-align: end;
}

/* -------------------------------------------------------Wishlist---------------------------------------------------------- */

.wishlist-wrapper{
  padding-top: 100px;
  width: 85%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 3fr;
  gap: 15px;
}

.wishlist_table.wishlist_view{
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
  border-radius: 20px;
  margin-bottom: 0 !important;
}

.wishlist-icon-link {
  text-decoration: none;
  padding: 0 5px;
}

.wishlist-icon-link i{
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #000;
}

.wishlist_table.wishlist_view thead tr th{
  background-color: #c6a664;
  color: #fff;
  font-size: 16px;
  border-right: 1px solid #fff;
}

.wishlist-items-wrapper td a{
  color: #b24d4d;
  text-decoration: none;
  font-size: 16px;
}
.wishlist-items-wrapper td a:hover{
  color: #7a2e2e;
  text-decoration: underline;
}

.wishlist-items-wrapper td span{
  font-size: 16px;
  color: #000;
  font-weight: 600;
}

.woocommerce-MyAccount-navigation-link{
  margin-bottom: 5px;
}

.woocommerce-MyAccount-navigation-link.is-active{
  background-color: #c3b59c;
}

.woocommerce-MyAccount-navigation-link.is-active a{
  color: #fff;
}

#yith-wcwl-form{
  width: 100%;
  border-radius: 24px;
  overflow: hidden;
}
/* -------------------------------------------------------Wishlist---------------------------------------------------------- */

.img-rerun img{
  aspect-ratio: 10/7;
  object-fit: cover;
}
/* ----------------------------
/* Responsive */
@media (max-width: 1024px) {
  .products.product-list.columns-4 {
    grid-template-columns: repeat(3, 1fr);
    padding: 0 50px;
  }

  .product-info-single-product-option-item {
    flex-direction: column;
  }

  .form-checkout {
    width: 100%;
    padding: 24px;
    box-sizing: border-box;
  }

  .wishlist-wrapper{
    grid-template-columns: 1fr 2fr;
  }
}

@media (max-width: 768px) {
  .products.product-list.columns-4 {
    grid-template-columns: repeat(2, 1fr);
    padding: 0 20px;
  }

  .shop-loop-header-wrapper {
    margin: 10px;
  }

  .banner-tag-product-content {
    bottom: 10px;
    left: 10px;
    top: unset;
    right: unset;
    transform: unset;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    padding: 24px;
    width: auto;
  }

  .banner-tag-product-content .banner-tag-product-description {
    width: 100%;
  }

  .product-info-single-product-wrapper {
    display: none;
  }

  .product-info-single-product-option-wrapper {
    width: 100% !important;
    padding: 0 10px;
  }

  .product-info-single-product-wrapper-mobile {
    display: block;
  }

  .product-info-left {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
  }

  .product-info-single-product {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
    padding: 10px;
  }

  .product-info-single-product-option-item-select-wrapper,
  .product-info-single-product-option-item {
    flex-direction: column;
  }
  .woocommerce div.product form.cart .button,
  .product-info-single-product-option-item-select-wrapper,
  .product-info-single-product-option-item-select,
  .add-to-cart-custom {
    width: 100% !important;
  }

  .product-info-single-product-option-item-select {
    padding: 8px 0;
  }

  .footer-top {
    grid-template-columns: 1fr;
  }

  .checkout-page {
    padding-top: 50px;
  }

  .form-checkout {
    width: 100%;
    padding: 24px;
    box-sizing: border-box;
    grid-template-columns: 1fr;
  }

  .thankyou-info-detail {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
  }

  .billing-address {
    grid-template-columns: 1fr 1fr;
  }

  .billing-address p {
    margin: 2px 0;
  }

  .account-content-wrapper{
    margin-top: 10px;
  }

  .wishlist-wrapper{
    grid-template-columns: 1fr;
  }

  .wishlist_table.wishlist_view{
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
    padding: 10px;
  }
}

@media (max-width: 600px) {
  .product-info-single-product {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    padding: 10px;
  }

  .billing-address {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .products.product-list.columns-4 {
    grid-template-columns: repeat(1, 1fr);
    padding: 0 10px;
  }

  .form-checkout {
    padding: 10px;
  }

  .field_country,
  .field_city,
  .woocommerce-page form .form-row-last,
  .woocommerce-page form .form-row-first {
    width: auto;
    float: none;
  }
}