/* Shared CRM presentation. Loaded in both Vite and no-build layouts. */
:root {
    --crm-primary: #007a1c;
    --crm-primary-hover: #006016;
    --crm-on-primary: #ffffff;
    --crm-danger: #9b0909;
    --crm-danger-hover: #750707;
    --crm-on-danger: #ffffff;
    --crm-canvas: #f3f5f2;
    --crm-surface: #ffffff;
    --crm-field-surface: #fafbf9;
    --crm-text: #1f2a24;
    --crm-muted: #525e55;
    --crm-border: #dce3dd;
    --crm-control-border: #78847b;
    --crm-focus: #006016;
    --crm-disabled-surface: #e7ece7;
    --crm-success-text: #14532d;
    --crm-success-surface: #edf7ef;
    --crm-error-text: #9b0909;
    --crm-error-surface: #fff0f0;
    --crm-radius: 6px;
    --crm-space-1: 4px;
    --crm-space-2: 8px;
    --crm-space-3: 12px;
    --crm-space-4: 16px;
    --crm-space-6: 24px;
    --crm-control-height: 44px;
    --crm-font: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
}
.crm-app { background:var(--crm-canvas); color:var(--crm-text); font-family:var(--crm-font); font-size:16px; line-height:1.5; }
.crm-card { background:var(--crm-surface); border:1px solid var(--crm-border); border-radius:var(--crm-radius); box-shadow:0 1px 3px #1f2a240a; padding:var(--crm-space-6); }
.crm-card-flush { padding:0; }
.crm-stat { padding:var(--crm-space-4); border:1px solid var(--crm-border); border-radius:var(--crm-radius); background:var(--crm-field-surface); font-variant-numeric:tabular-nums; }
.crm-title { color:var(--crm-text); font-size:28px; font-weight:700; line-height:1.25; letter-spacing:-.02em; overflow-wrap:anywhere; }
.crm-section-title { color:var(--crm-text); font-size:20px; font-weight:600; line-height:1.35; }
.crm-label { display:block; color:var(--crm-text); font-size:14px; font-weight:600; margin-bottom:var(--crm-space-1); }
.crm-fieldset { padding:var(--crm-space-3); border:1px solid var(--crm-border); border-radius:var(--crm-radius); }
.crm-help { color:var(--crm-muted); font-size:14px; line-height:1.5; }
.crm-field { width:100%; min-width:0; min-height:var(--crm-control-height); padding:var(--crm-space-2) var(--crm-space-3); border:1px solid var(--crm-control-border); border-radius:var(--crm-radius); background:var(--crm-field-surface); color:var(--crm-text); font:inherit; font-size:16px; line-height:1.5; }
.crm-field::placeholder { color:var(--crm-muted); opacity:1; }
.crm-field[readonly] { background:var(--crm-disabled-surface); }
.crm-field:disabled { background:var(--crm-disabled-surface); color:var(--crm-muted); cursor:not-allowed; opacity:1; }
.crm-field[aria-invalid="true"] { border-color:var(--crm-error-text); }
.crm-button { display:inline-flex; align-items:center; justify-content:center; gap:var(--crm-space-2); min-height:var(--crm-control-height); padding:var(--crm-space-2) var(--crm-space-4); border:1px solid transparent; border-radius:var(--crm-radius); font:inherit; font-size:14px; font-weight:600; line-height:1.4; text-align:center; cursor:pointer; text-decoration:none; transition:background-color .15s ease, border-color .15s ease; }
.crm-button-primary { background:var(--crm-primary); color:var(--crm-on-primary); }
.crm-button-primary:hover { background:var(--crm-primary-hover); }
.crm-button-secondary { background:var(--crm-surface); color:var(--crm-text); border-color:var(--crm-control-border); }
.crm-button-secondary:hover { background:var(--crm-disabled-surface); }
.crm-button-danger { background:var(--crm-danger); color:var(--crm-on-danger); }
.crm-button-danger:hover { background:var(--crm-danger-hover); }
.crm-button-icon { min-width:var(--crm-control-height); padding:var(--crm-space-2); }
.crm-picker-option { width:100%; justify-content:flex-start; text-align:left; }
.crm-button:disabled, .crm-button[aria-disabled="true"] { background:var(--crm-disabled-surface); color:var(--crm-muted); border-color:var(--crm-control-border); cursor:not-allowed; opacity:1; }
.crm-button[aria-busy="true"] { cursor:progress; }
.crm-button[aria-current="page"], .crm-button[aria-pressed="true"] { border-color:var(--crm-primary); text-decoration:underline; text-underline-offset:4px; }
.crm-link { color:var(--crm-primary-hover); text-decoration:underline; text-underline-offset:3px; }
.crm-link:hover { text-decoration-thickness:2px; }
.crm-button:focus-visible, .crm-field:focus-visible, .crm-link:focus-visible { outline:2px solid var(--crm-focus); outline-offset:3px; box-shadow:0 0 0 2px var(--crm-surface); }
.crm-table { width:100%; color:var(--crm-text); font-size:14px; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.crm-table th { background:var(--crm-field-surface); color:var(--crm-muted); font-weight:600; text-align:left; }
.crm-table th, .crm-table td { padding:var(--crm-space-3) var(--crm-space-4); border-bottom:1px solid var(--crm-border); vertical-align:top; }
.crm-table tbody tr:hover { background:var(--crm-field-surface); }
.crm-alert { padding:var(--crm-space-3) var(--crm-space-4); border:1px solid var(--crm-border); border-radius:var(--crm-radius); color:var(--crm-text); background:var(--crm-field-surface); font-size:14px; line-height:1.5; }
.crm-alert:empty { display:none; }
.crm-alert-success { color:var(--crm-success-text); background:var(--crm-success-surface); border-color:var(--crm-success-text); }
.crm-alert-error { color:var(--crm-error-text); background:var(--crm-error-surface); border-color:var(--crm-error-text); }
.crm-error-text { color:var(--crm-error-text); font-size:14px; }
.crm-success-text { color:var(--crm-success-text); font-size:14px; }
.crm-badge { display:inline-block; padding:var(--crm-space-1) var(--crm-space-2); border-radius:var(--crm-radius); background:var(--crm-success-surface); color:var(--crm-success-text); font-size:12px; font-weight:600; }
.crm-skeleton { background:var(--crm-disabled-surface); border-radius:var(--crm-radius); }
.crm-filter-actions { display:flex; flex-wrap:wrap; gap:var(--crm-space-2); }
@media (max-width:639px) {
    .crm-card { padding:var(--crm-space-4); }
    .crm-card-flush { padding:0; }
    .crm-title { font-size:24px; }
}
@media (prefers-reduced-motion:reduce) {
    .crm-button { transition:none; }
    .crm-skeleton { animation:none; }
}

.crm-dialog { margin: auto; border: 1px solid var(--crm-border); border-radius: 8px; padding: 24px; width: min(720px, calc(100vw - 32px)); max-height: 85vh; overflow: auto; background: var(--crm-surface); color: var(--crm-text); }
.crm-dialog::backdrop { background: rgb(0 0 0 / 45%); }
.crm-button[hidden] { display: none; }