/* ============================================================
   Cookiebot (Usercentrics) 동의 배너 — CUBIG 브랜드 컬러만 적용
   - 레이아웃/폰트/배경 등은 Cookiebot 기본 유지(대시보드 영역).
   - 여기서는 버튼·토글 색만 브랜드 보라(#8A77E0 / hover #6f5cd6)로.
   - 배너는 플러그인이 JS로 주입 → 라이브에서만 노출(로컬 미리보기 X).
   - html 접두사 + !important로 플러그인 주입 색을 우선 적용.
   ============================================================ */

/* Primary = Allow all → 보라 채움 */
html #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll {
  background: #8A77E0 !important;
  border-color: #8A77E0 !important;
  color: #fff !important;
}
html #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover {
  background: #6f5cd6 !important;
  border-color: #6f5cd6 !important;
}

/* Secondary = Allow selection / Deny → 흰 버튼 + 회색 보더 */
html #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection,
html #CybotCookiebotDialog #CybotCookiebotDialogBodyButtonDecline {
  background: #fff !important;
  color: #1c1c1c !important;
  border-color: rgba(28, 28, 28, .18) !important;
}
html #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection:hover,
html #CybotCookiebotDialog #CybotCookiebotDialogBodyButtonDecline:hover {
  border-color: rgba(28, 28, 28, .35) !important;
}

/* 배너 하단 여백을 상단과 동일하게 (기본 패딩 24 + 제목 여백 6 = 위 30 → 아래도 30) */
html #CybotCookiebotDialog { padding-bottom: 30px !important; }

/* 오른쪽 버튼 3개(Allow all/selection/Deny) 하단정렬 */
html #CybotCookiebotDialog div:has(#CybotCookiebotDialogBodyButtonDecline):not(:has(#CybotCookiebotDialogBodyContentTitle)) {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}

/* 토글 ON 상태 → 보라 */
html #CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #8A77E0 !important;
}

/* 토글 OFF 상태 → 연한 회색(기본 검정 X). ON(:checked)은 위에서 보라로 덮음 */
html #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #d8d8d8 !important;
}

/* 토글 스위치 크기 축소(기본 57×32 → 38×20) + knob/이동 보정 */
html #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonSlider {
  width: 38px !important;
  height: 20px !important;
  border-radius: 20px !important;
}
html #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonSlider:before {
  width: 14px !important;
  height: 14px !important;
  left: 3px !important;
  bottom: 3px !important;
}
html #CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider:before {
  transform: translateX(18px) !important;
}

/* 토글 타이틀 크기 축소 */
html #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonDescription {
  font-size: 12px !important;
}

/* 좌측: 기본 둥근 아이콘 제거 + 그 자리에 Cookiebot 로고만 중앙·회색 페이드 */
html #CybotCookiebotDialog div:has(> #CybotCookiebotDialogPoweredbyCybot) {
  justify-content: center !important;
  align-items: center !important;
}
html #CybotCookiebotDialog div:has(> #CybotCookiebotDialogPoweredbyCybot) > *:not(#CybotCookiebotDialogPoweredbyCybot) {
  display: none !important;
}
html #CybotCookiebotDialog #CybotCookiebotDialogPoweredbyCybot {
  margin: 0 !important;
  max-width: 105px !important;
  opacity: .45 !important;          /* 약간 회색 페이드 */
  transition: opacity .2s ease !important;
}
html #CybotCookiebotDialog #CybotCookiebotDialogPoweredbyCybot:hover { opacity: .7 !important; }
html #CybotCookiebotDialog #CybotCookiebotDialogPoweredbyCybot img { max-width: 100% !important; height: auto !important; }

/* 링크(Show details 등) → 브랜드 보라 */
html #CybotCookiebotDialog a { color: #6f5cd6 !important; }

/* 토글 라벨 글자가 박스보다 ~6px 아래로 처지는 Cookiebot 기본 현상 → 광학 수직중앙 보정.
   데스크탑(라벨 한 줄)에서만 — 모바일 스택 레이아웃은 기본 유지. */
@media (min-width: 901px) {
  html #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonDescription {
    position: relative !important;
    top: -6px !important;
  }
}