.btn-auth {
  text-decoration: none;
  padding: 8px 24px;
  border-radius: 50px;
  font-weight: bold;
  font-size: 14px;
  transition: all 0.3s ease;
}

.btn-login {
  color: #555;
  background: transparent;
}
.btn-login:hover {
  color: #000;
}

.btn-register {
  background: linear-gradient(45deg, #ff00cc, #333399);
  color: white;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.btn-register:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
.site-branding-area1 {
  width: 100%;
  padding: 5px 0;
}

/* CHỈ CẦN DÁN ĐOẠN NÀY VÀO CUỐI FILE style.css HOẶC THAY THẾ ĐOẠN CŨ */

.container1 {
  width: 100%; /* hoặc 100% nếu muốn full */ /* rộng tối đa */
  margin: 0 auto; /* căn giữa, KHÔNG dùng margin-left: 130px nữa */
  padding: 0 15px;
}

.container2 {
  width: 100%; /* hoặc 100% nếu muốn full */ /* rộng tối đa */
  margin: 0 auto; /* căn giữa, KHÔNG dùng margin-left: 130px nữa */
  padding: 0 15px;
  background-color: #ffffff;
}

.row1 {
  display: flex;
  align-items: center;
  justify-content: space-between; /* Đẩy 2 bên ra xa tối đa */
  flex-wrap: wrap;
  gap: 20px;
  width: 100%;
}

/* Bắt buộc: header-left phải ôm sát trái, header-right ôm sát phải */
.header-left {
  display: flex;
  align-items: center;
  margin: 0 0 0 103px; /* Đẩy header-right ra xa nhất có thể */
}

.header-right {
  display: flex;
  align-items: center;
  gap: 30px;
  margin: 0 auto; /* Đảm bảo dính phải */
  white-space: nowrap; /* không bị xuống dòng khi màn hình hẹp */
}

/* Nếu bạn vẫn còn logo hoặc search bị lệch thì thêm cái này */
.logo1 img {
  height: 100px;
}


.search form {
  min-width: 600px; /* bạn tự chỉnh độ rộng mong muốn */
}

/* Responsive nhẹ nhàng */
@media (max-width: 992px) {
  .header-left {
    margin-right: 0;
    width: 100%;
    justify-content: center;
  }
  .header-right {
    margin-left: 0;
    width: 100%;
    justify-content: center;
  }
  .search form {
    width: 100%;
    max-width: 500px;
  }
}

.logo1 {
  width: 100px;

}

.search {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-left: 30px;
}
.search input {
  border-radius: 20px;
  width: 500px;
}

.search button {
  background-color: #1bd172 !important;
  margin-left: 10px;
  border-radius: 20px;
  width: 100px;
  height: 40px;
}

.cart {
  margin-left: 30px;
}
.floatleft {
  float: left;
}
.floatright {
  float: right;
}
.alignleft {
  float: left;
  margin-right: 15px;
}
.alignright {
  float: right;
  margin-left: 15px;
}
.aligncenter {
  display: block;
  margin: 0 auto 15px;
}
a:focus {
  outline: 0px solid;
}
img {
  max-width: 100%;
  height: auto;
}

.rounded.product-img {
  max-width: 100%;
  height: 200px !important;
}

.fix {
  overflow: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 15px;
}
body {
  font-family: Arial, Helvetica, sans-serif;
}

.header-area {
  background: none repeat scroll 0 0 #f4f4f4;
}
.header-area a {
  color: #888;
}
.user-menu ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.user-menu li {
  display: inline-block;
}
.user-menu li a {
  display: block;
  font-size: 13px;
  margin-right: 5px;
  padding: 10px;
}
.user-menu li a i.fa {
  margin-right: 5px;
}
.header-right ul.list-inline {
  margin: 0;
  text-align: right;
}
.header-right ul.list-inline li a {
  display: block;
  padding: 9px;
}
.header-right ul.list-inline li ul a {
  padding: 5px 15px;
}
.header-right ul.list-inline li ul {
  border: medium none;
  border-radius: 0;
  left: 50%;
  margin-left: -50px;
  min-width: 100px;
  text-align: center;
}

.mainmenu-area {
  background: none repeat scroll 0 0 #fbfbfb;
  font-family: "Roboto Condensed", sans-serif;
  text-transform: uppercase;
  width: 100%;
  z-index: 999;
}

.logo h1 {
  font-size: 40px;
  margin: 30px 0;
  font-weight: 400;
}
.logo h1 a {
  color: #999;
}
.logo h1 a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.logo h1 a span {
  color: #ee5057;
}
.shopping-item {
  border: 1px solid #ddd;
  float: right;
  font-size: 18px;
  padding: 10px;
  position: relative;
}
.shopping-item a {
  color: #666;
}
.cart-amunt {
  color: #ee5057;
  font-weight: 700;
}
.logo {
  width: 30%;
}
.product-count {
  background: none repeat scroll 0 0 #ee5057;
  border-radius: 50%;
  color: #fff;
  display: inline-block;
  font-size: 10px;
  height: 20px;
  padding-top: 2px;
  position: absolute;
  right: -10px;
  text-align: center;
  top: -10px;
  width: 20px;
}
.shopping-item i.fa {
  margin-left: 15px;
}

.shopping-item:hover {
  background: none repeat scroll 0 0 #1bd172;
  border-color: #1bd172;
}
.shopping-item:hover a {
  color: #fff;
  text-decoration: none;
}
.shopping-item:hover .cart-amunt {
  color: #fff;
}
.shopping-item:hover .product-count {
  background: none repeat scroll 0 0 #000;
}

.mainmenu-area ul.navbar-nav li a {
  color: #6e6a6a;
  font-size: 20px;
  padding: 20px;
}

.mainmenu-area ul.navbar-nav li:hover a,
.mainmenu-area ul.navbar-nav li.active a {
  background: #1bd172;
  color: #fff;
}
.mainmenu-area .nav > li > a:focus {
  color: #fff;
}

.slider-area {
  width: 80%;
  position: relative;
  margin: 0 auto;
  padding: 5px;
}
/*-------------------------
[9. Block slider]
---------------------------*/
.block-slider {
  border: none;
  width: 100%;
}
.block-slider ul li {
  list-style: none;
}
.block-slider .bx-pager {
  display: none;
}
.block-slider .bx-prev,
.block-slider .bx-next {
  width: 32px;
  height: 32px;
  text-align: center;
  display: block;
  border-radius: 50%;
  font-size: 30px;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  line-height: 29px;
  -moz-transition: all 0.45s ease;
  -webkit-transition: all 0.45s ease;
  -o-transition: all 0.45s ease;
  -ms-transition: all 0.45s ease;
  transition: all 0.45s ease;
}
.block-slider img {
  width: 100%;
  height: auto;
}
.block-slider .bx-prev {
  left: 0px;
  padding-right: 3px;
}
.block-slider .bx-next {
  right: 0px;
  padding-left: 3px;
}
.block-slider:hover .bx-prev {
  left: 10px;
}
.block-slider:hover .bx-next {
  right: 10px;
}
.block-slider .bx-prev:hover,
.block-slider .bx-next:hover {
  background: #fead53;
  color: #fff;
  border-color: #fead53;
}

/*------------------
[4. Slidershow]
------------------*/

.block-slider .bx-pager {
  display: block;
  text-align: center;
}
.block-slider .bx-pager-item {
  width: 15px;
  height: 15px;
  background: #fff;
  font-size: 0;
  display: inline-block;
  border-radius: 50%;
  margin: 0 3px;
}
.block-slider .bx-pager-item a {
  width: 100%;
  height: 100%;
  background: #999;
  display: block;
  border-radius: 50%;
}
.block-slider .bx-pager-item a.active {
  background: #1bd172;
}
.block-slider .caption-group {
  position: absolute;
  top: 26%;
  right: 16%;
}
.block-slider .caption-group .title {
  margin: 0;
}
.block-slider .caption-group .subtitle {
  margin: 0;
  margin-top: 5px;
}
.block-slider .caption-group .button-radius {
  margin-top: 27px;
}
.block-slider .caption-group .primary {
  color: #1bd172;
}
.block-slider .caption-group .caption {
}

/*----------------------
[10. Block top seller ]
------------------------*/
.button-radius {
  position: relative;
  border: 1px solid #eaeaea;
  padding: 1px;
  min-height: 34px;
  background: #fff;
  display: inline-block;
  width: auto;
  line-height: 30px;
  padding-left: 40px;
  padding-right: 20px;
  margin: 0;
  color: #666666;
  -webkit-border-radius: 17px;
  -moz-border-radius: 17px;
  border-radius: 17px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  margin-top: 10px;
  font-size: 14px;
}
.button-radius .icon {
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  transition: all 1s ease-out;
  position: absolute;
  left: 2%;
  top: 2px;
  overflow: hidden;
}

.button-radius .icon:before {
  font-family: "FontAwesome";
  content: "\f105";
  font-size: 14px;
  color: #fff;
  width: 28px;
  height: 28px;
  background-color: #ee5057;
  border-radius: 90%;
  text-align: center;
  line-height: 26px;
  float: left;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  transition: all 1s ease-out;
}

.button-radius.white {
  border-color: #fff;
  color: #fff;
  background: transparent;
}
.button-radius.white .icon:before {
  background: #fff;
  color: #333;
}

.button-radius:hover .icon {
  left: 100%;
  margin-left: -30px;
}
.button-radius:hover {
  padding-left: 20px;
  padding-right: 40px;
}

.promo-area {
  background: #ffffff;
  color: #fff;
  padding: 40px 0 40px;
}

.brands-area {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
  color: #fff;
  padding: 20px 0 20px;
}

.promo-area .zigzag-bottom,
.brands-area .zigzag-bottom {
  background: #f4f4f4;
}
.single-promo {
  font-size: 25px;
  font-weight: 200;
  padding: 20px 10px;
  text-align: center;
}
.single-promo i {
  font-size: 50px;
}

.single-promo:hover {
  color: #fff;
  background: #222;
}
.promo1 {
  background: #ee9450;
}
.promo2 {
  background: #00ff80;
}
.promo3 {
  background: #fa7272;
}
.promo4 {
  background: #4a82be;
}
.section-title {
  font-family: "Raleway", sans-serif;
  font-size: 50px;
  font-weight: 100;
  margin-bottom: 50px;
  text-align: center;
}

.product-f-image {
  display: flex;
  position: relative;
  height: 270px;
  text-align: center;
  justify-content: center;
}

.product-img{
  margin-top: 20%;
  max-width: 100%;
  max-height: 68%;
}
.product-hover {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  overflow: hidden;
  border: 1px solid #ddd;
}
.product-hover:after {
  background: none repeat scroll 0 0 #000;
  content: "";
  height: 100%;
  left: -100%;
  opacity: 0.6;
  position: absolute;
  top: 0;
  width: 100%;
  transition: 0.4s;
}
.product-hover a {
  background: none repeat scroll 0 0 #1bd172;
  border-radius: 5px;
  color: #fff;
  display: block;
  font-size: 16px;
  left: 10%;
  margin: 0;
  padding: 10px;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  border: 1px solid #1bd172;
  width: 80%;
  z-index: 99;
  transition: 0.4s;
}
.product-hover a:hover {
  background: #000;
  text-decoration: none;
  border-color: #444;
}
.product-carousel-price ins {
  color: #ee5057;
  font-weight: 700;
  margin-right: 5px;
  text-decoration: none;
}
.product-hover a i.fa {
  margin-right: 5px;
}
.product-hover a.add-to-cart-link {
  top: -25%;
}
.product-hover a.view-details-link {
  bottom: -25%;
}
.single-product h2 {
  font-size: 18px;
  line-height: 25px;
  margin-bottom: 10px;
  margin-top: 15px;
}

.single-product h2 a {
  color: #222;
}
.single-product p {
  color: #ee5057;
  font-weight: 700;
}

.single-product {
  overflow: hidden;
}
.single-product:hover {
}
.single-product:hover .product-hover a.add-to-cart-link {
  top: 32%;
}
.single-product:hover .product-hover a.view-details-link {
  bottom: 32%;
}
.single-product:hover .product-hover:after {
  left: 0;
}

.product-carousel {
  padding-top: 40px;
}
.latest-product .owl-nav {
  position: absolute;
  right: 0;
  top: 0;
}

.latest-product .owl-nav div,
.related-products-wrapper .owl-nav div {
  background: #1bd172;
  color: #fff;
  display: inline-block;
  margin-left: 15px;
  padding: 1px 10px;
}
.latest-product .owl-nav div:hover,
.brand-wrapper .owl-nav div:hover,
.related-products-wrapper .owl-nav div:hover {
  color: #fff;
  background: #0b4f2c;
}
.brand-list {
  padding-top: 40px;
}
.brand-list .owl-nav {
  position: absolute;
  right: 0;
  top: 0;
}
.brand-wrapper .owl-nav div {
  border: 1px solid #fff;
  color: #fff;
  display: inline-block;
  margin-left: 15px;
  padding: 1px 10px;
}

.brand-wrapper .owl-nav div {
  background: #1bd172;
  color: #fff;
  display: inline-block;
  margin-left: 15px;
  padding: 1px 10px;
}

.maincontent-area {
  padding-bottom: 50px;
  padding-top: 20px;
}

.product-wid-title {
  font-family: raleway;
  font-size: 30px;
  font-weight: 100;
  margin-bottom: 40px;
}

.single-wid-product {
  margin-bottom: 31px;
  overflow: hidden;
}
.product-thumb {
  float: left;
  height: 90px;
  margin-right: 15px;
  width: 100px;
}
.single-wid-product h2 {
  font-size: 14px;
  margin-bottom: 12px;
}
.product-wid-rating {
  color: #ffc808;
  margin-bottom: 10px;
}
.product-wid-price ins {
  color: #ee5057;
  font-weight: 700;
  margin-right: 10px;
  text-decoration: none;
}
.single-wid-product h2 a {
  color: #222;
}
.single-wid-product h2 a:hover,
.single-product h2 a:hover {
  color: #ee5057;
}
.wid-view-more {
  background: none repeat scroll 0 0 #1bd172;
  color: #fff;
  padding: 3px 15px;
  position: absolute;
  right: 10px;
  top: 3px;
}
.wid-view-more:hover {
  color: #fff;
  background-color: #0b4f2c;
  text-decoration: none;
}
.single-product-widget {
  position: relative;
}
.product-widget-area {
  padding-bottom: 30px;
  padding-top: 30px;
}
.product-widget-area .zigzag-bottom {
  background: #f4f4f4;
}
.footer-top-area .zigzag-bottom {
  background: #f4f4f4;
}
.footer-top-area {
  background: none repeat scroll 0 0 #333;
  color: #999;
  padding: 35px 0 180px;
}

.footer-bottom-area {
  background: #000;
  color: #fff;
}
.footer-about-us span {
  color: #1bd172;
}
.footer-wid-title {
  font-family: raleway;
  font-size: 30px;
  font-weight: 100;
  color: #fff;
}

.footer-about-us h2 {
  font-weight: 200;
}
.footer-menu ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.footer-menu ul li {
  border-bottom: 1px dashed #555;
  padding: 5px 0;
}
.footer-menu a {
  display: block;
  padding: 5px 0;
  color: #999;
}

.footer-social a {
  background: none repeat scroll 0 0 #1bd172;
  color: #000000;
  display: inline-block;
  font-size: 20px;
  height: 40px;
  margin-bottom: 10px;
  margin-right: 10px;
  padding-top: 5px;
  text-align: center;
  width: 40px;
  border: 1px solid #1bd172;
}

.footer-social a:hover {
  background-color: #222;
  border-color: #666;
}

.footer-social {
  margin-top: 20px;
}

.feedback-form input[type="email"] {
  background: none repeat scroll 0 0 #fff;
  border: medium none;
  margin-bottom: 10px;
  padding: 10px;
  width: 100%;
}
.feedback-form input[type="submit"] {
  background: none repeat scroll 0 0 #ee5057;
  border: medium none;
  color: #fff;
  display: inline-block;
  font-size: 18px;
  padding: 7px 20px;
  text-transform: uppercase;
  border: 1px solid #ee5057;
}
.feedback-form input[type="submit"]:hover {
  background: #222;
  border-color: #666;
}
.feedback-form {
  margin-top: 25px;
}
a {
  color: #000000;
}
a:hover,
a:focus {
  color: #17a78b;
}
.footer-bottom-area {
  background: none repeat scroll 0 0 #000;
  color: #fff;
  padding-bottom: 40px;
}

.slide-bulletz {
  bottom: 30px;
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 99;
}
ol.slide-indicators {
  left: inherit;
  list-style: outside none none;
  margin: 0;
  padding: 0;
  position: relative;
  width: 100%;
}
ol.slide-indicators li {
  background: none repeat scroll 0 0 #222;
  border: medium none;
  border-radius: 0;
  cursor: pointer;
  display: inline-block;
  height: 10px;
  margin: 0 0 0 5px;
  width: 10px;
}
ol.slide-indicators li.active {
  background: none repeat scroll 0 0 #fff;
  height: 10px;
  margin: 0 0 0 5px;
  width: 10px;
}

.carousel.carousel-fade .item {
  transition: opacity 1s ease-in-out;
}
.carousel.carousel-fade .active.left,
.carousel.carousel-fade .active.right {
  left: 0;
  z-index: 2;
  opacity: 0;
  filter: alpha(opacity=0);
}

.footer-card-icon {
  font-size: 30px;
  text-align: right;
}

.copyright > p {
  margin: 10px 0 0;
}

.product-big-title-area {
  background: url(img/crossword.png) repeat scroll 0 0 #e68c3a;
}

.product-bit-title h2 {
  font-family: raleway;
  font-size: 50px;
  font-weight: 200;
  margin: 0;
  padding: 50px 0;
  color: #fff;
}

.single-product-area .zigzag-bottom {
  background-color: #f4f4f4;
}

.single-product-area {
  padding: 80px 0 130px;
}

.sidebar-title {
  color: #fead53;
  font-size: 25px;
  margin-bottom: 30px;
  text-transform: uppercase;
}
.single-sidebar {
  margin-bottom: 50px;
}
input[type="text"],
input[type="password"],
input[type="email"],
textarea {
  border: 1px solid #ddd;
  padding: 10px;
}
input[type="submit"],
button[type="submit"] {
  background: none repeat scroll 0 0 #1bd172;
  border: medium none;
  color: #fff;
  padding: 11px 20px;
  text-transform: uppercase;
}
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: #0b4f2c;
}
.single-sidebar input[type="text"] {
  margin-bottom: 10px;
  width: 100%;
}
.thubmnail-recent {
  margin-bottom: 30px;
  overflow: hidden;
}
.recent-thumb {
  float: left;
  height: auto;
  margin-right: 15px;
  width: 63px;
}
.thubmnail-recent > h2 {
  font-size: 20px;
  margin-bottom: 10px;
}
.thubmnail-recent > h2 a {
  color: #222;
}
.product-sidebar-price > ins {
  color: #ee5057;
  font-weight: 700;
  margin-right: 10px;
  text-decoration: none;
}
.single-sidebar > ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.single-sidebar li {
  border-bottom: 1px solid #f1f1f1;
  padding: 10px 0;
}
.single-sidebar a {
  display: block;
}
.product-breadcroumb {
  margin-bottom: 20px;
}
.product-breadcroumb > a {
  margin-right: 31px;
  position: relative;
}
.product-breadcroumb > a::before {
  content: "/";
  position: absolute;
  right: -20px;
  top: 2px;
}
.product-breadcroumb > a:last-child::before {
  display: none;
}
.product-main-img {
  margin-bottom: 20px;
}
.product-gallery {
  margin-bottom: 25px;
  margin-left: -15px;
  overflow: hidden;
}
.product-gallery img {
  height: auto;
  margin-left: 15px;
  width: 76px;
}
.product-name {
  font-size: 25px;
  margin-bottom: 20px;
}
.product-inner-price {
  margin-bottom: 25px;
}
.product-inner-price > ins {
  color: #ee5057;
  font-weight: 700;
  margin-right: 10px;
  text-decoration: none;
}
.quantity {
  float: left;
  margin-right: 15px;
}
.quantity input[type="number"] {
  border: 1px solid #0b0101;
  padding: 5px;
  width: 50px;
}
.add_to_cart_button {
  background: none repeat scroll 0 0 #1bd172;
  border: medium none;
  color: #fff;
  padding: 6px 25px;
  display: inline-block;
}
.add_to_cart_button:hover {
  background-color: #0b4f2c;
  color: #fff;
  text-decoration: none;
}
form.cart {
  margin-bottom: 25px;
}
.product-inner-category {
  margin-bottom: 30px;
}
.product-tab {
  border-bottom: 1px solid #ddd;
  list-style: outside none none;
  margin: 0 0 30px;
  padding: 0;
  text-align: center;
}
.product-tab li {
  display: inline-block;
}
.product-tab li.active {
  background: none repeat scroll 0 0 #fead53;
}
.product-tab li.active a {
  color: #fff;
}
.product-tab li a {
  color: #222;
  display: block;
  font-size: 16px;
  padding: 10px 30px;
}
.product-tab li a:hover {
  text-decoration: none;
}
.product-tab li a:focus {
  text-decoration: none;
}
.tab-content h2 {
  font-size: 20px;
}
.tab-content {
  margin-bottom: 30px;
}
.submit-review label {
  display: block;
}
.submit-review input[type="text"],
.submit-review input[type="email"],
.submit-review textarea {
  margin-bottom: 20px;
  width: 100%;
}
.rating-chooser {
  margin-bottom: 30px;
}
.rating-chooser p {
  font-weight: 700;
}
.rating-wrap-post {
  font-size: 20px;
}

.submit-review textarea {
  height: 105px;
}

.related-products-wrapper {
  margin-top: 30px;
}
.related-products-title {
  color: #feae52;
  font-size: 25px;
  margin-bottom: 30px;
  text-transform: uppercase;
}

.related-products-wrapper .owl-nav {
  position: absolute;
  right: 0;
  top: -56px;
}

table.shop_table {
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd;
  margin-bottom: 50px;
  width: 100%;
}
table.shop_table th,
table.shop_table td {
  border-left: 1px solid #ddd;
  border-top: 1px solid #ddd;
  padding: 15px;
  text-align: center;
}
table.shop_table th {
  background: none repeat scroll 0 0 #f4f4f4;
  font-size: 15px;
  text-transform: uppercase;
}
td.product-thumbnail img {
  height: auto;
  width: 70px;
}
td.product-name {
  font-size: 18px;
}
div.quantity input.plus,
div.quantity input.minus {
  background: none repeat scroll 0 0 #ee5057;
  border: medium none;
  color: #fff;
  height: 25px;
  line-height: 15px;
  width: 25px;
}
td.product-quantity div.quantity {
  float: none;
  margin: 0;
}
td.actions div.coupon {
  float: left;
}
.cart-collaterals {
  overflow: hidden;
}
.cross-sells {
  float: left;
  margin-right: 3%;
  width: 57%;
}
.cart_totals {
  float: right;
  margin-bottom: 50px;
  width: 40%;
}
.cart-collaterals h2 {
  color: #ee5057;
  font-size: 25px;
  margin-bottom: 25px;
  text-transform: uppercase;
}
div.cart-collaterals ul.products {
  list-style: outside none none;
  margin: 0 0 0 -30px;
  padding: 0;
}
div.cart-collaterals ul.products li.product {
  float: left;
  margin-left: 30px;
  position: relative;
  width: 198px;
}
.cart_totals table {
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd;
  width: 100%;
}
.cart_totals table th,
.cart_totals table td {
  border-left: 1px solid #ddd;
  border-top: 1px solid #ddd;
  padding: 10px;
}
.cart_totals table th {
  background: none repeat scroll 0 0 #f4f4f4;
}
.onsale {
}
div.cart-collaterals ul.products li.product .onsale {
  background: none repeat scroll 0 0 #ee5057;
  color: #fff;
  padding: 5px 10px;
  position: absolute;
  right: 0;
}
div.cart-collaterals ul.products li.product h3 {
  color: #333;
  font-size: 20px;
  margin-top: 15px;
}
div.cart-collaterals ul.products li.product .price {
  color: #333;
  display: block;
  margin-bottom: 10px;
  overflow: hidden;
}
.price > ins {
}
div.cart-collaterals ul.products li.product .price ins {
  color: #ee5057;
  font-weight: 700;
  margin-left: 10px;
  text-decoration: none;
}

.woocommerce-info {
  background: none repeat scroll 0 0 #f4f4f4;
  font-size: 18px;
  margin-bottom: 20px;
  padding: 15px;
}
.col2-set {
  margin-left: -30px;
  overflow: hidden;
}
.col-1,
.col-2 {
  float: left;
  margin-left: 30px;
  width: 360px;
}
#customer_details label {
  display: block;
  margin: 0 0 5px;
}
#customer_details input[type="text"],
#customer_details textarea,
.shipping_calculator input[type="text"] {
  margin-bottom: 10px;
  width: 100%;
}
#customer_details h3 {
  color: #ee5057;
  font-size: 20px;
  text-transform: uppercase;
}
.create-account {
  background: none repeat scroll 0 0 #f4f4f4;
  margin-bottom: 50px;
  padding: 15px;
}
#order_review_heading {
  color: #ee5057;
  font-size: 20px;
  text-transform: uppercase;
}
#payment ul.payment_methods {
  list-style: outside none none;
  margin: 0 0 30px;
  padding: 0;
}
#payment ul.payment_methods li {
  margin-bottom: 15px;
}
a.about_paypal {
  font-size: 12px;
  margin-left: 15px;
}

