/* ==========================================================================
   IMPORT EXTERNAL LAZADA CSS – pulls in Lazada’s buyer UI styles
   ========================================================================== */
   @import url("https://g.lazcdn.com/g/??lzd/assets/0.0.7/dpl-buyeruikit/2.0.1/next-noreset-1.css,lzd/assets/0.0.7/dpl-buyeruikit/2.0.1/next-noreset-2.css,lazada/lazada-product-detail/1.7.4/index/index.css");

   /* ==========================================================================
      CUSTOM CSS OVERRIDES – Your custom rules follow and override the external CSS
      ========================================================================== */
   
   /* -------------------------------------
      ICONS, BREADCRUMBS, AND FONT RULES
   ------------------------------------- */
   .svgfont {
     display: inline-block;
     width: 1em;
     height: 1em;
     fill: currentColor;
     font-size: 1em;
   }
   
   /* Base breadcrumb styles */
   .breadcrumb_list {
     max-width: 100%;
     height: 48px;
     border-bottom: 1px solid #990000;
     margin: 0 auto;
     overflow: hidden;
     text-overflow: ellipsis;
     padding: 0 1em;
     box-sizing: border-box;
   }
   .breadcrumb_list_empty {
     height: 0;
     border: none;
     overflow: hidden;
   }
   .breadcrumb_list .breadcrumb {
     padding-left: 0;
     margin-left: -4px;
     height: 48px;
     vertical-align: middle;
     display: inline-block;
     white-space: nowrap;
   }
   .breadcrumb_list .breadcrumb .breadcrumb_item {
     position: relative;
     display: table-cell;
     vertical-align: middle;
     font-size: 13px;
     font-weight: 300;
     height: 48px;
   }
   .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text {
     vertical-align: middle;
     padding: 0;
     margin: 0;
     line-height: 100%;
     display: inline-block;
     font-weight: 300;
   }
   .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor {
     display: inline-block;
     vertical-align: middle;
     color: #990000;
     padding: 0 4px;
     font-size: 14px;
     font-family: Roboto-Regular, Helvetica, Arial, sans-serif;
     max-width: 200px;
     white-space: nowrap;
     line-height: 16px;
     overflow: hidden;
     text-overflow: ellipsis;
   }
   .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor_last {
     color: #757575;
     max-width: none;
     height: 16px;
     line-height: 16px;
     white-space: normal;
   }
   .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_right_arrow {
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAACKUExURUxpcYGBgYGBgYWFhYCAgICAgICAgIKCgv///4GBgZWVlYyMjIGBgYCAgIKCgoGBgYGBgaqqqoODg7+/v4GBgZKSko6OjoGBgYWFhYGBgYSEhIGBgZmZmYCAgIGBgYGBgYCAgICAgIGBgYCAgICAgIiIiICAgIeHh4GBgYSEhIODg4GBgYGBgYCAgPLijmAAAAAtdFJOUwCS7jCDi/E1AbYMFJrrK9ToAycEugcJtBfYG64Fp+S+vb+god0e4SLcHyPgwPJLUkAAAAB6SURBVDjLY2AYYoCdkwu/AgVdHTG8Crj5dUVE8aqQkNQVl8GrQkpDV1oYrwpVbV1ZQbwq1OV0lTnwqhAS0OXBr4KPV5cRf3AwM+myEghRNl0WihQQsoKQIwl5U0tOVwmfvKYa/qCWUsEfWYSim2CCkddVFKMs0Q5aAABM4wlSQJ87yAAAAABJRU5ErkJggg==);
     background-repeat: no-repeat;
     background-size: contain;
     display: inline-block;
     width: 16px;
     height: 16px;
     vertical-align: middle;
   }
   
   /* Hide unwanted dialogs/messages */
   .baxia-dialog,
   .m-common-more .link-lazada-ic-Message {
     display: none !important;
   }
   
   body {
     font-family: 'CustomFont', sans-serif !important;
   }
   
   /* -------------------------------------
      MOBILE ADAPTIVE STYLES FOR BREADCRUMBS
   ------------------------------------- */
   @media (max-width: 768px) {
     .breadcrumb_list {
       height: auto;
       padding: 0 0.5em;
     }
     .breadcrumb_list .breadcrumb {
       height: auto;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item {
       height: auto;
       font-size: 12px;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor {
       font-size: 12px;
       max-width: 120px;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor_last {
       font-size: 12px;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_right_arrow {
       width: 12px;
       height: 12px;
     }
   }
   @media (max-width: 480px) {
     .breadcrumb_list {
       padding: 0 0.25em;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor {
       max-width: 80px;
       font-size: 10px;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_item_anchor_last {
       font-size: 10px;
     }
     .breadcrumb_list .breadcrumb .breadcrumb_item .breadcrumb_item_text .breadcrumb_right_arrow {
       width: 10px;
       height: 10px;
     }
   }
   
   /* -------------------------------------
      THREE-COLUMN LAYOUT (Desktop)
   ------------------------------------- */
   .product-container {
     display: flex;
     gap: 40px; /* Adjust spacing between columns */
   }
   .product-image {
     width: 30%; /* Adjust percentage as needed */
   }
   .main-info {
     width: 40%; /* Adjust percentage as needed */
   }
   .delivery-sidebar {
     width: 30%; /* Adjust percentage as needed */
   }
   
   /* -------------------------------------
      PRODUCT TITLE STYLING
   ------------------------------------- */
   .pdp-mod-product-badge-title {
     white-space: normal !important;
     word-break: break-word !important;
     overflow-wrap: break-word !important;
     letter-spacing: normal !important;
     word-spacing: normal !important;
   }
   body .product-container .main-info .pdp-mod-product-badge-wrapper .pdp-mod-product-badge-title {
     display: block !important;
     width: 100% !important;
     margin: 0 !important;
     padding: 0 !important;
     font-size: 24px !important;
     line-height: 1.2 !important;
     white-space: normal !important;
     word-break: break-word !important;
     overflow-wrap: break-word !important;
     letter-spacing: normal !important;
     word-spacing: normal !important;
   }
   
   /* -------------------------------------
      CONTAINER & BACKGROUND OVERRIDES
   ------------------------------------- */
   html, body {
     background-color: #EFF0F5 !important;
     min-width: 0 !important;
   }
   #container,
   #root.pdp-block {
     max-width: 1188px !important;
     margin: 0 auto !important;
     padding: 0 !important;
     background-color: #fff !important;
     visibility: visible !important;
   }
   
   /* ==========================================================================
      ADDITIONAL CENTER BLOCK OVERRIDES (Column 2 – Product Details)
      ========================================================================== */
   
   /* 1) Reduce spacing between the star rating and the Admin field */
   #block-C7wdxsrWYA0 .pdp-review-summary {
     margin-bottom: 2px !important;
     padding-bottom: 0 !important;
   }
   #module_product_brand_1 .pdp-product-brand {
     margin-top: 2px !important;
     padding-top: 0 !important;
   }
   
   /* 2) Remove text decoration (underlines) from button text */
   #module_add_to_cart .pdp-button-text,
   #module_add_to_cart a .pdp-button-text {
     text-decoration: none !important;
   }
   
   /* 3) Add spacing after the center block (Column 2) */
   .main-info {
     margin-bottom: 20px !important;
   }
   
   /* ==========================================================================
      MOBILE ADAPTIVE OVERRIDES – Stack columns vertically on smaller screens
      ========================================================================== */
   @media (max-width: 768px) {
     .product-container {
       flex-direction: column;
     }
     .product-image,
     .main-info,
     .delivery-sidebar {
       width: 100%;
     }
     /* Add some spacing between vertical blocks */
     .product-image,
     .main-info {
       margin-bottom: 20px;
     }
   }
   
   /* Optionally, you may want to adjust font sizes or padding on mobile further */
   @media (max-width: 480px) {
     /* For example, reduce the product title size on very small screens */
     body .product-container .main-info .pdp-mod-product-badge-wrapper .pdp-mod-product-badge-title {
       font-size: 20px !important;
     }
     /* And adjust button text size */
     #module_add_to_cart .pdp-button-text {
       font-size: 16px !important;
     }
   }

.fixed-footer {
  display: flex;
  justify-content: space-around;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  padding: 2px 0;               /* Reduced vertical padding */
  background: linear-gradient(to bottom, #000000 5%, #000000 20%, #ff0000 100%);
  border-radius: 20px 20px 0 0;  /* Smaller rounded top corners */
  font-size: 12px;
}

/* Style links in the footer */
.fixed-footer a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #ffffff;               /* White text */
  text-transform: uppercase;    /* Capitalized text */
  flex: 1;                      /* Evenly distribute in row */
  padding: 4px 0;
}

/* Adjust image size inside the footer */
.fixed-footer img {
  width: 24px;
  height: 24px;
  margin-bottom: 2px;
}

/* On mobile, keep the three columns side-by-side */
@media (max-width: 768px) {
  .fixed-footer {
    flex-direction: row;  /* Ensure row layout remains */
  }
  .fixed-footer a {
    margin: 0;            /* Remove extra vertical margins */
  }
}

#module_add_to_cart a {
  text-decoration: none !important;
}

.spacer {
  width: 100%;
  height: 30px; /* Adjust as needed */
}