/**
 * LPD Kabob Menu
 *
 * Framework row context menu. Every selector is prefixed .lpd-kabob- and the
 * panel owns the id #LPD_KabobMenu, so nothing here can reach the legacy
 * context menu (#ContextMenu / .table_dropMore_icon) or the outgoing
 * permission menu (#ContextMenuNew / .table_dropMore_icon_new).
 */

.lpd-kabob-cell {
    white-space: nowrap;
    text-align: center;
}

/**
 * Transitional, and scoped to framework tables only.
 *
 * Without this a framework row carries three dots icons: the legacy kabob
 * (.table_dropMore_icon), the outgoing permission kabob
 * (.table_dropMore_icon_new), and this one. The rule hides only the OUTGOING
 * one, and only inside a .lpd-kabob-cell — which exists only on rows rendered
 * by lib/view/components/datatables/table.view.php. Legacy pages have no such
 * cell, so both of their menus are untouched.
 *
 * Precedent: SearchResultsTools.module.js:41-42 suppresses the legacy kabob
 * inside framework search surfaces the same way.
 *
 * Remove this rule when the outgoing kabob is retired.
 */
.lpd-kabob-cell .table_dropMore_icon_new {
    display: none !important;
}

/* Sits inside the row's icon strip (a flex row), so it must not grow or
   shrink with it — LPD_KabobMenu.module.js moves it there on attach. */
.lpd-kabob-trigger {
    flex: 0 0 auto;
    align-self: center;
    background: none;
    border: 0;
    padding: 2px 6px;
    cursor: pointer;
    color: var( --lpd-text-muted, #6c757d );
    line-height: 1;
    border-radius: 4px;
}

.lpd-kabob-trigger:hover,
.lpd-kabob-trigger:focus {
    color: var( --lpd-blue, #2c9fd8 );
    background: var( --lpd-surface-hover, #eef6fb );
    outline: none;
}

/* ------------------------------------------------------------------ panel */

.lpd-kabob-panel {
    position: absolute;
    z-index: 10000;
    min-width: 260px;
    max-width: 340px;
    background: var( --lpd-surface, #ffffff );
    border: 1px solid var( --lpd-border, #d6dde3 );
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba( 0, 0, 0, 0.16 );
    font-size: 13px;
    overflow: hidden;
}

.lpd-kabob-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 12px;
    background: var( --lpd-surface-alt, #f5f8fa );
    border-bottom: 1px solid var( --lpd-border, #d6dde3 );
}

.lpd-kabob-header-type {
    font-weight: 600;
    color: var( --lpd-text, #22303a );
}

.lpd-kabob-header-id {
    color: var( --lpd-text-muted, #6c757d );
    font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------------ items */

/*
 * The list never scrolls inside itself. The panel renders at its natural
 * height and is positioned to stay on the page; the page is what the user
 * scrolls. A scroll region inside a floating panel traps the wheel and leaves
 * the viewer unable to move the page under it.
 */
.lpd-kabob-list {
    padding: 4px 0;
}

.lpd-kabob-item {
    display: grid;
    grid-template-columns: 20px 1fr auto;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 12px;
    background: none;
    border: 0;
    text-align: left;
    cursor: pointer;
    color: var( --lpd-text, #22303a );
}

.lpd-kabob-item:hover:not(:disabled),
.lpd-kabob-item:focus:not(:disabled) {
    background: var( --lpd-surface-hover, #eef6fb );
    outline: none;
}

.lpd-kabob-icon {
    color: var( --lpd-blue, #2c9fd8 );
    font-size: 13px;
    text-align: center;
}

.lpd-kabob-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* A greyed item says why it is greyed. That is the whole point of the chip. */
.lpd-kabob-note {
    font-size: 10.5px;
    line-height: 1;
    padding: 3px 6px;
    border-radius: 10px;
    white-space: nowrap;
    background: var( --lpd-surface-alt, #f0f2f4 );
    color: var( --lpd-text-muted, #6c757d );
    border: 1px solid var( --lpd-border, #e1e6ea );
}

.lpd-kabob-lock {
    font-size: 10px;
    color: var( --lpd-text-muted, #9aa5ad );
}

.lpd-kabob-item--disabled {
    cursor: default;
    color: var( --lpd-text-muted, #9aa5ad );
}

.lpd-kabob-item--disabled .lpd-kabob-icon {
    color: var( --lpd-text-muted, #b6bfc6 );
}

/* Reason-specific accents, one per reason the server can send, so a hurried
   glance separates "you were never granted this" from "not here" from
   "not built". */
.lpd-kabob-reason--not_granted     .lpd-kabob-note { border-color: #e3c4c4; color: #a04a4a; background: #fbf1f1; }
.lpd-kabob-reason--scope           .lpd-kabob-note { border-color: #d8ccb0; color: #8a6d2f; background: #fbf7ec; }
.lpd-kabob-reason--limit           .lpd-kabob-note { border-color: #e3c4c4; color: #a04a4a; background: #fbf1f1; }
.lpd-kabob-reason--pay             .lpd-kabob-note { border-color: #bfd9c6; color: #3f7a52; background: #f0f8f2; }
.lpd-kabob-reason--not_implemented .lpd-kabob-note { border-color: #d6dde3; color: #6c757d; background: #f5f8fa; }

/* ------------------------------------------------------- footer + messages */

.lpd-kabob-footer {
    padding: 6px 12px;
    border-top: 1px solid var( --lpd-border, #d6dde3 );
    background: var( --lpd-surface-alt, #f5f8fa );
    color: var( --lpd-text-muted, #6c757d );
    font-size: 11px;
}

.lpd-kabob-message {
    padding: 12px;
    color: var( --lpd-text-muted, #6c757d );
}

.lpd-kabob-message--error {
    color: #a04a4a;
}