#customer_details select,
.shipping_calculator select {
  border: 1px solid #ddd;
  margin-bottom: 15px;
  padding: 10px;
  width: 100%;
}

table.shop_table td.product-remove a {
  display: inline-block;
  padding: 0 5px 2px;
  text-transform: uppercase;
}

table.shop_table td.product-remove a:hover {
  color: #fff;
  background: red;
  text-decoration: none;
}
table.shop_table td.product-name a {
  color: #222;
}
table.shop_table td.product-name a:hover {
  color: #ee5057;
  text-decoration: none;
}
div.quantity input.plus:hover,
div.quantity input.minus:hover {
  background-color: #222;
}
div.cart-collaterals ul.products li.product a:hover h3 {
  color: #ee5057;
}
div.cart-collaterals ul.products li.product a:hover {
  text-decoration: none;
}

div.cart-collaterals ul.products li.product:hover .add_to_cart_button {
  background-color: #0b4f2c;
}

.cart-collaterals .shipping_calculator {
  float: right;
  width: 40%;
}

#login-form-wrap,
#coupon-collapse-wrap {
  background: none repeat scroll 0 0 #f4f4f4;
  margin-bottom: 30px;
  padding: 25px;
}
#login-form-wrap label {
  display: block;
  margin-bottom: 5px;
}
#login-form-wrap input[type="text"],
#login-form-wrap input[type="password"] {
  margin-bottom: 10px;
  width: 250px;
}
#login-form-wrap input[type="submit"] {
  margin-bottom: 15px;
}

