 /*=================== GENERAL STYLES =========================*/
	:root{  
		color-scheme: light dark;
    --color-first: light-dark(#2f619b, #2f619b);
    --color-first-dark: light-dark(#164174, #2572cc);
    --color-second: light-dark(#333, #ddd);
    --color-second-same: light-dark(#333, #333);
    --color-white: light-dark(#ffffff, #3c3c3c);
    --color-white-same: light-dark(#ffffff, #ffffff);
    --color-black: light-dark(#000000, #ffffff);
    --color-link: light-dark(#0053e2, #0053e2);
	--color-light-blue:light-dark(#dfebff, #1b2a35);
	--color-light-blue-2:light-dark(#bbd4f5, #1e3343);
	--color-light-2:light-dark(#f6e9da,#5d5145);
	--color-light-3:light-dark(#e4d1bb,#413426);
	--color-light-4:light-dark(#ffd6e0,#7a4552);
	--color-orange:light-dark(#F7941D,#F7941D);
	--color-yellow:light-dark(#fed602,#fed602);
	--bg-light:light-dark(#f7faff,#212529);
	--font-family: "Open Sans", sans-serif;
	} 	
  :root {
      &:has(html[data-bs-theme="light auto"]) {
          color-scheme: light;
      }
      &:has(html[data-bs-theme="dark"]) {
          color-scheme: dark;
      }
  }
	*,::after,::before{box-sizing: border-box;}
	* {
		margin: 0;
		padding: 0;
		font-family: var(--font-family);
		font-weight: 400;
		font-size: 16px;
		letter-spacing: 0;
		line-height: 1.5;
		color: var(--color-black);
		text-transform: none;
	}
    body {background-color: var(--color-white);}
 a,a:hover,.decorationNone{text-decoration: none;}
 html {scroll-behavior: smooth;}
 ul li {list-style: none;}
 ul.list-disc li, ul.list li {list-style: disc;}
 img {object-fit: scale-down;object-position: center;}
 .wrapper{position: relative;}
 .z-2 {z-index: 2}
 .ls-2 {letter-spacing: -2px}
 .webContent .lh-1 {line-height: 1 !important;}
 .breadcrumb-item+.breadcrumb-item::before {content: "●";}
 .dotted-border {border-bottom: 4px dotted rgba(255, 255, 255, 0.24);}
 .custom-tooltip {
     --bs-tooltip-font:0.8rem;
 }
 .accordion-button:not(.collapsed) {background-color:var(--color-white);}
 .accordion-collapse.collapse, .accordion-button, .accordion-item, .accordion-header { border: none; outline: none; }
 .accordion-button:focus {border: none;outline: none;box-shadow: none;}
 .accordion-item,.accordion-button{background-color: var(--color-white);color: var(--color-black);}
 .accordion-item,.accordion-button{background-color: var(--color-white);color: var(--color-black);}
 #accordionProductDetails .accordion-item:first-of-type>.accordion-header .accordion-button,
 #accordionProductDetails .accordion-button:not(.collapsed),
 #accordionProductDetails button:focus:not(:focus-visible){color: var(--color-black);}
 html[data-bs-theme=dark] .accordion-button::after{filter: invert(50%);}
 svg.fill-black{fill: var(--color-black);}
 .w-fit-content {width: fit-content !important;}
 .w-max-content {width: max-content !important;}
 .pagination .page-link{color: var(--color-black);}
 .pagination .active>.page-link, .pagination .page-link.active{background-color: var(--color-first);border-color: var(--color-first);color: var(--color-white);}
/*==================== BORDER STYLES ==========================*/
  .border-first {border-color: var(--color-first) !important;}
  .border-second {border-color: var(--color-second) !important;}
  .border-light-blue {border-color: var(--color-light-blue) !important;}
/*==================== BUTTON STYLES ==========================*/	
	.button-style,input[type=submit].button-style{
		display: inline-block;
		padding:7px 35px;
		color: #fff;
		font-size: 1rem;
		font-weight:600;
		letter-spacing: 0px;
		border:0;
		text-transform: capitalize;
		outline: 0;
		cursor: pointer;
		border-radius: 9999px;
	}	
	.button-style.button-sm{padding: 3px 10px;font-size:0.875rem; }
  .btn-outline-first {color: var(--color-first);border: 1px solid var(--color-first);background-color: transparent}
  .btn-outline-first:hover, .btn-first:hover, .btn-first {color: #fff;background-color: var(--color-first);}
  .btn-outline-second, .btn-outline-second-same {color: var(--color-second);border: 1px solid var(--color-second);background-color: transparent !important;}
  .btn-outline-second:hover, .btn-second:hover, .btn-second {color: var(--color-white);border: 1px solid var(--color-second);background-color: var(--color-second);}
  .btn-outline-second-same:hover, .btn-second-same:hover, .btn-second-same {color: var(--color-white-same);border: 1px solid var(--color-second-same);background-color: var(--color-second-same) !important;}
 .btn-outline-white {color: var(--color-white);border: 1px solid var(--color-white);background-color: transparent !important;}
 .btn-outline-white-same {color: var(--color-white-same);border: 1px solid var(--color-white-same);background-color: transparent !important;}
 .no-bg-btn {
      padding: 0;
      margin: 0;
      border: none;
      background-color: transparent;
      outline: none !important;
      box-shadow: none !important;
  }
 /*==================== HEADING STYLES =========================*/
	.webContent .mainHeading,.webContent .article-contents h1 {
		font-size: 2.4rem;
		font-weight: 600;
		color: var(--color-second);
		text-transform: capitalize;
		font-family:var(--font-family);
		letter-spacing: 0;
		margin-bottom: 5px;
    line-height:1.2;
	}	
  .webContent .largeHeading{
    font-size: 1.85rem;
    font-weight:600;
    line-height:1.3;
      text-transform: capitalize;
    letter-spacing: 0;
    color:var(--color-second);
    font-family: var(--font-family);
  }
	.webContent .subHeading {
        font-size:1.5rem;
		color: var(--color-second);
		letter-spacing:0px;
		text-transform: capitalize;
		font-family:var(--font-family);
		font-weight: 500;
		margin-bottom: 5px;
    line-height:1.3;
	}
    p {
		color: var(--color-black);
		font-size: 1.05rem;
		line-height: 1.4;
	}	
	.webContent.text-color-white .mainHeading {color: var(--color-third)}
  .webContent.text-color-white .largeHeading,
  .webContent.text-color-white .subHeading,
  .webContent.text-color-white .thirdHeading,
  .webContent.text-color-white p,
  .webContent.text-color-white a,
  .webContent.text-color-white span,
  .webContent.text-color-white small,
  .webContent.text-color-white strong,
  .webContent.text-color-white b,
  .webContent.text-color-white label,
  .webContent.text-color-white li {color: var(--color-white);}
  .webContent.color-white-same .mainHeading,
  .webContent.color-white-same .largeHeading,
  .webContent.color-white-same .subHeading,
  .webContent.color-white-same .thirdHeading,
  .webContent.color-white-same p,
  .webContent.color-white-same a,
  .webContent.color-white-same span,
  .webContent.color-white-same small,
  .webContent.color-white-same strong,
  .webContent.color-white-same b,
  .webContent.color-white-same label,
  .webContent.color-white-same li {color: var(--color-white-same);}
/*==================== FONT SIZE ==============================*/
    .text-xxxl {font-size: 4.5rem !important;line-height: 1.3 !important;}
    .text-xxl {font-size: 1.5rem !important;line-height: 1.3 !important;}
    .text-xl {font-size: 1.25rem !important;line-height:1.5;}
    .text-lg {font-size: 1.125rem !important;line-height:1.2;}
    .text-md {font-size: 1rem !important;line-height: normal;}
    .text-sm {font-size: 0.875rem !important;}
    .text-xs {font-size: 0.75rem !important;line-height: normal;}
/*==================== FONT WIGHT =============================*/
    .fw-400 {font-weight: 400 !important;}
    .fw-500 {font-weight: 500 !important;}
    .fw-600 {font-weight: 600 !important;}
    .fw-700 {font-weight: 700 !important;}
 /*==================== INPUT FIELDS STYLES ====================*/
 .form-section {background-color: var(--color-first);}
 input.form-control, select.form-select{height: 45px;background-color: var(--color-white-same);
     color: var(--color-black);}
 input.form-control, select.form-select,textarea.form-control {resize: none;
     background-color: var(--color-white-same);color: var(--color-second-same);}
 input.form-control:hover, select.form-select:hover,textarea.form-control:hover,input.form-control:focus,
 select.form-select:focus,textarea.form-control:focus{
     border-color:var(--color-black);
     box-shadow: none;
     outline: none;
 }
 .form-label {font-size:0.85rem;color: var(--color-white-same) !important;margin-bottom: 4px;}
 .form-required {color: red !important;font-weight: 600;}
 .input-border {border: 1px solid var(--border-color);transition: all 0.5s;}
 .input-border:hover, .input-border:focus, .input-border.active {border-color: var(--color-first);}
 .form-check-input:focus{box-shadow: none;}
 .form-check-input:checked {
     background-color: var(--color-first);
     border-color: var(--color-first);
 }
 .form-check-input {
     width: 1.2em;
     height: 1.2em;
     border-width: 2px;
 }
/*==================== TEXT LIMIT STYLES ======================*/	
	.text-limit-1,.text-limit-2,.text-limit-3,.text-limit-4{
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
	}
	.text-limit-1{-webkit-line-clamp: 1;}
	.text-limit-2{-webkit-line-clamp: 2;}
	.text-limit-3{-webkit-line-clamp: 3;}
	.text-limit-4{-webkit-line-clamp: 4;}
/*==================== OWL CAROUSEL STYLES ====================*/		
	.owl-theme .owl-nav {
    position: absolute;
    right:0px;
    top: -68px;
    margin-top: 0 !important;
  }
 .px-3 .owl-theme .owl-nav {top: -60px;}
  .owl-carousel .owl-nav button:focus {outline: 0 !important;border: 0 !important;}
  .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
    position: relative;
    width: 30px;
    height: 30px;
    border-radius: 100px;
    background: var(--color-first) !important;
  }
  .owl-carousel.owl-carousel-orange .owl-nav button.owl-next, .owl-carousel.owl-carousel-orange .owl-nav button.owl-prev {
    background: var(--color-orange) !important;
  }
  
  .owl-carousel .owl-nav button span { opacity: 0;width: 0;height: 0;display: none;}
  .owl-carousel .owl-nav button.owl-next::after, .owl-carousel .owl-nav button.owl-prev::after {
      content: "";
      display: inline-block;
      top: 0;
      left: -4px;
      right: 0;
      bottom: 0;
      margin: auto;
      width: 8px;
      height: 8px;
      position: absolute;
      transform: rotate(45deg);
      border-radius: 0;
      border: 2px solid var(--color-white-same);
      border-left: 0;
      border-bottom: 0;
  }
  .owl-carousel .owl-nav button.owl-prev {transform: rotate(180deg);}
 .owl-theme .owl-nav .owl-next {right: 0;}
/*==================== BG & COLOR STYLES ======================*/
	.bg-color-first{background-color:var(--color-first) !important;}
	.bg-color-second{background-color:var(--color-second) !important;}
	.bg-color-black{background-color:var(--color-black) !important;}
	.bg-color-white {background-color: var(--color-white) !important;}  
    .bg-white-same {background-color: var(--color-white-same) !important;}
	.bg-light-blue {background-color:var(--color-light-blue) !important;}
    .bg-light-blue-2 {background-color: var(--color-light-blue-2) !important;}
	.bg-light {background-color:var(--bg-light) !important;}
	.bg-light-2 {background-color:var(--color-light-2) !important;}
	.bg-light-3 {background-color:var(--color-light-3) !important;}
	.bg-light-4 {background-color:var(--color-light-4) !important;}
    .bg-color-orange{background-color:var(--color-orange) !important;}
    .bg-color-yellow{background-color:var(--color-yellow) !important;}
    .bg-gradient-first {background: linear-gradient(31deg, #0a3b74, #4179b6, #0a3b74);}
	.color-first{color:var( --color-first) !important;}
	.color-first-dark{color:var( --color-first-dark) !important;}
	.color-second{color:var(--color-second) !important;}
	.color-second-same{color:var(--color-second-same) !important;}
	.color-black{color:var(--color-black) !important;}
	.color-link{color:var(--color-link) !important;}
	.color-orange{color:var(--color-orange) !important;}
	.color-yellow{color:var(--color-yellow) !important;}
  .color-white {color: var(--color-white) !important;}
  .color-white-same {color: var(--color-white-same) !important;}
	.button:focus,input[type=submit].button:focus,.button i,.button:hover,.webContent.textWhite .mainHeading,
	.webContent.textWhite .subHeading,.webContent.textWhite p {color: var(--color-white-same);}	
/*==================== HOME STYLES ============================*/	
	/*==================== BANNER STYLES ========================*/
		.banner-img img{height: 300px;width: 100%;object-position: center;object-fit: cover;border-radius: 0 16px 0 0;}
        .bannerCarousel .carousel-item {z-index: 1;border-radius: 16px 16px 0 0;padding: 0 0 0 20px;}
        .bannerCarousel .carousel-item:nth-child(1) {background-color: #b8dbfa;}
        .bannerCarousel .carousel-item:nth-child(2) {background-color: #cdd2f5;}
        .bannerCarousel .carousel-item:nth-child(3) {background-color: #ffedcc;}
        .bannerCarousel .carousel-item:nth-child(4) {background-color: #45653d;}
        .bannerCarousel .carousel-item:nth-child(5) {background-color: #a2532c;}
        .bannerCarousel .carousel-item:nth-child(6) {background-color: #25050A;}
        .bannerCarousel .carousel-item:nth-child(7) {background-color: #9f9270;}
        .bannerCarousel .carousel-item:nth-child(8) {background-color: #0ab085;}
        .bannerCarousel .carousel-item:nth-child(9) {background-color: #251740;}
        .bannerCarousel .carousel-item:nth-child(10) {background-color: #4d4a5e;}
        .bannerCarousel .carousel-control-next, .bannerCarousel .carousel-control-prev {
            top: 0;
            bottom: 0;
            margin: auto 0;
            height: 40px;
            width: 40px;
            z-index: 9;
        }
        .bannerCarousel .carousel-control-next-icon, .bannerCarousel .carousel-control-prev-icon {width: 28px;height: 28px;}
        .bannerCarousel .carousel-control-next {left: auto;right: 0;}
        .bannerCarousel .carousel-control-prev {left: 0;right: auto;}
        @media screen and (max-width: 1200px) {
            .banner-img img{height: 250px;}
            .bannerCarousel .carousel-item {padding: 0;}
            .bannerCarousel .carousel-item .carousel-caption {left: 50px;width: 320px;}
        }
        @media screen and (max-width: 991px) {
            .banner-img img{height: 220px;}
            .bannerCarousel .carousel-item .carousel-caption {left: 40px;width: 280px;}
        }
        @media screen and (max-width: 767px) {
            .banner-img img{height: 160px;}
            .bannerCarousel .carousel-item .carousel-caption {left: 20px;right: 20px;width: 230px;margin: auto;}
            .bannerCarousel .carousel-control-next, .bannerCarousel .carousel-control-prev {height: 28px;width: 28px;}
            .bannerCarousel .carousel-control-next-icon, .bannerCarousel .carousel-control-prev-icon {width: 20px;height: 20px;}
        }
	/*==================== CATEGORIES STYLES ========================*/
 .top-flower {
     position: absolute;
     top: auto;
     left: 0;
     bottom: 0;
     width: auto;
     max-width: 100%;
     height: 85%;
     z-index: 0;
     opacity: 0.5;
 }
 .top-banner {border-radius: 0 16px 16px 0;height: 100%;object-fit: cover;object-position: left;}
 .bannerCarousel .top-banner {border-radius: 0 16px 0 0;}
 .top-banner-cards-img, .section-5-img1, .section-5-img2 {width:100%;object-fit: cover;object-position: center;}
 .section-1 .top-banner-cards-img {height: 300px;}
 .section-2 .top-banner-cards-img {height: 440px;}
 .top-banner-pro-tabs {padding-left: 100px;padding-right: 100px;}
 .nav.nav-pills.tabs-product-block {max-width: 100%;scrollbar-width: thin;-webkit-overflow-scrolling: touch;}
 .section-5-img1 {height: 462px}
 .section-5-img2 {height: 180px}
 .deals-cards {position: relative;}
 .deals-cards-new {
     position: absolute;
     top: 6px;
     left: 6px;
     width: fit-content;
     height: fit-content;
     z-index: 2;
 }
 @media screen and (max-width: 1024px) {
     .section-1 .top-banner-cards-img {height: 230px;}
     .section-2 .top-banner-cards-img {height: 320px;}
     .top-banner-section .mainHeading {font-size: 1.7rem !important;}
     .top-banner-section .text-xl {font-size: 1.1rem !important;}
 }
 @media screen and (max-width: 991px) {
     .section-1 .top-banner-cards-img {height: 180px;}
     .section-2 .top-banner-cards-img {height: 260px;}
     .top-banner-section .mainHeading {font-size: 1.3rem !important;}
     .top-banner-section .text-xl {font-size: 1rem !important;}
 }
 @media screen and (max-width: 767px) {
     .top-banner, .bannerCarousel .top-banner {border-radius: 16px 16px 0 0;}
     .top-banner-pro-tabs {padding-left: 0;padding-right: 70px;}
     .top-banner-pro-tabs.top-banner-pro-tabs2 {padding-left: 0;padding-right: 0;}
 }

 .categories-img-block{width: 150px;height: 150px;object-fit: contain;background-color: #fdfeff;}
 .categories-section .owl-carousel .item {padding-top: 20px;}
 .categories-section .categories-img-block{width: 160px;height: 160px;}
 .category-page .categories-img-block{width: 98%;}
 .categories-img-block img{height: 100%;object-fit: contain;background-color: var(--color-white);}
 /*html[data-bs-theme=dark] .categories-img-block img{background-color: var(--bg-light)}*/
/*==================== CATEGORIES STYLES ======================*/
	.categories-section .card{
		border-radius: 30px;
		margin-bottom: 10px;
	}
	.categories-section .card img.categories-img{
		border-top-right-radius: 30px;
		border-top-left-radius: 30px;
	}
	.categories-section .card .subHeading{
		font-size: 1.1rem;
		text-transform: capitalize;
		letter-spacing:0 ;
		color: var(--color-first);
	}
	.categories-section .card .card-body{
		height: 100px;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		position: relative;
	}
	.categories-section .card .card-body .category-icons{
		position: absolute;
		display: inline-block;
		width: 60px;
		height: 60px;
		top: -20%;
		left: 38%;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		border-radius: 50%;
		background-color: var(--color-second);
	}
	.categories-section .card .card-body .category-icons i{
		font-size: 1.3rem;
	}
/*==================== ARTICLES AND DETAILS STYLES ============*/	
	.articles-section .webContent .subHeading{ 
		font-size: 1.2rem;
		line-height:1.35;
		margin:10px 0;
		font-weight: 500;
		text-transform: capitalize; 
	}
	.articles-section .webContent .related-articles-block .mainHeading{
		font-size: 1.6rem;
		font-weight: 500;
	}	
	.articles-section .card,.articles-section .card img{transition: 0.3s linear;}
	.articles-section .card:hover img{filter: brightness(0.8);}
	.webContent .article-contents h1{font-weight:600;font-size:2.5rem }
	.articles-section .webContent .related-articles-block .subHeading{font-size: 1.15rem}
	.articles-section .card img{max-width: 100%;display: block;}
	.card.largeCard img{width:100%;height: 250px}
	.card.mediumCard img{width:100%;height: 175px}
	.card .smallCard img{width:100%;height: 85px}
	.articles-section .card p{margin-bottom: 0.5rem}
	.search_cloud-title {
      font-size: 22px;
      font-weight: 700;
      line-height: 1.5;
      color: #23262c;
      margin-bottom: 10px
    }
    .search_cloud {
      display: flex;
      flex-wrap: wrap
    }
    .search_cloud li {
      border: 1px solid var(--color-second);
      margin: 0 9px 9px 0
    }
    .search_cloud li a {
      color: var(--color-first);
      font-size: 16px;
      line-height: 1.5;
      padding: 3px 9px;
      display: block
    }
    .search_cloud li:hover {
      color: #fff;
      border-color:var(--color-first);
      background-color: var(--color-first);
      background-position: left bottom
    }
    .search_cloud li:hover a {
      color: #fff
    }
    .article-contents h2,.article-contents h3,.article-contents h4,.article-contents h5,.article-contents h6,
    .article-contents h2 span,.article-contents h3 span,.article-contents h4 span,.article-contents h5 span,
    .article-contents h6 span{
	    line-height: 1.35;
	    margin-top: 15px;
	    text-transform: capitalize;
	    color: var(--color-article-content);
	    letter-spacing: 0px;
	    font-family: var(--font-family);
	    margin-bottom: 5px;
    }
    .article-contents a,.article-contents a strong,.article-contents strong a{
    	color: #00f;
    	text-decoration: underline;
    	font-size: 1.05rem;
    }
    .article-contents strong a{font-weight: 600}
    .article-contents h2,.article-contents h2 span{font-size: 1.7rem;font-weight: 800;}
    .article-contents h3,.article-contents h3 span{font-size: 1.5rem;font-weight: 700;}
    .article-contents h4,.article-contents h4 span{font-size: 1.3rem;font-weight: 600;}
    .article-contents h5,.article-contents h5 span{font-size: 1.2rem;font-weight: 600;}
    .article-contents h6,.article-contents h6 span{font-size: 1.1rem;font-weight: 600;}
    .article-contents p,.article-contents p span,.article-contents span p,.article-contents p strong,
    .article-contents strong,.article-contents span{
    	color: var(--color-black);
	    font-size: 1.05rem;
	    line-height: 1.4;
	    white-space: pre-line;
    }
    .article-contents span{
    	display: inline-block;
	    margin-bottom: 1rem;
    }
    .article-contents img{max-width: 100%;height: auto;margin: 10px 0;display: block;}
    .article-contents ul{padding-left: 10px}
    .article-contents ul li,.drugs-name.injectableDrugsName ul li,ul.sitemapList li{
	    margin-bottom:5px;
	    position: relative;
	    padding-left: 20px;
	 }
	 .drugs-name.injectableDrugsName ul li{
	    margin-bottom:5px;
	  }
	.article-contents ul li:before,.drugs-name.injectableDrugsName ul li:before,ul.sitemapList li:before{
	    position: absolute;
	    font: var(--fa-font-solid);
	    content: "\f101";
	    color: var(--color-second);
	    width: 10px;
	    height: 10px;
	    font-size: 0.8rem;
	    left: 0;
	    top: 6px;
	}
	.drugs-name.injectableDrugsName ul li:before,ul.sitemapList li:before{
		font: var(--fa-font-regular);
		content: '\f192';
		font-size: 0.75rem;
	}
/*==================== PRODUCT CARD STYLES ====================*/
	.card.productCard{height: 320px;}
    .card.productCard.shadow-sm {box-shadow: 0 0 12px rgba(0, 0, 0, 0.11) !important}
	.card.productCard .product_img,.card.productCard .productDetails-content{height: 150px;margin-bottom: 8px;}
	.card.productCard .product_img img{width: 100%;height: 100%;object-fit: scale-down;background-color: var(--color-white);border-radius: 4px;}
	.card.productCard .product_img .product-option{	
		background-color: var(--color-light-blue);
		color: var(--color-black);	  
		padding: 3px 8px;
		position: absolute;
		top:2%;
		left: 2%;
		z-index: 2;    
	}
    .card.productCard .product_price {color: var(--color-orange) !important;}
    .card.productCard .productDetails-content h4 {height: 42px;}
	.rating-stars span.checked {color: var(--color-orange);}
    .product-carousel .item {padding-left: 2px;padding-right: 2px;}
/*==================== TABS PRODUCT STYLES ====================*/
 .tabs-product-block {overflow-y: hidden;overflow-x: auto;flex-wrap: nowrap;width: 100%;}
 .tabs-product-block .nav-link {width: max-content;}
	.tabs-product-block button.nav-link{color:var(--color-black);font-weight:400;border-radius: 50px;padding: 4px 12px;font-size: 14.5px;}
	.tabs-product-block button.nav-link.active{background-color:var(--color-first); }
 .ui-widget.ui-widget-content{border:1px solid #ebebeb;z-index: 99 !important}
 .ui-state-default, .ui-widget-content .ui-state-default,.ui-widget-header{
     background-color: #f8f9fa !important;
     text-align: center;
 }
 .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active,
 a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{
     color: var(--color-first) !important;
     border: 1px solid #c8c8c8 !important;
     background-color:rgb(233, 236, 239) !important;
 }
 .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
     border: 1px solid var(--color-first) !important;
     background: var(--color-first) !important;
     color: #fff !important;
 }
 .ui-widget-header {background-color: var(--color-second) !important;}
 .ui-state-default, .ui-widget-content .ui-state-default{border-radius: 2px}
 .ui-state-default, .ui-widget-content .ui-state-default:focus-visible{}
 .ui-slider-horizontal,.ui-slider .ui-slider-range{height: 0.4em;}
 .ui-slider-horizontal .ui-slider-handle { top: -.5em;}

/*card section*/
 .cards-a {width: 48% !important;}
 .w-55 {width: 55% !important;}
 .cards-a img {width: 100%;height: 140px;padding: 4px;object-fit: contain;object-position: center;background-color: var(--color-light-blue);}
 .card-section-2 .cards-2, .card-section-3 .cards-2 {position: relative;}
 .card-section-2 .cards-2 .cards-2-img, .card-section-3 .cards-2 .cards-2-img, .cards-3-img, .banner-cards-img-1, .banner-img-2 {width: 100%;object-fit: cover;object-position: center;}
 .card-section-2 .cards-2 .cards-2-img {height: 420px;}
 .card-section-3 .cards-2 .cards-2-img {height: 280px;}
 .card-section-3 .cards-3-img {height: 200px;}
 .banner-img-2 {height: 280px;}
 .banner-cards-img-1 {height: 424px;}
 .cards-2 .cards-2-text {
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px 40px 20px 20px;
    margin: 0;
    border-radius: 8px;
    width: 100%;
    height: 100%;
    z-index: 1;
}
 .cards-2 .cards-2-text.deals-text {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 12%, rgba(0, 0, 0, 0.28) 28%, transparent);
}
 .banner-cards {position: relative;height: 200px;background-image: url("../../assets/img/home/banners/bg-img.jpg")}
 .cards-2 .cards-2-text.banner-cards-text  {
     text-align: center;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     bottom: 0;
     padding: 20px 20%;
     margin: auto;
     z-index: 2;
 }
 .cards-2 .cards-2-text.banner-cards-text-1 {
     background-color: rgba(0, 0, 0, 0.15);
 }
 .cards-2.banner-cards:after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     border-radius: 8px;
     /*background: linear-gradient(61deg, #536dc6 5%, #45b0bc 50%, #5ab4a3 80%, #4daf80);*/
     opacity: 0.8;
     z-index: 1;
 }
 .cards-2.banner-cards1:after {background-color: #87baba;}
 .cards-2.banner-cards2:after {background-color: #c7af91;}
 .cards-2.banner-cards3:after {background-color: #9ec5e4;}

 .pro-cards-bg {width: 100%;height: 100%;background: linear-gradient(180deg, var(--color-light-blue-2) 18%, var(--color-light-2), var(--color-light-3));}
 .valentine-page .pro-cards-bg {width: 100%;height: 100%;background: linear-gradient(0deg, var(--color-light-4) 18%, var(--color-light-2));}
 .pro-cards-bg .pro-img {width: 100%;height: 220px;object-position: center;object-fit: contain;margin: 0 auto;}
 .pro-dis-text {font-size: 4.6rem;}
/*card section end*/

 /*==================== PRODUCT DETAILS PAGE STYLES =================*/
 .product-features-options .btn{
     min-width: 40px;position: relative;min-height: 30px;display: block;
 }
 .product-features-options.product-features-color .btn{width:40px;height:40px;display: flex;
     justify-content: center;align-items: center;}
 .product-features-options.product-features-color.product-features-color-with-price .btn{height: auto;
     width: 50px;}
 .product-features-options.product-features-color .btn .radio-img{width:35px;height:35px;
     object-fit: scale-down;}
 .product-features-options.product-features-color.product-features-color-with-price .btn .radio-img{
     width:45px;height:45px;margin-top: 2px;
 }
 .product-features-options.product-features-color.product-features-color-with-price .btn .text-xs{
     font-size: 0.7rem !important;line-height: 1;
 }
 .product-features-options.product-features-color .btn  .radio-img img{width: 100%;height: 100%;
     object-fit: scale-down;}
 .product-features-options .btn.show, .product-features-options .btn:first-child:active,
 .product-features-options :not(.btn-check)+.btn:active{background: transparent;color: var(--color-first);}
 .product-features-options .btn-check:checked+.btn,.product-features-options .btn.active,
 .product-features-options .btn.show,.product-features-options .btn:first-child:active,
 .product-features-options :not(.btn-check)+.btn:active,.product-features-options .btn-check:hover+.btn{
     box-shadow: inset 0 0 0 1px var(--color-first);
     background-color: transparent;
 }
 .product-features-options .btn.disabled:after{
     content: "";
     height: 110%;
     width: .5px;
     inset: 0;
     margin: auto;
     position: absolute;
     transform: rotate(45deg);
     opacity: 0.4;
     background-color: var(--color-second);
 }
 /* Product image Gallery */
 .productimg-gallery {position: sticky;top: 150px;}
 .thumb {
     position: relative;
     width: 55px;height: 55px;
     cursor: pointer;flex: 0 0 auto;
     border: 2px solid transparent;
 }
 .thumb.active { border-color:var(--color-first);}
 .thumb img { width: 100%;height: 100%;}
 .play-icon {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 18px;
     background: rgba(0,0,0,.4);
 }
 .main-img-preview img,.main-img-preview video {width: 80%; height: 400px; display: none;cursor: zoom-in;margin: 0 auto}
 .main-img-preview img.active, .main-img-preview video.active {display: block;	}
 /* Product image Popup */
 .show-popup {
     position: fixed;
     inset: 0;
     background: rgba(0,0,0,.8);
     display: none;
     justify-content: center;
     align-items: center;
     z-index: 9999;
 }
 .show-popup.active {display: flex;}
 .popup-preview img, .popup-preview video { width: 550px; display: none; }
 .popup-preview .active { display: block; }
 .close-popup {
     position: absolute;
     top: 20px;
     width: 30px;height: 30px;
     right: 10px;
     color: #fff;
     cursor: pointer;
 }
 .popup-nav-arrow {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     cursor: pointer;
     user-select: none;
     z-index: 10;
 }
 .popup-nav-arrow svg,.show-popup svg{fill:var(--color-white-same);}
 .popup-nav-arrow.left { left: 20px; }
 .popup-nav-arrow.right { right: 20px; }
 .popup-thumbs-img{opacity: 0;width: 0}
 .popup-thumbs-img .thumb.active { border-color: var(--color-first); }
 .product-button .input-group .input-group-text{width:50px;color: var(--color-black);}
 .product-button .input-group{width: 100px}
 .product-button select{padding: 5px}
 .product-button select.form-select:hover,.product-button select.form-select:focus{
     border-color: var(--bs-border-color);
 }
 /* Product DESCRIPTION ACCORDIAN */
 #accordionProductDetails .accordion-item:first-of-type>.accordion-header .accordion-button,
 #accordionProductDetails .accordion-button:not(.collapsed),#accordionProductDetails button:focus:not(:focus-visible){
     background-color: transparent;box-shadow: none;
 }
 .productDetailSection table td,.productDetailSection table th{border: 0;padding: 0.2rem 0.5rem;
     background-color: var(--color-white);}
 /* COMPARE TABLE*/
 :root {
     --col1-width: 150px;
     --col2-width: 280px;
     --min-dynamic-col: 280px;
 }

 /* Mobile */
 @media (max-width: 767px) {
     :root {
         --col1-width: 100px;
         --col2-width: 200px;
         --min-dynamic-col: 200px;
     }
 }
 .compare-product-table {position: relative;display: flex;width: 100%;}
 /* FIXED COLUMN */
 /*.fixed-product-col {
   width: 370px;
   flex-shrink: 0;
   background: #f7f7f7;
   border-right: 1px solid #ddd;
 }*/
 .compare-product-table th:nth-child(-n+2),
 .compare-product-table td:nth-child(-n+2){position: sticky;left: -1px;background: var(--color-light-blue);
     min-width: var(--col1-width); width:var(--col1-width);z-index: 2}
 .compare-product-table th:nth-child(2),
 .compare-product-table td:nth-child(2){min-width: var(--col2-width);width: var(--col2-width); z-index: 1;left: 148px}
 /* SCROLLABLE AREA */
 /*.scroll-compare-products-col { overflow-x: auto; width: calc(100% - 150px);}	*/
 .scroll-compare-products-col { overflow-x: auto; width: 100%;flex: 1;}
 /* TABLE STYLES */
 .compare-product-table table { border-collapse: collapse; table-layout: fixed; }
 .compare-product-table th,.compare-product-table td {
     border: 1px solid #ddd;
     padding: 0.4rem 0.5rem;
     transition: width 0.25s ease;
 }
 .compare-product-table img {width: 150px;height: 150px}
 /*.scroll-compare-products-col {overflow-x: auto;scrollbar-gutter: stable both-edges;}*/
 /* Arrow base */
 .scroll-product-arrow {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     width: 40px;
     height: 40px;
     border: none;
     background: var(--color-white);
     box-shadow: 0 2px 8px rgba(0,0,0,.25);
     cursor: pointer;
     z-index: 20;
     font-size: 32px;
     line-height: 1;
     display: flex;
     align-items: center;
     border-radius: 50%;
     justify-content: center;
     transition: opacity .2s, transform .2s;
 }
 .scroll-product-arrow.left { left: 400px; /* after fixed column */ }
 .scroll-product-arrow.right { right: 0;}
 .scroll-product-arrow:hover {transform: translateY(-50%) scale(1.05);}
 /* Hide when disabled */
 .scroll-product-arrow.disabled {opacity: .3;pointer-events: none;}
 /* Default: show arrows (desktop) */
 .scroll-product-arrow { display: flex; }
 /* Hide arrows on mobile */
 @media (max-width: 767px) {
     .scroll-product-arrow {display: none;}
 }
 /*==================== PRODUCT DETAILS PAGE STYLES END =================*/
 /*==================== PRODUCT CATEORY PAGE STYLES =================*/
 /*========== FILTER WEB ===========================*/
 .filter-button{width: 35px;height: 35px;border-radius: 50%;line-height: 35px;text-align: center;
     background: var(--color-first);}
 .filter-button svg{fill: var(--color-white-same);}
 /*========== PRICE RANGE ==========================*/
 .range-slider {width: 100%;text-align: center;position: relative;}
 .range-slider .rangeValues {display: block;}
 input[type=range] {-webkit-appearance: none;border: 2px solid var(--color-white);width: 100%;position: absolute;left: 0;}
 input[type=range]::-webkit-slider-runnable-track {
     width: 100%;
     height: 5px;
     background: var(--color-light-2);
     border: none;
     border-radius: 3px;
 }
 input[type=range]::-webkit-slider-thumb {
     -webkit-appearance: none;
     border: none;
     height: 16px;
     width: 16px;
     border-radius: 50%;
     background: var(--color-first);
     margin-top: -4px;
     cursor: pointer;
     position: relative;
     z-index: 1;
 }
 input[type=range]:focus { outline: none;}
 input[type=range]:focus::-webkit-slider-runnable-track {background: #ccc;}
 input[type=range]::-moz-range-track {
     width: 100%;
     height: 5px;
     background: var(--bg-light);
     border: none;
     border-radius: 3px;
 }
 input[type=range]::-moz-range-thumb {
     border: none;
     height: 16px;
     width: 16px;
     border-radius: 50%;
     background: var(--color-first);
 }
 /*hide the outline behind the border*/
 input[type=range]:-moz-focusring {outline: 1px solid var(--color-white);outline-offset: -1px; }
 input[type=range]::-ms-track {
     width: 100%;
     height: 5px;
     /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
     background: transparent;
     /*leave room for the larger thumb to overflow with a transparent border */
     border-color: transparent;
     border-width: 6px 0;
     /*remove default tick marks*/
     color: transparent;
     z-index: -4;
 }
 input[type=range]::-ms-fill-lower {background: #777;border-radius: 10px;}
 input[type=range]::-ms-fill-upper {background: var(--bg-light);border-radius: 10px;}
 input[type=range]::-ms-thumb {
     border: none;
     height: 16px;
     width: 16px;
     border-radius: 50%;
     background: var(--color-first);
 }
 input[type=range]:focus::-ms-fill-lower {background: var(--color-black);}
 input[type=range]:focus::-ms-fill-upper {background: var(--color-light-2);}
 .color-filter-icon{width: 20px;height: 20px;border-radius: 50%;display: inline-block;}
 .beige{background-color: beige;}
 .black{background-color: black;}
 .blue{background-color: blue;}
 .green{background-color: green;}
 .gray{background-color: gray;}
 .brown{background-color: brown;}
 select.sort{width:230px}

 /* FILTER BLOCK START HERER */
 /* FILTER CHIPS */
 .filter-chip-bar { overflow-x: auto; }
 html[data-bs-theme=dark] .filter-section svg{fill: var(--color-white-same);}
 /*.filter-section{height:75px;}*/
 .filter-block{transition: visibility .3s; }
 .filter-block.scrolled{position: fixed;top: 107px;left: 0;right: 0;background-color: var(--color-white);
     z-index: 1000;visibility: visible; animation: slideDown .3s ease forwards;scrollbar-gutter: stable;
     box-shadow:0 1px 0 rgba(0,0,0,0.08);
 }
 @keyframes slideDown{
     0% { transform: translateY(-100%); }
     100% { transform: translateY(0%); }
 }
 @media screen and (max-width: 991px) {
     .filter-block.scrolled{top: 68px;}
 }
 @media screen and (max-width: 767px) {
     .filter-block.scrolled{top: 112px;}
 }
 .chip {
     white-space: nowrap;
     padding: 8px 15px;
     border-radius: 30px;
     background:transparent;
     font-size: 1rem;
     font-weight: 600;
     cursor: pointer;
 }
 .chip:hover,.chip.active {background-color: var(--color-light-blue); }
 /* OVERLAY */
 .filter-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: none; z-index:1021; }
 body.filter-open { overflow: hidden; }
 /* DRAWER */
 .filter-drawer {
     position: fixed;
     inset: 0;
     max-width: 400px;
     margin-left: auto;
     background-color: var(--color-white);
     display: flex;
     flex-direction: column;
     transform: translateX(100%);
     transition: transform .3s ease;
     z-index: 1030;
 }
 .filter-drawer.active { transform: translateX(0); }
 /* CONTENT */
 .filter-content { position: relative; flex: 1; overflow: hidden;  }
 /* PAGES */
 .filter-page,.filter-subpage {
     position: absolute;
     inset: 0;
     display: none;
     overflow-y: auto;
     padding-bottom: 30px;
     background: var(--color-white);
 }
 .filter-page.active,.filter-subpage.active {display: block;}
 /* HEADER */
 .filter-header {
     position: sticky;
     top: 0;
     padding: 12px;
     display: flex;
     background: var(--color-white);
     align-items: center;
     justify-content: space-between;
 }
 .back-btn,.close-filter { background: none; border: none; cursor: pointer; }
 .back-btn { display: none; }
 /* ROW */
 .filter-row,.filter-options label { padding: 14px; cursor: pointer; }
 /* FOOTER */
 .filter-footer {
     position: sticky;
     bottom: 0;
     background: var(--color-white);
     padding: 12px;
 }
 .btn-clear, .btn-apply{
     flex: 1;
     padding:10px 12px;
     border-radius: 30px;
     border: none;
     font-weight: 600;
 }
 .btn-clear { background:var(--color-white); }
 .btn-apply { background: var(--color-first); color: var(--color-white); }
 /* FILTER BLOCK END HERE */

 /*==================== PRODUCT CATEORY PAGE STYLES END =================*/
 /*==================== Deals PAGE STYLES =================*/
 .banner-bg1 {
     background-image: url("../../assets/img/deals/deals-banner.png");
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
 }
 .banner-bg2 {
     background-image: url("../../assets/img/trending-banner.png");
     background-size: cover;
     background-position: bottom center;
     background-repeat: no-repeat;
 }
 .banner-bg3 {
     background-image: url("../../assets/img/valentine’s/valentine’s-banner.png");
     background-size: cover;
     background-position: bottom;
     background-repeat: no-repeat;
 }
 .bg-valentine-1 {
     background-color: #f9e2e7;
 }
 /*==================== Deals PAGE STYLES END =================*/

 /*==================== MEDIA QUERY ============================*/
    @media screen and (max-width: 1400px) {
        .categories-img-block{width: 130px;height: 130px;}
        .categories-section .categories-img-block{width: 140px;height: 140px;}
    }
 @media screen and (max-width: 1200px) {
     .webContent .mainHeading, .webContent .article-contents h1 {font-size: 2rem;}
     .webContent .largeHeading {font-size:1.6rem;}
     .webContent .subHeading {font-size: 1.35rem;}
     .cards-2 .cards-2-text {padding: 16px 30px 16px 16px;}
     .text-xxxl {font-size: 3.5rem !important;}
     .cards-2 .cards-2-text .text-xxl {font-size: 22px !important;}
     .banner-cards-img-1 {height: 416px;}
     .owl-theme .owl-nav {top: -60px;}
     .px-3 .owl-theme .owl-nav {top: -56px;}
     .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {width: 28px;height: 28px;}
 }
    @media screen and (max-width: 1024px) {
        .banner-img-2 {height: 260px;}
        .text-xxxl {font-size: 3rem !important;}
        .card-section-2 .cards-2 .cards-2-img {height: 320px;}
    }
    @media screen and (max-width: 991px) {
        *{font-size: 15px;}
        .webContent .mainHeading, .webContent .article-contents h1 {font-size: 1.8rem;}
        .webContent .largeHeading {font-size:1.4rem;}
        .webContent .subHeading {font-size: 1.25rem;}
        p {font-size: 1rem;}
        .owl-theme .owl-nav {top: -56px;}
        .px-3 .owl-theme .owl-nav {top: -52px;}
        .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {width: 24px;height: 24px;}
        .compare-product-table th:nth-child(2),
        .compare-product-table td:nth-child(2),
        .compare-product-table th:nth-child(n+3){position: initial;}
        .banner-img-2 {height: 220px;}
        .text-xxxl {font-size: 2.6rem !important;}
        .card-section-2 .cards-2 .cards-2-img {height: 350px;}
        .section-5-img1 {height: 360px;}
    }
    @media screen and (max-width: 767px) {
        *{font-size: 14px;}
        .text-xxxl {font-size: 2rem !important;}
        .webContent .mainHeading, .webContent .article-contents h1 {font-size: 1.65rem;}
        .webContent .largeHeading {font-size:1.3rem;}
        .webContent .subHeading {font-size: 1.2rem;}
        p {font-size: 0.9rem;}
        .owl-theme .owl-nav {top: -49px;}
        .px-3 .owl-theme .owl-nav {top: -47px;}
        .tabs-product-section .owl-carousel {margin-top: 30px;}
        .tabs-product-section .owl-theme .owl-nav {top: -30px;}
        .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {width: 22px;height: 22px;}
        .banner-cards-img-1, .card-section-3 .cards-2 .cards-2-img, .cards-3-img {height: 260px;}
        .popup-preview img, .popup-preview video{width: 80%;}
        .popup-nav-arrow.left { left: 10px; }
        .popup-nav-arrow.right,.close-popup { right: 10px; }
        .thumbs-img{overflow-x: auto;max-width: 100%;overflow-y: hidden;white-space: nowrap;
            scrollbar-width: thin;-webkit-overflow-scrolling: touch;}
        .compare-product-table th:nth-child(1),
        .compare-product-table td:nth-child(1){min-width: 120px; width:120px;left: -2px}
        .compare-product-table th:nth-child(2),
        .compare-product-table td:nth-child(2),
        .compare-product-table th:nth-child(n+3){min-width: 200px !important;width: 200px !important;}
        .w-55 {width: 75% !important;}
        select.sort{width:170px}
        .section-5-img1 {height: 280px;}
        .banner-img-2 {height: 200px;}
    }
 @media screen and (max-width: 481px) {
     .compare-product-table th:nth-child(1),
     .compare-product-table td:nth-child(1){min-width: 80px; width:80px;}
     .compare-product-table .text-sm{font-size: 0.75rem !important}
     .main-img-preview img, .main-img-preview video{height: 300px}
 }
 @media screen and (max-width: 450px) {
        .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {margin-left: 0;margin-right: 0;}
    }
    @media screen and (max-width: 360px) {
        .categories-img-block{width: 120px;height: 120px;}
        .categories-section .categories-img-block{width: 120px;height: 120px;}
        .categories-section .owl-carousel .item {padding-top: 12px;}
    }

/*==================== SITEMAP PAGE STYLES ====================*/
.sitemapSection ul li{ padding-left: 25px; position: relative;}
.sitemapSection ul li:before{
    position: absolute;
    left:0px;
    top: 4px;
    color: var(--color-first);
    font-size: 13px;
    font-weight: 600;
    content: '\f054';/*\f192*/
    font-family: "FontAwesome";
}
