/*
 * Mufeng OneNav iOS 26 — site-wide tooltip glass theme
 * Version: 1.8.5.20
 *
 * Visual-only override for Bootstrap 4/5 tooltips. It intentionally does not
 * change title text, tooltip initialization, hover/click triggers or placement.
 */

.tooltip {
  --mf-tooltip-bg: linear-gradient(145deg, rgba(255,255,255,.97), rgba(238,246,255,.94));
  --mf-tooltip-text: #26364b;
  --mf-tooltip-border: rgba(255,255,255,.94);
  --mf-tooltip-arrow: rgba(245,250,255,.97);
  --mf-tooltip-shadow: 0 12px 30px rgba(37, 57, 86, .20), 0 2px 8px rgba(37, 57, 86, .10);
  --bs-tooltip-bg: var(--mf-tooltip-bg);
  --bs-tooltip-color: var(--mf-tooltip-text);
  --bs-tooltip-opacity: 1;
}

.tooltip.show {
  opacity: 1 !important;
  filter: none !important;
  z-index: 1090;
}

.tooltip .tooltip-inner {
  box-sizing: border-box;
  max-width: 280px !important;
  padding: 9px 12px !important;
  color: var(--mf-tooltip-text) !important;
  background: var(--mf-tooltip-bg) !important;
  border: 1px solid var(--mf-tooltip-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--mf-tooltip-shadow) !important;
  -webkit-backdrop-filter: blur(18px) saturate(155%);
  backdrop-filter: blur(18px) saturate(155%);
  font-size: 12px !important;
  font-weight: 500;
  line-height: 1.55 !important;
  letter-spacing: .01em;
  text-align: left !important;
  text-shadow: none !important;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Bootstrap 4 arrows */
.tooltip.bs-tooltip-top .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
  border-top-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-bottom .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
  border-bottom-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-left .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
  border-left-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-right .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
  border-right-color: var(--mf-tooltip-arrow) !important;
}

/* Bootstrap 5 / Popper arrow compatibility */
.tooltip.bs-tooltip-top .tooltip-arrow::before,
.tooltip[data-popper-placement^="top"] .tooltip-arrow::before {
  border-top-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-bottom .tooltip-arrow::before,
.tooltip[data-popper-placement^="bottom"] .tooltip-arrow::before {
  border-bottom-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-start .tooltip-arrow::before,
.tooltip[data-popper-placement^="left"] .tooltip-arrow::before {
  border-left-color: var(--mf-tooltip-arrow) !important;
}
.tooltip.bs-tooltip-end .tooltip-arrow::before,
.tooltip[data-popper-placement^="right"] .tooltip-arrow::before {
  border-right-color: var(--mf-tooltip-arrow) !important;
}

/* OneNav night mode: deep OLED blue/graphite glass. */
html.io-black-mode .tooltip,
body.io-black-mode .tooltip {
  --mf-tooltip-bg: linear-gradient(145deg, rgba(31,43,61,.97), rgba(17,27,43,.96));
  --mf-tooltip-text: #edf4ff;
  --mf-tooltip-border: rgba(151,184,225,.24);
  --mf-tooltip-arrow: rgba(24,37,56,.97);
  --mf-tooltip-shadow: 0 14px 34px rgba(0,0,0,.36), 0 2px 10px rgba(0,0,0,.22);
}

/* Low-transparency fallback for older browsers. */
@supports not (backdrop-filter: blur(1px)) {
  .tooltip .tooltip-inner {
    background: rgba(250,252,255,.98) !important;
  }
  html.io-black-mode .tooltip .tooltip-inner,
  body.io-black-mode .tooltip .tooltip-inner {
    background: rgba(24,36,54,.98) !important;
  }
}

/* Narrow screens: keep the bubble inside the viewport. */
@media (max-width: 575.98px) {
  .tooltip .tooltip-inner {
    max-width: min(260px, calc(100vw - 28px)) !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
  }
}