.single-shop-product h2 {
  font-size: 20px;
  margin: 10px 0;
}
.product-option-shop {
  margin-top: 15px;
}

.single-shop-product {
  margin-bottom: 50px;
}

.pagination > li > a,
.pagination > li > span {
  color: #ee5057;
}
/* 1. Container chứa các nút (Xếp dọc) */
.floating-contact-wrap {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999999;
  display: flex;
  flex-direction: column;
  /* Xếp dọc */
  gap: 15px;
  /* Khoảng cách giữa các nút */
}

/* 2. Style chung cho các nút */
.contact-btn {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  text-decoration: none !important;
  position: relative;
  transition: transform 0.3s;
}

.contact-btn:hover {
  transform: scale(1.1);
}

/* Nút Zalo (Màu xanh Zalo) */
.btn-zalo {
  background-color: #0068ff;
  border: 2px solid white;
}

/* Chữ Z cho icon Zalo */
.zalo-text {
  color: white;
  font-family: Arial, sans-serif;
  font-weight: 900;
  font-size: 32px;
  line-height: 1;
}

/* Nút Messenger (Màu xanh Messenger) */
.btn-messenger {
  background-color: #0084ff;
  border: 2px solid white;
}

.btn-messenger svg {
  width: 30px;
  height: 30px;
  fill: white;
}

