/* =====================================================================
   ПОДСКАЗКА «ПОДРОБНЕЕ» — ОДИН СТИЛЬ ДЛЯ ВСЕГО КАБИНЕТА
   Основа — подсказка Лиги Монстров (Monster_Leaque_reg.php).
   Подключается на страницах: guide.php (справочник), Monster_Leaque_reg.php.
   Менять стиль подсказок — только здесь.

   Разметка (data-pop data-bs-toggle="popover" data-bs-content="…", popover создаёт Monsterlegue.js):
     .mi-pop
       .mi-pop__head  > .mi-pop__name + .mi-cls[.mi-cls--normal|--premium|--brave]
       .mi-pop__block > .mi-pop__title, .mi-pop__row (.mi-pop__k + .mi-pop__v), .mi-pop__note
   Цвет рамки/шапки: по умолчанию голубой; .mi-cls--normal — зелёный, --premium — синий, --brave — золотой.
   Селекторы .popover.ml2-popover … обязательны: в style.css есть старое правило с чёрным фоном.
   ===================================================================== */

.popover.ml2-popover {
  --mi-pc: rgba(120,180,245,.75);                 /* цвет рамки и шапки */
  max-width: 340px;
  --bs-popover-bg: #16243a; --bs-popover-border-color: var(--mi-pc); --bs-popover-arrow-border: var(--mi-pc);
  --bs-popover-arrow-width: 16px; --bs-popover-arrow-height: 8px;
  background: linear-gradient(180deg, #1c2d47 0%, #111c2d 100%) !important;
  border: 1px solid var(--mi-pc) !important; border-radius: 12px !important;
  box-shadow: 0 0 16px color-mix(in srgb, var(--mi-pc) 60%, transparent), 0 14px 32px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.14) !important;
  backdrop-filter: none !important;
}
.popover.ml2-popover:has(.mi-cls--normal)  { --mi-pc: #2fae8f; }
.popover.ml2-popover:has(.mi-cls--premium) { --mi-pc: #3f8fe0; }
.popover.ml2-popover:has(.mi-cls--brave)   { --mi-pc: #e0a92e; }
.popover.ml2-popover .popover-body { padding: 0; color: #e3e9f2; background: transparent !important; border-radius: 11px; }
/* стрелка: заливка в цвет того края подсказки, к которому она примыкает */
.popover.ml2-popover[data-popper-placement^="bottom"] { --bs-popover-bg: #2e4f79; }
.popover.ml2-popover[data-popper-placement^="top"]    { --bs-popover-bg: #111c2d; }
.popover.ml2-popover[data-popper-placement^="left"],
.popover.ml2-popover[data-popper-placement^="right"]  { --bs-popover-bg: #17263d; }
.popover.ml2-popover .popover-arrow::before { filter: drop-shadow(0 0 3px color-mix(in srgb, var(--mi-pc) 70%, transparent)); }

.mi-pop { font-size: 13.5px; line-height: 1.4; min-width: 250px; }
.mi-pop__head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 14px; border-radius: 11px 11px 0 0;
  border-bottom: 1px solid color-mix(in srgb, var(--mi-pc) 40%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--mi-pc) 35%, transparent), color-mix(in srgb, var(--mi-pc) 12%, transparent));
}
.mi-pop__name { font-weight: 800; font-size: 15px; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
/* плашка в шапке: по умолчанию как в Лиге (тёмная, золотой текст); цветные варианты — для мунов/коробок */
.mi-cls { padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap;
  color: #ffd36b; background: rgba(0,0,0,.45); border: 1px solid rgba(240,185,42,.55); }
.mi-cls--normal  { background: #2fae8f; color: #fff; border-color: transparent; }
.mi-cls--premium { background: #3f8fe0; color: #fff; border-color: transparent; }
.mi-cls--brave   { background: #e0a92e; color: #1b1b1b; border-color: transparent; }
.mi-pop__block { padding: 8px 14px 10px; }
.mi-pop__block + .mi-pop__block { border-top: 1px dashed rgba(255,255,255,.18); }
.mi-pop__title { font-weight: 700; color: #9fd0ff; margin-bottom: 4px; }
.mi-pop__row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.mi-pop__row:last-child, .mi-pop__row:last-of-type { border-bottom: 0; }
.mi-pop__k { color: #8b9bb0; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.mi-pop__v { text-align: right; color: #e8ecf4; }
.mi-pop__v b { color: #fff; }
.mi-pop__v .mi-hi { color: #ffd36b; }
.mi-cond { display: inline-block; padding: 1px 8px; border-radius: 999px; background: rgba(127,178,255,.14); border: 1px solid rgba(127,178,255,.3); color: #9fd0ff; font-weight: 600; white-space: nowrap; }
.mi-pop__note { margin-top: 5px; font-size: 12px; color: #aab4c4; font-style: italic; }
/* пояснение-акцент (оранжевое, с отступом) — например, «растёт с уровнем» у гвардианов */
.mi-pop__note--accent { margin: 0 14px 12px; padding: 6px 10px; border-left: 3px solid #d98a3a; border-radius: 0 8px 8px 0; background: rgba(217,138,58,.12); color: #f2b57a; font-style: normal; line-height: 1.45; }