/**
 * OneTrust Cookie Banner — Miora Brand Override
 *
 * 将 OneTrust 默认的绿色/矩形横幅覆盖为 Miora 品牌橙色 + 胶囊圆角版本。
 * 对应 Issue #1552: Cookie 横幅样式调整为橙色版（与品牌主色一致）
 *
 * 设计 token 来源：miora-spell（--ms-* CSS 变量）。
 * 由于 OneTrust SDK 在 React 之前加载、横幅可能在 token 体系就绪前注入，
 * 关键颜色提供 fallback（brand-9 = #FD7E14）。
 */

/* ========== 主横幅容器（底部弹出的 Cookie Banner）========== */
#onetrust-banner-sdk {
  /* 品牌橙背景 */
  background-color: hsl(var(--ms-brand-9, 27.24 98.37% 53.69%)) !important;
  /* 胶囊圆角 */
  border-radius: calc(var(--ms-radius-2xl, 20px) * var(--radius-scale, 1)) !important;
  corner-shape: superellipse(var(--superellipse-curve, 1)) !important;
  /* 阴影 */
  box-shadow: var(--ms-shadow-lg, 0px 8px 16px rgba(0, 0, 0, 0.12)) !important;
  /* 边框去除 */
  border: none !important;
  width: calc(100% - 32px);
  /* 最大宽度限制，避免在宽屏上过宽 */
  max-width: 1200px !important;
  /* 间距 */
  padding: 24px 32px !important;
  margin: 0 auto 24px !important;
}

/* 隐藏 OneTrust 内部容器默认背景 */
#onetrust-banner-sdk .ot-sdk-container {
  background: transparent !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

#onetrust-banner-sdk .ot-sdk-row {
  margin: 0 !important;
}

/* ========== 标题（YOUR COOKIE PREFERENCES）========== */
#onetrust-banner-sdk #onetrust-policy-title {
  color: var(--ms-whiteA-12-hex, #fffffff2) !important;
  font-size: var(--ms-text-xl, 16px) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
}

/* ========== 说明文字 ========== */
#onetrust-banner-sdk #onetrust-policy-text {
  color: var(--ms-whiteA-11-hex, #ffffffe6) !important;
  font-size: var(--ms-text-base, 12px) !important;
  line-height: var(--ms-leading-normal, 1.5) !important;
}

/* ========== Cookies Policy 链接 ========== */
#onetrust-banner-sdk #onetrust-policy-text a,
#onetrust-banner-sdk .ot-policy-link {
  color: var(--ms-whiteA-12-hex, #fffffff2) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

#onetrust-banner-sdk #onetrust-policy-text a:hover,
#onetrust-banner-sdk .ot-policy-link:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* ========== 按钮容器 ========== */
#onetrust-banner-sdk #onetrust-button-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* ========== 通用按钮重置 ========== */
#onetrust-banner-sdk .ot-banner-button,
#onetrust-banner-sdk #onetrust-accept-btn-handler,
#onetrust-banner-sdk #onetrust-reject-all-handler,
#onetrust-banner-sdk #onetrust-pc-btn-handler {
  /* 基础样式 */
  border-radius: calc(var(--ms-radius-full, 9999px) * var(--radius-scale, 1)) !important;
  corner-shape: superellipse(var(--superellipse-curve, 1)) !important;
  font-size: var(--ms-text-sm, 11px) !important;
  font-weight: 500 !important;
  padding: 8px 20px !important;
  min-height: 32px !important;
  cursor: pointer !important;
  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
              color 150ms cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
}

/* ========== Accept all 按钮 — 白底主按钮 ========== */
#onetrust-banner-sdk #onetrust-accept-btn-handler {
  background-color: #ffffff !important;
  color: hsl(var(--ms-brand-9, 27.24 98.37% 53.69%)) !important;
  border: none !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), inset 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
}

#onetrust-banner-sdk #onetrust-accept-btn-handler:hover {
  background-color: hsl(var(--ms-brand-1, 23.37 55.16% 98.98%)) !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.16), inset 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
}

#onetrust-banner-sdk #onetrust-accept-btn-handler:active {
  transform: scale(0.97) !important;
}

/* ========== Reject all 按钮 — 透明描边按钮 ========== */
#onetrust-banner-sdk #onetrust-reject-all-handler {
  background-color: transparent !important;
  color: var(--ms-whiteA-12-hex, #fffffff2) !important;
  border: 1px solid var(--ms-whiteA-8-hex, #ffffff99) !important;
}

#onetrust-banner-sdk #onetrust-reject-all-handler:hover {
  background-color: var(--ms-whiteA-2-hex, #ffffff1a) !important;
  border-color: var(--ms-whiteA-10-hex, #ffffffcc) !important;
}

#onetrust-banner-sdk #onetrust-reject-all-handler:active {
  transform: scale(0.97) !important;
}

/* ========== Customize Settings 按钮 — 透明文字按钮 ========== */
#onetrust-banner-sdk #onetrust-pc-btn-handler,
#onetrust-banner-sdk .ot-banner-button.ot-pc-btn {
  background-color: transparent !important;
  color: var(--ms-whiteA-11-hex, #ffffffe6) !important;
  border: none !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

#onetrust-banner-sdk #onetrust-pc-btn-handler:hover,
#onetrust-banner-sdk .ot-banner-button.ot-pc-btn:hover {
  color: #ffffff !important;
  background-color: var(--ms-whiteA-1-hex, #ffffff0d) !important;
}

#onetrust-banner-sdk #onetrust-pc-btn-handler:active {
  transform: scale(0.97) !important;
}

/* ========== 关闭按钮（右上角 ×）========== */
#onetrust-banner-sdk #onetrust-close-btn-container button {
  color: var(--ms-whiteA-10-hex, #ffffffcc) !important;
  background: transparent !important;
}

#onetrust-banner-sdk #onetrust-close-btn-container button:hover {
  color: #ffffff !important;
}

