@import url("variables.css");

.overlay-content {
  background: rgba(0, 0, 0, 0.2);
  border-radius: 15px;
}

.overlay-content .text-overlay {
  font-size: 24px;
  font-weight: 800;
}

.overlay-content .btn-upto {
  color: var(--text-color);
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
}

/* ----------------------
  EXTRA SMALL - xxs (<380px)
-----------------------*/
@media (max-width: 379.98px) {
  .title-section-home,
  .title-section {
    font-size: 16px !important;
  }
  .text-fs-20 {
    font-size: 15px !important;
  }
  .text-fs-15 {
    font-size: 12px !important;
  }
  .overlay-text {
    font-size: 12px;
  }
  .btn-discover {
    font-size: 16px !important;
    height: 40px !important;
  }
  .product-fomo .product-title {
    font-size: 16px;
  }
  .btn-outline-custom {
    font-size: 13px;
  }
  .btn-see-more {
    font-size: 11px !important;
  }
  .testimonial-card .name {
    font-size: 13px !important;
  }
  .certificate-swiper h6 {
    font-size: 13px;
  }
  .sub-section .sub-title {
    font-size: 16px !important;
  }
  .footer-style h6 {
    font-size: 15px !important;
  }
  .footer-style .payments a img {
    height: 25px !important;
  }
  .btn-h-45 {
    height: 35px !important;
  }
  .btn-h-50 {
    height: 38px !important;
  }

  .card-custom .card-body p {
    font-size: 13px !important;
  }
  .card-custom .card-body .price-sale {
    font-size: 14px !important;
  }

  /* Cart */
  .cart-card .cart-image {
    width: 120px !important;
  }
  .cart-title h5 {
    font-size: 12px !important;
  }
  .cart-meta li,
  .cart-meta li span {
    font-size: 9px !important;
  }
  .cart-price .price-sale {
    font-size: 13px !important;
  }
  .payments .payments-icon img {
    height: 23px !important;
  }
  .cart-card,
  .summary-card {
    padding: 12px !important;
  }
}

/* ----------------------
  SMALLER XS (380–479px)
-----------------------*/
@media (min-width: 380px) and (max-width: 429.98px) {
  .overlay-text {
    padding: 5px 0 !important;
    font-size: 14px !important;
  }
  .title-section-home,
  .title-section {
    font-size: 18px !important;
  }
  .sub-section .sub-title {
    font-size: 18px !important;
  }
  .footer-style h6 {
    font-size: 15px !important;
  }
  .footer-style .payments a img {
    height: 27px !important;
  }
  .btn-discover {
    font-size: 15px !important;
    height: 40px !important;
  }
  .btn-outline-custom {
    font-size: 14px;
  }
  .testimonial-card .name {
    font-size: 15px !important;
    font-weight: 600 !important;
  }
  .certificate-swiper h6 {
    font-size: 14px;
  }
  .btn-h-45 {
    height: 36px !important;
  }
  .btn-h-50 {
    height: 36px !important;
  }
  .card-custom .card-body p {
    font-size: 14px !important;
  }
  .card-custom .card-body .price-sale {
    font-size: 14px !important;
  }

  /* Cart */
  .cart-price .price-sale {
    font-size: 13px !important;
  }
  .cart-title h5 {
    font-size: 12px !important;
  }
  .cart-meta li,
  .cart-meta li span {
    font-size: 9px !important;
  }
  .cart-card .cart-image {
    width: 120px !important;
  }
  .payments .payments-icon img {
    height: 25px !important;
  }
  .cart-card,
  .summary-card {
    padding: 13px !important;
  }
}

@media (min-width: 430px) and (max-width: 479.98px) {
  .overlay-text {
    padding: 5px 0 !important;
    font-size: 14px !important;
  }
  .title-section-home,
  .title-section {
    font-size: 20px !important;
  }
  .sub-section .sub-title {
    font-size: 20px !important;
  }
  .footer-style h6 {
    font-size: 16px !important;
  }
  .footer-style .payments a img {
    height: 30px !important;
  }
  .btn-discover {
    font-size: 15px !important;
    height: 38px !important;
  }
  .btn-outline-custom {
    font-size: 14px;
  }
  .testimonial-card .name {
    font-size: 15px !important;
    font-weight: 600 !important;
  }
  .certificate-swiper h6 {
    font-size: 16px;
  }

  .btn-h-45 {
    height: 40px !important;
  }
  .btn-h-50 {
    height: 40px !important;
  }

  /* Cart */
  .cart-card .cart-image {
    width: 140px !important;
  }
  .cart-title h5 {
    font-size: 13px !important;
  }
  .cart-meta li,
  .cart-meta li span {
    font-size: 10px !important;
  }
  .cart-price .price-sale {
    font-size: 15px !important;
  }
  .payments .payments-icon img {
    height: 28px !important;
  }
  .cart-card,
  .summary-card {
    padding: 15px !important;
  }
}

