/* === Topbar Variables === */


/* category page content css start */
#shopmaster .woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
  float: left;
  margin: 0 0.7% 1.992em 0 !important;
    margin-left: 0px;
  padding: 0;
  position: relative;
   margin-left: 0;
}

#shopmaster  .woocommerce-page.columns-5 ul.products li.product, .woocommerce.columns-5 ul.products li.product {
  width: 19.1%;
}

#shopmaster .woocommerce-page.columns-6 ul.products li.product, .woocommerce.columns-6 ul.products li.product {
  width: 15.5%;
}

#shopmaster .woocommerce ul.products li.product h2.woocommerce-loop-product__title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  max-width: 100%;
  min-height: unset;
  max-height: unset;
}

#shopmaster .woocommerce ul.products li.product img {
  width: 100%;
  height: 350px;          /* Set to your desired portrait height */
  aspect-ratio: 3/4;      /* Portrait ratio (width/height = 0.75) */
  object-fit: contain;    /* Show whole image, do not crop/stretch */
  background: #f7f7fa;    /* Or any color you want for the "frame" */
  display: block;
  margin: 0 auto 12px auto;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(50,50,50,0.06);
}

/* category page content css end*/


/* carousel start*/
 /* Diwaker Carousel Styles */
:root {
    /* Default CSS Variables - can be overridden */
    --diw-carousel-bg: #fff;
    --diw-carousel-border: 1px solid #eee;
    --diw-carousel-radius: 14px;
    --diw-carousel-imageradius: 8px;
    --diw-carousel-shadow: 0 2px 10px rgba(0,0,0,0.07);
    --diw-carousel-title: #222;
    --diw-carousel-title-size: 16px;
    --diw-carousel-price: #117a1b;
    --diw-carousel-price-size: 15px;
    --diw-carousel-badge-sale-bg: #ffe4e1;
    --diw-carousel-badge-sale-color: #e31b23;
    --diw-carousel-badge-discount-bg: #e0f9e3;
    --diw-carousel-badge-discount-color: #22ad47;
    --diw-carousel-btn-bg: #333;
    --diw-carousel-btn-color: #fff;
}

/* Horizontal Carousel Styles */
.diw-carousel-wrapper { 
    display: flex; 
  width:99% !important;
    gap: 18px; 
}

.diw-carousel-card {
    background: var(--diw-carousel-bg);
    border: var(--diw-carousel-border);
    border-radius: var(--diw-carousel-radius);
    box-shadow: var(--diw-carousel-shadow);
    overflow: hidden;
    text-align: center;
    padding: 10px;
    position: relative;
    transition: box-shadow 0.3s;
}

.diw-carousel-card:hover {
    box-shadow: 0 2px 20px rgba(0,0,0,0.11);
}

.diw-carousel-img-wrap {
    position: relative;
    margin-bottom: 8px;
}

.diw-carousel-img {
 
    width: 100%;
  height: 320px;          /* Set to your desired portrait height */
  aspect-ratio: 3/4;      /* Portrait ratio (width/height = 0.75) */
  object-fit: contain;    /* Show whole image, do not crop/stretch */
 
    border-radius: var(--diw-carousel-imageradius);
 
    background: #fafafa;
    transition: transform 0.3s cubic-bezier(.4,1.5,.5,1);
}

.diw-carousel-img-wrap:hover .diw-carousel-img {
    transform: scale(1.08);
    transition: transform 0.3s cubic-bezier(.4,1.5,.5,1);
}

.diw-carousel-title {
    font-size: var(--diw-carousel-title-size);
    font-weight: bold;
    margin-bottom: 4px;
    color: var(--diw-carousel-title);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.diw-carousel-price {
    font-size: var(--diw-carousel-price-size);
    margin-bottom: 0;
    color: var(--diw-carousel-price);
    font-weight: bold;
}

.diw-carousel-badge-sale {
    position: absolute;
    left: 5px; 
    top: 5px; 
    z-index: 2;
    background: var(--diw-carousel-badge-sale-bg);
    color: var(--diw-carousel-badge-sale-color);
    font-size: 13px; 
    padding: 3px 9px; 
    border-radius: 8px;
    font-weight: bold; 
    box-shadow: 0 0 6px rgba(0,0,0,0.07);
}

.diw-carousel-badge-discount {
    position: absolute;
    right: 5px; 
    top: 5px; 
    z-index: 2;
    background: var(--diw-carousel-badge-discount-bg);
    color: var(--diw-carousel-badge-discount-color);
    font-size: 13px; 
    padding: 3px 9px; 
    border-radius: 8px;
    font-weight: bold; 
    box-shadow: 0 0 6px rgba(0,0,0,0.07);
}

/* Slick Dots */
.slick-dots {
    position: absolute;
    bottom: -50px !important;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    list-style-type: none;
    text-align: center;
}

/* Vertical Carousel Styles */
.diw-vertical-carousel-wrapper {
    background: var(--diw-carousel-bg);
    border-radius: var(--diw-carousel-radius);
    padding: 15px;
    overflow: hidden;
    box-shadow: var(--diw-carousel-shadow);
}

.diw-vertical-carousel-item {
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
}

.diw-vertical-carousel-item:last-child {
    border-bottom: none;
}

.diw-vertical-product-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}

