/* ==========================================================================
   rt-tooltip — the app-wide button tooltip (11-Sep-2026).

   Visual spec is the rt-design-system Tooltip (Design Reference/rt-design-system/
   src/components/ui/tooltip.tsx): bg-primary + primary-foreground, text-xs,
   px-3 py-1.5, rounded-md, sideOffset 4, fade-in + zoom-in-95.

   Own never-cached file on purpose: main.css is long-cached in the browser,
   so a rule added there would not reach users (see project memory,
   feedback-collectstatic-and-cached-css). Behaviour is in js/rt-tooltip.js.
   ========================================================================== */
.rt-tip {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483000;
    max-width: 280px;
    padding: 6px 12px;
    border-radius: 6px;
    background: var(--color-primary, #f2542d);
    color: var(--color-text-inverse, #ffffff);
    font-family: inherit;
    font-size: var(--fs-12, 12px);
    font-weight: 500;
    line-height: var(--line-height-snug);
    text-align: left;
    white-space: pre-line;   /* clipped text + action arrive as two lines */
    overflow-wrap: anywhere;
    pointer-events: none;
    opacity: 0;
    transform: scale(0.95);
    transition: opacity 120ms ease-out, transform 120ms ease-out;
}
.rt-tip[data-side="top"]    { transform-origin: 50% 100%; }
.rt-tip[data-side="bottom"] { transform-origin: 50% 0; }
.rt-tip.is-open { opacity: 1; transform: scale(1); }
/* Formula tips (RT, 17-Sep-2026): definition, then "Formula:", then
   "Currently:" with the screen's own figures. Three parts need more width
   than a button label; still capped by the viewport on a phone. */
.rt-tip.is-formula { max-width: min(380px, calc(100vw - 16px)); }

@media (prefers-reduced-motion: reduce) {
    .rt-tip { transition: none; transform: none; }
}

/* A disabled button is still hovered so its reason can be read. The DS
   button sets pointer-events:none on disabled; this app keeps them live and
   relies on cursor:not-allowed, which is restated here for the span-based
   disabled buttons (.is-disabled / .is-off) that main.css does not cover. */
.btn.is-disabled, .btn.is-off, [aria-disabled="true"].btn { cursor: not-allowed; }

/* The two hand-built CSS tooltips that predate this component now defer to
   it. Their text is still in the DOM (aria-describedby) and is what the
   global tooltip shows, so hiding the visual copy avoids a double tooltip. */
.hod-commit-wrap .hod-commit-tip,
.iap-submit-wrap .iap-submit-tip { display: none !important; }

/* Readonly fields: the not-allowed cursor tells the user before the tooltip
   does that the field cannot be typed into. */
input[readonly]:not([type="hidden"]):not(.flatpickr-input), textarea[readonly] { cursor: not-allowed; }
