.hdt-sb-widget{
  &:has(.hdt-sb-inner:empty){
    display: none;
  }
  .hdt-sidebar-widget:not(:last-child){
    margin-bottom: 5rem;
  }
  @media (width < 767px){
    order: 9999;
  }
  .hdt-widget-inner{
    /* background-color: rgb(var(--color-background2)); */
    color: rgb(var(--color-foreground));
  }
  .hdt-widget-title { 
    padding-bottom: 4px;
    margin-bottom: 25px;
    position: relative;
    &.hdt-style-2 {
      &::before{
        display: none;
      }
      span{
        &::before,
        &::after{
          content: "";
          width: 17px;
          height: 1px;
          background-color: rgb(var(--color-foreground)/.15);
          display: inline-block;
          vertical-align: middle;
        }
        &::before{
          margin-inline-end: 2rem;
        }
        &::after{
          margin-inline-start: 2rem;
        }
      }
    }
    &::before{
      content: "";
      position: absolute;
      bottom: 0;
      display: inline-block;
      width: 3rem;
      height: 2px;
      background-color: rgb(var(--color-foreground)/.1);
    }
  }
  .hdt-widget_products{
    .hdt-filter-inline{
      opacity: 1;
    }
    .hdt-price,
    .hdt-compare-at-price{
      font-size: var(--text-base);
    }
    .hdt-list-inner{
      display: flex;
      gap: 12px;
      .hdt-list-img{
        flex: 1 0 auto;
        width: 60px;
      }
      .hdt-list-content{
        flex: 0 1 auto;
      }
      .hdt-list-title{
        margin-bottom: 8px;
        a{
          transition: all .25s ease-in-out;
          &:hover{
            color: rgb(var(--color-accent));
            text-decoration: underline;
          }
        }
      }
    }
    .hdt-list-item:not(:last-child){
      padding-bottom: 1rem;
      margin-bottom: 1rem;
      border-bottom: 1px solid rgb(var(--color-foreground)/.15);
    }
  }
  .hdt-widget_shipping {
    i {
      font-size: 4rem;
      color: rgb(var(--color-foreground)/.2);
    }
    .hdt-list-inner{
      display: flex;
      gap: 6px;
    }
    .hdt-list-item:not(:last-child){
      margin-bottom: 3rem;
    }
  }
  .hdt-widget_ins_feed{
    .hdt-custom-html-listing > a + .hdt-widget-ins-gallery{
      margin-top: 1.5rem;
    }
    .hdt-image-gallery-wrap{
      margin-top: 0;
    }
  }
  .hdt-widget_categories{
    .hdt-sb-category--item:not(:last-child){
      .hdt-sb-category--link{
        padding-bottom: 0.5rem;
      }
    }
    .hdt-sb-accordion-icon,
    .hdt-sb-category-icon{
      width: 2.4rem;
      height: 2.4rem;
      display: flex;
      align-items: center;
      justify-content: center;
      svg{
        width: 1.6rem;
        height: 1.6rem;
        pointer-events: none;
      }
    }
    .hdt-sb-category--link-text{
      display: flex;
      align-items: center;
      gap: 0;
    }
    .hdt-sb-lv-2{
      .hdt-sb-category--list{
        padding-inline-start: 1.5rem;
      }
    }
    [aria-expanded="true"] > [accordion-icon]{
      transform: rotate(180deg);
    }
  }
  /* serach form */
  .hdt-search-input{
    height: 4rem;
    border: 1px solid rgb(var(--color-line-border));
    line-height: 1.8rem;
    padding: 0 1rem;
    transition: border-color .5s;
    box-shadow: none;
    border-radius: var(--radius-input);
    padding-inline-end: 10rem;
  }
  .hdt-search-submit{
    height: 4rem;
    width: 10rem;
  }
  .hdt-sb-category--list{
    li:not(:last-child){
      margin-bottom: 0.5rem;
    }
  }
  /* filter */
  .hdt-sb-filter{
    #hdt-facet-filters-form{
      margin-top: 0;
      padding: 0;
      grid-template-columns: 1fr;
      gap: 5rem;
      background-color: transparent;
    }
  }
}
.hdt-blog-wrap:not(:has(.hdt-sb-inner:empty)){
  display: grid;
  grid-template-columns: 3fr 7fr;
  row-gap: var(--spacing-y);
  column-gap: var(--spacing-x);
  > * {
    min-width: 0;
  }
  @media ( width > 1150px) {
    &:has(.hdt-sb-pos-right){
      grid-template-columns: 7fr 3fr;
      & > .hdt-sidebar-blog{
        order: 999;
      }
    }
  }
  .hdt-sidebar-blog:empty{
    display: none;
  }
  &:has(.hdt-sidebar-blog:empty){
    grid-template-columns: 1fr;
  }
  @media ( width < 767px){
    grid-template-columns: 1fr;
  }
}

.hdt-sidebar-drawer{
  .hdt-dialog:modal{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .hdt-dialog-drawer__header{
    padding: 2rem;
    justify-content: space-between;
    border-bottom: 0.1rem solid rgb(var(--color-line-border));
    @media (width > 767px){
      display: none;
    }
  }
  .hdt-dialog-drawer__inner{
    padding: 2rem;
    overflow: hidden;
    @media (width < 1150px){
      .hdt-main-sidebar-inner{
        overflow-y: auto;
        height: 100%;
      }
    }
    @media (width > 767px){
      padding: 0;
    }
  }
  dialog{
    @media (width > 767px){
      display: block;
      position: static;
      opacity: 1;
      visibility: visible;
      width: auto;
    }
  }
}
.hdt-sidebar-btn {
  top: 50%;
  background:rgb(var(--hdt-btn-color));
  color: rgb(var(--hdt-btn-bg));
  box-shadow: 0 0 3px rgb(var(--color-overlay, 0 0 0) / .15);
  height: 50px;
  z-index: 7;
  .hdt-btn-icon{
    width: 50px;
    height: 50px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }
  .hdt-btn-text{
    white-space: nowrap;
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: max-width 0.4s cubic-bezier(.175,.885,.32,1.15);
    @media (max-width: 1149px){
      display: none;
    }
  }
  &:hover{
    .hdt-btn-text{
      padding-inline-end: 20px;
      max-width: 20rem;
    }
  }
}
@media (min-width: 768px) {
  .hdt-pin {
    --pin-w: 50px;
    --pin-h: 50px;
    --pin-x: var(--pin-x-md) !important;
    --pin-y: var(--pin-y-md) !important;
  }
  .hdt-sidebar-blog_false .hdt-header-drawer-blog{
    display: none;
  }
  .hdt-sidebar-btn {
    height: 50px;
  }
  .hdt-sidebar-btn svg{
    width: 24px;
    height: 24px;
  }
}