/* Syncfusion theme variable overrides — maps Syncfusion primary/secondary to zwATS Tailwind palette.
   Imported in App.razor AFTER syncfusion-targeted.min.css so these values win. */

:root {
    /* Primary: sky-500 (#0ea5e9) */
    --color-sf-primary: #0ea5e9;
    --color-sf-primary-hover: #0284c7;
    --color-sf-primary-active: #0369a1;
    --color-sf-primary-light: #e0f2fe;

    /* Content/surface: slate scale */
    --color-sf-surface: #f8fafc;       /* slate-50 */
    --color-sf-border: #e2e8f0;        /* slate-200 */
    --color-sf-text: #0f172a;          /* slate-900 */
    --color-sf-text-muted: #64748b;    /* slate-500 */
}

/* Syncfusion Tailwind 3 primary overrides */
.e-btn.e-primary,
.e-css.e-btn.e-primary {
    background-color: var(--color-sf-primary);
    border-color: var(--color-sf-primary);
}

.e-btn.e-primary:hover,
.e-css.e-btn.e-primary:hover {
    background-color: var(--color-sf-primary-hover);
    border-color: var(--color-sf-primary-hover);
}

/* Dark mode overrides */
.dark :root,
.dark {
    --color-sf-surface: #0f172a;       /* slate-950 */
    --color-sf-border: #334155;        /* slate-700 */
    --color-sf-text: #f1f5f9;          /* slate-100 */
    --color-sf-text-muted: #94a3b8;    /* slate-400 */
    --color-sf-primary-light: #0c4a6e; /* sky-950 */
}

/* Syncfusion renders Kanban content outside Razor CSS isolation. */
.task-kanban .e-empty-card,
.hiring-kanban .e-empty-card { display: none !important; }

.task-kanban .e-content-cells:nth-child(1) .e-kanban-card { border-left: 4px solid #64748b !important; background: #f8fafc !important; }
.task-kanban .e-content-cells:nth-child(2) .e-kanban-card { border-left: 4px solid #16a34a !important; background: #f0fdf4 !important; }
.task-kanban .e-content-cells:nth-child(3) .e-kanban-card { border-left: 4px solid #f59e0b !important; background: #fffbeb !important; }
.task-kanban .e-content-cells:nth-child(4) .e-kanban-card { border-left: 4px solid #0ea5e9 !important; background: #f0f9ff !important; }

.hiring-kanban .e-content-cells:nth-child(1) .e-kanban-card { border-left: 4px solid #0ea5e9 !important; background: #f0f9ff !important; }
.hiring-kanban .e-content-cells:nth-child(2) .e-kanban-card { border-left: 4px solid #f59e0b !important; background: #fffbeb !important; }
.hiring-kanban .e-content-cells:nth-child(3) .e-kanban-card { border-left: 4px solid #16a34a !important; background: #f0fdf4 !important; }
.hiring-kanban .e-content-cells:nth-child(4) .e-kanban-card { border-left: 4px solid #ef4444 !important; background: #fef2f2 !important; }
.hiring-kanban .e-content-cells:nth-child(5) .e-kanban-card { border-left: 4px solid #8b5cf6 !important; background: #f5f3ff !important; }
.hiring-kanban .e-content-cells:nth-child(6) .e-kanban-card { border-left: 4px solid #0891b2 !important; background: #ecfeff !important; }

.dark .task-kanban .e-kanban-card,
.dark .hiring-kanban .e-kanban-card { background: #1e293b !important; border-top-color: #334155 !important; }
.dark .task-kanban .e-content-cells:nth-child(1) .e-kanban-card { border-left-color: #94a3b8 !important; }
.dark .task-kanban .e-content-cells:nth-child(2) .e-kanban-card { border-left-color: #4ade80 !important; }
.dark .task-kanban .e-content-cells:nth-child(3) .e-kanban-card { border-left-color: #fbbf24 !important; }
.dark .task-kanban .e-content-cells:nth-child(4) .e-kanban-card { border-left-color: #38bdf8 !important; }
.dark .hiring-kanban .e-content-cells:nth-child(2) .e-kanban-card { border-left-color: #fbbf24 !important; }
.dark .hiring-kanban .e-content-cells:nth-child(3) .e-kanban-card { border-left-color: #4ade80 !important; }
.dark .hiring-kanban .e-content-cells:nth-child(4) .e-kanban-card { border-left-color: #f87171 !important; }
.dark .hiring-kanban .e-content-cells:nth-child(5) .e-kanban-card { border-left-color: #a78bfa !important; }
.dark .hiring-kanban .e-content-cells:nth-child(6) .e-kanban-card { border-left-color: #22d3ee !important; }

/* Hiring Task Board: spacing/padding (must live here, not in PageHiringBoard.razor.css - see note above). */
.hiring-kanban { border: 1px solid #e2e8f0 !important; border-radius: 8px !important; overflow-x: auto !important; overflow-y: hidden !important; }
.hiring-kanban .e-kanban-header,
.hiring-kanban .e-kanban-content { background: #f8fafc !important; }
.hiring-kanban .e-header-cells {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    padding: 0.75rem 0.9rem !important;
    min-width: 250px !important;
}
.hiring-kanban .e-header-text { color: #1e293b !important; font-weight: 700 !important; }
.hiring-kanban .e-content-cells { padding: 0.4rem 0.25rem !important; min-width: 250px !important; }
.hiring-kanban .e-card-wrapper { margin: 0 0 0.5rem !important; }
.hiring-kanban .e-card-wrapper:last-child { margin-bottom: 0 !important; }
.hiring-kanban .e-kanban-card {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 2px rgb(15 23 42 / 8%) !important;
    transition: box-shadow 150ms ease, transform 150ms ease;
}
.hiring-kanban .e-kanban-card:hover { box-shadow: 0 4px 10px rgb(15 23 42 / 12%) !important; transform: translateY(-1px); }
/* Task card body padding is set inline in PageHiringBoard.razor's KanbanCardSettings Template root div - Syncfusion does not auto-wrap Template output in a styleable class. */

.dark .hiring-kanban { border-color: #334155 !important; }
.dark .hiring-kanban .e-kanban-header,
.dark .hiring-kanban .e-kanban-content { background: #0f172a !important; border-color: #334155 !important; }
.dark .hiring-kanban .e-header-cells { background: #1e293b !important; border-color: #334155 !important; }
.dark .hiring-kanban .e-header-text { color: #f1f5f9 !important; }
.dark .hiring-kanban .e-kanban-card { border-color: #334155 !important; }
