body.drts-addon-sidebar-open { overflow: hidden; }

/* Overlay */
.drts-addon-overlay{
  position:fixed; inset:0;
  background: rgba(6,10,20,.55);
  backdrop-filter: blur(6px);
  opacity:0; pointer-events:none;
  transition: opacity 260ms ease;
  z-index: 999998;
}
.drts-addon-overlay.is-open{ opacity:1; pointer-events:auto; }

/* Sidebar base */
.drts-addon-sidebar{
  position:fixed; top:0;
  height:100vh;
  width: min(460px, 92vw);
  transition: transform 320ms cubic-bezier(.2,.8,.2,1);
  z-index: 999999;

  background: radial-gradient(1200px 600px at 20% 10%, rgba(0,140,255,.18), transparent 60%),
              radial-gradient(900px 500px at 90% 30%, rgba(124,3,35,.18), transparent 55%),
              rgba(8,12,22,.96);

  border-left: 1px solid rgba(255,255,255,.10);
  box-shadow: -12px 0 44px rgba(0,0,0,.45);
  display:flex; flex-direction:column;
}

/* Right position */
.drts-addon-sidebar.drts-pos-right{ right:0; transform: translateX(110%); }
.drts-addon-sidebar.drts-pos-right.is-open{ transform: translateX(0); }

/* Left position */
.drts-addon-sidebar.drts-pos-left{
  left:0; right:auto;
  transform: translateX(-110%);
  border-left: none;
  border-right: 1px solid rgba(255,255,255,.10);
  box-shadow: 12px 0 44px rgba(0,0,0,.45);
}
.drts-addon-sidebar.drts-pos-left.is-open{ transform: translateX(0); }

/* Header */
.drts-addon-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 16px 10px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.drts-addon-titlewrap{ display:flex; align-items:center; gap:10px; }
.drts-addon-badge{
  width:12px; height:12px; border-radius:999px;
  background: rgba(0,140,255,.95);
  box-shadow: 0 0 18px rgba(0,140,255,.65);
}
.drts-addon-title{
  margin:0; font-size:16px; letter-spacing:.3px;
  color: rgba(255,255,255,.92);
}
.drts-addon-close{
  appearance:none;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.9);
  width:36px; height:36px;
  border-radius:12px;
  cursor:pointer;
  transition: transform 150ms ease, background 150ms ease, border-color 150ms ease;
}
.drts-addon-close:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.20);
}

/* Subheader */
.drts-addon-subheader{
  padding:10px 16px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.drts-addon-subtext{
  font-size:13px; line-height:1.35;
  color: rgba(255,255,255,.70);
}

/* Body */
.drts-addon-body{
  flex:1;
  padding:12px 16px 16px;
  overflow:hidden;
  display:flex; flex-direction:column; gap:10px;
}
.drts-addon-status{
  padding:10px 12px;
  border-radius:14px;
  font-size:13px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
}
.drts-addon-status.is-error{
  border-color: rgba(124,3,35,.45);
  background: rgba(124,3,35,.16);
}
.drts-addon-status.is-ok{
  border-color: rgba(0,140,255,.45);
  background: rgba(0,140,255,.14);
}
.drts-addon-products{ overflow:auto; padding-right:6px; }

/* Loading */
.drts-addon-loading{
  display:flex; align-items:center; gap:12px;
  padding:14px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
}
.drts-spinner{
  width:18px; height:18px; border-radius:999px;
  border:2px solid rgba(255,255,255,.25);
  border-top-color: rgba(0,140,255,.95);
  animation: drtsSpin .85s linear infinite;
}
@keyframes drtsSpin{ to{ transform: rotate(360deg); } }
.drts-addon-loading-text{ color: rgba(255,255,255,.80); font-size:13px; }

/* Footer */
.drts-addon-footer{
  padding:14px 16px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex; gap:10px;
}
.drts-addon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:11px 12px;
  border-radius:14px;
  text-decoration:none;
  font-size:13px;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.14);
  transition: transform 150ms ease, background 150ms ease, border-color 150ms ease;
  white-space:nowrap;
  flex:1;
}
.drts-addon-btn:hover{ transform: translateY(-1px); }
.drts-addon-btn-ghost{
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.90);
}
.drts-addon-btn-ghost:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.20);
}
.drts-addon-btn-solid{
  background: rgba(0,140,255,.18);
  border-color: rgba(0,140,255,.35);
  color: rgba(255,255,255,.94);
  box-shadow: 0 10px 28px rgba(0,0,0,.25);
}
.drts-addon-btn-solid:hover{
  background: rgba(0,140,255,.24);
  border-color: rgba(0,140,255,.48);
}

/* Woo products inside sidebar */
#drts-addon-sidebar .woocommerce ul.products{ margin:0; padding:0; }
#drts-addon-sidebar .woocommerce ul.products li.product{
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  padding:10px !important;
  overflow:hidden;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}
#drts-addon-sidebar .woocommerce ul.products li.product:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.06);
  border-color: rgba(0,140,255,.25);
}
#drts-addon-sidebar .woocommerce ul.products li.product a{ color: rgba(255,255,255,.9); }
#drts-addon-sidebar .woocommerce ul.products li.product .price{ color: rgba(255,255,255,.85); }

#drts-addon-sidebar .woocommerce ul.products li.product .button,
#drts-addon-sidebar .woocommerce ul.products li.product a.button{
  border-radius:14px !important;
  border:1px solid rgba(0,140,255,.35) !important;
  background: rgba(0,140,255,.18) !important;
  color: rgba(255,255,255,.95) !important;
  transition: transform 150ms ease, background 150ms ease, border-color 150ms ease;
  width:100%;
  text-align:center;
}
#drts-addon-sidebar .woocommerce ul.products li.product .button:hover,
#drts-addon-sidebar .woocommerce ul.products li.product a.button:hover{
  transform: translateY(-1px);
  background: rgba(0,140,255,.24) !important;
  border-color: rgba(0,140,255,.48) !important;
}

#drts-addon-sidebar .drts-addon-empty{
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.75);
  font-size:13px;
}