/* ========== 横幅内 logo（如有）========== */
#onetrust-banner-sdk .ot-bnr-logo {
  filter: brightness(0) invert(1) !important;
}

/* ========== Preference Center (弹出的详细设置弹窗) ========== */
#onetrust-pc-sdk {
  border-radius: calc(var(--ms-radius-xl, 16px) * var(--radius-scale, 1)) !important;
  corner-shape: superellipse(var(--superellipse-curve, 1)) !important;
  box-shadow: var(--ms-shadow-lg, 0px 8px 16px rgba(0, 0, 0, 0.12)) !important;
}

#onetrust-pc-sdk #ot-pc-title {
  font-size: var(--ms-text-xl, 16px) !important;
  font-weight: 600 !important;
  color: var(--ms-grayA-12-hex, #000000df) !important;
}

#onetrust-pc-sdk .ot-pc-header {
  border-bottom: 1px solid hsl(var(--ms-gray-6, 0 0% 85.1%)) !important;
}

#onetrust-pc-sdk .ot-cat-item {
  border-bottom: 1px solid hsl(var(--ms-gray-4, 0 0% 90.98%)) !important;
}

#onetrust-pc-sdk .ot-cat-item h4 {
  color: var(--ms-grayA-12-hex, #000000df) !important;
  font-size: var(--ms-text-base, 12px) !important;
  font-weight: 500 !important;
}

#onetrust-pc-sdk .ot-cat-item p {
  color: var(--ms-grayA-10-hex, #0000007c) !important;
  font-size: var(--ms-text-xs, 10px) !important;
}

/* Preference Center 按钮 */
#onetrust-pc-sdk .ot-pc-footer .ot-btn-container button {
  border-radius: calc(var(--ms-radius-full, 9999px) * var(--radius-scale, 1)) !important;
  font-size: var(--ms-text-sm, 11px) !important;
  font-weight: 500 !important;
  padding: 8px 20px !important;
}

#onetrust-pc-sdk #accept-recommended-btn-handler {
  background-color: hsl(var(--ms-brand-9, 27.24 98.37% 53.69%)) !important;
  color: var(--ms-whiteA-12-hex, #fffffff2) !important;
  border: none !important;
}

#onetrust-pc-sdk #accept-recommended-btn-handler:hover {
  background-color: hsl(var(--ms-brand-10, 30.31 129.56% 39.74%)) !important;
}

#onetrust-pc-sdk .save-preference-btn-handler {
  background-color: transparent !important;
  color: var(--ms-grayA-12-hex, #000000df) !important;
  border: 1px solid hsl(var(--ms-gray-7, 0 0% 80.78%)) !important;
}

#onetrust-pc-sdk .save-preference-btn-handler:hover {
  background-color: hsl(var(--ms-gray-3, 0 0% 94.11%)) !important;
}

:focus {
  outline: none;
}

/* 隐藏浮动按钮 */
    #ot-sdk-btn-floating { display: none !important; }

@media only screen and (max-width: 425px) {
  #onetrust-banner-sdk #onetrust-policy {
    margin-top: 10px !important;
  }
}

@media (max-width: 768px) {
  #onetrust-banner-sdk {
    max-width: calc(100vw - 32px) !important;
    padding: 20px 24px !important;
    border-radius: calc(var(--ms-radius-xl, 16px) * var(--radius-scale, 1)) !important;
    corner-shape: superellipse(var(--superellipse-curve, 1)) !important;
    margin: 0 auto 16px !important;
  }

  /* 窄屏下按钮组改为纵向排列 */
  #onetrust-banner-sdk #onetrust-button-group {
    flex-direction: column !important;
    width: 100% !important;
  }

  #onetrust-banner-sdk .ot-banner-button,
  #onetrust-banner-sdk #onetrust-accept-btn-handler,
  #onetrust-banner-sdk #onetrust-reject-all-handler,
  #onetrust-banner-sdk #onetrust-pc-btn-handler {
    width: 100% !important;
    text-align: center !important;
  }

  /* 窄屏下标题和正文也要调整 */
  #onetrust-banner-sdk #onetrust-policy-title {
    font-size: var(--ms-text-lg, 14px) !important;
  }

  #onetrust-banner-sdk #onetrust-policy-text {
    font-size: var(--ms-text-xs, 10px) !important;
  }
}

@media screen and (min-width: 890px) {
  #onetrust-banner-sdk .ot-sdk-row {
    display: flex !important;
    align-items: center;
  }
    #onetrust-banner-sdk:not(.ot-iab-2) #onetrust-group-container {
        width: 1px !important;
        flex: 1;
    }
    #onetrust-banner-sdk #onetrust-policy {
        margin-left: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
  #onetrust-banner-sdk:not(.ot-iab-2) #onetrust-button-group-parent {
    position: static !important;
    padding-right: 0 !important;
    padding-left: 20px !important;
    width: 300px !important;
  }
  #onetrust-banner-sdk.ot-buttons-fw:not(.ot-iab-2) #onetrust-button-group {
    margin-top: 0 !important;
  }
  #onetrust-banner-sdk #onetrust-accept-btn-handler, #onetrust-banner-sdk #onetrust-reject-all-handler, #onetrust-banner-sdk #onetrust-pc-btn-handler {
        margin-right: 0 !important;
    }
}