/* ----------------------
  XS (480–575.98px)
-----------------------*/
@media (min-width: 480px) and (max-width: 575.98px) {
  .overlay-text {
    padding: 5px 0;
    font-size: 14px;
  }
  .title-section-home,
  .title-section {
    font-size: 20px !important;
  }
  .sub-section .sub-title {
    font-size: 20px !important;
  }
  .footer-style h6 {
    font-size: 16px !important;
  }
  .footer-style .payments a img {
    height: 30px !important;
  }
  .btn-discover {
    font-size: 16px;
    height: 40px;
  }
  .testimonial-card .name {
    font-size: 15px !important;
    font-weight: 600 !important;
  }

  .btn-h-45 {
    height: 40px !important;
  }
  .btn-h-50 {
    height: 40px !important;
  }

  /* Cart */
  .cart-card .cart-image {
    width: 140px !important;
  }
  .cart-title h5 {
    font-size: 13px !important;
  }
  .cart-meta li,
  .cart-meta li span {
    font-size: 10px !important;
  }
  .cart-price .price-sale {
    font-size: 15px !important;
  }
  .payments .payments-icon img {
    height: 28px !important;
  }
  .cart-card,
  .summary-card {
    padding: 15px !important;
  }
}

/* ----------------------
  MOBILE DEFAULT: <576px
-----------------------*/
@media (max-width: 575.98px) {
  /* .title-section-home,
  .title-section {
    font-size: 20px !important;
  } */
  .card-custom .card-body {
    padding: 9px !important;
  }
  .card-custom .card-body p {
    margin-bottom: 2px !important;
  }
  .card-custom .card-body .text-sale {
    font-size: 10px !important;
  }
  .card-custom .card-body h6 {
    margin-bottom: 0 !important;
  }
  .xs-text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .xs-text-truncate-4 {
    display: -webkit-box;
    -webkit-line-clamp: 4 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .overlay-text {
    padding: 5px 0 !important;
    font-size: 14px !important;
  }
  .category-slide::after {
    border-radius: 0 0 10px 10px !important;
    height: 20px !important;
  }
  .category-nav {
    width: 25px !important;
    height: 25px !important;
  }
  /* .btn-h-45 {
    height: 40px !important;
  }
  .btn-h-50 {
    height: 40px !important;
  } */
  .collection-section {
    background-image: url("../images/collection-section.png") !important;
  }
  .collection-section .collection-title {
    font-size: 20px !important;
  }
  .testimonial-card {
    padding: 10px !important;
  }
  .testimonial-card .name {
    font-size: 15px;
    font-weight: 600;
  }
  .testimonial-card .location,
  .testimonial-card .text {
    font-size: 10px !important;
  }
  .testimonial-card .stars-icon > img {
    height: 17px !important;
  }
  .trustpilot-logo h3 {
    text-align: left !important;
  }
  .trustpilot-section .trustpilot-logo img {
    max-width: 127px !important;
  }
  .trustpilot-section .testimonial-navigation {
    top: -45px !important;
    right: 15px !important;
  }
  .news-navigation .btn-nav,
  .trustpilot-section .testimonial-navigation .btn-nav {
    width: 24px !important;
    height: 24px !important;
  }
  .news-navigation {
    top: -40px !important;
    right: 15px !important;
  }
  .certificate {
    margin: 10px 0 !important;
  }
  .sub-section {
    background-image: url("../images/banner-sub-mobile.png") !important;
    height: fit-content !important;
    padding: 12px !important;
  }
  /* .sub-section .sub-title {
    font-size: 20px !important;
  } */
  .sub-section .sub-desc {
    font-size: 14px !important;
  }
  .sub-section .sub-form {
    max-width: 269px !important;
  }
  .sub-section .sub-form > input,
  .sub-section .sub-form > button {
    height: 40px !important;
  }
  /* .footer-style .payments a img {
    height: 30px !important;
  } */

  /* Product */
  .product-fomo .product-title {
    font-size: 20px !important;
  }

  /* Checkout Success */
  .thanks-section {
    background-image: url("../images/bg-checkout-success.png") !important;
  }
  .thanks-section .thanks-title {
    font-size: 20px !important;
  }
  .thanks-section .thanks-icon {
    max-width: 70px !important;
  }
  .thanks-section .thanks-text {
    font-size: 13px !important;
    text-align: center !important;
  }

  /* Checkout */
  .checkout-container .order-img {
    width: 120px !important;
    height: 120px !important;
  }
  .checkout-container .order-title {
    font-size: 13px !important;
  }
  .checkout-container .checkout-meta {
    font-size: 10px !important;
  }
  .checkout-container .btn-paypal {
    font-size: 20px !important;
  }
  .checkout-form-control h5 {
    font-size: 18px;
  }

  /* Blog Detail */
  .breadcrumb-style ol li {
    font-size: 13px !important;
  }
  .breadcrumb-style ol li a {
    font-size: 13px !important;
  }
  .blog-detail h2 {
    font-size: 16px !important;
  }
  .blog-detail .meta-data {
    font-size: 13px !important;
  }
  .blog-detail .detail-text {
    font-size: 13px !important;
  }

  /* Blog */
  .blog-card {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  }
  #blog-container .blog-card .blog-title {
    font-size: 15px !important;
  }
  #blog-container .blog-card .blog-meta {
    font-size: 13px;
  }
  #blog-container .blog-card .blog-desc {
    font-size: 13px !important;
  }

  /* Introduce */
  .introduce-content p {
    font-size: 12px !important;
  }
  .introduce-content h3 {
    font-size: 20px !important;
  }

  /* Product Detail */
  .product-detail .product-detail-right {
    margin-top: 10px !important;
  }
  .product-detail .product-name {
    font-size: 20px !important;
  }
  .product-detail .price-sale {
    font-size: 25px !important;
  }
  .product-detail .price-origin {
    font-size: 15px !important;
  }
  .product-detail .delivery-text {
    font-size: 12px !important;
  }
  .product-detail .stars-icon img {
    height: 18px !important;
  }
  .product-detail .custom-tab .nav-link {
    padding: 6px 14px !important;
  }
  .product-detail .secure-checkout-label {
    position: absolute;
    top: -12px;
    left: 36%;
    transform: translateX(-25%);
    padding: 0 10px;
    font-size: 15px !important;
  }
  .product-detail .secure-checkout-box {
    padding-top: 32px;
    padding-bottom: 20px;
  }
  .product-detail .payments-icon img {
    height: 30px !important;
  }
  .product-detail .gallery-nav {
    width: 26px !important;
    height: 26px !important;
  }
  .product-detail .gallery-nav .bi {
    font-size: 12px;
  }

  /* Cart */
  /* .cart-card .cart-image {
    width: 140px !important;
  } */
  /* .cart-title h5 {
    font-size: 13px !important;
  } */
  /* .cart-meta li,
  .cart-meta li span {
    font-size: 10px;
  } */
  /* .payments .payments-icon img {
    height: 28px !important;
  } */
  /* .cart-card,
  .summary-card {
    padding: 15px !important;
  } */
  .cart-delivery {
    font-size: 10px !important;
  }
  .cart-delivery img {
    width: 12px !important;
    height: 10px !important;
  }
  .checkout-btn span {
    font-size: 15px !important;
  }
  .checkout-btn img {
    width: 16px !important;
    height: 16px !important;
  }
  .secure-note span {
    font-size: 13px;
  }
  .secure-note img {
    width: 20px !important;
    height: 20px !important;
  }

  .summary-payment-methods img {
    height: 30px !important;
  }
  /* .cart-price .price-sale {
    font-size: 15px !important;
  } */
  .cart-price .price-origin {
    font-size: 10px !important;
  }
  .vertical-rounded-bar::before {
    bottom: 5px !important;
  }
  .vertical-rounded-bar {
    height: 50px !important;
  }

  .cart-quantity {
    width: 85px !important;
    height: 24px !important;
    font-size: 13px !important;
  }
  .cart-quantity input {
    font-size: 13px !important;
  }
  .cart-quantity .bi {
    font-size: 12px !important;
  }
  .cart-quantity .bi:hover,
  .cart-quantity .bi:active {
    color: #fff !important;
  }
  .cart-quantity .btn {
    width: 28px !important;
  }
  .qty-custom .btn-left {
    border-radius: 8px 0 0 8px !important;
  }
  .qty-custom .btn-right {
    border-radius: 0 8px 8px 0 !important;
  }
  .cart-popup .btn {
    padding: 8px 10px !important;
    font-size: 13px;
  }
  .cart-popup h5 {
    font-size: 14px !important;
  }
  .cart-popup p {
    font-size: 12px !important;
    margin-bottom: 10px !important;
  }
  .cart-remove i {
    font-size: 15px !important;
  }
  .custom-select-wrapper {padding: 0 10px;}
  .custom-select-wrapper label, .custom-select-wrapper select {font-size: 12px;}
}

/* ----------------------
  SM (576–599.98px)
-----------------------*/
@media (min-width: 576px) and (max-width: 599.98px) {
}

/* ----------------------
  SM+ (600–767.98px)
-----------------------*/
@media (min-width: 600px) and (max-width: 767.98px) {
}

/* ----------------------
  TABLET (768–991.98px)
-----------------------*/
@media (min-width: 768px) and (max-width: 991.98px) {
}

/* ----------------------
  DESKTOP (992–1199.98px)
-----------------------*/
@media (min-width: 992px) and (max-width: 1199.98px) {
  /* Laptop nhỏ */
}

/* ----------------------
  DESKTOP XL (1200–1399.98px)
-----------------------*/
@media (min-width: 1200px) and (max-width: 1399.98px) {
  /* Desktop vừa */
}

/* ----------------------
  DESKTOP XXL (≥1400px)
-----------------------*/
@media (min-width: 1400px) {
  /* Desktop lớn */
}