/* Central colour tokens. Create a new scheme by overriding only this file's variables. */
:root,
:root[data-theme="rural"] {
    --rm-primary: #1E4620;
    --rm-primary-hover: #143016;
    --rm-primary-soft: #E8F1E9;
    --rm-on-primary: #FFFFFF;
    --rm-page: #F1F5F9;
    --rm-surface: #FFFFFF;
    --rm-surface-muted: #F3F4F6;
    --rm-text: #0F172A;
    --rm-text-secondary: #4B5563;
    --rm-border: #CBD5E1;
    --rm-border-strong: #94A3B8;
    --rm-success: #15803D;
    --rm-warning: #D97706;
    --rm-danger: #DC2626;
    --rm-danger-dark: #991B1B;
    --rm-danger-soft: #FEF2F2;
    --rm-focus: #3B82F6;
    --rm-overlay: rgba(15, 23, 42, 0.55);
}

:root[data-theme="ocean"] {
    --rm-primary: #075985;
    --rm-primary-hover: #0C4A6E;
    --rm-primary-soft: #E0F2FE;
    --rm-page: #F0F9FF;
    --rm-focus: #0284C7;
}

:root[data-theme="charcoal"] {
    --rm-primary: #334155;
    --rm-primary-hover: #1E293B;
    --rm-primary-soft: #E2E8F0;
    --rm-page: #E5E7EB;
    --rm-focus: #475569;
}

html, body, body#PageBody, main, .app-view-canvas {
    background-color: var(--rm-page) !important;
    color: var(--rm-text) !important;
}

.spa-dialog-holder {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 24px !important;
    overflow: auto !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--rm-overlay) !important;
    z-index: 900000 !important;
}

.spa-dialog-holder > :first-child {
    width: min(100%, 640px);
    max-height: calc(100vh - 48px);
    overflow: auto;
    background: var(--rm-surface);
    color: var(--rm-text);
    border: 1px solid var(--rm-border);
    border-radius: 8px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.24);
    padding: 20px;
    box-sizing: border-box;
}

.spa-dialog-holder .modal-popup-tactical-card {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 !important;
}

.spa-dialog-underlay { pointer-events: none !important; }

:focus-visible {
    outline: 3px solid var(--rm-focus) !important;
    outline-offset: 2px !important;
}