.diw-vertical-product-link:hover {
    transform: translateX(5px);
}

.diw-vertical-product-image {
    width: 60px;
    height: 60px;
    margin-right: 12px;
    flex-shrink: 0;
    border-radius: var(--diw-carousel-imageradius);
    overflow: hidden;
    background: #fafafa;
}

.diw-vertical-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.diw-vertical-product-link:hover .diw-vertical-img {
    transform: scale(1.1);
}

.diw-vertical-product-info {
    flex: 1;
    min-width: 0;
}

.diw-vertical-product-title {
    font-size: var(--diw-carousel-title-size);
    font-weight: 600;
    color: var(--diw-carousel-title);
    margin-bottom: 4px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.diw-vertical-product-price {
    font-size: var(--diw-carousel-price-size);
    color: var(--diw-carousel-price);
    font-weight: bold;
}

/* Vertical Slick Arrows */
.diw-vertical-carousel-wrapper .slick-prev,
.diw-vertical-carousel-wrapper .slick-next {
    width: 30px;
    height: 30px;
    background: var(--diw-carousel-btn-bg);
    border-radius: 50%;
    right: 10px;
    left: auto;
    z-index: 3;
}

.diw-vertical-carousel-wrapper .slick-prev {
    top: 10px;
}

.diw-vertical-carousel-wrapper .slick-next {
    bottom: 10px;
    top: auto;
}

.diw-vertical-carousel-wrapper .slick-prev:before,
.diw-vertical-carousel-wrapper .slick-next:before {
    font-size: 14px;
    color: var(--diw-carousel-btn-color);
}

/* Responsive Design */
@media(max-width:600px) {
    .diw-carousel-wrapper { 
        gap: 8px; 
    }
    .diw-carousel-card { 
        padding: 7px; 
    }
    .diw-vertical-product-image {
        width: 50px;
        height: 50px;
        margin-right: 10px;
    }
    .diw-vertical-product-title {
        font-size: calc(var(--diw-carousel-title-size) - 1px);
    }
    .diw-vertical-product-price {
        font-size: calc(var(--diw-carousel-price-size) - 2px);
    }
}

/* carousel end*/

/* footer */
 /* Set background and text color for the whole footer section */
#shopmaster-footer {
  --shopmaster-bg: #131f23 !important;
  --shopmaster-text: #f9f9f9 !important;
  background: var(--shopmaster-bg) !important;
  color: var(--shopmaster-text) !important;
}

/* Make ALL inner rows and columns transparent, so the parent background shows */
#shopmaster-footer .et_pb_row,
#shopmaster-footer .et_pb_column,
#shopmaster-footer .et_pb_module,
#shopmaster-footer .et_pb_code_inner,
#shopmaster-footer .et_pb_text_inner {
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* Ensure text and links are visible and styled */
#shopmaster-footer,
#shopmaster-footer a,
#shopmaster-footer .et_pb_text_inner,
#shopmaster-footer .et_pb_code_inner {
  color: var(--shopmaster-text) !important;
}
#shopmaster-footer a {
  color: #fff !important;
  text-decoration: underline !important;
  transition: color 0.2s !important;
}
#shopmaster-footer a:hover,
#shopmaster-footer a:focus {
  color: #f2f2f2 !important;
}




/* footer category and products links css start */

.custom-product-categories,
.custom-latest-products {
  --cpc-bg: ;
  --cpc-border-radius: 0rem;
  --cpc-link-color: #fff;
  --cpc-link-hover-bg:  ;
  --cpc-link-hover-color: #f2f2f2;
  --cpc-link-active-bg: #fff;
  --cpc-link-active-color: #fff;
  --cpc-padding-x: 0rem ;
  --cpc-padding-y: 0.25rem;
  --cpc-gap: 0.2rem;
  --cpc-font-size: 1rem;
 
  --cpc-font-weight: 500;
  --cpc-margin: 0.5rem 0;
  --cpc-box-shadow: 0 2px 12px 0 rgba(30,40,90,0.07);
  --cpc-border: 0px solid #e8e8e8;
  background: var(--cpc-bg);
  border-radius: var(--cpc-border-radius);
  margin: var(--cpc-margin);
  padding: 0rem 0rem;
  box-shadow: var(--cpc-box-shadow);
  border: var(--cpc-border);
  list-style: none;
  width: 100%;
  max-width: 380px;
}
/* Easily disable border radius by adding 'no-radius' class */
.custom-product-categories.no-radius,
.custom-latest-products.no-radius {
  --cpc-border-radius: 0 !important;
}

