[x-cloak]	{
	display:none !important;
}

body {
  background-color:#e9ecef;
  backgroundcolor:#fff !important;
}

.bg-body {
  background-color: #e9ecef !important;
  backgroundcolor: #fff !important;
}

.text-gray-300 {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity, 1)) !important;
}

.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1)) !important;
}

.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}

.text-gray-700 {
  --tw-text-opacity: 1;
  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
}

.text-gray-800 {
  --tw-text-opacity: 1;
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}

.text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.text-blue  {
  color: var(--blue) !important;/* #00A5E0 !important;*/
}

.accent2  {
  color: #D69E2E;
}

.text-accent  {
  color: var(--accent);
}

.btn-outline-primary  {
  border-color: none !important;
}

.btn-accent  {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.bg-accent  {
  background-color: var(--accent) !important;
}

/* Normalize paragraph spacing */
p {
  margin: 0 0 1em;
}

.flex  {
  display: flex;
}

.mb-4  {
  margin-bottom: 1em;
}

.gap-4  {
  gap:1em;
}

.gap-8  {
  gap:2em;
}

.justify-center  {
  justify-content: center;
}

.justify-between  {
  justify-content: space-between;
}

.justify-around  {
  justify-content: space-around;
}

.items-center  {
  align-items:center;
}

.custom-width-control  {
  width:340px;
  margin-left:auto;
  margin-right:auto;
}

@media (min-width:576px)  {
  .custom-width-control  {
    width:500px;
  }
}

@media (min-width:768px)  {
  .custom-width-control  {
    width:640px;
  }
}

@media (min-width:992px)  {
  .custom-width-control  {
    width:800px;
  }
}

@media (min-width:1200px)  {
  .custom-width-control  {
    width:900px;
  }
}

.no-wrap  {
  white-space:nowrap;
}

.overlay-custom	{
	width:100vw;
	height:100vh;
	z-index:1100;
	background-color:rgba(0,0,0,0.5);
	position:fixed;
}

/*  Mobile Side Menus */
.side-menu {
  position: fixed;
  top: 0rem;
  bottom: 4em;
  width: 17.5rem;
  padding: 1rem;
  overflow-y: auto;
  transition: transform 0.3s ease;
  z-index: 2000;
  height:100vh;
  background:#fff;
}

.pop-aside-menu {
  position: absolute;
  top:0em;
  right: -19.5em;
  width: 17.5rem;
  padding: 1rem;
  overflow-y: auto;
  z-index: 2000;
  background:#fff;
}

/* Left menu: off-screen left */
.side-menu.left {
  left: 0;
  transform: translateX(-100%);
}
/* When open, slide in */
.side-menu.open {
  transform: translateX(0);
}

/* hide scrollbar */
.navbar-nav.hide-scrollbar {
  overflow-x: auto;
  -ms-overflow-style: none;     /* IE and Edge */
  scrollbar-width: none;        /* Firefox */
}
.navbar-nav.hide-scrollbar::-webkit-scrollbar {
  display: none;                /* Chrome, Safari, Opera */
}

/* Control king carousel */
        
        .king-section {
            border-radius: 10px;
            overflow: hidden;
            
        }
        
        .carousel-item {
            height: 500px;
            background-size: cover;
            background-position: center;
        }
        
        .carousel-overlay {
            background: linear-gradient(to right, rgba(45, 52, 54, 0.85) 0%, rgba(45, 52, 54, 0.6) 100%);/* rgba(45, 52, 54, 0.85)  rgba(45, 52, 54, 0.6) */
            height: 100%;
            display: flex;
            align-items: center;
            padding: 0 10%;
        }
        
        .carousel-content {
            max-width: 600px;
            color: white;
            text-shadow: 0 1px 3px rgba(0,0,0,0.3);
        }
        
        .carousel-content h2 {
            font-size: 3rem;
            font-weight: 700;
            margin-bottom: 20px;
            color: var(--accent);
            text-transform: uppercase;
        }
        
        .carousel-content p {
            font-size: 1.2rem;
            margin-bottom: 30px;
            line-height: 1.6;
        }
        
        .btn-king {
            background: linear-gradient(45deg, white, white);
            color:var(--primary);
            border: none;
            border-radius: 50px;
            padding: 12px 30px;
            font-weight: 600;
            font-size: 1.1rem;
            text-transform: uppercase;
            letter-spacing: 1px;
            transition: all 0.3s ease;
            box-shadow: 0 5px 15px rgba(0,0,0,0.2);
        }
        
        .btn-king:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.3);
        }
        
        .carousel-indicators li {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            margin: 0 6px;
        }
        
        .carousel-control-prev, .carousel-control-next {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: rgba(255,255,255,0.2);
            top: 50%;
            transform: translateY(-50%);
            opacity: 0.7;
            transition: all 0.3s;
        }
        
        .carousel-control-prev:hover, .carousel-control-next:hover {
            opacity: 1;
            background: var(--primary);
        }
        
        .carousel-control-prev {
            left: 20px;
        }
        
        .carousel-control-next {
            right: 20px;
        }
        
        .discount-badge {
            position: absolute;
            display:none;
            top: 20px;
            right: 20px;
            background: white;
            color: ;
            padding: 8px 15px;
            border-radius: 5px;
            font-weight: bold;
            font-size: 1rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.2);
            z-index: 10;
        }
        
        /* Responsive Adjustments */
        @media (max-width: 992px) {
            .carousel-item {
                height: 400px;
            }
            
            .carousel-content h2 {
                font-size: 2.5rem;
            }
        }
        
        @media (max-width: 768px) {
            .carousel-item {
                height: 350px;
            }
            
            .carousel-content h2 {
                font-size: 2rem;
            }
            
            .carousel-content p {
                font-size: 1rem;
            }
        }
        
        @media (max-width: 576px) {
            .carousel-item {
                height: 300px;
            }
            
            .carousel-overlay {
                padding: 0 5%;
            }
            
            .carousel-content h2 {
                font-size: 1.8rem;
            }
            
            .discount-badge {
                font-size: 1rem;
                padding: 5px 10px;
            }
        }
        
.rotate-180 {
    transform: rotate(180deg);
}

.pric  {
  color:#212529 !important;
}

.p-detail-mobile  {
  padding:1em 0em;
}

@media (max-width:576px)  {
  .p-detail-mobile  {
    margin:0em -2em;
    padding:1em 2em 1em 2em;
    background: #fff;
  }
  .p-detail-mobile-review  {
    margin:0em -2em;
    padding:1em 2em 2em 2em;
    background: #fff;
  }
  .p-detail-mobile-2  {
    margin:-1em -2em 0em -2em;
    padding-top:1em;
    background: white;
  }
  .p-detail-mobile-2 .product_main  {
    padding:0em 2em;
  }
}

.mobile_info td   {
  margin:0.5em;
  padding:0.5em;
}