/** Shopify CDN: Minification failed

Line 229:0 Comments in CSS use "/* ... */" instead of "//"
Line 230:0 Comments in CSS use "/* ... */" instead of "//"
Line 231:0 Comments in CSS use "/* ... */" instead of "//"
Line 234:0 Comments in CSS use "/* ... */" instead of "//"
Line 235:0 Comments in CSS use "/* ... */" instead of "//"
Line 236:0 Comments in CSS use "/* ... */" instead of "//"
Line 238:0 Comments in CSS use "/* ... */" instead of "//"
Line 239:0 Comments in CSS use "/* ... */" instead of "//"
Line 240:0 Comments in CSS use "/* ... */" instead of "//"
Line 241:0 Comments in CSS use "/* ... */" instead of "//"
... and 139 more hidden warnings

**/
:root {
  --dark-green: #183e40;
  --dark-green-hover: #818f92;
  --dark-green-300: #597175;
  --light-green: #0d6363;
  --light-cyan: #e7efef;
  --light-green-100: #b4cfcf;
  --gray: #d9d9d9;
  --dark-grey: #2c2c2c;
  --light-mauve: #dad4de;
  --dark-rose: #a47379;
  --cream: #ece2df;
  --white: #fff;
  --grey-50: #f7f7f7;
  --grey-100: #e5e5e5;
  --grey-300: #ababab;
  --grey-500: gray;
  --grey-700: #4d4d4d;
  --error: #c21419;
  --warning: #f08532;
  --success: #2d9033
}
.pagination {
  background: unset;
  border-radius: unset;
  border-width: 0;
  justify-self: center;
  display: flex
;
  align-items: center;
  max-width: 100%;
  overflow: hidden;
}
.pagination {
  background: unset;
  border-radius: unset;
  border-width: 0;
  justify-self: center;
  display: flex;
  align-items: center;
  max-width:100%;
  overflow:hidden;
}
span.pagination__parts {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
}
 span.pagination__parts a{
  border-radius: 50%;
  border-width: 1px;
  padding: 0.185rem 0.56525rem;
  height: 2rem;
  width: 2rem;
  align-items: center;
  justify-content: center;
  display: flex;
}
.diamond-pagination {
  margin: 20px;
}
div#diamond_search_wrapper {
  max-height: unset;
}
span.pagination__parts span{
  border-radius: 50%;
  border-width: 1px;
  padding: 0.185rem 0.56525rem;
  height: 2rem;
  width:2rem;
  align-items: center;
  justify-content: center;
  display: flex;
  border-color:#1D1D1B;
}
.animated-arrow{
  border-radius: 50%;
  border-width: 1px;
  padding: 0.185rem 0.56525rem;
  height: 2rem;
  width: 2rem;
  border-color:currentColor;
  box-sizing:border-box;
}
nav.collection__pagination .pagination__item {
  padding-inline-start: var(--spacing-3);
  padding-inline-end: var(--spacing-3);
}
.ir364-filter-type{ 
display: flex;
font-family: 'Avenir Medium';
border: 1px solid currentColor;

padding: 10px;
column-gap: 8px;
@media(min-width:768px) and (max-width:1023px){
    padding: 10px 4px;
    border:0;
}
svg {
    width: 20px;
    height: 20px;
}
span{
    height: 20px;
    display: block;
}
.ir364-filter-type__text{
  color: var(--dark-grey,#2c2c2c);  
  @media(min-width:768px) and (max-width:1024px){
    display: none
  }
}
&:hover{
    color: var(--grey-300);
    svg rect{
        fill: var(--grey-300);
    }
}
&.active{
    color: var(--light-green);
    .ir364-filter-type__text{
        color: inherit;
    }
    svg rect{
        fill: var(--light-green);
    } 
}    
&:not(.active):last-child{
    border-left:0;
}
&:not(.active):first-child{
    border-right: 0;
}
cursor: pointer;
}
.align-items-center {
align-items: center;
}
.d-flex {
display: flex
;
}
.ml-auto {
margin-left: auto !important;
}
.dropdown--sort-by2 {
z-index: 15;
}
.dropdown--sort-by, .dropdown--sort-by2 {
border: 1px solid var(--gray);
display: flex
;
gap: 1rem;
position: relative;
z-index: 1031;
}
.ml30 {
margin-left: 30px;
}
.dropdown--sort-by .dropdown-toggle, .dropdown--sort-by2 .dropdown-toggle {
cursor: pointer;
padding: 10px 16px;
height: 40px;
white-space: nowrap;
display: flex
;
align-items: center;
}
.dropdown--sort-by .item-name, .dropdown--sort-by2 .item-name {
flex-grow: 1;
position: relative;
top: 2px;
min-width: 130px;
text-align: left;
}
.caret {
margin-left: 12px;
border: none;
height: 8px;
width: 17px;
background: url(https://css.brilliantearth.com/static/img/icon/svg/drop-down2-black.svg?v1) center center no-repeat;
background-size: 100% auto;
}
div#js_dropdown_sort_by .filterScrollbar {
opacity: 0;
display: none;
}
div#js_dropdown_sort_by .filterScrollbar.show {
display: block;
opacity: 1;
position: absolute;
top: 40px;
z-index: 999999;
left: 0;
width: 100%;
}
.ir364-filter-type--wrapper {
display: flex;
flex-direction: row;
}
.d-flex .flex-fill{
flex: 1 1 auto!important
}
.ir364-listing-grid{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-column-gap: 16px;
grid-row-gap: 24px;
padding-top: 24px;
padding-left: 12px;
padding-right: 6px;
//   @media (max-width: 1259px){
//     grid-template-columns: 1fr 1fr;
//   }
.wide-item{ 
grid-column: span 3; 
// @media (max-width: 1259px){
//     grid-column: span 2;
// }
}
//   .wide-item .try-diamond-finder{
//     padding-top: 16px;
//     padding-bottom: 16px !important;
//     background-color:#F9F6F5;
//     display: grid; place-items: center;
//     height: 76px !important;
//   }
//   .wide-item .try-diamond-finder .btn{ font-size: 14px; border-radius: 0; }
}

.ir364-search-results-thumbnail{
border: 0;
padding: 0;
.thumbnail-caption {
    padding-top: 8px;
}
.thumbnail-badging{
    top:0;
    padding-left: 8px;
}  
.thumbnail-badge {
    margin-bottom: 4px;
    height: 20px;
}
.thumbnail-imgs{
    position: relative;
    cursor: pointer;
    aspect-ratio: 1/1; background: #f9f9f9; display: flex; align-items: center;
}
.thumbnail-imgs .hideImage {
    pointer-events: none;
}    
.thumbnail-checkbox{
    margin-left: 8px;
}
.thumbnail-wishlist{
    margin-left: 8px;
}
.thumbnail-checkbox .checkbox-ty4-green{
    min-height: auto;
}
.thumbnail-checkbox .checkbox-ty4-green i{
    width: 18px;
    height: 18px;
}
.thumbnail-link{
    margin-top: 8px;
    .ir251-link-text{
        font-size: 14px;
    }
    + .thumbnail-link{
        margin-bottom: 11px;
    }
}
.btn-outline-dark{
    border-color: var(--gray);
    box-shadow: none;
}
.checkbox-ty4-green{
    position: relative;
}
.checkbox-ty4-green:after{
    color: #000;
    font-family: "Avenir Book";
    font-size: 11px;
    font-style: normal;
    content: "Compare";
    padding: 2px 12px;
    padding-top:4px;
    border-radius: 2px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
    position: absolute;
    right: 0;
    top: 33px;
    background: #F9F9F9;
    display:none;
}
@media(pointer:fine){
    .checkbox-ty4-green:hover::after{
        display: block;
    }
}
} 
.checkbox-ty4-green .icons-checkbox{
background-color: white;
border: 1px solid var(--gray);
}
.checkbox-ty4-green .icons-checked{
background-color: var(--light-green);
border-color:var(--light-green);
background-image:url("/static/img/icon/svg/check-mark--round--white.svg");
}
.ir364-search-results-thumbnail .add-video-bg.add-video-bg--center img{
top: 50%;transform: translateY(-50%);
}

// useless start
.widget-filter__item--v2{
.widget-filter__name {
    font-family: 'Avenir Medium';
    padding-top: 4px;
    display: block;
    padding-bottom: 0;
    border: none;
}
.widget-filter__name:hover,.widget-filter__name:active{
    text-decoration:underline;
}
.widget-filter__cont {
    padding: 12px 16px;
}
.widget-filter__name .caret{
    position: relative;
    top: -1px;
}
&:has(.in),&:has(.collapsing){
    border-color: var(--gray);
}
margin-bottom: 8px;
border: 1px solid transparent;
} 
// useless end
.ir364-search-results-grid{
.filterScrollbar:before{
    display: none;
}
.viewport-v2{
    height: auto;
    /** overflow: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    **/
}
} 

.additional-details-grid{
display: grid;grid-template-columns: 1fr 1fr; 
grid-column-gap: 16px; grid-row-gap: 8px;text-align: left;
}
//search info
#limited-results-note, #grid_limited-results-note { background-color: #ffffff; color: var(--dark-grey); cursor: default; height: 60px; max-height: 60px; width: 100%; display: table; text-transform: none; }
#limited-results-note > div, #grid_limited-results-note > div { display: table-row; }
#limited-results-note p, #grid_limited-results-note p { color: #959595; display: table-cell; font-size: 12px; text-transform: uppercase; vertical-align: middle; }
#limited-results-note .message{color:var(--dark-grey);text-transform:none;font-size: 14px;}
#limited-results-note p.ico, #grid_limited-results-note p.ico{ padding:0 0.5em; font-size:20px; text-align:center; width: 40px;    padding-right: 0 !important;}


