/*
 * checklist-theme.css — SoSIQ theming for Lean Checklists section
 * AI-GEN LEAF 2026-05-03 — see README#ai-gen
 *
 * All rules scoped to .lean-checklists to avoid bleeding into other pages.
 * Dark mode variants use [data-bs-theme="dark"] per the site convention.
 * No Flowvantage component files were modified to produce this file.
 */

/* ------------------------------------------------------------------
   SoSIQ palette tokens (mirrors site.css; kept local for readability)
   ------------------------------------------------------------------ */
:root {
    --sosiq-primary:        #4169e1;
    --sosiq-primary-hover:  #1e3a8a;
    --sosiq-accent-start:   #4f8cff;
    --sosiq-accent-end:     #6366f1;
    --sosiq-nav-bg:         #12141e;
    --sosiq-border:         #dee2e6;
    --sosiq-surface:        #f8f9fa;
    --sosiq-text-muted:     #6c757d;
}

/* ------------------------------------------------------------------
   Page header — accent underline matching the nav brand colour
   ------------------------------------------------------------------ */
.lean-checklists .lc-page-header {
    padding-bottom: 16px;
    margin-bottom: 24px;
    border-bottom: 2px solid var(--sosiq-primary);
}

.lean-checklists .lc-page-header h2 {
    font-size: 1.55rem;
    font-weight: 700;
    color: var(--sosiq-primary);
    margin-bottom: 4px;
}

.lean-checklists .lc-page-header p {
    color: var(--sosiq-text-muted);
    margin-bottom: 0;
}

/* ------------------------------------------------------------------
   Module cards (Index overview page)
   Left accent bar + lift on hover
   ------------------------------------------------------------------ */
.lean-checklists .lc-module-card {
    border-left: 4px solid var(--sosiq-primary);
    border-radius: 8px;
    transition: box-shadow 0.2s, transform 0.2s;
}

.lean-checklists .lc-module-card:hover {
    box-shadow: 0 6px 18px rgba(65, 105, 225, 0.18);
    transform: translateY(-2px);
}

.lean-checklists .lc-module-card .card-title {
    color: var(--sosiq-primary);
    font-weight: 600;
}

/* ------------------------------------------------------------------
   Form / edit card (Templates page create/edit panel)
   ------------------------------------------------------------------ */
.lean-checklists .lc-form-card .card-header {
    background: linear-gradient(135deg, var(--sosiq-accent-start) 0%, var(--sosiq-accent-end) 100%);
    color: #fff;
    font-weight: 600;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
}

/* ------------------------------------------------------------------
   Table header — branded tint
   ------------------------------------------------------------------ */
.lean-checklists .table thead th {
    background: rgba(65, 105, 225, 0.06);
    color: var(--sosiq-primary);
    border-bottom-color: var(--sosiq-primary);
}

/* ------------------------------------------------------------------
   Dark mode overrides
   ------------------------------------------------------------------ */
[data-bs-theme="dark"] .lean-checklists .lc-page-header h2 {
    color: var(--sosiq-accent-start);
}

[data-bs-theme="dark"] .lean-checklists .lc-page-header {
    border-bottom-color: var(--sosiq-accent-start);
}

[data-bs-theme="dark"] .lean-checklists .lc-module-card {
    border-left-color: var(--sosiq-accent-start);
}

[data-bs-theme="dark"] .lean-checklists .lc-module-card:hover {
    box-shadow: 0 6px 18px rgba(79, 140, 255, 0.22);
}

[data-bs-theme="dark"] .lean-checklists .lc-module-card .card-title {
    color: var(--sosiq-accent-start);
}

[data-bs-theme="dark"] .lean-checklists .table thead th {
    background: rgba(79, 140, 255, 0.08);
    color: var(--sosiq-accent-start);
    border-bottom-color: var(--sosiq-accent-start);
}