/* 3. Tooltip (Chữ hiện ra bên cạnh) */
.contact-tooltip {
  position: absolute;
  right: 70px;
  top: 15px;
  background: #333;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 13px;
  color: white;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  font-family: Arial, sans-serif;
}

/* Mũi tên tooltip */
.contact-tooltip::after {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  border-left: 6px solid #333;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}

.contact-btn:hover .contact-tooltip {
  opacity: 1;
  visibility: visible;
  right: 75px;
}

/* 4. Hiệu ứng rung lắc cho nút Zalo để gây chú ý */
.btn-zalo {
  animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
}

@keyframes quick-alo-circle-img-anim {
  0% {
    transform: rotate(0) scale(1) skew(1deg);
  }

  10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
  }

  20% {
    transform: rotate(25deg) scale(1) skew(1deg);
  }

  30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
  }

  40% {
    transform: rotate(25deg) scale(1) skew(1deg);
  }

  50% {
    transform: rotate(0) scale(1) skew(1deg);
  }

  100% {
    transform: rotate(0) scale(1) skew(1deg);
  }
}

/* Badge giảm giá đỏ nổi góc phải trên cùng (chuẩn Shopee) */
.product-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #ee4d2d;
  color: white;
  font-size: 14px;
  font-weight: bold;
  padding: 4px 8px;
  border-radius: 4px;
  z-index: 10;
  box-shadow: 0 2px 8px rgba(238, 77, 45, 0.4);
  border: 2px solid white;
}

