/* App-level design tokens — light mode defaults */
:root {
    /* Task-type left-border colours */
    --task-type-task:    #28a745;
    --task-type-bug:     #dc3545;
    --task-type-ticket:  #0d6efd;
    --task-type-subtask: #6c757d;

    /* Sidebar accent (orange — the purchased theme's original secondary colour) */
    --sidebar-accent: #F19828;

    /* Modal backdrop overlay */
    --modal-backdrop-bg: rgba(255, 255, 255, 0.3);

    /* Kanban card shadow */
    --card-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);

    /* Focus ring for inputs */
    --focus-ring-color: rgba(13, 110, 253, 0.2);

    /* input-group-text label chip (Client:/Project:/From: etc. filter prefixes) —
       approved "crisp" design from the #107 review, so the label reads as distinct
       from the field it's labelling instead of matching its background exactly */
    --filter-label-bg:     #eef0f2;
    --filter-label-text:   #6c757d;
    --filter-label-border: #b9bfc7;

    /* Input/select background from the same #107 "crisp" design — slightly different
       from the theme's own --color-200 (#EEEEEE), so it needs its own token rather
       than reusing that one */
    --filter-input-bg: #ffffff;
}

/* Dark mode overrides */
[data-theme="dark"] {
    --task-type-task:    #16a34a;
    --task-type-bug:     #dc2626;
    --task-type-ticket:  #2563eb;
    --task-type-subtask: #6b7280;

    --modal-backdrop-bg: rgba(0, 0, 0, 0.4);
    --card-shadow:       0 1px 3px rgba(0, 0, 0, 0.4);
    --focus-ring-color:  rgba(13, 110, 253, 0.3);

    --filter-label-bg:     #2a2d32;
    --filter-label-text:   #9aa0a6;
    --filter-label-border: #454a51;

    --filter-input-bg: #1f2227;

    /* Page body background from the #107 "crisp" design — same value as the input
       background above, so the page canvas and inputs read as one continuous
       surface with only the label chip standing out. Overrides the purchased
       theme's own --body-color (#1e1f20) rather than adding a new token, since
       --body-color is already consumed sitewide (main wrapper, dropdowns, modals). */
    --body-color: #1f2227;
}
