/* ──────────────────────────────────────────────────────────────
   Cyber Maturity Assessment Portal — Custom Styles
   Supplements Bootstrap 5.3 and theme variables defined in layouts.
   ────────────────────────────────────────────────────────────── */

/* ── Maturity level badges ── */
.maturity-1 { background: #dc3545; color: #fff; }
.maturity-2 { background: #fd7e14; color: #fff; }
.maturity-3 { background: #ffc107; color: #000; }
.maturity-4 { background: #20c997; color: #fff; }
.maturity-5 { background: #198754; color: #fff; }

.maturity-badge {
    display: inline-block;
    min-width: 2rem;
    padding: .25em .5em;
    font-size: .8rem;
    font-weight: 600;
    text-align: center;
    border-radius: .375rem;
}

/* ── Status badges ── */
.status-draft       { background: var(--text-secondary); color: #fff; }
.status-in_progress { background: #0d6efd; color: #fff; }
.status-under_review { background: #6f42c1; color: #fff; }
.status-completed   { background: #198754; color: #fff; }
.status-archived    { background: #6c757d; color: #fff; }

/* ── Priority indicators ── */
.priority-critical { color: #dc3545; }
.priority-high     { color: #fd7e14; }
.priority-medium   { color: #ffc107; }
.priority-low      { color: #20c997; }

/* ── Score progress ring ── */
.score-ring {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .9rem;
    border: 3px solid var(--accent);
}

/* ── Data table tweaks ── */
.table-sortable th {
    cursor: pointer;
    user-select: none;
}
.table-sortable th:hover {
    color: var(--accent);
}

/* ── Evidence attachment cards ── */
.evidence-card {
    border: 1px dashed var(--border-color);
    border-radius: .5rem;
    padding: .75rem;
    margin-bottom: .5rem;
    transition: border-color .2s;
}
.evidence-card:hover {
    border-color: var(--accent);
}

/* ── Radar/spider chart container ── */
.chart-container {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}

/* ── Gap analysis heat colours ── */
.gap-none    { background: rgba(25, 135, 84, .15); }
.gap-minor   { background: rgba(255, 193, 7, .15); }
.gap-major   { background: rgba(253, 126, 20, .15); }
.gap-critical { background: rgba(220, 53, 69, .15); }

/* ── Loading spinner ── */
.cma-spinner {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--border-color);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: cma-spin .6s linear infinite;
}
@keyframes cma-spin {
    to { transform: rotate(360deg); }
}

/* ── Notification dot ── */
.notification-unread {
    border-left: 3px solid var(--accent);
}

/* ── Sidebar active indicator ── */
.cma-sidebar .nav-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 60%;
    background: var(--accent);
    border-radius: 0 2px 2px 0;
}
.cma-sidebar .nav-link {
    position: relative;
}

/* ── Form validation states ── */
.is-invalid .form-control,
.is-invalid .form-select {
    border-color: #dc3545;
}
.invalid-feedback {
    color: #dc3545;
    font-size: .85rem;
}

/* ── Print styles ── */
@media print {
    .cma-sidebar,
    .cma-topbar,
    .cma-footer,
    .btn,
    .theme-btn { display: none !important; }
    .cma-main { margin-left: 0 !important; padding: 0 !important; }
    body { background: #fff !important; color: #000 !important; }
}