:root{
  --solswt-radius: 18px;
  --solswt-shadow: 0 18px 60px rgba(0,0,0,.35);
  --solswt-bg: rgba(10,10,16,.72);
  --solswt-border: rgba(255,255,255,.16);
  --solswt-text: rgba(255,255,255,.92);
}

.solswt-wrap{width:100%;}

.solswt-notice{
  padding: 10px 12px;
  border-radius: 14px;
  margin: 0 0 10px 0;
  font-size: 13px;
  line-height: 1.35;
  border: 1px solid var(--solswt-border);
  background: rgba(0,0,0,0.28);
  color: var(--solswt-text);
}

.solswt-openwallet{display:none; gap:10px; margin:0 0 12px 0; flex-wrap:wrap; justify-content:center;}

.solswt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  font-size:14px;
  line-height:1;
  border:1px solid var(--solswt-border);
  background: rgba(255,255,255,0.06);
  color: var(--solswt-text);
}
.solswt-btn:hover{filter: brightness(1.08);}

.solswt-plugin{width:100%; min-height:560px;}

/* Drawer mode */
.solswt-trigger{margin: 0 auto;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid var(--solswt-border);
  background: rgba(255,255,255,0.08);
  color: var(--solswt-text);
  font-weight: 700;
  cursor: pointer;
}
.solswt-trigger:hover{filter: brightness(1.08);}

.solswt-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  opacity: 0;
  transition: opacity .22s ease;
  z-index: 99998;
}
.solswt-overlay.is-open{opacity: 1;}

.solswt-drawer{
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: min(420px, 92vw);
  background: var(--solswt-bg);
  border-right: 1px solid rgba(255,255,255,0.08);
  box-shadow: var(--solswt-shadow);
  transform: translateX(-110%);
  transition: transform .22s ease;
  z-index: 99999;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  color: var(--solswt-text);
}

.solswt-drawer.is-open{transform: translateX(0);}

.solswt-drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.solswt-brand{display:flex; align-items:center; gap:10px;}
.solswt-brand-logo{
  width: 28px; height: 28px; border-radius: 10px; object-fit: cover;
  background: rgba(255,255,255,0.08);
}
.solswt-brand-name{font-size: 15px; font-weight: 800; letter-spacing: .2px;}

.solswt-close{
  width: 36px; height: 36px;
  border-radius: 12px;
  border: 1px solid var(--solswt-border);
  background: rgba(255,255,255,0.06);
  color: var(--solswt-text);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.solswt-close:hover{filter: brightness(1.08);}

.solswt-drawer-body{
  padding: 14px 14px 18px 14px;
  overflow: auto;
  height: calc(100vh - 60px);
}

.solswt-error{
  padding:12px 14px;
  border:1px solid #cc0000;
  border-radius:10px;
  font-size:14px;
  line-height:1.4;
  color: #fff;
  background: rgba(0,0,0,0.25);
}

.solswt-openwallet .solswt-btn{flex:1 1 0; min-width: 0; text-align:center;}

/* Open-wallet buttons: show only on mobile and only when JS decides */
.solswt-show-openwallet .solswt-openwallet{display:flex;}
@media (min-width: 768px){
  .solswt-openwallet{display:none !important;}
}
.solswt-openwallet .solswt-btn{
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  padding: 10px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: rgba(0,0,0,0.18);
}

/* Keep openwallet bar same width as widget */
.solswt-wrap .solswt-openwallet{max-width: 420px; margin-left:auto; margin-right:auto;}


/* Trigger button: mobile only */
@media (min-width: 768px){
  .solswt-trigger{display:none !important;}
}
