/* Slide-out drawer on the right edge; uses global CSS vars */
:root {
  --ti-cs-bg: var(--ticket-color, #781c1c);
  --ti-cs-fg: var(--text-color, #ffffff);
}

.ti-cs { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 9999; font-family: inherit; }

/* Drawer */
.ti-cs-drawer {
  position: relative;
  min-width: 380px;
  background: var(--ti-cs-bg);
  color: var(--ti-cs-fg);
  border-radius: 12px 0 0 12px;
  box-shadow: 0 16px 48px rgba(0,0,0,.45);
  padding: 18px 22px;
  transform: translateX(100%); /* hidden off-canvas */
  transition: transform .28s ease;
  /* --- Scrollable Drawer --- */
  max-height: calc(100vh - 250px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.ti-cs.open .ti-cs-drawer { transform: translateX(0); }

/* Tab (always visible), vertical, no wrapping */
.ti-cs-tab {
  position: absolute;
  top: 50%;
  right: var(--ti-cs-tab-offset, 56px);
  transform: translate(100%, -50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  background: var(--ti-cs-bg);
  color: var(--ti-cs-fg);
  border: none;
  padding: 26px 20px;
  cursor: pointer;
  border-radius: 10px 0 0 10px;
  box-shadow: 0 4px 18px rgba(0,0,0,.35);
  letter-spacing: .08em;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  line-height: 1;
}
.ti-cs-tab:focus { outline: 2px solid currentColor; outline-offset: -2px; }

.ti-cs-vertical { display: inline; }

.ti-cs-eye {
  width: 16px; height: 16px; flex: 0 0 16px;
  background: currentColor;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5C21.27 7.61 17 4.5 12 4.5m0 12.5a5 5 0 1 1 0-10 5 5 0 0 1 0 10m0-8a3 3 0 1 0 .001 6.001A3 3 0 0 0 12 9z"/></svg>') center/contain no-repeat;
          mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5C21.27 7.61 17 4.5 12 4.5m0 12.5a5 5 0 1 1 0-10 5 5 0 0 1 0 10m0-8a3 3 0 1 0 .001 6.001A3 3 0 0 0 12 9z"/></svg>') center/contain no-repeat;
}

.ti-cs-list { list-style: none; margin: 0; padding: 0 8px 0 0; }
.ti-cs-item + .ti-cs-item { margin-top: 12px; }

.ti-cs-link {
  color: var(--ti-cs-fg);
  text-decoration: none;
  display: inline-block;
  font-weight: 800;
  border-bottom: 2px solid rgba(255,255,255,.35);
  padding-bottom: 2px;
}
.ti-cs-link:hover, .ti-cs-link:focus { border-color: currentColor; }

@media (max-width: 640px) {
  .ti-cs-drawer { min-width: 280px; padding: 16px 18px; max-height: calc(100vh - 72px); }
  .ti-cs-tab { padding: 10px 8px; right: var(--ti-cs-tab-offset, 35px); }
}