.per-product {
display: block;
} 
.thumbnail {
display: inline-block;
display: block;
height: auto;
max-width: 100%;
padding: 4px;
line-height: 1.428571429;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 4px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.ir327-badge, .ir327-pdp-badge--larger, .ir327-pdp-badge {
font-family: "Avenir Heavy";
color: var(--dark-grey);
display: block;
background: #fff;
overflow: hidden;
font-size: 8px;
text-transform: uppercase;
padding: 7px 10px 6px 10px;
text-align: center;
border-radius: 50em;
line-height: 1em;
}
.ir364-search-results-thumbnail .thumbnail-badging {
top: 0;
padding-left: 8px;
}
.full-width {
width: 100%;
}
@media (min-width: 768px) {
.thumbnail-badging {
    left: 50%;
    transform: translatex(-50%);
    -webkit-transform: translatex(-50%);
    -moz-transform: translatex(-50%);
    -ms-transform: translatex(-50%);
    width: 220px;
}
}
.thumbnail-badging {
min-height: 32px;
display: flex
;
text-align: right;
align-items: center;
position: absolute;
z-index: 5;
padding: 5px;
padding-right: 8px;
}
.ir364-search-results-thumbnail .thumbnail-link {
margin-top: 8px;
}
.display-block {
display: block !important;
}

.btn-outline-dark {
font-family: "Avenir Medium";
letter-spacing: .05em;
background-color: #fff;
color: var(--dark-grey);
border-color: var(--dark-grey);
}
.btn-outline-dark {
color: #2c2c2c;
border-color: #2c2c2c;
}
.ir364-search-results-thumbnail .btn-outline-dark {
border-color: var(--gray);
box-shadow: none;
}
.thumbnail-link {
position: relative;
}
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: normal;
line-height: 1.428571429;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
border: 1px solid transparent;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
.diamond-search-hybrid{
display: flex;
/* height: calc(100vh - 100px); */
height: 100%;
width: 100%;
gap: 30px;
@media(max-width:1279px) and (min-width:1024px){
  gap: 24px;
}
}
.diamond-search-hybrid__filter{
width: 382px;
//padding-right: 20px;
flex-grow: 0;
flex-shrink: 0;
//border-right: 1px solid var(--gray);
--sticky-top: 0px;
position: sticky;
top: var(--sticky-top);
height: 100vh;
background-color: white;
.filterScrollbar{
  height: 100%;
  overflow: auto;
  padding-right: 27px;
  width: 100%;
  @media(min-width:1024px){
    --sb-size: 6px;
  }
}
.widget-filter__name{
  .caret{
    margin-right: 3px;
  }
}
.noUiSlider .ui-slider-left-cap, .noUiSlider .ui-slider-right-cap {
  height: 4px;
}
.tab-diamond-origin li a{
  white-space: nowrap;
}
@media(max-width:1279px) and (min-width:1024px){
  padding-bottom: 0;
  width: 290px;
  .filterScrollbar{
    padding-right: 8px;
  }
  .rose-slick-mobile{
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media(max-width:1023px){
  transform: translate3d(-460px, 0, 0);
  transition: transform 0.3s ease-out, opacity 0.4s ease-in-out;
  position: fixed;
  z-index: 107161;
  top: 0;
  bottom: 0;
  left: 0;
  background-color: white;
  width: 400px;
  padding: 16px;
  padding-top: 10px;
  .filterScrollbar{
    margin-right: -12px;
    padding-right: 8px;
    padding-bottom: 10px;
  }
  &.is-active{
    transform: translate3d(0px, 0, 0);
  }
  .widget-filter__item:nth-child(2) .widget-filter__name{
    border-top: 0;
  }
  .listing-selector-box--diamond,.filterScrollbar:before,.widget-filter__item--origin{
    display: none;
  }
}

@media(min-width:1024px){
  .widget-filter__footer,.widget-filter__header{
     display: none;
  }
  .widget-filter-shadow{
    padding-bottom: 15px;
  }
}
.filterScrollbar:after{
  display: none;
}

}
.tab-diamond-origin--paid-wrapper{
width: 306px;
@media(min-width:1024px){
  display: none;
}
@media(max-width: 1023px){
  width: auto !important;
  .tab-diamond-origin li a,.tab-diamond-origin li span{
    padding: 8px 16px;
    white-space: nowrap;
  }
}
}


.diamond-search-hybrid__body{
flex-grow: 1;
@media(max-width:1023px){
  width: 100%;
  .dropdown--sort-by2{
    margin-left: 16px !important;
  }
}
.popover-green3{    
  bottom: auto;
  top: 34px;
  transform: translateX(-45%);
  left: 50%;
  text-transform: none;
  width: 197px;
  &.fade {
    -webkit-transition: opacity 0.1s linear;
    transition: opacity 0.1s linear;
  }
}
}
//common
.radio-green-cricle i.icons-checked:after{
background-color: var(--light-green);
}
.radio-green-normal {
position: relative;
padding-left: 25px;
i{
  left: 0;
}
}
.diamond-search-hybrid{
.iconfont-help1 {
  cursor: pointer;
  opacity: 0.2;
  font-size: 16px;
  position: relative;
  top: -2px;
  color: inherit;
}
}

.nav-loose-diamond-section--bullet{

.nav-loose-diamond-box{
  align-items: center;
}
.nav-loose-diamond{
  max-width: 200px;
  height: 44px;
  padding: 3px;
  border: 1px solid var(--grey-300);
  border-radius: 50px;
  li{
    border-radius: 50px;
  }
  a{
    font-family: "Avenir Roman";
    min-width: unset;
    border: none;
    padding-top: 11px;
    /* padding-top: 15px;
     padding-bottom: 10px;*/
  }
}
}
.rose-diamond-shape--search{
display: block;
li{
  float: left;
  width: 70px;
}
}
.tab-looking-suggestion{
color: var(--dark-grey);
text-align: center;
font-size: 12px;
display: flex;
padding-bottom: 8px;
align-items: flex-start;
gap: 8px;
align-self: stretch;
li{
  cursor: pointer;
  display: flex;
  padding: 10px 4px 6px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex: 1 0 0;
  border-radius: 50px;
  border: 1px solid var(--grey-300);
  @media (pointer: fine){
    &:hover{
      background-color:var(--light-green-100);
      border-color:var(--light-green-100);
    }
  }
  &.active{
    color: var(--white);
    border-color: var(--light-green);
    background-color: var(--light-green);
  }
  &.disabled{
    pointer-events: none;
    position: relative;
    color:var(--grey-300);
    border-color:var(--gray);
  }
}
}
.tab-diamond-origin{
color: var(--dark-grey);
text-align: center;
font-size: 12px;
display: flex;
padding-bottom: 8px;
align-items: flex-start;
gap: 8px;
align-self: stretch;
li{
  cursor: pointer;
  gap: 8px;
  flex: 1 0 0;
  padding: 0;
  a,span{
    border-radius: 50px;
    padding: 10px 4px 6px;
    display: block;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--grey-300);
    text-decoration: none;
  }
  a:hover{
    background-color:var(--light-green-100);
    border-color:var(--light-green-100);
  }
  &.active{
    a,span{
      color: var(--white);
      border-color: var(--light-green);
      background-color: var(--light-green);
    }
  }
}
}

.our-diamond-collections{
display: flex;
padding: 12px;
flex-direction: column;
align-items: flex-start;
border: 1px solid var(--Primary-Light-Green-500--Normal, #0D6363);
background: var(--Primary-Light-Green-50, #E7EFEF);
}
.tab-filter-recommended-new{
//font-size: 12px;
font-family: "Avenir Medium";
 ;
list-style: none;
padding: 0;
text-transform: capitalize;
margin: 0;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
li {
  display: flex;
  height: 40px;
  gap: 8px;
  flex: 1;
  &:last-child{
    margin-left: -1px;
  }
  > a{
    background: #fff;
    border: 1px solid #d9d9d9;
    color: var(--dark-grey);
    text-decoration: none;
    margin: 0 -1px 0 0;
    padding: 10px;
    display: block;
    width: 100%;
  }
  &.active{
    a {
      background-color: #f9f9f9;
      cursor: default!important
    }
  }
  &:not(.active) a:hover{
     color:var(--light-green);
  }
}
.iconfont-help1 {
  opacity: 1;
  color: #cfcfcf;
}
}
.diamond-search-hybrid__body:has(.ir364-filter-type:last-child.active) .tab-filter-recommended-new{
box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.15);
}
.filter-search-results-new{
.filterScrollbar{
  --sb-size: 6px;
}
.filterScrollbar:before{
  display:none;
  //--sb-track-color: #f1f1f1;
}

.diamond-info-panel-detal {
  .additonal-details-content {
    > div:last-child {
      width: 22%;
    }
  }
}
.search-results-outline > thead > tr > th{
  border-bottom: none;
}
.search-results-outline thead th{
  font-size: 14px;
}
.diamond-info-panel{
  .headline {
    font-size: 18px;
  }
}
.diamond-info-panel-detal{
  display: flex;
  padding: 16px;
  gap: 16px;
  .additonal-details-content {
    font-size: 12px;
  }
  .diamond-info-panel{
    padding: 0;
  }
}
border: 1px solid #e5e5e5;
.search-result-table{
  td{
    font-size: 14px;
  }
}
.try-diamond-finder{
  .btn {
    font-size: 14px;
    border-radius: unset;
  }
}
}
.diamond-info-body{
flex: 1 1 0;
}
.diamond-info-body-inner{
display: flex;
gap: 16px;
}
.listing-selector-box--diamond{
padding-top: 20px;
border-top: 1px solid var(--grey-100);
margin-right: 35px;

}
.dropdown--sort-by2{
@extend .dropdown--sort-by;
z-index: 9;
.dropdown-menu{
  --sb-size: 6px;
}
.filterScrollbar:before{
  display: none;
}
@media(max-width: 991px) {
  .dropdown--sort-name {
    display: none;
  }
  .item-name {
    min-width: 50px;
  }
  &.open{
    .dropdown-menu {
      left: auto;
      border-top: 1px solid var(--gray)
    }
  }
}
}
.results-bar-tablet{
font-family: "Avenir Medium";
margin-top:20px;

}

.best-badge{
font-size: 8px;
font-family: 'Avenir Heavy';
color: var(--light-green);
line-height: normal;
letter-spacing: 0.4px;
text-transform: uppercase;
white-space: nowrap;
position: absolute;
bottom: 100%;
transform: translateX(-50%);
left: 50%;
}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr{
&.active{
  .best-badge{
    color: var(--grey-500);
  }
}
@media (pointer: fine) {
  &:hover{
    .best-badge{
      color: var(--grey-500);
    }
  }
}
}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr.active > td{

}
#search-scrollbar .viewport-v2  tr.collapsed .best-badge{
display:none;
}
.shop-by-style-filters-wrap {
text-align: center;
@media (max-width: 767px) {
  margin-left: -30px;
  margin-right: -15px;
}
}

.shop-by-style-filters {
max-width: 100%;
text-align: left;
padding-left: 1px;
padding-right: 1px;
display: inline-block;
.swiper-button-next, .swiper-button-prev {
  background-size: 10px auto;
  filter: grayscale(100%);
  //top: 85px;
  margin-top: -32px;
}

.swiper-button-next, .swiper-button-prev {
  //right: -40px;
  width: 44px;
  height: 44px;
  border-radius: 10em;
  background-color: white;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
}

.swiper-button-prev {

}

.swiper-button-disabled {
  display: none;
}

.swiper-slide {
  width: 145px;
  margin-right: 8px;
}

a:not(.has-placeholder) {
  display: block;
  text-decoration: none;

  img {
    border: 2px solid transparent;
    width: 145px;
    height: 157px;
    object-fit: cover;
  }

  &:hover {
    color: var(--grey-500);

    img {
      border-color: var(--grey-500);
    }
  }

  &.active {
    color: var(--light-green);

    img {
      border-color: var(--light-green);
    }
  }
  &.disabled{
    pointer-events: none;
    color: var(--gray);
  }
}
a.has-placeholder {
  display: block;
  text-decoration: none;
  .img-placehoder {
    border: 2px solid transparent;
    width: 145px;
    height: 157px;
  }
  img{
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  &:hover {
    color: var(--grey-500);

    .img-placehoder {
      border-color: var(--grey-500);
    }
  }

  &.active {
    color: var(--light-green);

    .img-placehoder {
      border-color: var(--light-green);
    }
  }
  &.disabled{
    pointer-events: none;
    color: var(--gray);
  }
}

.img {
  background: #f9f9f9;
}
}

.shop-by-style-filters__title {
font-family: "Avenir Book";
font-size: 14px;
font-style: normal;
line-height: normal;
text-transform: capitalize;
margin-top: 8px;
}

// filters-bar-entry
.filters-bar-box {
display: flex;
align-items: center;
padding-top: 8px;
padding-bottom: 8px;
justify-content: space-between;
}

.filters-bar-entry {
display: flex;
gap: 1rem;

.item-filters {
  cursor: pointer;
  padding: 10px;
  width: 132px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}

.item-name {
  font-family: "Avenir Medium";
  //flex-grow: 1;
  position: relative;
  top: 2px;
  text-align: center;
}

.item-filters {
  color: var(--white);
  background-color: var(--dark-green);

  img {
    margin-left: 8px;
  }

  &:hover {
    //background-color: var(--dark-green-hover);
    background-color: var(--dark-green-300);
  }
}
}

.dropdown--sort-by {
border: 1px solid var(--gray);
display: flex;
gap: 1rem;
position: relative;
z-index: 1031;

.dropdown-toggle {
  cursor: pointer;
  padding: 10px 16px;
  height: 40px;
  white-space: nowrap;
  display: flex;
  align-items: center;
}

.item-name {
  flex-grow: 1;
  position: relative;
  top: 2px;
  min-width: 130px;
  text-align: left;
}

.dropdown-menu {
  background-color: var(--white);
  box-shadow: none;
  border-radius: 0;
  margin-left: -1px;
  right: -1px;
  margin-top: -1px;
  border: 0;
  padding-top: 0;
  padding-bottom: 0;
  //border-color:var(--dark-grey);
  //background: #eaebec;

  & > li > a {
    padding: 10px 16px;
  }

  a {
    display: block;
    padding: 10px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: var(--dark-grey);
    white-space: nowrap;

    &:hover {
      background-color: #F8F8F8;
    }
  }
}

.caret {
  margin-left: 12px;
  border: none;
  height: 8px;
  width: 17px;
  background: url(/static/img/icon/svg/drop-down2-black.svg?v1) center center no-repeat;
  background-size: 100% auto;
}

&.open {
  //border-color: var(--dark-green-300);

  .caret-img {
    transform: rotate(180deg);
  }

  /*    .dropdown-toggle {
        background: var(--dark-grey);
        background: var(--dark-green-300);
        color: var(--white);
      }*/

  .caret {
    //background: url(/static/img/icon/svg/drop-down2-white.svg) center 2px no-repeat;
    transform: rotate(180deg);
  }

  .dropdown-menu {
    border: 1px solid var(--gray);
    border-top: none;
  }
}
}

//product results
.listing-grid {
transition: all 0.3s ease 0s;
width: 100%;
}

.listpage-hybrid.is-active {
.listing-grid {
  grid-template-columns: 1fr 1fr 1fr;
  @media (max-width: 1259px) {
    grid-template-columns: 1fr 1fr;
  }
  @media (max-width: 991px) {
    grid-template-columns: 1fr;
  }
  flex-grow: 1;
}

@media (max-width: 1259px) {
  .listing-grid-col[data-col-num="3"] {
    grid-column-start: 1 !important;
    grid-column-end: span 2 !important;
  }

}
@media (max-width: 991px) {
  .listing-grid-col:not([class*="grid-col-one"]) {
    grid-column-start: 1 !important;
    grid-column-end: span 1 !important;
  }
  .listing-grid-col.grid-col-one {
    grid-column-start: 1 !important;
  }
  .listing-grid-col.grid-col-one-first {
    grid-column-start: 1 !important;
  }
}
}


.filter-hybrid {
--sticky-top: 90px;
position: sticky;
z-index: 1031;
top: var(--sticky-top);
/*background-color: unset;*/
opacity: 0;
/*padding-right: 3rem;*/
//transform: translate3d(-290px,0,0);
/*transition: transform .3s ease-in-out,opacity .4s ease-in-out;*/
transition: width .3s ease;
width: 0;
overflow: hidden;
height: calc(100vh - var(--sticky-top));
max-height: calc(100vh - var(--sticky-top));
background-color: white;
}

.filter-hybrid-box {
display: flex;
flex-direction: column;
height: 100%;
opacity: 0;
transform: translate3d(-0.5rem, 0, 0);
transition: transform .3s ease-in-out, opacity .4s ease-in-out;
}

.listpage-hybrid {
.product-results-body {
  flex-grow: 1;
}

&.is-active {
  .filter-hybrid {
    /*min-width: calc(100% - 100px);*/
    width: 320px;
    padding-right: 20px;
    @media(max-width: 991px) {
      width: 350px;
    }
    flex-grow: 0;
    flex-shrink: 0;
    opacity: 1;
    //transform: translateZ(0);
    /*transition: all .3s ease-in-out .3s,opacity .4s ease-in-out .3s;*/
  }

  .filter-hybrid-box {
    opacity: 1;
    transform: translateZ(0);
    transition: transform .3s ease-in-out .3s, opacity .4s ease-in-out .15s;
  }
}
}

.listpage-hybrid {
display: flex;
/*height:calc(100vh - 100px);*/
height: 100%;
width: 100%;
}

.widget-filter {
//width: 400px;
padding: 24px;
}

.filters-flyout {
transform: translate3d(-400px, 0, 0);
transition: transform .3s ease-out, opacity .4s ease-in-out;
position: fixed;
z-index: 107161;
top: 0;
bottom: 0;
left: 0;
background-color: white;
width: 400px;

.close {
  font-size: 15px;
  color: var(--dark-grey);
  opacity: 1;
}

.filterScrollbar {
  margin-right: -12px;
  padding-right: 8px;
}

&.is-active {
  transform: translate3d(0px, 0, 0);
}
}

.widget-filter__item {
overflow: hidden;
}

.widget-filter__header {
color: black;
// font-family: "Avenir Medium";
font-size: 16px;
margin-bottom: 26px;
&--sm{
  font-size: 14px;
  font-family: 'Avenir Medium';
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 0;
  margin-left: -16px;
  margin-right: -16px;
  border-bottom: 1px solid var(--gray);
  .iconfont-close2{
    font-size: 16px;
    opacity: 1;
  }
}
}
.widget-filter__header__right{
position: absolute;
right: 16px;
top: 0;
}

.widget-filter__body {
overflow: auto;
padding-right: 24px;
}

.widget-filter__footer {
padding-top: 24px;
background-color: white;
margin-top: auto;
}

.filters-fixed__content {
display: flex;
flex-direction: column;
height: 100%;

.ir246-search-noUiSlider {
  .amount-min, .amount-max {
    padding-top: 7px;
  }
}

.ir246-search-noUiSlider {
  .noUi-horizontal {
    height: 4px;
  }

  .noUiSlider .noUi-handle {
    height: 16px;
    width: 16px;
  }

  .noUi-horizontal .noUi-handle {
    top: -5px;
  }
}
}

.listing-selector-set {
display: flex;
gap: 8px 16px;
font-size: 12px;
color: var(--grey-500);
flex-wrap: wrap;

.exposed-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.item {
  color: inherit;
  display: inline-block;
  white-space: nowrap;
  text-decoration: none;
  text-transform: capitalize;
  cursor: pointer;
  margin-right: 8px;
  &.disabled{
    cursor: default;
    pointer-events: none;
  }
}

.x {
  color: var(--dark-grey);
  margin-left: 8px;
  display: inline-block;
}
}

.listing-selector-box {
.exposed-filter, .listing-selector-set, .widget-filter__results {
  display: inline;
}
}

.widget-filter__results {
padding-right: 8px;
}

.widget-filter__results,
.widget-filter__name {
font-family: "Avenir Medium";
}

.widget-filter__name {
font-family: "Avenir Medium";
padding-top: 18px;
padding-bottom: 14px;
border-top: 1px solid var(--grey-100);
display: flex;
align-items: center;
justify-content: space-between;

&:hover, &:focus {
  text-decoration: none;
  color: var(--dark-grey);
}

.caret {
  border: none;
  display: inline-block;
  width: 10px;
  height: 10px;
  background: url(/static/img/icon/svg/drop-down.svg) center center no-repeat;
  transform: rotate(180deg);
  background-size: 9px auto;
}

&.collapsed {
  .caret {
    transform: rotate(0deg);
  }
}

}

.rose-slick-mobile {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 10px 8px;
flex-wrap: wrap;
font-size: 12px;
line-height: 1.2;
text-transform: capitalize;
text-align: center;
list-style: none;
padding-left: 0;

.filter-thumbnail {
  background-color: #F9F9F9;
  //background-color: #f2f2f1;
  display: block;
  width: 52px;
  height: 52px;
  border-radius: 100%;
  overflow: hidden;
  margin: 0 auto 5px;
  border: 2px solid transparent;
}
.bgColor{
  background-color: #f9f9f9;
}
.nobg{
  background-color: transparent;
}
li {
  font-size: 12px;
  font-family: "Avenir Light";

  a {
    text-decoration: none;
    text-align: center;
    display: inline-block;

    &:focus {
      color: var(--dark-grey);
    }
    @media (pointer: fine) {
      &:hover {
        color: var(--grey-500);
        .filter-thumbnail {
          border-color: var(--grey-500);
        }
      }
    }
    @media (pointer: coarse) {
      &:hover {
        color: var(--dark-grey);
      }
    }
    &.active {
      color: var(--light-green);

      .filter-thumbnail {
        border-color: var(--light-green);
      }
    }

    &.disabled {
      position: relative;
      display: block;
      pointer-events: none;
      &:after {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        background-color: rgba(255,255,255,0.5);
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
      }
      .filter-thumbnail {
        position: relative;
        border-color: var(--gray);
        &:before {
          content: '';
          position: absolute;
          width: 1px;
          height: 100%;
          left: 50%;
          background: var(--gray);
          transform: rotate(45deg);
        }
      }
    }
  }
}

img {
  display: block;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  object-fit: contain;
}

/*  &.uncircles{
    .filter-thumbnail{
      padding:3px;
    }
    img{
      width: 46px;
      height: 46px;
    }
  }*/


&.mini {
  .filter-thumbnail {
    width: 42px;
    height: 42px;
  }
}

&.mini-gemstone {
  .filter-thumbnail {
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 110% 110%;
  }
  li a.disabled{
    &:after{
      width: auto;
      height: auto;
      left: -2px;
      top: -2px;
      bottom: -2px;
      right: -2px;
    }
    .filter-thumbnail{
      border-color: white;
      box-shadow: 0 0 0 2px var(--gray);
    }
  }
  li a:hover{
    .filter-thumbnail {
      border-color: white;
      box-shadow: 0 0 0 2px var(--grey-500);
    }
  }
  li a.active{
    .filter-thumbnail {
      border-color: white;
      box-shadow: 0 0 0 2px var(--light-green);
    }
  }
}
&.minicircles {
  .filter-thumbnail {
    background-color: transparent;
    width: 32px;
    height: 32px;
  }
  .filter-thumbnail img {
    // transform: scale(1.1);
    border: 1px solid #fff;
  }
  li a.active,li a:hover{
    .filter-thumbnail {
      // border-color: transparent;
    } 
  } 
}
}

.rose-slick-4col {
> li {
  //width: 25%;
}
}

.rose-diamond-shape {
img {
  // transform: scale(0.9);
  width: 34px;
  transform: none;
}
}
.rose-diamond-shape-wireframe{
.filter-thumbnail-shape{
  display: block;
  margin:auto;
  margin-bottom: 5px;
  width: 38px;
  height: 38px;
}
img{
  background: url(/static/img/spirit/spirit-shape-y24.png) left top no-repeat;
  background-size: auto 76px;
  background-position-y: 2px;
  border-radius:0;
}
a.active{
  img{
    background-position-y: -39px;
  }
}
.round{
  background-position-x: 4px;
}
.oval{
  background-position-x: -224px;
}
.cushion{
  background-position-x: -137px;
}
.emerald{
  background-position-x: -410px;
}
.pear{
  background-position-x: -316px;
}
.radiant{
  background-position-x: -271px;
}
.princess{
  background-position-x: -43px;
}
.asscher{
  background-position-x: -92px;
}
.marquise{
  background-position-x: -180px;
}
.heart{
  background-position-x: -363px;
}
.other{
  background-position-x: -452px
}
.elongated-cushion{
  background-position-x: -495px;
}
}


.rose-metal-list {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 10px 8px;
text-align: center;
list-style: none;
padding-left: 0;

.custom-control {
  display: inline-block;
  text-align: center;
  &.disabled{
    &:after {
      content: '';
      display: block;
      background-color: rgba(255,255,255,0.5);
      position: absolute;
      left: -2px;
      top: -2px;
      bottom: -2px;
      right: -2px;
    }
    .custom-control-label i{
      position: relative;
    }
    .custom-control-label i:after{
      content: "";
      position: absolute;
      width: 1px;
      height: 100%;
      left: 50%;
      background: var(--gray);
      transform: skew(-45deg);
    }
    .custom-control-label {
      margin-bottom: 0;
      font-weight: 400;
        color: var(--grey-500);
        i {
          box-shadow: 0 0 0 2px var(--gray);
        }
    }
  }
}

.custom-control-label {
  cursor: pointer;
  margin-bottom: 0;
  font-weight: 400;
  @media (pointer: fine) {
    &:hover {
      color: var(--grey-500);

      i {
        box-shadow: 0 0 0 2px var(--grey-500);
      }
    }
  }
  @media (pointer: coarse) {
    &:hover {
      color: var(--dark-grey);
    }
  }
}

i {
  border-radius: 100%;
  width: 28px;
  height: 28px;
  border: 1px solid #fff;
  overflow: hidden;
  display: block;
  margin: 0 auto 15px;
}

span {
  font-size: 12px;
  font-family: 'Avenir Light';
  display: block;
  white-space: nowrap;
  cursor: pointer;
}

.custom-control-input:checked ~ .custom-control-label {
  i {
    box-shadow: 0 0 0 2px var(--light-green);
  }

  span {
    color: var(--light-green);
  }
}
// .custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label {
//   color: #6c757d;
// }

// .custom-control-input[disabled] ~ .custom-control-label i, .custom-control-input:disabled ~ .custom-control-label i{    background-color: #e9ecef;
// }

}

//others
.rose-match-set {
padding-left: 26px;
position: relative;
top: 1px;
&.checkbox-ty7-green:first-child,&.radio-green-cricle:first-child{
   margin-top: 1px;
}
&.checkbox-ty7-green:not(:only-child):not(:last-child){
  margin-bottom: 6px;
}
&.radio-green-cricle:not(:only-child):not(:last-child){
  margin-bottom: 9px;
}
&.radio-green-cricle i{
  margin-top: 2px;
  .mac &{
    margin-top:1px;
  }
}
&.radio-green-cricle i.icons-checked:after{
  background-color: var(--light-green);
}
span {
  font-size: 12px;
  font-family: 'Avenir Light';
  display: inline-block;
}
i{
  left: 0;
}
}

.btn-view-results {
font-size: 14px;
/*  background-color:var(--light-green);
  &:hover{
    background-color:var(--light-green-hover)
  }*/
}

.listingfulltile {
//margin:0 !important;
}

.filters-custom-switch {
display: flex;
font-size: 14px;

img {
  vertical-align: middle;
  margin: 0 8px;
}

.txt {
  position: relative;
  top: 2px
}

.custom-switch {
  margin-right: 24px;

  &:last-child {
    margin-right: 0;
  }
}

.custom-control-label,.custom-controled-label {
  display: flex;
  align-items: center;
}

.custom-switch {
  .custom-control-label::after,
  .custom-controled-label::after {
    top: 2px;
    left: -30px;
    background: white;
    border: none;
  }
}

.custom-switch {
  .custom-control-label::before,
  .custom-controled-label::before {
    top: 0;
    left: -32px;
    background: var(--gray);
    border: none;
  }

  .custom-controled-label::before {
    background: var(--dark-green);
  }
}
}

//css scrollbar
.widget-filter-shadow {
position: relative;
z-index: 2;

.widget-filter__item:first-child {
  .widget-filter__name {
    border-top: none;
  }
}
}

.filterScrollbar {
--sb-track-color: #ffffff;
--sb-thumb-color: #d9d9d9;
--sb-size: 4px;

.bottom-shadow {
  display: none;
}

&:before {
  content: "";
  height: 1px;
  position: sticky;
  right: 0;
  background: var(--grey-100);
  display: block;
  z-index: 5;
  top: 0;
}

&.is-active:before {
  //filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.15));
  //background:linear-gradient(to bottom, #d9d9d94d, transparent);
}



&.is-active:after {
  //filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.15));
  //background:linear-gradient(to top, #d9d9d94d, transparent);
  background: var(--grey-100);
}
}

.top-shadow {
display: block;
height: 10px;

}

.bottom-shadow {
display: block;
height: 10px;

&:before {
  content: "";
  height: 10px;
  filter: drop-shadow(0px -4px 4px rgba(0, 0, 0, 0.15));
  background: #ffffff;
  display: block;
  width: 100%;
  margin-top: 12px;
}
}

.filterScrollbar::-webkit-scrollbar {
width: var(--sb-size);
}

.filterScrollbar::-webkit-scrollbar-track {
background: var(--sb-track-color);
border-radius: 20px;
}

.filterScrollbar::-webkit-scrollbar-thumb {
background: var(--sb-thumb-color);
border-radius: 20px;
}

@supports not selector(::-webkit-scrollbar) {
.filterScrollbar {
  scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);
}
}

/*.c-scrollbox {
position: relative;
&::before {
  content: "";
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  display: block;
  height: 4px;
  margin-top:-4px;
  background: white;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
}
&::after {
  content: "";
  position: absolute;
  top: 0;
  display: block;
  width: 100%;
  height: 8px;
  background: white;
  border-top: 1px solid var(--grey-100);
}
}*/


//end scrollbar

.king-shopping-list {
padding: 0;
list-style: none;
color: var(--dark-grey);
font-size: 12px;
}

.filter-bar-sticky {
position: relative;
z-index: 10;
/*&.is-active {
  background: #FFF;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
  position: sticky;
}*/
}

/* 隐藏滚动条但允许滚动 */
/*
body::-webkit-scrollbar {
display: none; !* 适用于Chrome, Safari, 和 Opera *!
}
body::-webkit-scrollbar {
display: none;
height: 0;
width: 0
}*/

//custom switch

.modal-backdrop-filter {
background: #D9D9D9;
z-index: 107160;
mix-blend-mode: multiply;
&--sm{
  @media(min-width:1024px){
    display:none;
  }
}
}
.ir364-filter-type{
  display: flex;
  font-family: 'Avenir Medium';
  border: 1px solid currentColor;
  color: var(--gray);
  padding: 10px;
  column-gap: 8px;
  @media(min-width:768px) and (max-width:1023px){
      padding: 10px 4px;
      border:0;
  }
  svg {
      width: 20px;
      height: 20px;
  }
  span{
      height: 20px;
      display: block;
  }
  .ir364-filter-type__text{
    color: var(--dark-grey,#2c2c2c);  
    @media(min-width:768px) and (max-width:1024px){
      display: none
    }
  }
  &:hover{
      color: var(--grey-300);
      svg rect{
          fill: var(--grey-300);
      }
  }
  &.active{
      color: var(--light-green);
      .ir364-filter-type__text{
          color: inherit;
      }
      svg rect{
          fill: var(--light-green);
      } 
  }    
  &:not(.active):last-child{
      border-left:0;
  }
  &:not(.active):first-child{
      border-right: 0;
  }
  cursor: pointer;
}
.ir364-filter-type--wrapper {
display: flex;
flex-direction: row;
}
.d-flex .flex-fill{
flex: 1 1 auto!important
}
.ir364-listing-grid{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-column-gap: 16px;
grid-row-gap: 24px;
padding-top: 24px;
padding-left: 12px;
padding-right: 6px;
//   @media (max-width: 1259px){
//     grid-template-columns: 1fr 1fr;
//   }
.wide-item{ 
  grid-column: span 3; 
  // @media (max-width: 1259px){
  //     grid-column: span 2;
  // }
}
//   .wide-item .try-diamond-finder{
//     padding-top: 16px;
//     padding-bottom: 16px !important;
//     background-color:#F9F6F5;
//     display: grid; place-items: center;
//     height: 76px !important;
//   }
//   .wide-item .try-diamond-finder .btn{ font-size: 14px; border-radius: 0; }
}

.ir364-search-results-thumbnail{
  border: 0;
  padding: 0;
  .thumbnail-caption {
      padding-top: 8px;
  }
  .thumbnail-badging{
      top:0;
      padding-left: 8px;
  }  
  .thumbnail-badge {
      margin-bottom: 4px;
      height: 20px;
  }
  .thumbnail-imgs{
      position: relative;
      cursor: pointer;
      aspect-ratio: 1/1; background: #f9f9f9; display: flex; align-items: center;
  }
  .thumbnail-imgs .hideImage {
      pointer-events: none;
  }    
  .thumbnail-checkbox{
      margin-left: 8px;
  }
  .thumbnail-wishlist{
      margin-left: 8px;
  }
  .thumbnail-checkbox .checkbox-ty4-green{
      min-height: auto;
  }
  .thumbnail-checkbox .checkbox-ty4-green i{
      width: 18px;
      height: 18px;
  }
  .thumbnail-link{
      margin-top: 8px;
      .ir251-link-text{
          font-size: 14px;
      }
      + .thumbnail-link{
          margin-bottom: 11px;
      }
  }
  .btn-outline-dark{
      border-color: var(--gray);
      box-shadow: none;
  }
  .checkbox-ty4-green{
      position: relative;
  }
  .checkbox-ty4-green:after{
      color: #000;
      font-family: "Avenir Book";
      font-size: 11px;
      font-style: normal;
      content: "Compare";
      padding: 2px 12px;
      padding-top:4px;
      border-radius: 2px;
      box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.20);
      position: absolute;
      right: 0;
      top: 33px;
      background: #F9F9F9;
      display:none;
  }
  @media(pointer:fine){
      .checkbox-ty4-green:hover::after{
          display: block;
      }
  }
} 
.checkbox-ty4-green .icons-checkbox{
  background-color: white;
  border: 1px solid var(--gray);
}
.checkbox-ty4-green .icons-checked{
  background-color: var(--light-green);
  border-color:var(--light-green);
  background-image:url("/static/img/icon/svg/check-mark--round--white.svg");
}
.ir364-search-results-thumbnail .add-video-bg.add-video-bg--center img{
  top: 50%;transform: translateY(-50%);
}

// useless start
.widget-filter__item--v2{
  .widget-filter__name {
      font-family: 'Avenir Medium';
      padding-top: 4px;
      display: block;
      padding-bottom: 0;
      border: none;
  }
  .widget-filter__name:hover,.widget-filter__name:active{
      text-decoration:underline;
  }
  .widget-filter__cont {
      padding: 12px 16px;
  }
  .widget-filter__name .caret{
      position: relative;
      top: -1px;
  }
  &:has(.in),&:has(.collapsing){
      border-color: var(--gray);
  }
  margin-bottom: 8px;
  border: 1px solid transparent;
} 
// useless end
.ir364-search-results-grid{
  .filterScrollbar:before{
      display: none;
  }
  .viewport-v2{
      height: auto;
      /** overflow: auto;
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
      -ms-overflow-style: -ms-autohiding-scrollbar;
      **/
  }
} 

.additional-details-grid{
display: grid;grid-template-columns: 1fr 1fr; 
grid-column-gap: 16px; grid-row-gap: 8px;text-align: left;
}
//search info
#limited-results-note, #grid_limited-results-note { background-color: #ffffff; color: var(--dark-grey); cursor: default; height: 60px; max-height: 60px; width: 100%; display: table; text-transform: none; }
#limited-results-note > div, #grid_limited-results-note > div { display: table-row; }
#limited-results-note p, #grid_limited-results-note p { color: #959595; display: table-cell; font-size: 12px; text-transform: uppercase; vertical-align: middle; }
#limited-results-note .message{color:var(--dark-grey);text-transform:none;font-size: 14px;}
#limited-results-note p.ico, #grid_limited-results-note p.ico{ padding:0 0.5em; font-size:20px; text-align:center; width: 40px;    padding-right: 0 !important;}
// .ir364-diamond-filter-bar{
//     &.sticky{
//         position: sticky;
//         top:0;
//         background: white;
//         z-index: 6;
//         box-shadow: 0px 1px 0px 0px rgb(138, 137, 137);
//     }
// }
//nouislider layout
.nouislider-box {
display: flex;
flex-direction: column;
.nouislider-box__body{
  --spacing : 8px;
  padding-left: var(--spacing);
  padding-right: var(--spacing);
}
}

.nouislider-data {
display: flex;
justify-content: space-between;
margin-left: -8px;
margin-right: -8px;
.form-group{
  margin-bottom: 0;
}
.input-xs {
  width: 100px;
  height: 24px;
  padding: 8px 4px 5px 4px;
}
}

.nouislider-custom {
height: 4px;
box-shadow: none;
border: 0;
background-color: #e1e1e1;
.noUi-value {
  font-family: 'Avenir Book';
  color: inherit;
  font-size: 12px;
  line-height: 1em;
}

.noUi-handle:after, .noUi-handle:before {
  display: none;
}

.noUi-base {
  z-index: inherit;
}

.noUi-connect {
  background-color: var(--light-green);
}

.noUi-handle {
  width: 16px;
  height: 16px;
  right: -8px;
  top: -6px;
  border-radius: 10em;
  background-color: var(--light-green);
  box-shadow: none;
  border: 0;
  cursor: pointer;
}

.noUi-value-horizontal {
  transform: translate(-50%, 0%);
}

.noUi-pips-horizontal {
  display: flex;
  height: auto;
  color: inherit;
  .noUi-marker-horizontal.noUi-marker {
    color: inherit;
    width: 1px;
    height: 4px;
    margin-top: -14px;
    background-color: white;
  }

  .noUi-marker-large {
    display: none;
  }
}
}

.nouislider-custom--center {
.noUi-pips-horizontal {
  .noUi-marker-large, .noUi-value-large:last-child {
    display: none;
  }

  .noUi-value {
    position: static;
    flex: 1;
    transform: translateX(0%);
  }
}
}

//new nouislider out style
.carat-weight-noUiSlider {
.noUi-tooltip {
  bottom: auto;
  top: 120%;
  border: 0;
}
}

//nouislider-custom for carat
.nouislider-custom--carat{
border-radius: 0;
background: var(--light-green);
.noUi-connects{
  border-radius: 0;
}
.noUi-handle{
  width: 20px;
  height: 20px;
  right: -10px;
  top: -8px;
}
}
.modal-slider-tooltip .tooltip {
display: block;
opacity: 1;
position: relative;
padding: 10px 0 0;
}

.modal-slider-tooltip .tooltip.bottom .tooltip-arrow {
border-bottom-color: var(--light-green);
border-width: 0 10px 10px;
margin-left: -10px;
}

.modal-slider-tooltip .tooltip-inner {
max-width: 100%;
text-align: left;
background-color: var(--light-green);
clear: both;
padding: 0.5em 1em;
color: white;
font-size: 13px;
border-radius: 0;
p{
  font-size: 14px;
}
}

@import "helper/common";
@import "components/_diamond-search-modal-question";
@import "components/_nav-loose-diamond";

.nav-loose-diamond-help:after{
display:none;
}
.nav-loose-diamond-section{
text-align:left;
width: 100%;
.nav-loose-diamond-box{
  width: 100%;
  display: flex;
  font-size:0;
  text-align:center;
  ul{
    margin-bottom:0;
    display: flex;
    width: 100%;
  }
  .nav-loose-diamond--round{
    overflow: visible;
    li{
      border: 0;
      flex: 1;
      width: auto;
      background: transparent;      
      a{
        font-family: "Avenir Light";
        font-size: 15px;
         
        line-height: 1.33;
        color: var(--dark-grey);
        border: 0;
        display: block;
        min-width: auto;
        border-radius: 18px;
        box-shadow: 0 0 0 2px #dedede;
        padding: .6em 1.3em .6em;
        .mac &, .linux &, .ipad &, .android &{
          padding: 0.7em 1.3em 0.5em;
        }
        &:hover{
          color: var(--dark-grey);
          //background-color:var(--gray);
          box-shadow: 0 0 0 2px var(--grey-300);
        }
      }
    }
    li:first-of-type {
      margin-right: 1rem
    }
    li.active{
      a{
        color: var(--dark-grey);
        border: 0;
        box-shadow: 0 0 0 2px var(--light-green);
        background-color: transparent;
      }
    }
  }
}
 .nav-loose-diamond{
   li{
     width: 50%;
   }
   a{
     padding-top: 10px;
     padding-bottom: 8px;
//        .win &{
//          padding-top:14px;
//          padding-bottom: 4px;
//        }
   }
 }
}
.nav-loose-diamond-section .iconfont-help1{
//   left: 100%;
display: none;
position:absolute;
margin-left: 0.5em;
top: 2px;
//   position: absolute;
//   top:0;
}

.ir246-shape-type-picture{
width: 20px;
height: 1em;
display: inline-block;
position:relative;
&:before{
  position: absolute;
  top: -2px;
  left: 0;
  position: absolute;
  content: '';
  background: url(/static/img/icon/camera-green-cache1.png) left center no-repeat;
background-size: 100% auto;
  width: 20px;
  height: 18px;
  display: inline-block;
}
}
.shape-type-picture-gray{
@extend .ir246-shape-type-picture;
&:before{
  background-image: url(/static/img/icon/camera-gray.png);
}
}
.quick-ship-diamonds{
position: relative;
height: 1em;
width: 24px;
display: inline-block;
&:before{
  position: absolute;
  top: -1px;
  left: 0;
  position: absolute;
  content: '';
  background: url(/static/img/icon/svg/icon-speedy-diamond.svg?v2) left center no-repeat;
  background-size: 100% auto;
  width: 20px;
  height: 15px;
  display: inline-block;
}
}
.quick-ship-diamonds-gray{
@extend .quick-ship-diamonds;
&:before{
  background-image: url(/static/img/icon/svg/icon-speedy-diamond-green-y23.svg);
}
}
.ir246-real-view-available{
position: absolute;
left: 70px;
top: 16px;
z-index: 1;
.checkbox-ty7{
  display: inline-block;
  padding-left: 28px;
  margin-top:0;
  margin-bottom:5px;
  vertical-align: top;
  .icons-checkbox,.icons-checked{
    margin-left: -28px;
  }
}
.filter-hearts-arrows{
  position:relative;
  width: 26px;
  height: 19px;
  display: none;
  &:before {
    content:'';
    display:inline-block;
    width: 22px;
    height: 22px;
    background-image: url(/static/img/icon/svg/hearts-arrows.svg);
    background-size:100% auto;
    margin-top: -0.1em;
  }
}
}

/*2. popup*/
.popup-Diamond-Table { width:97%; margin:0 auto; }
.popup-Diamond-Table ol li{ font-size: 14px; width:19%; display:inline-block; text-align:center; height:80px; } .popup-Diamond-Table ol li .popup-Dimond-Sketch{ display: block; height: 36px; margin-top:20px; line-height: 34px; }
.diamond-shape-select{max-width:525px; width:auto;}
.modal-slider-tips .icons-close-green{ vertical-align:middle; position:relative; top:-1px; margin-left:5px;}
.modal-slider-tips .modal-content{ border: 0;}
.modal-slider-tips .h4{ font-size:30px; line-height:1.2em; padding-bottom:5px; margin-top:0; border:none;text-transform:capitalize;
@media(max-width: 767px){
  font-size: 24px;
}
}
.modal-slider-tips .modal-header{border-bottom:0;padding:50px 50px 15px;}
.modal-slider-tips .modal-body{ font-size:13px; padding:0px 50px 50px;}
.modal-slider-tips .search-noUiSlider-wrap{  padding:0 35px;}
.modal-slider-tips .clarity-scale{ position:relative; padding:5% 0;}
.modal-slider-tips .clarity-scale p{ text-align:right; margin-top:-30px; font-size:13px;}
.modal-slider-tips .modal-header{padding-bottom:0}
/*diamond pdp popup*/
#carat-weight .noUi-handle-lower {
position: relative;
}
#carat-weight .noUi-handle-lower #min-euro {
margin-top: 2em;
padding: 5px 10px;
position: absolute;
width: 65px;
left: 50%;
text-align: center;
margin-left: -28px;
/*font-family: "Brandon Grotesque Medium";*/
font-size: 12px;
cursor: default;
color: #464646;
}
/*carat*/
.carat-weight-noUiSlider { position: relative; padding: 13px 55px 23px; }
.carat-weight-noUiSlider:after,.carat-weight-noUiSlider:before { color: #7f7f7f; font-size: 12px; position: absolute; top: 8px; /*font-family: "Brandon Grotesque Medium";*/ text-transform: uppercase; color: #464646; }
.carat-weight-noUiSlider:after { content:'0.25 CT'; left:0; }
.carat-weight-noUiSlider:before { content:'2.00 CT'; right:0; }
.search-noUiSlider .modal-cursor li {cursor: pointer}
.diamond-lightbox-hand{max-width:280px; margin:auto;}
.diamond-lightbox-hand .hand-wrap{position:relative;}
.diamond-lightbox-hand .image-assets{background-position: center center;background-repeat: no-repeat;background-size: 100% auto;cursor: default;height: 40%;left: 50%;margin-left: -25%;margin-top: -18%;position: absolute;top: 50%;width: 40%;z-index: 2;}
.diamond-lightbox-hand .h6{font-family: 'Avenir Roman'; display:block; padding:0.8em; color:var(--dark-grey); text-align:center;}
@media(max-width:767px){
.modal-slider-tips .modal-header{ padding:50px 20px 15px;}
.modal-slider-tips .modal-body{ padding:0px 20px 35px;}
.modal-slider-tips .search-noUiSlider-wrap{padding:0;}
.modal-slider-tips .clarity-scale p{ text-align:right; margin-top:0px;}
}
/* carat lightbox diamond image style */
.diamond-lightbox-hand .carat-image-assets{background-position: center center;background-repeat: no-repeat;background-size: 100% auto;cursor: default;height: 40%;left: 50%;margin-left: -25%;margin-top: -18%;position: absolute;top: 50%;width: 40%;z-index: 2;}

.search-noUiSlider .slider-data { overflow: hidden; padding-top: 10px; padding-bottom: 5px; }
.search-noUiSlider .slider-data .amount-min { width: 80px; height: 24px; }
.search-noUiSlider .slider-data .amount-max { width: 80px; height: 24px; }
.cut-slider-data, .color-slider-data, .clarity-slider-data ,.polish-slider-data,.symmetry-slider-data,.fluorescence-slider-data{ list-style: none; margin: 0; padding: 0; overflow: hidden; font-size: 12px; padding-top: 10px; }
.cut-slider-data li, .color-slider-data li, .clarity-slider-data li,.polish-slider-data li,.symmetry-slider-data li,.fluorescence-slider-data li { width: 20%; float: left; text-align: center; text-transform:capitalize; /*white-space: nowrap;*/ }
.polish-slider-data li,.symmetry-slider-data li{ width:33.33%; overflow:hidden;}
.color-slider-data li { width: 14.2857%; overflow: hidden; }
.clarity-slider-data li { width: 12.5%; overflow: hidden; }

//search result
@media(max-width: 767px) {
.search-nothing-tips { padding-left:15px; padding-right: 15px; }
}
@media(min-width: 768px) and (max-width: 1200px) {
.search-nothing-tips { padding-left:10px; padding-right: 10px; }
}
@media(min-width: 1201px) and (max-width: 1289px){
.search-nothing-tips { padding-left:15px; padding-right: 15px; }
}
@media(min-width: 1290px){
.search-nothing-tips { padding-left:20px; padding-right: 20px; }
}

@media(max-width: 767px) {
.popular-search-nothing-tips { padding-left:15px; padding-right: 15px; }
}
@media(min-width: 768px) and (max-width: 1200px) {
.popular-search-nothing-tips { padding-left:10px; padding-right: 10px; }
}
@media(min-width: 1201px) and (max-width: 1289px){
.popular-search-nothing-tips { padding-left:15px; padding-right: 15px; }
}
@media(min-width: 1290px){
.popular-search-nothing-tips { padding-left:20px; padding-right: 20px; }
}

@media (max-width: 1290px) and (min-width: 1230px){
.ir246-diamond-search-results {
  max-width: 1280px;
  width: 96%;
}
}
@media (min-width: 768px) and (max-width: 1024px){
.ir246-diamond-search-results {
  max-width: none;
}
}
/* for an internal account */
.checkbox-ty1 .icons-checkbox, .checkbox-ty1 .icons-checked {
float: left;
margin-left: -20px;
margin-top: 6px;
}
.checkbox-ty1 input, .checkbox-ty2 input, .checkbox-ty3 input, .checkbox-ty4 input, .checkbox-ty5 input {
display: none;
}
.checkbox-ty7-only{padding-left:0;margin:0}
.checkbox-ty7-only i{width:16px;height:16px;border:1px solid #d4d4d4;vertical-align:middle}
.checkbox-ty7-only .icons-checkbox{background:white}
.checkbox-ty7-only .icons-checked{background-color:white;background-position:-112px -86px}
.checkbox-ty4 { padding-left: 0; margin: 0; }
.checkbox-ty4 i { width: 19px; height: 19px; border: 1px solid #d4d4d4; vertical-align: middle; }
.checkbox-ty4 .icons-checkbox { background: white; }
.checkbox-ty4 .icons-checked {
background-color:var(--white);
background-image: url("/static/img/icon/svg/check-mark.svg");
background-size: 10px auto;
background-position: center;
}
.shape{
text-align:center !important; 
.shape-img{
  display:none;
}
}
.shape-img{
width:40px;
display:inline-block;
text-align: left;
margin-left:5px;
margin-right:5px;
}
.shape-type-360{
display:inline-block;
background: url(/static/img/icon/svg/video-play.svg) left bottom no-repeat;
background-size: 100% auto;
width: 13px;
height: 10px;
position:relative;
top:2px;
}
.shape-type-picture{
display:inline-block;
background: url(/static/img/icon/svg/camera.svg) left bottom no-repeat;
background-size: 100% auto;
width: 13px;
height: 13px;
position:relative;
top:3px;
}

.search-results-outline > thead > tr > th { background-color: #f5f5f5; border-bottom: 1px solid #f1f1f1; padding: 6px 0px; font-size: 12px; }
.search-results-outline thead th { font-weight: normal; font-size: 12px; color: #111; }
.search-results-outline thead th a {  text-decoration: none;  }
.search-results-outline .table-head span a {  color: inherit;  text-transform: capitalize;  }
.search-results-outline .table-head span, .search-results-outline .table-head span a {  margin-left: 0px !important;  }
.search-results-outline .table-head .icons-chevron-down, .search-results-outline .table-head .icons-chevron-up {
margin-left: 5px; height: 7px;
}
//#search-scrollbar .viewport-v2 > div.search-table{ background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAABECAYAAACiXEQvAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjlCQzFBRDJGREM1RjExRTVBQUE2OTM5RDE4RDk4RkJBIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjlCQzFBRDMwREM1RjExRTVBQUE2OTM5RDE4RDk4RkJBIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OUJDMUFEMkREQzVGMTFFNUFBQTY5MzlEMThEOThGQkEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OUJDMUFEMkVEQzVGMTFFNUFBQTY5MzlEMThEOThGQkEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5+/WitAAAALElEQVR42mL8//8/AzbAxIADjEqMSoxK4JZg+fXr1//RIBmVGJWgkgRAgAEApAIHdMIUHe4AAAAASUVORK5CYII=) left top; }
#search-scrollbar .viewport-v2 .item:nth-child(2n+1) td{background-color:transparent;}
/*#search-scrollbar .viewport-v2 .table-hover > tbody > tr > td{text-align:center !important}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr > td.last{text-align:left !important;}*/
@media(hover:hover){
#search-scrollbar .viewport-v2 .table-hover > tbody > tr:hover > td{ border-bottom-color:var(--light-green); color:#fff; background-color: var(--light-green) !important;}
}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr.active > td { color: white; background-color: var(--light-green) !important; }
#search-scrollbar .sort-active {  background-color: #cccccc21 !important;  }
#limited-results-note, #grid_limited-results-note { background-color: #ffffff; color: var(--dark-grey); cursor: default; height: 60px; max-height: 60px; width: 100%; display: table; text-transform: none; }
#limited-results-note > div, #grid_limited-results-note > div { display: table-row; }
#limited-results-note p, #grid_limited-results-note p { color: #959595; display: table-cell; font-size: 12px; text-transform: uppercase; vertical-align: middle; }
#limited-results-note .message{color:var(--dark-grey);text-transform:none;font-size: 14px;}
#limited-results-note p.ico, #grid_limited-results-note p.ico{ padding:0 0.5em; font-size:20px; text-align:center; width: 40px;    padding-right: 0 !important;}
.search-result-table {
border-collapse: collapse;

.viewport-v2 &{
  table-layout: fixed;
}
}
@media(min-width:1230px) and (max-width:1290px){
.ir317-diamond-search-results{
  max-width:1280px; width:96%;
}
}
.ir317-diamond-search-results .search-result-table td{ padding: 7px 0px; white-space: nowrap;
height: 34px; font-size: 12px;text-align: center; text-transform: capitalize;
 }
.ir317-diamond-search-results .table-hover tr>td{ cursor:pointer;}
.ir317-diamond-search-results .table-hover tr>td.try-diamond-finder{ cursor: default; }
.ir317-diamond-search-results #search_result_header_table, .ir317-diamond-search-results #search_recently_header_table, .ir317-diamond-search-results #search_comparison_header_table{font-size: 14px;}
.ir317-diamond-search-results .nav-tabs{font-size: 12px; text-transform: capitalize;}
#search-scrollbar .viewport-v2 .view-detail-wrapper{
cursor:pointer;
.view-detail-link{
  .caret{
    margin-left: 0;
    border: none;
    width: 12px;
    height: 6px;
    background: url(/static/img/icon/svg/drop-down.svg) center center no-repeat;
    background-size:9px auto;
    margin-top: -3px;
  }
  &.active{
    .caret{
      transform: rotate(180deg);
    }
  }
}
}
.table-diamond-detail{
  display: none;
  border-bottom:1px solid #e1e1e1;
  &.active{
    display: block;
  }
//     &>div{
//       @media(max-width:1023px){
//         flex-direction:column;
//       }
//     }
  .diamond-detail-img-wrapper{
    width:300px;
    @media(min-width:1024px){
      flex:0 0 27%;
    }
    @media(max-width:991px) and (min-width:767px){
        width:200px;
    }
  }
  .diamond-detail-infos-wrapper{
      @media(min-width:1024px){
        flex:0 0 73%; justify-content: center;
      } 
    }
//    td{
////       border-top:1px solid #e1e1e1;
//      background-color: #fff;
//    }
  .iconfont-close1{
    display: inline-block;
    cursor: pointer;
    font-size: 24px;
    padding:2px;
    position: absolute;
    right:0;
    top:0;
  }
}

/* Diamond search page css START */
.ysr-heading { font-family:Avneir Roman; padding: 6px 10px; white-space: nowrap; background-color: #f5f5f5;margin-bottom:2px;
margin-top:2px; }
//.ysr-tabs .nav-tabs { z-index:2; border: 0; font-size: 13px; text-transform: uppercase; position:absolute; right: 50%; top:50%; transform:translate(-50%,-50%);}
//.ysr-tabs .nav-tabs > li > a { border: 1px solid #ebebeb; margin: 0 -1px 0 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; padding:6px 15px; }
//.ysr-tabs .nav-tabs > li.active > a { background: #ebebeb; color: var(--dark-grey); }
//.ysr-heading .reset-search { text-align: right; font-size: 12px; margin-top:-5px;}
//
//@media (min-width: 768px) and (max-width: 991px) {
//  .ysr-tabs .nav-tabs > li > a { padding: 10px 4px; font-size: 11px; }
//  .ysr-heading .col-tabs { padding-right: 0; }
//  .ysr-heading .reset-search { font-size: 11px; }
//}
.diamond-information{
//height:380px;
width: 100%;
overflow:auto;
@media(max-width:1023px){
  height:auto;
}
}

@media(min-width:992px) and (max-width:1289px){.diamond-type-parameter.hs .girdle{ left:0;}}
@media(min-width:768px) and (max-width:991px){
.search-results-outline .mid,	.search-results-outline .thumbnail-list{ 
  width:200px; margin:auto;
}
}
@media(max-width:1279px){
.diamond-type-parameter span{font-size:10px;}
}
.diamond-info-panel-detal {
width:100%;
background: #f8f8f8;
font-size:14px;
display:flex;
justify-content:space-between;
align-items: flex-start;
flex-wrap:wrap;
@media(max-width:1023px){
  justify-content:flex-start;
}
.diamond-info-panel{
  flex:1 1 0;
  padding: 20px 20px 0;
  @media(max-width:1199px){
    padding:10px 10px 20px 10px;
  }
//     background: #a9a9a8;
  .diamond-line-info{
    font-size:14px;
    .diamond-line-info-text{
      border-bottom:1px solid #ccc;
      padding:6px 0;
    }
    &.diamond-line-info--noBorder{
      .diamond-line-info-text{
        border-bottom:0;
      }
      
    }
  }
}
.diamond-line-info-collapse{
  position:relative;
  cursor: pointer;
  .caret{
    position:absolute;right:5px;
    top: 50%;
    transform:translateY(-50%) rotate(180deg) ;
    width: 12px;
    height: 6px;
    border:none;
    background: url(/static/img/icon/svg/drop-down.svg) center center no-repeat;
    background-size:9px auto;
  }
  &.collapsed{
    .caret{
      transform: translateY(-25%) rotate(0deg)
    }
  }
}
.additonal-details-content{
  font-size: 12px;
  @media(min-width: 1260px){
    font-size: 13.5px;
  }
  color: #666;
  margin:15px 0;
  display:table;
  table-layout:fixed;
  width:100%;
  >div {
    display: table-cell;
    vertical-align: top;
    padding: 2px 5px;
    width:10%;
    &.fore1 {
      width: 8%;
//         background: red;
    }
    &.fore2 {
      width: 10%;
//         background-color: wheat;
    }
    &:nth-child(3){
      width: 13%;
    }
    &:last-child{
      width: 18%;
    }
  }
  .headline{
    font-size:inherit;
    color: var(--dark-grey);
  }
}
.diamond-avaliable-panel{
  margin-top:100px;
  @media(min-width:1200px){
     flex:0 0 220px;
  }
  flex:0 0 200px;
  @media(max-width:1023px){
    flex: 0 0 230px;
    text-align:center;
  }
  .btn{
    width:200px;
    margin-bottom: 5px;
    box-shadow: none;
  }
  @media(pointer:fine){
    .btn:hover{
      background-color: var(--dark-grey);
      border-color: var(--dark-grey);
    }
  }
}
.diamond-statement-available{
  li{
    display:flex;
    align-items:center;
    padding-left:26px;
    font-size:14px;
    line-height:24px;
    margin: 10px 0;
    //.glyphicon{
    //  display:inline-block;
    //  margin-left:4px; margin-right:4px;
    //  position:relative;
    //  top:-2px;
    //}
    //img{
    //  margin-right:4px;
    //  position:relative;
    //   .mac &{
    //     top:-2px;
    //   }
    //}
    /*position:relative;
    &:before{
      content: '';
      position:absolute;
      width:20px;
      height:100%;
      left:0;
      top:0;
      background:red;
      opacity: 0.5;
    }*/
    &.heart-arrows{
      background: url("/static/img/icon/svg/hearts-arrows.svg") no-repeat 2px 2px;
      background-size: 17px auto;
      .iconfont-help1{
        position:relative;
        margin-left:5px;
        top:-.2emå;
      }
    }
    &.quick-ship{
      background: url("/static/img/icon/svg/icon-speedy-diamond.svg") no-repeat left 3px;
      background-size: 20px auto;
    }
    &.one-available{
      background: url("/static/img/icon/svg/icon-star-green.svg") no-repeat 0 top;
      background-size: 20px auto;
    }
    &.block-chain,&.another-users-cart{
      position:relative;
      em{
        color: #616161;
        position:absolute;
        width:24px;
        text-align: center;
        left:-2px;
        top:1px;
        font-size:16px;
      }
//         background: url("/static/img/icon/svg/icon-star-green.svg") no-repeat left center;
//         background-size: 20px auto;
    }
    &.another-users-cart{
      em{
        font-size:18px;
        top:-2px;
        left: -2px;
      }
    }
  }
  &.gray-style{
    li{
      &.heart-arrows{
        background-image: url("/static/img/icon/svg/hearts-arrows-gray.svg");
      }
      &.quick-ship{
        background-image: url("/static/img/icon/svg/icon-speedy-diamond-gray.svg");
      }
      &.one-available{
        background-image: url("/static/img/icon/svg/icon-star-gray.svg");
      }
    }
  }
}
}
.diamond-info-panel-detal a{
text-decoration: none;
//&:visited{
//  color:var(--light-green);
//}
}

.diamond-info-panel-detal .headline {
font-size: 19px;
}

.diamond-info-panel-detal .price {
//   font-size: 19px;
display: block;
margin-bottom: 10px;
}

// .diamond-info-panel-detal p {
//   font-size: 13px;
// }

// diamond pairs
@media(min-width: 768px) and (max-width: 991px){
.search-results-outline_pairs .mid{
  width: 100%;
}
}
@media(min-width:768px){
.search-results-outline_pairs{
  .table-diamond-detail .diamond-detail-img-wrapper {
    width: 500px;
    @media(min-width:1024px){
      flex: 0 0 40%;
      padding-left:20px;
    }
  }
  .mid{
    @media(min-width: 768px) and (max-width: 991px){
      width: 100%;
    }
  }
  .diamond-type-vision360{
    padding-bottom: 85%;
    iframe{
      width: 85%;
      /* height: 85%; */
      left:50%;
      top:0;
      transform:translateX(-50%);
    }
  }
  p:nth-of-type(2){
    margin-top: 10px;
  }
  .diamond-type-parameter{
    width: 85%;
    height:85%;
    margin:0 2.5%;
    span{
      font-size: 10px;
      line-height: 1.2;
      padding: 0 2px;
    }
  }
  .additonal-details-content{
    .fore-2{
      width: 25% !important;
    }
    .fore-auto{
      width: auto !important;
    }
  }
  .second-pairs-property{
    display: inline;
    .second-pairs-text{
      display: inline-block;
    }
  }
  .diamond-info-panel-detal .diamond-info-panel{
    padding-bottom:20px;
  }
}
}
/*

.ir327-diamond-statement-available{
li{
  min-height:24px;
  display:flex;
  align-items: center;
  //padding-left: 26px;
  font-size: 14px;
  line-height: 120%;
  margin: 10px 0;
  .icon{
    position:relative;
    top:-2px;
    flex-shrink: 0;
    width:26px;
    height:24px;
    img{
      position: absolute;
      top:50%;
      left:50%;
      transform:translate(-50%,-50%);
      -webkit-transform:translate(-50%,-50%);
      -moz-transform:translate(-50%,-50%);
      -ms-transform:translate(-50%,-50%);
    }
  }
}
}*/

//Diamond Badging
.ir338-diamond-badges {
padding-left:0;
padding-right:0;
margin-left:0;
margin-right:0;
list-style: none;
}

.ir338-diamond-badges li {
background: #ebf5f3;
border-radius: 50em;
display: inline-flex;
align-items: center;
margin-right: 10px;
margin-bottom: 10px;
}
.ir338-diamond-badges .text {
font-family: avenir heavy;
color: var(--light-green);
padding: 7px 10px 6px 10px;
font-size: 8px;
letter-spacing: .05em;
text-transform: uppercase;
text-align: center;
line-height: 1em;
}
.diamond-info-panel-detal--ir349{
background-color: white;
.ir338-diamond-badges .text{
  font-size: 10px;
  padding: .7em .6em .6em .6em;
}
.diamond-line-info-collapse{
  display: inline-block;
}
.diamond-line-info-collapse .caret{
  right: -5px;
  transform: translate(100%, -50%);
}
.diamond-info-panel{
  padding-left: 30px;
}
@media(min-width:1024px){
  .diamond-search-hybrid__body {
    margin-top: 10px;
}
  .diamond-line-info__wrapper{
    display: flex;
    align-items: center;
    .diamond-line-info__leftPart{
      flex: 1;
      position: relative;
      &:after{
        content: ' ';
        height: 100%;
        width: 1px;
        background-color: #ccc;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
      }
    }
    .diamond-line-info__rightPart{
      flex: 0 0 350px;
    }
  }
  .diamond-avaliable-panel{
    margin-top: 0;
    text-align: center;
    position: relative;
  }
}
}
// abtest diamond listing dropdown
.dropdown--start-diamond{
.dropdown-nav {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 10;
  padding: 0;
  margin: 0;
  list-style: none;
  background-clip: padding-box;
  text-align: center;
  background-color: var(--white);
  display: none;
  .touch &{
    @media(max-width: 767px) {
      position:static;
    }
  }
  a{
    display: block;
    padding: 10px 20px;
    clear: both;
    font-size: 14px;
    // font-weight: 700;
    line-height: 28px;
    text-align: left;
    color: var(--dark-grey);
    white-space: nowrap;
    text-decoration: none;
    &:hover{
      background-color: #f5f7f8;
    }
  }
}
.caret {
  font-size: 10px;
  line-height: 1;
  width: 10px;
  border: 0;
  margin-left: 5px;
  margin-right: -15px;
  height: 10px;
  margin-top:-3px;
}
.divider {
  height: 1px;
  margin: 0;
  overflow: hidden;
  background-color: var(--dark-grey);
  margin-left: 1em;
  margin-right: 1em
}
.btn{
  background: transparent;
  box-shadow: none;
}
@media (pointer: coarse) {
  .btn:hover{
    color: var(--dark-grey);
  } 
}
&.open{
  .btn{
    border-color:var(--dark-grey);
    background: var(--dark-grey);
    color: white;
  }
  .dropdown-nav {
    display: block;
    box-shadow: 0px 4px 4px 0px rgba(0,0,0,.15);
  }
  .caret:before {
    content: "\e60e";
  }
}
.ir364-search-results-thumbnail &:not(.open) .btn-outline-dark{
  background-color: white;
}
@media(pointer:fine){
  .ir364-search-results-thumbnail &:not(.open) .btn-outline-dark:hover{
    background-color: var(--dark-grey);
    border-color: var(--dark-grey);
  }
}
}
.search-result-table {
width: 100%;
border-collapse: collapse;
}

.search-result-table td {
text-align: center;
vertical-align: middle;
padding: 10px;
}

.search-result-table .shape-type {
display: flex;
align-items: center;
justify-content: start;
}

.search-result-table .shape-type img {
margin-right: 5px;
}

.search-result-table .shape-type-name {
display: inline-block;
vertical-align: middle;
}

/* 表头样式 */
.search-results-outline thead th {
text-align: left !important;
vertical-align: middle;
padding: 10px;
}

/* 去掉第一列的居中对齐 */
.search-result-table td ,.search-results-outline th:first-child{
text-align: left !important;
}

.width_ratio_hide {
  display: none;
}1

th.pl10 {}

th.pl10 {}

.shape-type {
  display: flex;
}

table.table-striped.table-hover.search-result-table.text-33.variant {
  padding: 10px 0;
}


  tr#js_sort_by_header_table {
    display: flex;
}

tr#js_sort_by_header_table th {
    flex: 1 0 0;
}

tr.search-item {
    display: flex;
}

tr.search-item td {
    flex: 1 0 0;
}

td.un-bubble-ga.ee_data.compare_selector.ir327-heart.js-heart {
    display: none;
}


tr#js_sort_by_header_table th.pl10 {
    padding-left: 0 !important;
}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr {
    /* height: auto !important; */
    justify-content: center;
    align-items: center;
}
td.price {
    margin-bottom: 0;
}
th.width_ratio_hide + th ,td.un-bubble-ga.ee_data.compare_selector.ir327-heart.js-heart + td{
    width: 1% !important;
    flex: 5% 0 0 !important;
    }
td.js-heart + td svg {
    transform: rotate(270deg);
}

#search-scrollbar .viewport-v2 .table-hover > tbody > tr.active > td svg {
    transform: rotate(90deg);
}
.search-item.active {
    background-color: var(--light-green) !important;
}
a.dropdown-item {
    border: 1px solid;
    padding: 5px;
    text-align: center;
    margin-bottom: 10px;
}
  table.search-results-outline > tbody > tr > td {
    padding: 0;
}
.inner.item:nth-child(even) {
    background: #f9f9f9;
}
@media (min-width: 769px) {
.diamond-search-hybrid__body {
    margin-top: 30px;
}
  
tr.search-item:hover {
  background: #0d6363;
}




tr#js_sort_by_header_table th.pl10 span {
    padding-left: 10px;
}
}
@media (max-width: 768px) {
  .text-center.thumbnail-caption {
    text-align: left;
    padding: 0 5px;
}

a.avenir-medium.thumbnail-name.td-n2,.mb5.thumbnail-4Cs {
    font-size: 12px;
}
tr#js_sort_by_header_table th.pl10 span {
    padding-left: 0;
}
  .search-result-table .shape-type {
    margin-left: 0 !important;
}
  .filter-search-results-new {
    border: unset;
}
#search-scrollbar .viewport-v2 .table-hover > tbody > tr {
    height: auto !important; 
    justify-content: center;
    align-items: center;
}
.container.container1260 {
    margin-left: 0px;
    margin-right: 0px;
}
div#js_dropdown_sort_by .filterScrollbar.show {
    right: 0;
    left: auto;
}
.search-result-table .shape-type-name {
    display: none;
}
.d-flex.align-items-center.mb-15 {
flex-wrap: wrap;
}

