/*
 * tooltip.css
 *
 * Global skin for the framework's shared Tooltip widget
 * (kohezion_core/ui/tooltip/tooltip.js + core/ui/tooltip/tooltip.js).
 *
 * Every attachTooltip() call in the codebase - calendar event
 * chips, grid cells, form labels, icon buttons, the Timeline widget,
 * etc. - goes through the singleton Tooltip instance, so this file
 * is the single source of truth for tooltip appearance.
 *
 * Design: "Minimal Card" (Option 1 of the redesign proposal).
 * Matches the Kohezion palette in calendar_sidebar.css and
 * ui/timeline.css so tooltips feel native to the rest of the product.
 *
 * The widget root automatically gets class="Tooltip" via
 * Panel.create() (panel.js sets className = getType(this)), so all
 * selectors below hang off the .Tooltip root.
 */

/* Panel.create()/postCreate() writes inline styles for margin,
 * padding, box-sizing and border on the widget root, so most of
 * the skin overrides below use !important to win the cascade. */
.Tooltip {
    /* Surface */
    background: #ffffff !important;
    border: 1px solid #DEE0E3 !important;
    border-radius: 4px;
    padding: 10px 14px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
    max-width: 360px;

    /* Typography */
    font-family: Roboto, Arial, sans-serif;
    font-size: 12px;
    line-height: 1.5;
    color: #484848;

    /* The tooltip is absolutely positioned by the framework and
     * should never trap pointer events (hover/mouseout tracking
     * lives on the source element, not the tooltip itself). */
    pointer-events: none;
    box-sizing: border-box !important;
}

/* Content emphasis used by most attachTooltip() callers
 * (the convention is "<b>Title</b><br>body"). Bold content
 * renders in the Kohezion navy headline color. */
.Tooltip b,
.Tooltip strong {
    color: #0B3764;
    font-weight: 600;
}

/* Muted secondary text (useful for "label: value" tables that
 * some callers build with semantic tags). */
.Tooltip small,
.Tooltip em {
    color: #8C9BB5;
    font-style: normal;
}

/* Dividers inside tooltip content (some callers insert <hr>
 * between a title row and a detail block). */
.Tooltip hr {
    border: none;
    border-top: 1px solid #EBF2F8;
    margin: 8px 0;
}

/* Tables inside tooltips (used by a few report renderers to
 * show key/value detail grids). */
.Tooltip table {
    border-collapse: collapse;
    margin: 0;
}
.Tooltip td {
    padding: 1px 6px 1px 0;
    vertical-align: top;
    font-size: 12px;
}

/* Links inside tooltips render in the brand color. */
.Tooltip a {
    color: #249EF5;
    text-decoration: none;
}
.Tooltip a:hover {
    text-decoration: underline;
}

/* Record-field tooltip overrides for `.pillBorderRadius` (the
 * dropdown/category pill emitted by the document field UI) live
 * with the base `.pillBorderRadius` rule in stylesheets/styles_k.css
 * to keep this generic UI primitive's stylesheet free of
 * domain-specific knowledge. */