/* Remove bullets, nice spacing for both */
.custom-product-categories li,
.custom-latest-products li {
  margin: var(--cpc-gap) 0;
  padding: 0;
}

/* All links styled identically */
.custom-product-categories a,
.custom-latest-products a {
  display: block;
  width: 100%;
  padding: var(--cpc-padding-y) var(--cpc-padding-x);
  color: var(--cpc-link-color) !important;
  background: transparent;
  border-radius: 1.5rem;
  font-size: var(--cpc-font-size);
  font-weight: var(--cpc-font-weight);
  text-decoration: none;
  transition: background 0.2s, color 0.2s, box-shadow 0.18s;
  box-shadow: none;
  border: none;
  line-height: 1.45;
  word-break: break-word;
    white-space: nowrap;          /* Prevents line breaks */
  overflow: hidden;             /* Hides overflow */
  text-overflow: ellipsis;      /* Shows ... if too long */
}

/* Hover & focus for both */
.custom-product-categories a:hover, 
.custom-product-categories a:focus,
.custom-latest-products a:hover,
.custom-latest-products a:focus {
  background: var(--cpc-link-hover-bg);
  color: var(--cpc-link-hover-color);
  box-shadow: 0 2px 10px 0 rgba(20,97,206,0.11);
}

/* Active/current category/product support (optional) */
.custom-product-categories a.active,
.custom-product-categories li.current-cat a,
.custom-latest-products a.active,
.custom-latest-products li.current-cat a {
  background: var(--cpc-link-active-bg);
  color: var(--cpc-link-active-color);
}
.et-l--footer ul {
  list-style-type: disc;
  padding: 0 0 0px 0em !important;
  line-height: 26px;
}
.custom-product-categories,
.custom-latest-products {
  list-style: none !important;
  padding-left: 0;
}
/* footer category and products links css end */
:root {
  --footer-contact-bg: #191d24;
  --footer-contact-primary: #19c381;
  --footer-contact-radius: 16px;
  --footer-contact-icon-size: 48px;
  --footer-contact-icon-inner-size: 28px;
  --footer-contact-label-color: #7e8a98;
  --footer-contact-label-size: 16px;
  --footer-contact-label-weight: 600;
  --footer-contact-value-color: #fff;
  --footer-contact-value-size: 20px;
  --footer-contact-value-weight: bold;
  --footer-contact-gap: 18px;
  --footer-contact-row-margin: 24px;
  --footer-contact-padding: 0px 0px;
}

.footer-contact-section {
  max-width: 400px;
  padding: var(--footer-contact-padding);
  border-radius: var(--footer-contact-radius);
  background: var(--footer-contact-bg);
}

.footer-contact-row {
  display: flex;
  align-items: center;
  margin-bottom: var(--footer-contact-row-margin);
}

.footer-contact-icon {
  width: var(--footer-contact-icon-size);
  height: var(--footer-contact-icon-size);
  background: var(--footer-contact-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: var(--footer-contact-gap);
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-size: var(--footer-contact-icon-inner-size) var(--footer-contact-icon-inner-size);
  background-position: center;
}

.footer-contact-icon.call {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M20.25 3.75v4.5m0-4.5h-4.5m4.5 0-6 6m3 12c-8.284 0-15-6.716-15-15V4.5A2.25 2.25 0 0 1 4.5 2.25h1.372c.516 0 .966.351 1.091.852l1.106 4.423c.11.44-.054.902-.417 1.173l-1.293.97a1.062 1.062 0 0 0-.38 1.21 12.035 12.035 0 0 0 7.143 7.143c.441.162.928-.004 1.21-.38l.97-1.293a1.125 1.125 0 0 1 1.173-.417l4.423 1.106c.5.125.852.575.852 1.091V19.5a2.25 2.25 0 0 1-2.25 2.25h-2.25Z'/%3E%3C/svg%3E");
}

.footer-contact-icon.email {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2024%2024%27%20stroke-width%3D%271.5%27%20stroke%3D%27white%27%3E%3Cpath%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20d%3D%27M16.5%2012a4.5%204.5%200%201%201-9%200%204.5%204.5%200%200%201%209%200Zm0%200c0%201.657%201.007%203%202.25%203S21%2013.657%2021%2012a9%209%200%201%200-2.636%206.364M16.5%2012V8.25%27/%3E%3C/svg%3E");
}

.footer-contact-label {
  color: var(--footer-contact-label-color);
  font-weight: var(--footer-contact-label-weight);
  font-size: var(--footer-contact-label-size);
  margin-bottom: 2px;
  line-height: 0.25;
}

.footer-contact-value {
  font-size: var(--footer-contact-value-size);
  font-weight: var(--footer-contact-value-weight);
  color: var(--footer-contact-value-color);
  line-height: 1.3;
}
.container {
    width: 100% !important;
    max-width: 100% !important;
}