/* 슬라이드 하단 로고·홈페이지 주소(2026-10-22).
   두 부분으로 나뉜다.
   1) 선택 상자(.slide-brand-options): 포털 화면 부품이라 토큰·44px 누름 영역을 따르고 밝은/어두운 모드를 따라간다.
   2) 슬라이드 하단 띠(.slide-brand-footer): 슬라이드는 인쇄·문서 재현 영역이므로 포털 테마·글꼴과 분리한다.
      색과 글꼴은 이 띠 안의 --slide-brand-* 값으로만 정하고, 어두운 모드에서도 바뀌지 않는다(PDF·PPTX·HTML과 같은 모양).
   원본 그림의 위치는 바꾸지 않고, 그림이 실제로 그려진 사각형 안쪽 아래에만 얹는다. 화면 폭 기준은 760px·1180px만 쓴다. */

/* ---------------- 슬라이드 하단 띠(문서 쪽) ---------------- */
.slide-brand-footer {
  --slide-brand-ink: #4d6070;
  --slide-brand-quiet: #5b6d7a;
  --slide-brand-focus: #136a36;
  --slide-brand-hit: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  color: var(--slide-brand-ink);
  background: transparent;
  font-family: Pretendard, "Pretendard Variable", -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 500;
  line-height: 1.2;
  pointer-events: none;
}
.slide-brand-footer__left { display: flex; align-items: center; min-width: 0; height: 100%; }
.slide-brand-footer__right { display: flex; justify-content: flex-end; min-width: 0; }
.slide-brand-footer__left > img { display: block; width: auto; height: 100%; max-width: 100%; object-fit: contain; }
/* 눈에 보이는 글자는 작아도 누르는 영역은 44px 안팎: 안쪽 여백을 늘리고 바깥 여백으로 되돌려 배치는 그대로 둔다. */
.slide-brand-footer__right > a {
  display: inline-block;
  padding: var(--slide-brand-hit);
  margin: calc(var(--slide-brand-hit) * -1);
  color: var(--slide-brand-ink);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  pointer-events: auto;
}
/* 발표 화면(scene·overlay)의 주소는 누르는 대상이 아닌 글자다. 띠 전체가 pointer-events:none이라 그 위 탭은 슬라이드로 넘어간다. */
.slide-brand-footer__right > .slide-brand-site { color: var(--slide-brand-ink); font-size: 12px; font-weight: 500; white-space: nowrap; }
.slide-brand-footer__right > a:hover { text-decoration: underline; }
.slide-brand-footer__right > a:focus-visible { outline: 2px solid var(--slide-brand-focus); outline-offset: -4px; }

/* 그림 위에 얹는 띠: 그림이 그려진 사각형(.slide-brand-overlay) 기준 비율. cqw는 슬라이드 폭을 따라간다. */
.slide-brand-overlay,
.slide-branded-sheet,
.slide-brand-print-sheet { container-type: inline-size; }
.slide-brand-overlay { position: absolute; pointer-events: none; z-index: 5; }
.slide-brand-overlay[hidden] { display: none; }
.slide-brand-overlay > .slide-brand-footer,
.slide-branded-sheet > .slide-brand-footer,
.slide-brand-print-sheet > .slide-brand-footer {
  position: absolute;
  left: 4.8%;
  right: 14%;
  bottom: 1.2%;
  align-items: end;
  padding: 0;
  z-index: 5;
}
/* 크기는 슬라이드 폭에 비례한다(퍼센트 높이는 작은 미리보기에서 로고가 띠 밖으로 넘쳐 잘렸다). 780px 폭 슬라이드에서 로고 높이 약 16px. */
.slide-brand-overlay > .slide-brand-footer img,
.slide-branded-sheet > .slide-brand-footer img,
.slide-brand-print-sheet > .slide-brand-footer img { width: auto; height: clamp(10px, 2.05cqw, 22px); max-width: none; }
.slide-brand-overlay > .slide-brand-footer a,
.slide-branded-sheet > .slide-brand-footer a,
.slide-brand-print-sheet > .slide-brand-footer a,
.slide-brand-overlay > .slide-brand-footer .slide-brand-site { font-size: clamp(9px, 1.5cqw, 12px); }

/* 옛 제품 선택·CMS 발표 화면(presentation-catalog·appendix·legacy)의 하단 줄 */
.presentation-footer.slide-brand-footer--scene {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  height: 1lh;
  flex: none;
  margin: 0;
  padding: 0;
  line-height: inherit;
  font-family: inherit;
  color: var(--slide-brand-quiet);
}
.slide-brand-footer__scene-left { flex: 1; align-self: stretch; position: relative; }
.slide-brand-category-under-logo { visibility: hidden; }
.slide-brand-footer__scene-left > img { position: absolute; left: 0; bottom: 0; height: clamp(20px, 3vmin, 32px); max-width: 112px; }
.slide-brand-footer--scene > .slide-brand-footer__right { flex: none; }

/* ---------------- 선택 상자(포털 화면 쪽) ---------------- */
.slide-brand-options {
  --slide-brand-line: var(--rule, currentcolor);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 20px;
  min-width: 0;
  margin: 12px 0;
  padding: 4px 14px 8px;
  border: 1px solid var(--slide-brand-line);
  border-radius: var(--radius-control);
}
.slide-brand-options > legend { padding: 0 6px; color: var(--ink-2, inherit); font-size: .8125rem; font-weight: 600; }
.slide-brand-options > .slide-brand-note { flex-basis: 100%; order: 3; margin: 0 0 4px; color: var(--ink-3, inherit); font-size: .8125rem; line-height: 1.5; }
.slide-brand-options > label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: var(--height-touch, 44px);
  margin: 0;
  color: var(--ink-2, inherit);
  font-size: .875rem;
  font-weight: 400;
  cursor: pointer;
}
.slide-brand-options > label:has(input:focus-visible) { outline: 2px solid var(--focus-ring, currentcolor); outline-offset: 2px; border-radius: var(--radius-small); }
.slide-brand-options input[type=checkbox] { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--accent, auto); cursor: inherit; }
.library-toolbar > .slide-brand-options { flex-basis: 100%; }
.flow-options .slide-brand-options { grid-column: 1 / -1; }
.wb-brand-options { margin: 16px 0 0; }

@media (max-width: 760px) {
  .slide-brand-footer--scene { gap: 10px; }
  .slide-brand-footer--scene a { font-size: 10px; }
  .slide-brand-options { gap: 0 12px; }
}
@media print {
  .slide-brand-options { display: none; }
  .slide-brand-footer { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .wb-print-output > .slide-brand-print-sheet,
  .library-print-pages > .slide-brand-print-sheet { position: relative; }
  .slide-brand-print-sheet > .slide-brand-footer a { font-size: 8pt; }
}
