/* PLP Filter panel */
.list-container {
    width:95%;
  }
  .pageTitleBox {color:#182859!important; font-size: 1.4rem; text-align: center;}
  .hide-content{
    display: none;
  }

  .pageTitleBox {display: flex; justify-content:center; align-items:center; padding: 0 3rem 1rem}
  .pageTitleBox h2 {padding-right: 5px; font-size: 1rem!important;}
  .pageTitleBox h1  {color: #182859; font-weight: bold; font-size: 1.5rem; line-height: normal;}
  .pageTitleBox span {color:#666; padding: 0 0 0 5px;}
  .pageTitleBox p {font-size: 1rem;}
  .rightPart {align-items: center;}
  .rightPart a:hover {text-decoration: underline;}
  .filtersTop {padding:10px 10px 0 0; font-size: 1.2rem; border-bottom: 1px solid #ccc;}
  .filtersTop label {font-weight: bold;}
  .filtersTop .slds-col {margin: 0;}
  .filter-container .slds-accordion__section.slds-is-open {background:#fff;}
  /* PLP Result Container */
  .filter-container .slds-accordion {
      margin: 15px 0 0 0;
    }
    .filter-container {
      padding: 10px 0 30px 10px;
      background: #eeeff2;
      border-right: 1px dashed #ccc;
      position: relative;
      transform: translateX(0);
      transition: width 0.5s;
      transition-timing-function: linear;
      /* margin: 0 20px 0 0; */
    }

    .filter-container.collapsed {
      width: 10px;
      margin: 0;
      min-width: 20px;
    }

    .filter-container.collapsed c-plp-filters-cmp {
      display: none;
    }

    .sortBox {
      padding: 0 0 10px;
      display: flex;
      justify-content: end;
      align-items: baseline;
      min-width: 250px;
    }
    .sortBox .slds-input_faux {min-height: 30px; line-height: 30px;}

    .sortBox .slds-context-bar__item {
      min-width: 200px;
    }

    .filterMessage {
      border: 5px solid red;
      text-align: center;
      padding: 20px;
      margin: 20px;
    }

    .cont {
      color: #182859;
      text-align: center;
      padding: 20px;
      max-width: 350px;
      background-color:#fff;
      top: 20px;
      left: 12%;
      min-height: 200px;
    }

    .cont h4 {
      font-size: 1.3rem;
    }

    .bannerWrap img {
      width: 100%;
    }

    .cont p {
      font-size: 1rem;
    }

    .collapsed {
      padding-left: 0px;
      background: none;
      transform: translateX(0);
      transition: width 0.5s;
      transition-timing-function: linear;
    }

    .plp-card {
      max-width: 224px;
      border: solid 1px #e2e2e2;
      border-collapse: collapse;
    }

    .b2c-plp-card {
      border: solid 1px #e2e2e2;
      border-collapse: collapse;
      padding: 5px; max-width: 223px;
      border-width: 0 1px 1px 0;
    }

c-retail-theme-layout .b2c-plp-card {max-width:224px!important}
.product-card-container.slds-large-size_12-of-12 .b2c-plp-card {max-width:221px!important}
c-retail-theme-layout .b2c-plp-card:nth-child(1), c-retail-theme-layout .b2c-plp-card:nth-child(2),
c-retail-theme-layout .b2c-plp-card:nth-child(3), c-retail-theme-layout .b2c-plp-card:nth-child(4),
c-retail-theme-layout .b2c-plp-card:nth-child(5), .product-card-container.slds-large-size_12-of-12 .b2c-plp-card:nth-child(6)
 {border-top: 1px solid #e2e2e2;}


    .plp-card .prdtSUbCodes {
      font-size: 0.8rem;
      color: #858585;
    }

    .showFilter {
      display: block;
    }

    .hideFilter,
    .mobileFilterPanel {
      display: none;
    }

    /* Mobile Filter Panel UI */

    .showFilter {
      display: block;
      min-width: 330px;
      position: absolute;
      min-height: 100%;
      background: #fff;
      Z-INDEX: 999;
      top:0;
      padding: 20px;
      left: -20px;
      background: #EEEFF2;
      box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px,
      rgba(0, 0, 0, 0.12) 0px -12px 30px,
      rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px,
      rgba(0, 0, 0, 0.09) 0px -3px 5px;
    }
    .showFilter .slds-button.slds-accordion__summary-action {background: #EEEFF2 ;}
    .showFilter .slds-accordion__summary-heading {margin: 0 0 0 10px;}

    .hideFilter {
      display: none;
    }

    .mobileFilter {
      height: 30px;
      width: 35px;
      position: absolute;
      /* top: 54px!important; */
      left: 3px;
      border-right: 1px solid #e2e2e2;
      display: none;
      bottom: 10px;
    }

    .mobileFilter .slds-button__icon {
      width: 25px;
      height: 25px;
      fill: #182859;
    }
  /* PLP left panel default filter option */
  c-plp-filters-cmp lightning-accordion lightning-accordion-section
  .slds-accordion__summary-content {font-weight:bold;}

  .slds-button.slds-accordion__summary-action {padding:5px 10px;}

    /* From Stylesheet */
    /* PLP  card */
  article.slds-card {border:0!important; box-shadow: none!important;}
  .productCarousal article.slds-card {min-height: 300px!important;}
  .plp-card .cardDesc {min-height:140px; font-size: 0.8rem; position: relative;}
  .plp-card .slds-card__body.slds-card__body_inner {margin-bottom:0; padding: 0 5px;}
  .plp-card .product-details {min-height:60px;}
  .plp-card .color-picker {min-height: 30px;}
  .plp-card .costTag {font-weight: bold; padding: 7px;}
  .plp-card .prdtCode, .plp-card .prdtSUbCodes {font-size: 0.8rem!important; color: #858585!important;}
  .prdtName {overflow: hidden; font-weight: bold;  text-overflow: ellipsis;display: -webkit-box!important;-webkit-line-clamp: 2;-webkit-box-orient: vertical; height: auto!important;}
   .active span {border:1px solid navy}
   .product-card-container.slds-size_12-of-12 .plp-card {max-width: 270px;}


   /* PLP Drawer code */
  .drawerBtn {position: absolute; right:-11px;  top:0; z-index: 9;}
  .drawerBtn button {background: #182859; padding: 5px; border-radius: 4px 0 0 4px; color: #fff!important;}

  .btnFilter button {background: #182859; border-radius: 0; padding: 5px 20px}
  .filter-container .slds-checkbox .slds-checkbox__label .slds-form-element__label {font-size: 0.8rem; font-weight: normal;}
  .slds-accordion__section.slds-is-open {background: #fff;}


  /* PLP Cards comps */
  .btnLogin a {color:#dd302a ;}
  /* PLP my range card */
  .plp-card-myRange {padding:10px 20px 0; text-align: center; min-height: 320px!important;}
  .plp-card-myRange .slds-card {border: 0; box-shadow: none;}
  .plp-card-myRange .desc {padding: 5px 20px 0;}
  .plp-card-myRange:hover {background: #F2F2F2;}
  .plp-card-myRange .slds-card__body {padding: 0;}
  .plp-card-myRange .slds-card__body .owl-item {padding:20px}
  .plp-card-myRange:hover .desc {background: #F2F2F2;}
  .plp-card-myRange .product-details {min-height:auto; max-height: 80px;}
  .hovLink a {visibility: hidden; text-align: center; color: #182859;}
  .hovLink a span {font-size: 1.5rem;}
  .plp-card-myRange .slds-card_body_inner {min-height: 300px;}
  .plp-card-myRange:hover .hovLink a {visibility: visible;}
  .plp-card-myRange .hovLink a {position: absolute; bottom:5px; display: block; text-align:center; left: 0; width:100%;}


  /* PLP  card */
  .plp-card .cardMedia {height:210px;}
  .plp-card .product-details {min-height: 80px;}
  .plp-card .prdtName {color: #182859!important;}
  .plp-card .color-picker {min-height: 40px;}
  .plp-card .product-image {max-height: 320px;}
  .product-card-container .product-image img {min-height: 190px; max-height:240px;}
  .product-card-container .active {border:1px solid #182859}
  .brand-image {position: absolute; right:5px; top: 0px; z-index:1;}

  /*Colour Picker Styling*/
  .color-picker ul li.active {
      border-color:#d52f2a;
  }

  /*
  .color-picker ul li.active::after {
      content: ''; position: absolute; left: 0; right: 0; bottom: 0; top: 0;
      background: url(/resource/SelectedOkIcon) 50% 33.3%/18px 18px no-repeat;
  }
  */
  .color-picker {display: flex; justify-content: center}

  .color-picker ul.has-more-colours {
      position:absolute;
      z-index:99;
      bottom:0;
      background: #fff;
  }

  .color-picker .default-colours li {
      display: inline-block;
      border: 1px solid #fff;
      padding: 1px;
      cursor: pointer;
      max-width: 32px;
      max-height: 31px;
  }

  .color-picker .color-picker-all-colours li {
      display: inline-block !important;
      border: 1px solid #fff;
      padding: 1px;
      cursor: pointer;
      max-width: 32px;
      max-height: 31px;
  }

  .color-picker ul li .colour-item-container {
     width:25px;
     height:25px;
     border:1px solid #ccc;
     text-align: left; padding: 0;
  }
  /*Single Colour*/
  .color-picker ul li.items1 .colour-item {
      float:left;
      height: 100%;
      width: 100%;
      display:inline-block;
      border:none !important;
  }

  /*Two Colours*/
  .color-picker ul li.items2 .colour-item {
      float:left;
      height: 100%;
      width: 50%;
      display:inline-block;
      border:none !important;
  }

  /*Three Colours*/
  .color-picker ul li.items3 .colour-item {
    float:left;
    height: 100%;
    width: 33.33%;
    display:inline-block;
    border:none !important;
  }

  /*+ MORE colour options*/
  .show-more-button {
      text-align: center;
      border-color: transparent;
      font: 700 8px/1.1 Arial, Helvetica, sans-serif;
      color: #7a808a;
      text-transform: uppercase;
      vertical-align: top;
      padding: 2px !important;
  }

  /* mobile filter panel
  TO DO by Sandesh D
  .sortBox {margin-top: -40px;}
  .items1 {display: none;}
  .color-picker div.items1:nth-child(1), .color-picker div.items1:nth-child(2), .color-picker div.items1:nth-child(3),
  .color-picker div.items1:nth-child(4), .color-picker div.items1:nth-child(5) {display: block!important;}
  */

  /*Product Image*/
  .product-image {
      position: relative;
      width: 360px;
      max-width: 100%; min-height: 220px;
  }

  .product-image .image-hover {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      bottom: 0;
      object-fit: contain;
      opacity: 0;
      transition: opacity .9s;
      background-color: #fff;
  }

  .product-image:hover .image-hover {
      opacity: 1;
  }


  .product-image .logo-options-available {
      width: 100%;
      position: absolute;
      bottom: 0;
  }

  .product-image .logo-options-available li:nth-child(2) {
      padding-left:2px;
      padding-right:2px;
  }

  .product-image .logo-options-available img {
      max-height: 40px;
      min-height: 40px;
  }

  /*Pricing Section*/
  .price-box {
      width: 90%;
      margin: 0 auto;
      bottom: 0;
      position: absolute; padding:0 0 5px 0;
  }

  .price-box span {
      color:#182859;
      font: 0.9rem "ProximaNovaSemibold", Arial, Helvetica, sans-serif;
      font-weight:bold;
  }

  .price-box small {
      vertical-align: baseline;
      font: 700 0.6rem Arial, Helvetica, sans-serif;
      color:#858585;
  }

  .overlay {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 10px;
      right: 0;
      height: 50px!important;
      width: 50px!important;
      transition: .3s ease;
  }
  .overlay-icon {
      color: white;
      font-size: 100px;
      position: absolute;
      width:50%;
      height:50%;
      z-index: 1;
      top: 10px;
      left: 10px;
      transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      text-align: center;
  }

  ol.lwc-1okeam5n5rs li.lwc-1okeam5n5rs p.lwc-1okeam5n5rs {
    line-height: 25px;
  }

   /* Responsive Media Query  */
   @media screen and (max-width: 1023px) {

      .hideFilter,
      .filter-container {
        display: none;
      }

      .mobileFilter {
        display: block;
      }
    }
   @media screen and (max-width: 767px) {

      /* PLP Listing */
      c-plpresultscontainer_plpresultscontainer.slds-grid {margin: 0;}
      .plp-card {max-width: 300px!important; margin: 0 auto;}
          /* PLP Sort section */
          .sortBox {margin: 0!important;}
          .sortBox label {min-width:70px; margin: 0;}
          .sortBox .slds-form-element__control .slds-combobox_container, .sortBox .slds-combobox_container {max-width: 180px;}
          .mobileNone {display: none!important;}

        /* PLP page mobile */
        .plp-card .product-image, .plp-card .product-image img {min-height: 130px!important; max-height: 160px!important;}
        .product-card-container .plp-card .cardMedia {height: 160px;}
        .product-card-container .plp-card {border-right: solid 1px #e2e2e2!important;
            border-collapse: collapse;
            border-bottom: solid 1px #e2e2e2!important;}
    .product-card-container .plp-card:nth-child(even) {border-right:0!important}

   }