/* ── Floating Sidebar Widget – front.css ── */

:root {
  --fsw-bg: #4a2060;
  --fsw-txt: #ffffff;
  --fsw-item-h: 44px;
  --fsw-icon-w: 44px;
  --fsw-label-max: 180px;
  --fsw-radius: 0px;
  --fsw-gap: 0px;
  --fsw-z: 9999;
  --fsw-speed: 0.25s;
  --fsw-shadow: 0 4px 14px rgba(0,0,0,0.25);
}

#fsw-container {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: var(--fsw-z);
  display: flex;
  flex-direction: column;
  gap: var(--fsw-gap);
  pointer-events: none; /* children re-enable */
}

/* ── position helpers ── */
#fsw-container.fsw-pos-right { right: 0; }
#fsw-container.fsw-pos-left  { left: 0; }

/* ── each button row ── */
.fsw-item {
  pointer-events: all;
  display: flex;
  align-items: stretch;
}

/* right-side: icon on the right edge, label expands left */
.fsw-pos-right .fsw-item { flex-direction: row-reverse; }
.fsw-pos-left  .fsw-item { flex-direction: row; }

/* ── anchor ── */
.fsw-link {
  display: flex;
  align-items: center;
  text-decoration: none !important;
  color: var(--fsw-txt) !important;
  background: var(--fsw-bg);
  overflow: hidden;
  height: var(--fsw-item-h);
}

.fsw-pos-right .fsw-link {
  border-radius: var(--fsw-radius) 0 0 var(--fsw-radius);
  flex-direction: row-reverse;
}
.fsw-pos-left .fsw-link {
  border-radius: 0 var(--fsw-radius) var(--fsw-radius) 0;
  flex-direction: row;
}

/* ── icon block ── */
.fsw-icon {
  flex-shrink: 0;
  width: var(--fsw-icon-w);
  height: var(--fsw-item-h);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--fsw-speed);
}

.fsw-icon svg {
  width: 20px;
  height: 20px;
  fill: var(--fsw-txt);
  color: var(--fsw-txt);
  display: block;
}

/* ── label block ── */
.fsw-label {
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0.02em;
  transition: max-width var(--fsw-speed) ease, padding var(--fsw-speed) ease;
  padding: 0;
  color: var(--fsw-txt);
}

/* ── hover: reveal label ── */
.fsw-item:hover .fsw-label {
  max-width: var(--fsw-label-max);
  padding: 0 14px;
}

.fsw-item:hover .fsw-icon {
  background: rgba(0,0,0,0.15);
}

/* ── shadow on hover ── */
.fsw-item:hover .fsw-link {
  box-shadow: var(--fsw-shadow);
  filter: brightness(1.08);
}

/* ── focus accessibility ── */
.fsw-link:focus {
  outline: 3px solid rgba(255,255,255,0.7);
  outline-offset: -2px;
}

/* ── mobile: always show condensed, still interactive ── */
@media (max-width: 600px) {
  :root { --fsw-item-h: 38px; --fsw-icon-w: 38px; }
}