/* Task priority (#1730), js/task-priority.js.
 *
 * Each level hands its colour to the row as --pz-task-priority: the task
 * note, the Tasks page, the embed widget, the dashboard modal and the Kanban
 * card paint their own rows from it (tasks.css, tasks-page.css, kanban.css,
 * dashboard.css). The palette tokens switch with the theme. */

.priority-high {
    --pz-task-priority: var(--pz-color-red);
}

.priority-medium {
    --pz-task-priority: var(--pz-color-orange);
}

.priority-low {
    --pz-task-priority: var(--pz-color-green);
}

/* The menu opened by the flag button */
.task-priority-menu {
    position: fixed;
    z-index: 10050;
    min-width: 180px;
    background: var(--pz-bg);
    border: 1px solid var(--pz-border);
    border-radius: var(--pz-radius-lg);
    box-shadow: 0 12px 30px rgba(var(--pz-shadow-rgb), 0.12);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.task-priority-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    background: none;
    border: none;
    border-radius: var(--pz-radius);
    cursor: pointer;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.3;
    color: var(--pz-text);
    text-align: left;
}

.task-priority-menu-item:hover,
.task-priority-menu-item:focus-visible {
    background: var(--pz-surface-hover);
    outline: none;
}

.task-priority-menu-item i,
.task-priority-menu-item i[class*="lucide-"] {
    font-size: 15px;
    flex-shrink: 0;
    color: var(--pz-task-priority, var(--pz-text-subtle));
    transform: none;
}

.task-priority-menu-item span {
    flex: 1;
}

.task-priority-menu-item .task-priority-menu-check,
.task-priority-menu-item .task-priority-menu-check[class*="lucide-"] {
    color: var(--pz-text-muted);
}

html[data-theme='dark'] .task-priority-menu {
    background: var(--pz-surface);
    box-shadow: 0 12px 30px rgba(var(--pz-shadow-rgb), 0.5);
}