
/* ==========================================================
   /ui/css/base/ljh-tasks.css
   LJH TASKS – Status & Calendar Layer
   ----------------------------------------------------------
   Ansvar:
   - CSS-tokens för task-status (en källa för hela systemet)
   - Notes card accent-system per status
   - Status badges per tillstånd
   - Kalender event-färger per status
   ----------------------------------------------------------
   Används av: ljh-notes.css, ljh-calendar.css
========================================================== */


/* ==========================================================
   STATUS COLOR TOKENS – En källa för hela systemet
========================================================== */

:root {
    --task-overdue:   #e53935;
    --task-approval:  #fb8c00;
    --task-active:    #1e88e5;
    --task-pending:   #8e24aa;
    --task-paused:    #fdd835;
    --task-completed: #9e9e9e;
}


/* ==========================================================
   NOTES CARD ACCENT SYSTEM
========================================================== */

.notes-card.notes-task {
    position: relative;
    border-left: 4px solid transparent;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.notes-card.notes-task:hover { transform: translateY(-1px); }

.notes-card.task-overdue   { border-left-color: var(--task-overdue);   background: rgba(229,57,53,0.06); }
.notes-card.task-approval  { border-left-color: var(--task-approval);  background: rgba(251,140,0,0.06); }
.notes-card.task-active    { border-left-color: var(--task-active);    }
.notes-card.task-pending   { border-left-color: var(--task-pending);   }
.notes-card.task-paused    { border-left-color: var(--task-paused);    }
.notes-card.task-completed { border-left-color: var(--task-completed); opacity: .85; }

.notes-card.task-overdue.is-overdue {
    box-shadow: 0 0 0 1px rgba(229,57,53,0.25);
}


/* ==========================================================
   STATUS BADGES
========================================================== */

.notes-badge.is-status[data-status="waiting_approval"] { background: var(--task-approval); color: #fff; }
.notes-badge.is-status[data-status="in_progress"]      { background: var(--task-active);   color: #fff; }
.notes-badge.is-status[data-status="pending"]          { background: var(--task-pending);  color: #fff; }
.notes-badge.is-status[data-status="paused"]           { background: var(--task-paused);   color: #000; }
.notes-badge.is-status[data-status="completed"]        { background: var(--task-completed);color: #fff; }
.notes-badge.is-status[data-status="rejected"]         { background: var(--task-overdue);  color: #fff; }


/* ==========================================================
   KALENDER EVENT STATUS
========================================================== */

.calendar-event.task-overdue   { background: var(--task-overdue);   color: #fff; }
.calendar-event.task-approval  { background: var(--task-approval);  color: #fff; }
.calendar-event.task-active    { background: var(--task-active);    color: #fff; }
.calendar-event.task-pending   { background: var(--task-pending);   color: #fff; }
.calendar-event.task-paused    { background: var(--task-paused);    color: #000; }
.calendar-event.task-completed { background: var(--task-completed); color: #fff; }

