/*
 * Подсказка «i» кабинета (`sc_tip_html()`, inc/tip.php). Свой файл, а не срез Claude Design:
 * `parts/*.css` - побайтовые копии проекта дизайна, и чужое правило в них потерялось бы.
 * Только логические свойства.
 */
.sc-tip{position:relative;display:inline-flex;align-items:center;vertical-align:middle}
.sc-tip__b{display:inline-flex;align-items:center;justify-content:center;inline-size:20px;block-size:20px;
  padding:0;border:0;border-radius:50%;background:transparent;color:var(--sc-ink-500);cursor:pointer;line-height:0}
.sc-tip__b .sc-icon{font-size:16px}
.sc-tip__b:hover,.sc-tip__b[aria-expanded="true"]{color:var(--sc-text)}
.sc-tip__b:focus-visible{outline:var(--sc-focus-ring-w) solid var(--sc-focus-ring);outline-offset:1px}
/* Без скрипта пояснение стоит строкой рядом со значком - иначе оно пропало бы целиком. */
.sc-tip__t{margin-inline-start:6px;font-size:13px;line-height:18px;color:var(--sc-text-muted)}
html.js .sc-tip__t{display:none;position:absolute;z-index:30;inset-block-start:calc(100% + 6px);inset-inline-start:-8px;
  inline-size:max-content;max-inline-size:min(280px,70vw);margin:0;padding:8px 12px;border-radius:var(--sc-radius-ctl);
  background:var(--sc-ink-950);color:var(--sc-plane);font-size:13px;font-weight:var(--sc-fw-text);line-height:18px;
  white-space:normal;text-align:start;box-shadow:var(--sc-shadow-overlay)}
html.js .sc-tip[data-open] .sc-tip__t{display:block}
/* У конечного края слой ложится влево от значка: признак ставит скрипт, когда места справа нет. */
html.js .sc-tip[data-end] .sc-tip__t{inset-inline-start:auto;inset-inline-end:-8px}