/* Giá mới + giá cũ */
.product-carousel-price {
  margin: 12px 0;
  line-height: 1.4;
}

.product-carousel-price ins {
  color: #ee4d2d;
  font-size: 20px;
  font-weight: bold;
  text-decoration: none;
}

.product-carousel-price del {
  color: #999;
  font-size: 14px;
  margin-left: 8px;
}

.onsale {
  background: #0dcaf0;
  font-size: 20px;
}

.product-category-area {
  padding-bottom: 50px;
  /* Tạo khoảng cách với phần dưới */
  padding-top: 20px;
}

/* Khung bao quanh mỗi danh mục */
.cat-item {
  display: block;
  background: #fff;
  border: 1px solid #e1e1e1;
  text-align: center;
  padding: 25px 10px;
  border-radius: 8px;
  /* Bo tròn nhẹ */
  transition: all 0.3s ease;
  text-decoration: none !important;
  /* Bỏ gạch chân */
  margin-bottom: 20px;
}

/* Icon (Sử dụng FontAwesome có sẵn) */
.cat-item .cat-icon i {
  font-size: 40px;
  color: #5a88ca;
  /* Màu xanh chủ đạo */
  margin-bottom: 15px;
  transition: all 0.3s ease;
}

/* Chữ tên danh mục */
.cat-item .cat-text {
  color: #333;
  font-weight: 600;
  font-size: 16px;
  text-transform: uppercase;
}

/* Hiệu ứng khi di chuột vào (Hover) */
.cat-item:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  /* Đổ bóng */
  transform: translateY(-5px);
  /* Nổi lên trên */
  border-color: #5a88ca;
}

.cat-item:hover .cat-icon i {
  color: #ee4d2d;
  /* Đổi màu icon sang cam đỏ khi hover */
  transform: scale(1.1);
  /* Phóng to icon một chút */
}

.cat-item:hover .cat-text {
  color: #ee4d2d;
}
