/* ============================================================
   Export buttons — fixed top-right toolbar on flat HTML pages
   ============================================================ */

.export-toolbar {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 1000;
  display: flex;
  gap: 8px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid var(--neutral-200);
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(30, 30, 30, 0.12), 0 1px 3px rgba(30, 30, 30, 0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.export-toolbar .doc-name {
  display: flex;
  align-items: center;
  padding: 0 14px 0 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--neutral-600);
  letter-spacing: -0.005em;
  border-right: 1px solid var(--neutral-100);
  margin-right: 4px;
  white-space: nowrap;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.export-toolbar button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--neutral-200);
  background: #fff;
  color: var(--neutral-800);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  cursor: pointer;
  transition: all 160ms ease-out;
}
.export-toolbar button:hover:not(:disabled) {
  border-color: var(--primary-300);
  color: var(--primary-700);
  background: var(--bg-tint-primary);
}
.export-toolbar button.primary {
  background: var(--primary-500);
  border-color: var(--primary-500);
  color: #fff;
}
.export-toolbar button.primary:hover:not(:disabled) {
  background: var(--primary-700);
  border-color: var(--primary-700);
  color: #fff;
}
.export-toolbar button:disabled {
  opacity: 0.55;
  cursor: progress;
}
.export-toolbar .back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--neutral-200);
  background: #fff;
  color: var(--neutral-800);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  text-decoration: none;
  cursor: pointer;
  transition: all 160ms ease-out;
}
.export-toolbar .back:hover {
  border-color: var(--primary-300);
  color: var(--primary-700);
  background: var(--bg-tint-primary);
}
.export-toolbar .back .icon {
  font-size: 18px;
  line-height: 1;
  margin-top: -1px;
}
.export-toolbar button .icon {
  font-size: 15px;
  line-height: 1;
}

.export-toolbar .pdf-progress {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: -6px;
  height: 2px;
  background: var(--neutral-100);
  border-radius: 999px;
  overflow: hidden;
  display: none;
}
.export-toolbar.busy .pdf-progress { display: block; }
.export-toolbar .pdf-progress .bar {
  height: 100%;
  width: 0%;
  background: var(--primary-500);
  transition: width 200ms ease-out;
}

/* Print-time: hide the toolbar entirely */
@media print {
  .export-toolbar { display: none !important; }
}

/* 목차로 돌아가기 버튼 */
.export-toolbar .btn-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid var(--neutral-200);
  background: #fff;
  color: var(--neutral-600);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  cursor: pointer;
  text-decoration: none;
  transition: all 160ms ease-out;
}
.export-toolbar .btn-back:hover {
  border-color: var(--neutral-300);
  color: var(--neutral-800);
}

/* PDF 다운로드 버튼 */
.export-toolbar .btn-pdf {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--primary-500);
  background: var(--primary-500);
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  cursor: pointer;
  text-decoration: none;
  transition: all 160ms ease-out;
}
.export-toolbar .btn-pdf:hover {
  background: var(--primary-700);
  border-color: var(--primary-700);
}
.export-toolbar .btn-pdf .icon,
.export-toolbar .btn-back .icon {
  font-size: 15px;
  line-height: 1;
}

@media (max-width: 600px) {
  .export-toolbar .doc-name { display: none; }
  .export-toolbar .btn-back .label,
  .export-toolbar .btn-pdf .label,
  .export-toolbar button .label { display: none; }
  .export-toolbar .btn-back,
  .export-toolbar .btn-pdf,
  .export-toolbar button { padding: 10px 14px; }
}
