/* ════════════════════════════════════════════════════════════════════
   CONTRACTOR MODULE STYLES
   Shared design system for all /contractors/* pages
════════════════════════════════════════════════════════════════════ */

/* ── Page wrapper ── */
.co-page { max-width: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.25rem; }

/* ── Page header ── */
.co-page-header { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 1rem; }
.co-page-header h1 { margin: 0; font-size: 1.65rem; font-weight: 700; color: #121d31; }
.co-subtitle { margin: 0.2rem 0 0; color: #5f7195; font-size: 0.93rem; }
.co-header-actions { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* ── Buttons ── */
.co-btn { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.48rem 1rem; border-radius: 8px; font-size: 0.88rem; font-weight: 600; cursor: pointer; border: 1px solid transparent; text-decoration: none; transition: all 0.15s; white-space: nowrap; }
.co-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.co-btn-primary { background: #2b4a78; color: #fff; border-color: #2b4a78; }
.co-btn-primary:hover { background: #1d3760; border-color: #1d3760; color: #fff; text-decoration: none; }
.co-btn-secondary { background: #f0f4fc; color: #2b4a78; border-color: #c8d4e8; }
.co-btn-secondary:hover { background: #e2eaf8; }
.co-btn-ghost { background: transparent; color: #5f7195; border-color: #dce4f1; }
.co-btn-ghost:hover { background: #f3f6fc; color: #2b4a78; text-decoration: none; }
.co-btn-ai { background: linear-gradient(135deg, #6d28d9, #4f46e5); color: #fff; border-color: transparent; }
.co-btn-ai:hover { background: linear-gradient(135deg, #5b21b6, #4338ca); color: #fff; text-decoration: none; }
.co-btn-ai:disabled { opacity: 0.5; }
.co-btn-sm { padding: 0.28rem 0.65rem; font-size: 0.8rem; }
.co-btn-xs { padding: 0.2rem 0.5rem; font-size: 0.75rem; border-radius: 6px; background: #fff; border-color: #c8d4e8; color: #2b4a78; margin-left: 0.3rem; }
.co-btn-xs:hover { background: #eef3fc; }
.co-btn-full { width: 100%; justify-content: center; }

/* ── Icon buttons ── */
.co-icon-btn { background: none; border: 1px solid transparent; border-radius: 6px; padding: 0.25rem 0.4rem; font-size: 0.95rem; cursor: pointer; color: #5f7195; transition: all 0.12s; }
.co-icon-btn:hover { background: #f0f4fc; border-color: #c8d4e8; color: #2b4a78; }
.co-icon-danger:hover { background: #fff1f2; border-color: #fca5a5; color: #dc2626; }

/* ── Summary bar ── */
.co-summary-bar { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.co-summary-chip { display: flex; flex-direction: column; align-items: center; padding: 0.6rem 1.1rem; border-radius: 10px; border: 1px solid; min-width: 90px; }
.co-summary-chip strong { font-size: 1.4rem; font-weight: 700; line-height: 1; }
.co-summary-chip span { font-size: 0.75rem; font-weight: 500; margin-top: 0.2rem; opacity: 0.8; }
.co-chip-blue  { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.co-chip-green { background: #f0fdf4; border-color: #86efac; color: #15803d; }
.co-chip-amber { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.co-chip-red   { background: #fff1f2; border-color: #fca5a5; color: #b91c1c; }
.co-chip-purple{ background: #faf5ff; border-color: #c4b5fd; color: #6d28d9; }

/* ── Filters ── */
.co-filter-row { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; }
.co-search { flex: 1; min-width: 200px; padding: 0.5rem 0.75rem; border: 1px solid #cdd6e6; border-radius: 8px; font-size: 0.9rem; background: #fff; }
.co-select { padding: 0.5rem 0.65rem; border: 1px solid #cdd6e6; border-radius: 8px; font-size: 0.88rem; background: #fff; min-width: 160px; }
.co-select-full { width: 100%; }

/* ── Section ── */
.co-section { display: flex; flex-direction: column; gap: 1rem; }
.co-section-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.75rem; }
.co-section-header h2 { margin: 0; font-size: 1.1rem; font-weight: 700; color: #1a2d4e; }
.co-filter-bar { display: flex; gap: 0.5rem; align-items: center; }

/* ── Table ── */
.co-table-wrapper { background: #fff; border: 1px solid #dce4f1; border-radius: 14px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.co-table { width: 100%; border-collapse: collapse; }
.co-table thead th { background: #f7f9fd; color: #53658b; font-weight: 600; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.7rem 0.85rem; border-bottom: 2px solid #e6ebf3; white-space: nowrap; }
.co-table tbody td { padding: 0.7rem 0.85rem; border-bottom: 1px solid #f1f4fa; font-size: 0.9rem; vertical-align: middle; }
.co-table tbody tr:last-child td { border-bottom: none; }
.co-table tbody tr:hover td { background: #fafbff; }
.co-th-center { text-align: center !important; }
.co-th-actions { width: 90px; text-align: right !important; }
.co-td-primary { font-weight: 600; color: #1a2d4e; }
.co-muted { color: #8a9bbf; font-size: 0.87rem; }
.co-link { color: #2b4a78; font-weight: 600; text-decoration: none; }
.co-link:hover { color: #1d3760; text-decoration: underline; }
.co-row-critical td { background: #fff8f8 !important; }
.co-row-warn td { background: #fffdf4 !important; }

/* ── Badges ── */
.co-badge { display: inline-flex; align-items: center; gap: 0.2rem; border-radius: 999px; padding: 0.18rem 0.65rem; font-size: 0.76rem; font-weight: 600; white-space: nowrap; }
.co-badge-green  { background: #d1fae5; color: #065f46; }
.co-badge-amber  { background: #fef3c7; color: #92400e; }
.co-badge-red    { background: #fee2e2; color: #991b1b; }
.co-badge-blue   { background: #dbeafe; color: #1e40af; }
.co-badge-blue-sm{ background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; padding: 0.12rem 0.5rem; font-size: 0.74rem; }
.co-badge-muted  { background: #f1f5f9; color: #64748b; }
.co-badge-ai     { background: linear-gradient(135deg, #ede9fe, #ddd6fe); color: #6d28d9; border: 1px solid #c4b5fd; }

/* ── Status badges ── */
.co-status { display: inline-block; padding: 0.2rem 0.7rem; border-radius: 999px; font-size: 0.77rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.co-status-active    { background: #d1fae5; color: #065f46; }
.co-status-suspended { background: #fef3c7; color: #92400e; }
.co-status-archived  { background: #f1f5f9; color: #64748b; }
.co-status-pending   { background: #ede9fe; color: #6d28d9; }

/* ── KPI Cards ── */
.co-kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; }
.co-kpi-card { background: #fff; border: 1px solid #dce4f1; border-radius: 14px; padding: 1.25rem; display: flex; flex-direction: column; gap: 0.2rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04); border-top: 4px solid transparent; }
.co-kpi-icon { font-size: 1.4rem; }
.co-kpi-value { font-size: 2.1rem; font-weight: 800; line-height: 1.1; color: #1a2d4e; }
.co-kpi-label { font-size: 0.82rem; font-weight: 600; color: #5f7195; }
.co-kpi-sub { font-size: 0.77rem; color: #8a9bbf; margin-top: 0.1rem; }
.co-sub-alert { color: #dc2626 !important; font-weight: 600; }
.co-sub-warn  { color: #d97706 !important; font-weight: 600; }
.co-kpi-green { border-top-color: #22c55e; }
.co-kpi-amber { border-top-color: #f59e0b; }
.co-kpi-red   { border-top-color: #ef4444; }
.co-kpi-blue  { border-top-color: #3b82f6; }

/* ── Compliance score pill ── */
.co-score-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; padding: 0.25rem 0.6rem; border-radius: 999px; font-size: 0.82rem; font-weight: 700; }
.co-score-green { background: #d1fae5; color: #065f46; }
.co-score-amber { background: #fef3c7; color: #92400e; }
.co-score-red   { background: #fee2e2; color: #991b1b; }
.co-pill-sm { font-size: 0.76rem; min-width: 44px; }

/* ── Bool / count indicators ── */
.co-bool { font-size: 1rem; font-weight: 700; }
.co-bool-ok   { color: #16a34a; }
.co-bool-fail { color: #dc2626; }
.co-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; border-radius: 999px; font-size: 0.78rem; font-weight: 700; }
.co-count-ok   { background: #f0fdf4; color: #15803d; }
.co-count-warn { background: #fef3c7; color: #92400e; }
.co-count-fail { background: #fee2e2; color: #991b1b; }

/* ── Progress bar ── */
.co-progress-cell { display: flex; align-items: center; gap: 0.4rem; min-width: 90px; }
.co-progress-bar { flex: 1; height: 6px; background: #e8edf8; border-radius: 999px; overflow: hidden; }
.co-progress-lg { height: 10px; }
.co-progress-fill { height: 100%; border-radius: 999px; transition: width 0.4s; }
.co-fill-blue  { background: #3b82f6; }
.co-fill-green { background: #22c55e; }
.co-progress-label { font-size: 0.75rem; color: #5f7195; white-space: nowrap; }
.co-label-green { color: #16a34a; font-weight: 600; }

/* ── Compliance alerts grid ── */
.co-alerts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.85rem; }
.co-alert-card { background: #fff; border: 1px solid #dce4f1; border-radius: 12px; padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem; border-left: 4px solid transparent; }
.co-alert-critical { border-left-color: #ef4444; }
.co-alert-warn { border-left-color: #f59e0b; }
.co-alert-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; }
.co-alert-name { font-weight: 700; color: #1a2d4e; font-size: 0.95rem; text-decoration: none; }
.co-alert-name:hover { color: #2b4a78; text-decoration: underline; }
.co-alert-issues { display: flex; flex-direction: column; gap: 0.25rem; }
.co-issue { font-size: 0.8rem; }
.co-issue-fail { color: #dc2626; }
.co-issue-warn { color: #d97706; }
.co-alert-action { align-self: flex-end; font-size: 0.82rem; color: #2b4a78; font-weight: 600; text-decoration: none; }
.co-alert-action:hover { text-decoration: underline; }

/* ── Template cards ── */
.co-template-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.co-template-card { background: #fff; border: 1px solid #dce4f1; border-radius: 14px; padding: 1.1rem; display: flex; flex-direction: column; gap: 0.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04); transition: box-shadow 0.15s; }
.co-template-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,0.08); }
.co-card-inactive { opacity: 0.6; }
.co-template-card-top { display: flex; justify-content: space-between; align-items: flex-start; }
.co-template-badges { display: flex; gap: 0.3rem; flex-wrap: wrap; }
.co-template-actions { display: flex; gap: 0.25rem; }
.co-template-name { margin: 0; font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.co-template-desc { margin: 0; font-size: 0.85rem; color: #5f7195; }
.co-template-context { margin: 0; font-size: 0.83rem; color: #7a93b8; }
.co-template-footer { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 0.6rem; border-top: 1px solid #f0f4fb; }
.co-template-count { font-size: 0.8rem; color: #8a9bbf; }
.co-template-view { font-size: 0.83rem; color: #2b4a78; font-weight: 600; text-decoration: none; }
.co-template-view:hover { text-decoration: underline; }

/* ── Card ── */
.co-card { background: #fff; border: 1px solid #dce4f1; border-radius: 14px; padding: 1.2rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
.co-card-title { margin: 0 0 0.9rem; font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.co-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.9rem; }

/* ── Edit layout ── */
.co-edit-layout { display: grid; grid-template-columns: 320px 1fr; gap: 1.25rem; align-items: flex-start; }
@media (max-width: 900px) { .co-edit-layout { grid-template-columns: 1fr; } }
.co-edit-meta { display: flex; flex-direction: column; gap: 1rem; position: sticky; top: 1rem; }
.co-save-bar { padding: 0; }

/* ── Form controls ── */
.co-form-group { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.9rem; }
.co-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
@media (max-width: 600px) { .co-form-row { grid-template-columns: 1fr; } }
.co-label { font-size: 0.84rem; font-weight: 600; color: #3d5173; }
.co-input { padding: 0.5rem 0.7rem; border: 1px solid #cdd6e6; border-radius: 8px; font-size: 0.9rem; background: #fff; color: #172033; width: 100%; }
.co-input:focus { outline: 2px solid rgba(43,74,120,0.2); border-color: #9fb4d6; }
.co-input-item { flex: 1; }
.co-input-cat { width: 140px; font-size: 0.82rem; }
.co-textarea { padding: 0.5rem 0.7rem; border: 1px solid #cdd6e6; border-radius: 8px; font-size: 0.9rem; background: #fff; color: #172033; width: 100%; resize: vertical; }
.co-textarea:focus { outline: 2px solid rgba(43,74,120,0.2); border-color: #9fb4d6; }
.co-form-check-group { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 0.9rem; }
.co-check-label { display: flex; align-items: center; gap: 0.5rem; font-size: 0.88rem; color: #3d5173; cursor: pointer; user-select: none; }
.co-check-inline { display: flex; align-items: center; gap: 0.35rem; font-size: 0.82rem; color: #5f7195; cursor: pointer; white-space: nowrap; }

/* ── Meta stats ── */
.co-meta-stats { display: flex; gap: 0.5rem; flex-wrap: wrap; padding: 0.6rem 0; border-top: 1px solid #f0f4fb; margin-top: 0.5rem; }
.co-stat { font-size: 0.8rem; padding: 0.2rem 0.5rem; border-radius: 6px; background: #f3f6fc; color: #5f7195; font-weight: 500; }
.co-stat-req { background: #eff6ff; color: #1e40af; }
.co-stat-opt { background: #f0fdf4; color: #15803d; }

/* ── Checklist builder items ── */
.co-item-group { margin-bottom: 0.75rem; }
.co-item-group-header { display: flex; justify-content: space-between; align-items: center; font-size: 0.79rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #7a93b8; margin-bottom: 0.35rem; padding: 0.25rem 0; border-bottom: 1px solid #eef2f9; }
.co-item-group-count { background: #eff6ff; color: #3b82f6; border-radius: 999px; padding: 0.1rem 0.45rem; font-size: 0.75rem; }
.co-item-row { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.4rem 0.5rem; border: 1px solid #e8edf8; border-radius: 8px; margin-bottom: 0.4rem; background: #fafbff; transition: border-color 0.12s; }
.co-item-row:hover { border-color: #c8d4e8; }
.co-item-drag { color: #c8d4e8; font-size: 1rem; cursor: grab; padding-top: 0.25rem; user-select: none; }
.co-item-body { flex: 1; display: flex; flex-direction: column; gap: 0.3rem; }
.co-item-options { display: flex; align-items: center; gap: 0.5rem; }
.co-item-controls { display: flex; flex-direction: column; gap: 0.15rem; }
.co-empty-items { padding: 1.5rem; text-align: center; color: #8a9bbf; font-size: 0.9rem; }

/* ── Quick category buttons ── */
.co-quick-categories { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; padding: 0.6rem 0; border-top: 1px solid #f0f4fb; margin-top: 0.5rem; }
.co-qc-top { border-top: none; border-bottom: 1px solid #f0f4fb; margin-bottom: 0.75rem; padding-bottom: 0.6rem; }
.co-cat-label { font-size: 0.78rem; font-weight: 600; color: #8a9bbf; white-space: nowrap; }
.co-cat-btn { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; border-radius: 6px; padding: 0.22rem 0.55rem; font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: all 0.12s; }
.co-cat-btn:hover { background: #dbeafe; border-color: #93c5fd; }

/* ── Template preview in induction modal ── */
.co-template-preview-strip { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.35rem; padding: 0.4rem 0.6rem; background: #f0f7ff; border-radius: 7px; border: 1px solid #bfdbfe; font-size: 0.84rem; }

/* ── Checklist view (modal / builder) ── */
.co-checklist-group { margin-bottom: 1rem; }
.co-checklist-group-header { display: flex; justify-content: space-between; font-size: 0.79rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #7a93b8; padding: 0.3rem 0; border-bottom: 1px solid #e8edf8; margin-bottom: 0.4rem; }
.co-group-count { background: #eff6ff; color: #3b82f6; border-radius: 999px; padding: 0.1rem 0.45rem; font-size: 0.75rem; }
.co-checklist-item { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.4rem 0.5rem; border-radius: 7px; transition: background 0.1s; }
.co-checklist-item:hover { background: #f8faff; }
.co-item-done { background: #f0fdf4 !important; }
.co-item-check { margin-top: 0.15rem; width: 16px; height: 16px; cursor: pointer; flex-shrink: 0; }
.co-item-icon { font-size: 0.95rem; flex-shrink: 0; margin-top: 0.05rem; }
.co-icon-done { color: #16a34a; }
.co-icon-req  { color: #6b7280; }
.co-icon-opt  { color: #9ca3af; }
.co-item-text { flex: 1; font-size: 0.9rem; color: #1e293b; }
.co-optional-text { color: #64748b; }
.co-optional-item { color: #64748b; }
.co-opt-badge { font-size: 0.7rem; background: #f1f5f9; color: #64748b; border-radius: 4px; padding: 0.1rem 0.3rem; font-weight: 500; }

/* ── Checklist preview (AI modal) ── */
.co-checklist-preview { display: flex; flex-direction: column; gap: 0.1rem; }
.co-checklist-preview-item { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.35rem 0.5rem; border-radius: 6px; font-size: 0.88rem; }
.co-checklist-preview-item:hover { background: #f8faff; }
.co-check-icon { font-size: 0.9rem; flex-shrink: 0; }

/* ── Progress header in checklist view ── */
.co-checklist-progress { display: flex; align-items: center; gap: 1rem; padding: 0.75rem 1rem; background: #f8faff; border-radius: 10px; border: 1px solid #e2eaf8; margin-bottom: 1rem; }
.co-cp-left { display: flex; flex-direction: column; min-width: 80px; }
.co-cp-val { font-size: 1.2rem; font-weight: 800; color: #1a2d4e; }
.co-cp-blue { color: #2563eb; }
.co-cp-green { color: #16a34a; }
.co-cp-label { font-size: 0.74rem; color: #7a93b8; font-weight: 500; }
.co-cp-pct { font-size: 0.95rem; font-weight: 700; color: #5f7195; min-width: 38px; text-align: right; }

/* ── Notes block ── */
.co-notes-block { background: #fffbf0; border: 1px solid #fde68a; border-radius: 8px; padding: 0.75rem 1rem; font-size: 0.88rem; color: #78350f; margin-top: 0.75rem; }

/* ── Modal ── */
.co-modal-backdrop { position: fixed; inset: 0; background: rgba(10, 20, 50, 0.55); backdrop-filter: blur(3px); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.co-modal { background: #fff; border-radius: 16px; max-height: 90vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.2); width: 100%; max-width: 540px; }
.co-modal-lg { max-width: 720px; }
.co-modal-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 1.25rem 1.5rem 1rem; border-bottom: 1px solid #eef2f9; gap: 0.75rem; flex-shrink: 0; }
.co-modal-header h2 { margin: 0; font-size: 1.15rem; font-weight: 700; color: #1a2d4e; }
.co-modal-subtitle { margin: 0.2rem 0 0; font-size: 0.83rem; color: #7a93b8; }
.co-modal-title { display: flex; align-items: center; gap: 0.5rem; }
.co-modal-icon { font-size: 1.3rem; }
.co-modal-close { background: none; border: 1px solid #e2eaf8; border-radius: 8px; padding: 0.25rem 0.5rem; font-size: 1rem; cursor: pointer; color: #8a9bbf; flex-shrink: 0; }
.co-modal-close:hover { background: #f3f6fc; color: #dc2626; border-color: #fca5a5; }
.co-modal-body { padding: 1.25rem 1.5rem; overflow-y: auto; flex: 1; }
.co-modal-footer { padding: 1rem 1.5rem; border-top: 1px solid #eef2f9; display: flex; gap: 0.5rem; justify-content: flex-end; flex-shrink: 0; }

/* ── AI modal ── */
.co-ai-intro { font-size: 0.9rem; color: #5f7195; margin: 0 0 1.2rem; padding: 0.75rem; background: #faf5ff; border-radius: 8px; border: 1px solid #e9d5ff; }
.co-ai-generating { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 3rem 1.5rem; text-align: center; color: #5f7195; }
.co-ai-success-banner { display: flex; align-items: flex-start; gap: 0.75rem; background: #f0fdf4; border: 1px solid #86efac; border-radius: 10px; padding: 0.85rem 1rem; margin-bottom: 1rem; }
.co-ai-success-icon { font-size: 1.3rem; flex-shrink: 0; }
.co-ai-success-banner strong { font-size: 0.95rem; color: #15803d; display: block; }
.co-ai-success-banner p { margin: 0.2rem 0 0; font-size: 0.83rem; color: #166534; }
.co-review-title { margin: 0 0 0.3rem; font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.co-review-desc { margin: 0 0 1rem; font-size: 0.85rem; color: #5f7195; }

/* ── Alert banners ── */
.co-alert-banner { padding: 0.75rem 1rem; border-radius: 8px; font-size: 0.9rem; margin-bottom: 0.5rem; }
.co-alert-success { background: #f0fdf4; color: #15803d; border: 1px solid #86efac; }
.co-alert-error   { background: #fff1f2; color: #b91c1c; border: 1px solid #fca5a5; }

/* ── Loading ── */
.co-loading { display: flex; align-items: center; gap: 0.75rem; padding: 2rem; color: #7a93b8; font-size: 0.9rem; }
.co-spinner { width: 22px; height: 22px; border: 3px solid #e2eaf8; border-top-color: #3b82f6; border-radius: 50%; animation: co-spin 0.7s linear infinite; flex-shrink: 0; }
.co-spinner-large { width: 40px; height: 40px; border-width: 4px; }
@keyframes co-spin { to { transform: rotate(360deg); } }

/* ── Empty state ── */
.co-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.5rem 2rem; text-align: center; background: #fff; border-radius: 14px; border: 2px dashed #dce4f1; gap: 0.5rem; }
.co-empty-icon { font-size: 2.5rem; margin-bottom: 0.3rem; }
.co-empty h3 { margin: 0; color: #1a2d4e; font-size: 1.05rem; }
.co-empty p { margin: 0; color: #8a9bbf; font-size: 0.9rem; max-width: 380px; }
.co-empty-actions { display: flex; gap: 0.6rem; margin-top: 0.5rem; }

/* ── Table cell states ── */
.co-cell-expired  { color: #b91c1c; font-weight: 600; }
.co-cell-expiring { color: #d97706; font-weight: 600; }

/* ════════════════════════════════════════════════════════════════════
   CONTRACTOR DETAIL PAGE STYLES
════════════════════════════════════════════════════════════════════ */

/* Hero banner */
.cd-hero { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 1rem; background: #fff; border: 1px solid #dce4f1; border-radius: 16px; padding: 1.4rem 1.6rem; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.cd-hero-left { display: flex; flex-direction: column; gap: 0.6rem; }
.cd-hero-title-row { display: flex; align-items: center; gap: 1rem; }
.cd-avatar { width: 52px; height: 52px; border-radius: 12px; background: linear-gradient(135deg, #2b4a78, #4a7cc1); color: #fff; font-size: 1.5rem; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cd-company-name { margin: 0; font-size: 1.65rem; font-weight: 800; color: #121d31; }
.cd-hero-meta { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.25rem; }
.cd-meta-chip { background: #f0f4fc; border: 1px solid #dce4f1; border-radius: 999px; padding: 0.2rem 0.65rem; font-size: 0.8rem; color: #5f7195; }
.cd-hero-right { display: flex; flex-direction: column; align-items: flex-end; gap: 0.75rem; }
.cd-status-lg { font-size: 0.88rem; padding: 0.3rem 0.9rem; }
.co-btn-warn { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.co-btn-warn:hover { background: #fde68a; }
.co-btn-danger { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.co-btn-danger:hover { background: #fecaca; }

/* Stat bar */
.cd-stat-bar { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.cd-stat { display: flex; flex-direction: column; align-items: center; padding: 0.75rem 1.1rem; background: #fff; border: 1px solid #dce4f1; border-radius: 12px; text-decoration: none; color: inherit; min-width: 100px; transition: box-shadow 0.15s, border-color 0.15s; cursor: default; flex: 1; }
a.cd-stat { cursor: pointer; }
a.cd-stat:hover { box-shadow: 0 3px 10px rgba(0,0,0,0.08); border-color: #9fb4d6; text-decoration: none; }
.cd-stat-val { font-size: 1.5rem; font-weight: 800; line-height: 1; color: #1a2d4e; }
.cd-stat-icon { font-size: 1.2rem; }
.cd-stat-label { font-size: 0.76rem; font-weight: 600; color: #7a93b8; text-align: center; }
.cd-stat-sub { font-size: 0.74rem; color: #8a9bbf; text-align: center; font-weight: 500; }
.cd-stat-pill { font-size: 0.7rem; background: #fef3c7; color: #92400e; border-radius: 999px; padding: 0.1rem 0.4rem; font-weight: 700; margin-top: 0.15rem; }
.cd-stat-active { border-top: 3px solid #3b82f6; }
.cd-stat-warn   { border-top: 3px solid #f59e0b; }
.cd-stat-ok     { border-top: 3px solid #22c55e; }
.cd-stat-fail   { border-top: 3px solid #ef4444; }
.cd-stat-missing{ border-top: 3px solid #e2e8f0; }

/* Layout */
.cd-layout { display: grid; grid-template-columns: 1fr 240px; gap: 1.25rem; align-items: flex-start; }
@media (max-width: 1024px) { .cd-layout { grid-template-columns: 1fr; } }
.cd-main { display: flex; flex-direction: column; gap: 1.25rem; }
.cd-sidebar { display: flex; flex-direction: column; gap: 1rem; position: sticky; top: 1rem; }

/* Info grid */
.cd-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.cd-ins-section { grid-column: span 2; }
@media (max-width: 768px) { .cd-info-grid { grid-template-columns: 1fr; } .cd-ins-section { grid-column: span 1; } }

/* Definition list */
.cd-dl { display: flex; flex-direction: column; gap: 0.5rem; }
.cd-dl-row { display: grid; grid-template-columns: 130px 1fr; gap: 0.5rem; align-items: baseline; }
.cd-notes-row { display: flex; flex-direction: column; gap: 0.25rem; }
.cd-dt { font-size: 0.8rem; font-weight: 600; color: #7a93b8; text-transform: uppercase; letter-spacing: 0.04em; }
.cd-dd { font-size: 0.9rem; color: #1e293b; }
.cd-notes { font-size: 0.86rem; color: #5f7195; line-height: 1.5; background: #f8faff; border-radius: 8px; padding: 0.5rem 0.75rem; border: 1px solid #eef2f9; }

/* Contact block */
.cd-contact-block { display: flex; align-items: flex-start; gap: 0.85rem; }
.cd-contact-avatar { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg, #4a7cc1, #6ea0d6); color: #fff; font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cd-contact-info { display: flex; flex-direction: column; gap: 0.25rem; }
.cd-contact-name { font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.cd-contact-detail { font-size: 0.85rem; color: #2b4a78; text-decoration: none; }
.cd-contact-detail:hover { text-decoration: underline; }
.cd-contact-link { font-size: 0.85rem; color: #2b4a78; text-decoration: none; }
.cd-contact-link:hover { text-decoration: underline; }

/* Insurance in detail */
.cd-ins-amount { font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.cd-ins-expiry { font-size: 0.83rem; color: #5f7195; }
.cd-ins-expiry strong { color: #1a2d4e; }

/* Section header helpers */
.cd-sh-text { flex: 1; }
.cf-section-header { justify-content: space-between; }
.cd-count-pill { display: inline-flex; align-items: center; justify-content: center; background: #eff6ff; color: #2563eb; border-radius: 999px; padding: 0.1rem 0.55rem; font-size: 0.78rem; font-weight: 700; margin-left: 0.4rem; vertical-align: middle; }

/* Operative avatar */
.cd-op-name { display: flex; align-items: center; gap: 0.6rem; }
.cd-op-avatar { width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, #4a7cc1, #6ea0d6); color: #fff; font-size: 0.85rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cd-row-inactive { opacity: 0.55; }

/* Document type badge */
.cd-doc-type { font-size: 0.76rem; font-weight: 700; background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; border-radius: 6px; padding: 0.15rem 0.5rem; white-space: nowrap; }

/* Section empty state */
.cd-section-empty { display: flex; align-items: center; justify-content: center; gap: 0.75rem; padding: 2rem; color: #8a9bbf; font-size: 0.9rem; border-top: 1px solid #f0f4fb; flex-wrap: wrap; }
.cd-empty-icon { font-size: 1.3rem; }

/* Flush table inside section (no extra border/shadow) */
.cd-table-flush { border: none; border-radius: 0; box-shadow: none; border-top: 1px solid #f0f4fb; }

/* Quick actions sidebar */
.cd-actions-list { display: flex; flex-direction: column; gap: 0.4rem; }
.cd-action-btn { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem; border-radius: 9px; background: #f7f9fd; border: 1px solid #e6ebf3; color: #2b4a78; font-size: 0.88rem; font-weight: 600; text-decoration: none; transition: all 0.12s; }
.cd-action-btn:hover { background: #eef3fc; border-color: #9fb4d6; text-decoration: none; }
.cd-action-icon { font-size: 1rem; }

/* Health list */
.cd-health-list { display: flex; flex-direction: column; gap: 0.5rem; }
.cd-health-row { display: flex; align-items: flex-start; gap: 0.55rem; padding: 0.55rem 0.65rem; border-radius: 9px; border-left: 3px solid transparent; }
.cd-health-ok      { background: #f0fdf4; border-left-color: #22c55e; }
.cd-health-warn    { background: #fffbeb; border-left-color: #f59e0b; }
.cd-health-fail    { background: #fff1f2; border-left-color: #ef4444; }
.cd-health-missing { background: #f8faff; border-left-color: #cbd5e1; }
.cd-health-icon { font-size: 0.95rem; flex-shrink: 0; margin-top: 0.1rem; }
.cd-health-text { display: flex; flex-direction: column; gap: 0.1rem; }
.cd-health-label { font-size: 0.78rem; font-weight: 700; color: #3d5173; }
.cd-health-val { font-size: 0.77rem; color: #5f7195; }

/* Alert banner warning variant */
.co-alert-warn { background: #fffbeb; color: #92400e; border: 1px solid #fcd34d; }

/* ════════════════════════════════════════════════════════════════════
   CONTRACTOR EDIT FORM STYLES
════════════════════════════════════════════════════════════════════ */

/* Breadcrumb */
.cf-breadcrumb { display: flex; align-items: center; gap: 0.4rem; font-size: 0.83rem; margin-bottom: 0.35rem; }
.cf-breadcrumb-link { color: #2b4a78; text-decoration: none; font-weight: 500; }
.cf-breadcrumb-link:hover { text-decoration: underline; }
.cf-breadcrumb-sep { color: #9fb4d6; }

/* Two-column layout */
.cf-form-layout { display: grid; grid-template-columns: 1fr 300px; gap: 1.5rem; align-items: flex-start; }
.cf-form-main { display: flex; flex-direction: column; gap: 1.25rem; }
.cf-form-sidebar { display: flex; flex-direction: column; gap: 1rem; position: sticky; top: 1rem; }

/* Sections */
.cf-section { background: #fff; border: 1px solid #dce4f1; border-radius: 16px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.cf-section-header { display: flex; align-items: flex-start; gap: 0.85rem; padding: 1.1rem 1.4rem; background: linear-gradient(to right, #f7f9fd, #fff); border-bottom: 1px solid #eef2f9; }
.cf-section-icon { font-size: 1.4rem; flex-shrink: 0; margin-top: 0.1rem; }
.cf-section-title { margin: 0; font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.cf-section-desc { margin: 0.15rem 0 0; font-size: 0.82rem; color: #7a93b8; }
.cf-section-body { padding: 1.25rem 1.4rem; display: flex; flex-direction: column; gap: 0.85rem; }

/* Fields */
.cf-field { display: flex; flex-direction: column; gap: 0.3rem; }
.cf-field-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.85rem; }
.cf-field-grow { grid-column: span 2; }
.cf-label { font-size: 0.83rem; font-weight: 600; color: #3d5173; }
.cf-required { color: #ef4444; }
.cf-opt { font-size: 0.74rem; color: #9fb4d6; font-weight: 400; }
.cf-input { padding: 0.55rem 0.8rem; border: 1.5px solid #cdd6e6; border-radius: 9px; font-size: 0.9rem; color: #172033; background: #fff; width: 100%; transition: border-color 0.15s, box-shadow 0.15s; }
.cf-input:focus { outline: none; border-color: #2b4a78; box-shadow: 0 0 0 3px rgba(43,74,120,0.1); }
.cf-input:hover:not(:focus) { border-color: #9fb4d6; }
.cf-select { padding: 0.55rem 0.8rem; border: 1.5px solid #cdd6e6; border-radius: 9px; font-size: 0.9rem; color: #172033; background: #fff; width: 100%; transition: border-color 0.15s, box-shadow 0.15s; }
.cf-select:focus { outline: none; border-color: #2b4a78; box-shadow: 0 0 0 3px rgba(43,74,120,0.1); }
.cf-textarea { padding: 0.6rem 0.8rem; border: 1.5px solid #cdd6e6; border-radius: 9px; font-size: 0.9rem; color: #172033; background: #fff; width: 100%; resize: vertical; transition: border-color 0.15s, box-shadow 0.15s; }
.cf-textarea:focus { outline: none; border-color: #2b4a78; box-shadow: 0 0 0 3px rgba(43,74,120,0.1); }
.cf-validation { font-size: 0.78rem; color: #dc2626; margin-top: 0.15rem; }

/* Icon-prefix inputs */
.cf-input-icon-wrap { position: relative; }
.cf-input-icon { position: absolute; left: 0.7rem; top: 50%; transform: translateY(-50%); font-size: 0.9rem; pointer-events: none; color: #9fb4d6; }
.cf-input-with-icon { padding-left: 2.1rem; }

/* Insurance cards */
.cf-insurance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem; }
.cf-insurance-card { border: 1.5px solid #e2eaf8; border-radius: 12px; padding: 1rem; display: flex; flex-direction: column; gap: 0.75rem; transition: border-color 0.15s; }
.cf-ins-neutral  { border-color: #e2eaf8; background: #fafbff; }
.cf-ins-valid    { border-color: #86efac; background: #f0fdf4; }
.cf-ins-expiring { border-color: #fcd34d; background: #fffbeb; }
.cf-ins-expired  { border-color: #fca5a5; background: #fff1f2; }
.cf-ins-header { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.cf-ins-icon { font-size: 1.1rem; }
.cf-ins-title { font-weight: 700; font-size: 0.9rem; color: #1a2d4e; flex: 1; }
.cf-ins-badge { font-size: 0.74rem; font-weight: 700; padding: 0.15rem 0.55rem; border-radius: 999px; }
.cf-ins-badge-ok   { background: #d1fae5; color: #065f46; }
.cf-ins-badge-warn { background: #fef3c7; color: #92400e; }
.cf-ins-badge-fail { background: #fee2e2; color: #991b1b; }

/* Sidebar cards */
.cf-sidebar-card { background: #fff; border: 1px solid #dce4f1; border-radius: 14px; padding: 1.15rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }

/* Save card */
.cf-save-card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.7rem; border-top: 4px solid #2b4a78; }
.cf-save-icon { font-size: 2rem; }
.cf-save-title { margin: 0; font-size: 1rem; font-weight: 700; color: #1a2d4e; }
.cf-save-desc { margin: 0; font-size: 0.8rem; color: #7a93b8; line-height: 1.4; }

/* Inline spinner for save button */
.co-spinner-inline { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%; animation: co-spin 0.7s linear infinite; flex-shrink: 0; display: inline-block; }

/* Completion checklist */
.cf-checklist-title { margin: 0 0 0.75rem; font-size: 0.88rem; font-weight: 700; color: #3d5173; text-transform: uppercase; letter-spacing: 0.04em; }
.cf-checklist { list-style: none; margin: 0 0 0.85rem; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.cf-checklist li { display: flex; align-items: center; gap: 0.45rem; font-size: 0.84rem; padding: 0.3rem 0.5rem; border-radius: 6px; }
.cf-check-done    { color: #15803d; background: #f0fdf4; }
.cf-check-pending { color: #8a9bbf; background: #f8faff; }
.cf-check-fail    { color: #b91c1c; background: #fff1f2; }
.cf-check-icon { font-size: 0.85rem; flex-shrink: 0; }
.cf-completion-bar { height: 7px; background: #e8edf8; border-radius: 999px; overflow: hidden; margin-bottom: 0.35rem; }
.cf-completion-fill { height: 100%; background: linear-gradient(to right, #3b82f6, #2b4a78); border-radius: 999px; transition: width 0.4s ease; }
.cf-completion-label { font-size: 0.78rem; color: #7a93b8; text-align: center; margin: 0; font-weight: 500; }

/* Status guide */
.cf-status-rows { display: flex; flex-direction: column; gap: 0.55rem; }
.cf-status-row { display: flex; align-items: center; gap: 0.6rem; }
.cf-status-desc { font-size: 0.78rem; color: #7a93b8; }

/* Shared contractor alignment with the wider app dashboard language */
.co-page-header {
    background: #fff;
    border: 1px solid #dce4f1;
    border-radius: 12px;
    padding: 1rem 1.15rem;
    box-shadow: 0 1px 3px rgba(30, 58, 120, 0.05);
}

.co-page-header h1 {
    font-size: 1.35rem;
    color: #17243d;
}

.co-subtitle {
    color: #697996;
}

.co-summary-bar,
.co-kpi-grid,
.cd-stat-bar {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .85rem;
    margin-bottom: 1.35rem;
}

.co-summary-chip,
.co-kpi-card,
.cd-stat {
    min-height: 6.1rem;
    align-items: flex-start;
    justify-content: center;
    background: #fff;
    border: 1px solid #dce4f1;
    border-left: 3px solid #c8d4e8;
    border-radius: 12px;
    padding: .95rem 1rem;
    box-shadow: none;
    text-align: left;
    text-decoration: none;
    color: inherit;
}

.co-summary-chip:hover,
.co-kpi-card:hover,
.cd-stat:hover {
    border-color: #b8c7de;
    box-shadow: 0 4px 14px rgba(30,58,120,.10);
    text-decoration: none;
}

.co-summary-chip strong,
.co-kpi-value,
.cd-stat-val {
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.05;
    color: #17243d;
}

.co-summary-chip span,
.co-kpi-label,
.cd-stat-label {
    order: -1;
    font-size: .72rem;
    font-weight: 700;
    color: #697996;
    line-height: 1.25;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-top: 0;
}

.co-kpi-icon,
.cd-stat-icon {
    display: none;
}

.co-kpi-sub,
.cd-stat-sub,
.cd-stat-pill {
    font-size: .74rem;
    color: #8a9ab8;
}

.co-chip-green,
.co-kpi-green,
.cd-stat-ok,
.cd-stat-active {
    border-left-color: #9dbca8;
}

.co-chip-amber,
.co-kpi-amber,
.cd-stat-warn {
    border-left-color: #d4bd84;
}

.co-chip-red,
.co-kpi-red,
.cd-stat-fail {
    border-left-color: #c98e8e;
}

.co-chip-blue,
.co-kpi-blue {
    border-left-color: #9fb4d6;
}

.co-chip-purple {
    border-left-color: #aaa0c4;
}