.mr15.tab-diamond-origin--paid-wrapper {
width: 100% !important;
}

.results-bar-tablet.mb10.pt-10 {
margin-top: 10px;

}

.ir364-listing-grid {
grid-template-columns: 1fr 1fr;
padding: 10px 0;
gap: 10px;
}

.container.container1260.ir317-diamond-search-results.mt-20 {
margin-top: 20px;
}



.d-flex.align-items-center.mb-15 {
    margin-left: 10px;
    margin-right: 10px;
}

ul#js_diamond_tab {
    margin-left: 10px;
    margin-right: 10px;
}

table#search_result_header_table {
    /* margin-left: 10px; */
    /* margin-right: 10px; */
    background-color: #f5f5f5;
    margin-top: 5px;
}

tr#js_sort_by_header_table {
    /* margin-left: 10px; */
    /* margin-right: 10px; */
}

td.shape {
    /* margin-left: 5px; */
}

td.shape {
    margin-left: 10px;
}

tr#js_sort_by_header_table th.pl10 {
    padding-left: 10px !important;
}

td.un-bubble-ga.js-heart + td {
    padding-right: 10px;
}
}
span.pagination__parts span.more_page

 {
    border-color: rgb(var(--text-color) / .12);
}
.video-container {
        position: relative;
        width: 100%;
        height: 100%;
        cursor: pointer;
    }

    .video-play-button {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 60px;
        height: 60px;
        background: rgba(0, 0, 0, 0.6);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .video-play-button svg {
        width: 24px;
        height: 24px;
        fill: white;
        stroke: white;
    }

    .video-play-button:hover {
        background: rgba(0, 0, 0, 0.8);
        transform: translate(-50%, -50%) scale(1.1);
    }

    .video-play-button.hidden {
        opacity: 0;
        pointer-events: none;
    }

    .video-placeholder {
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        background: #f5f5f5;
    }
    
    .video-placeholder video {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
    
    .video-placeholder img {
        max-width: 100%;
        height: auto;
        display: block;
    }
    tr.search-item.active img.mr5 {
    background: #fff;
}
    @media (max-width: 768px) {
     .shape-type {
    position: relative;
} 
.shape-type-picture{
   background-size: 100% auto;
   width: 13px;
   height: 11px;
   position: absolute;
   margin-top: 10px;
   margin-left: 2px;
}
.shape-type-picture{
    background: url(/cdn/shop/files/video-play.svg?v=1746724436) left bottom no-repeat;
    margin-top: 3px;
    margin-left: 5px;
    background-size: 100% auto;
    height: 13px;
    top: 0;
        left: 20px;
}

.search-item.active .shape-type-picture { 
     background: url(/cdn/shop/files/video-play-white.svg?v=1746724425) left bottom no-repeat;
background-size: 100% auto;
}



span.shape-type-picture {}
        .video-placeholder {
            height: auto;
            background: unset;
        }
        
        .video-placeholder video {
            width: 100%;
            height: auto;
        }

        .video-play-button {
            width: 40px;
            height: 40px;
        }

        .video-play-button svg {
            width: 16px;
            height: 16px;
        }
    }
 .video-container {
        position: relative;
        width: 100%;
        height: 100%;
    }
    
    .video-play-button {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 30px;
        height: 30px;
        background: rgba(255, 255, 255, 0.8);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 2;
    }
    
    .video-play-button svg {
        width: 30px;
        height: 30px;
        fill: currentColor;
    }
    
    .video-play-button.hidden {
        display: none;
    }
    
    .diamond-video {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }