:root,
html[data-pm-theme="light"] {
    color-scheme: light;
    --pm-theme-bg: #f7faf8;
    --pm-theme-bg-2: #edf6f1;
    --pm-theme-surface: #ffffff;
    --pm-theme-surface-2: #f1f7f3;
    --pm-theme-nav: rgba(255, 255, 255, .96);
    --pm-theme-border: #cbded4;
    --pm-theme-border-strong: #9fc5b1;
    --pm-theme-text: #14251d;
    --pm-theme-muted: #52695d;
    --pm-theme-accent: #087a54;
    --pm-theme-accent-hover: #065f46;
    --pm-theme-accent-text: #ffffff;
    --pm-theme-secondary: #0b55aa;
    --pm-theme-success-bg: #e8f8ef;
    --pm-theme-success-text: #07613e;
    --pm-theme-warning-bg: #fff8e6;
    --pm-theme-warning-text: #7a4b00;
    --pm-theme-danger-bg: #fff0f0;
    --pm-theme-danger-text: #9f1d2d;
    --pm-theme-shadow: 0 18px 46px rgba(20, 60, 42, .10);
    --pm-bg: var(--pm-theme-bg);
    --pm-bg-2: var(--pm-theme-bg-2);
    --pm-panel: var(--pm-theme-surface);
    --pm-panel-2: var(--pm-theme-surface-2);
    --pm-border: var(--pm-theme-border);
    --pm-border-strong: var(--pm-theme-border-strong);
    --pm-text: var(--pm-theme-text);
    --pm-muted: var(--pm-theme-muted);
    --pm-accent: var(--pm-theme-accent);
    --pm-green: var(--pm-theme-accent);
    --pm-cyan: var(--pm-theme-secondary);
    --ga-bg: var(--pm-theme-bg);
    --ga-bg-2: var(--pm-theme-bg-2);
    --ga-bg-3: var(--pm-theme-surface-2);
    --ga-surface: var(--pm-theme-surface);
    --ga-surface-strong: var(--pm-theme-surface-2);
    --ga-card: var(--pm-theme-surface);
    --ga-card-2: var(--pm-theme-surface-2);
    --ga-border: var(--pm-theme-border);
    --ga-border-strong: var(--pm-theme-border-strong);
    --ga-text: var(--pm-theme-text);
    --ga-muted: var(--pm-theme-muted);
    --ga-muted-2: var(--pm-theme-muted);
    --ga-emerald: var(--pm-theme-accent);
    --ga-mint: var(--pm-theme-accent);
    --ga-cyan: var(--pm-theme-secondary);
    --bg: var(--pm-theme-bg);
    --surface: var(--pm-theme-surface);
    --panel: var(--pm-theme-surface);
    --line: var(--pm-theme-border);
    --text: var(--pm-theme-text);
    --muted: var(--pm-theme-muted);
    --accent: var(--pm-theme-accent);
    --pm-ocr-bg: var(--pm-theme-bg);
    --pm-ocr-surface: var(--pm-theme-surface);
    --pm-ocr-surface-2: var(--pm-theme-surface-2);
    --pm-ocr-surface-3: var(--pm-theme-bg-2);
    --pm-ocr-line: var(--pm-theme-border);
    --pm-ocr-text: var(--pm-theme-text);
    --pm-ocr-soft: var(--pm-theme-text);
    --pm-ocr-muted: var(--pm-theme-muted);
    --pm-ocr-accent: var(--pm-theme-accent);
    --pm-ocr-warn: var(--pm-theme-warning-text);
    --pm-ocr-danger: var(--pm-theme-danger-text);
    --pm-ocr-shadow: rgba(20, 60, 42, .10);
}

html[data-pm-theme="dark"] {
    color-scheme: dark;
    --pm-theme-bg: #06140f;
    --pm-theme-bg-2: #0b1f17;
    --pm-theme-surface: #0f2a20;
    --pm-theme-surface-2: #123529;
    --pm-theme-nav: rgba(6, 20, 15, .96);
    --pm-theme-border: #315a49;
    --pm-theme-border-strong: #4f806b;
    --pm-theme-text: #f8fafc;
    --pm-theme-muted: #cbd5e1;
    --pm-theme-accent: #6ee7b7;
    --pm-theme-accent-hover: #a7f3d0;
    --pm-theme-accent-text: #06140f;
    --pm-theme-secondary: #22d3ee;
    --pm-theme-success-bg: #123529;
    --pm-theme-success-text: #a7f3d0;
    --pm-theme-warning-bg: #3b2f12;
    --pm-theme-warning-text: #fde68a;
    --pm-theme-danger-bg: #3a171b;
    --pm-theme-danger-text: #fecaca;
    --pm-theme-shadow: 0 20px 55px rgba(0, 0, 0, .34);
    --pm-ocr-shadow: rgba(0, 0, 0, .34);
}

/* Keep the browser canvas on-theme before the application has finished
   rendering. This prevents a white flash during login and module hand-off. */
html,
body {
    min-height: 100%;
}

html[data-pm-theme="light"] {
    background: #f7faf8;
}

html[data-pm-theme="dark"] {
    background: #06140f;
}

html[data-pm-theme] body {
    background: linear-gradient(145deg, var(--pm-theme-bg), var(--pm-theme-bg-2)) fixed !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(h1, h2, h3, h4, h5, h6, strong, label, legend, th) {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(p, small, .muted, .text-muted, .pm-muted, .wf-muted) {
    color: var(--pm-theme-muted) !important;
}

html[data-pm-theme] :where(.pm-shell, .pm-page, .pm-page-content, .wf-page, main) {
    color: var(--pm-theme-text);
}

html[data-pm-theme] :where(.pm-topbar, .pm-navbar, .navbar, header.pm-topbar) {
    background: var(--pm-theme-nav) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.pm-card, .pm-panel, .pm-content-card-wide, .pm-greener-card, .wf-card, .wf-kpi, .card, .panel, .modal-content, dialog) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
    box-shadow: var(--pm-theme-shadow);
}

/* Legacy modules still contain a few permanently-light nested surfaces.
   Normalize them here so every dark page uses the same readable hierarchy. */
html[data-pm-theme="dark"] :where(
    .wf-empty,
    .pm-empty-state,
    .pm-list-empty,
    .pm-template-empty,
    .pm-loading-state,
    .pm-hero-mini-grid > div,
    .pm-dashboard-action,
    .pm-template-library,
    .pm-template-tools,
    .pm-template-group,
    .pm-template-card,
    .pm-template-list-row,
    .pm-company-template-group,
    .pm-company-template-head,
    .pm-runtime-key-card,
    .pm-upload-selection-panel,
    .pm-file-input-row
) {
    background: var(--pm-theme-surface-2) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
    box-shadow: none !important;
}

html[data-pm-theme="dark"] :where(
    .wf-empty,
    .pm-empty-state,
    .pm-list-empty,
    .pm-template-empty,
    .pm-loading-state,
    .pm-hero-mini-grid > div,
    .pm-dashboard-action,
    .pm-template-card,
    .pm-template-list-row,
    .pm-runtime-key-card
) :where(h1, h2, h3, h4, strong, b, label) {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="dark"] :where(
    .wf-empty,
    .pm-empty-state,
    .pm-list-empty,
    .pm-template-empty,
    .pm-loading-state,
    .pm-hero-mini-grid > div,
    .pm-dashboard-action,
    .pm-template-card,
    .pm-template-list-row,
    .pm-runtime-key-card
) :where(p, span, small) {
    color: var(--pm-theme-muted) !important;
}

/* Shared navigation/login/module loading experience. The element is injected
   by pm-two-theme.js, so it also covers the non-Blazor OCR/ESG/Identity pages. */
.pm-navigation-loading {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--pm-theme-accent) 18%, transparent), transparent 38%),
        color-mix(in srgb, var(--pm-theme-bg) 88%, transparent);
    -webkit-backdrop-filter: blur(12px) saturate(115%);
    backdrop-filter: blur(12px) saturate(115%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, visibility 0s linear .18s;
}

.pm-navigation-loading.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    transition-delay: 0s;
}

.pm-navigation-loading-card {
    position: relative;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    width: min(430px, 100%);
    min-height: 142px;
    padding: 24px 26px 30px;
    overflow: hidden;
    border: 1px solid var(--pm-theme-border-strong);
    border-radius: 26px;
    background: color-mix(in srgb, var(--pm-theme-surface) 94%, transparent);
    color: var(--pm-theme-text);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .28);
    transform: translateY(8px) scale(.985);
    transition: transform .22s ease;
}

.pm-navigation-loading.is-visible .pm-navigation-loading-card {
    transform: translateY(0) scale(1);
}

.pm-navigation-loading-mark {
    position: relative;
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--pm-theme-accent), var(--pm-theme-secondary));
    color: var(--pm-theme-accent-text);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--pm-theme-accent) 34%, transparent);
}

.pm-navigation-loading-mark::before,
.pm-navigation-loading-mark::after {
    content: "";
    position: absolute;
    inset: -7px;
    border: 2px solid color-mix(in srgb, var(--pm-theme-accent) 46%, transparent);
    border-radius: 27px;
    animation: pm-loading-orbit 1.5s ease-in-out infinite;
}

.pm-navigation-loading-mark::after {
    inset: -13px;
    opacity: .45;
    animation-delay: -.75s;
}

.pm-navigation-loading-mark span {
    color: inherit !important;
    font-size: 1.35rem;
    font-weight: 950;
    letter-spacing: -.04em;
}

.pm-navigation-loading-copy {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.pm-navigation-loading-copy strong {
    color: var(--pm-theme-text) !important;
    font-size: 1rem;
    letter-spacing: .025em;
}

.pm-navigation-loading-copy span {
    color: var(--pm-theme-muted) !important;
    font-size: .95rem;
    line-height: 1.45;
}

.pm-navigation-loading-progress {
    position: absolute;
    right: 26px;
    bottom: 18px;
    left: 116px;
    height: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--pm-theme-border) 62%, transparent);
}

.pm-navigation-loading-progress i {
    display: block;
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--pm-theme-accent), var(--pm-theme-secondary));
    animation: pm-loading-progress 1.15s ease-in-out infinite;
}

html.pm-is-navigating,
html.pm-is-navigating body {
    overflow: hidden !important;
}

@keyframes pm-loading-progress {
    0% { transform: translateX(-115%); }
    100% { transform: translateX(345%); }
}

@keyframes pm-loading-orbit {
    0%, 100% { transform: scale(.94); opacity: .28; }
    50% { transform: scale(1.04); opacity: .8; }
}

@media (max-width: 520px) {
    .pm-navigation-loading-card {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 14px;
        min-height: 124px;
        padding: 20px 20px 27px;
        border-radius: 22px;
    }

    .pm-navigation-loading-mark {
        width: 58px;
        height: 58px;
        border-radius: 18px;
    }

    .pm-navigation-loading-progress {
        right: 20px;
        bottom: 15px;
        left: 92px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pm-navigation-loading,
    .pm-navigation-loading-card {
        transition: none;
    }

    .pm-navigation-loading-mark::before,
    .pm-navigation-loading-mark::after,
    .pm-navigation-loading-progress i {
        animation-duration: 2.4s;
    }
}

html[data-pm-theme] :where(.pm-module-card, .pm-section, .pm-data-card, .pm-data-row, .pm-list-row, .wf-product-status-card, .wf-product-step, .wf-help-card, .wf-package-card, .wf-billing-card, .wf-product-callout, .wf-plan-card, .wf-operation-section, .wf-operation-metric, .wf-product-action-card, .wf-product-page-header, .wf-product-hero, .pm-dashboard-hero-copy, .pm-dashboard-hero-panel, .pm-dashboard-kpi-card, .pm-dashboard-section-card, .pm-dashboard-action) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
    box-shadow: var(--pm-theme-shadow) !important;
}

html[data-pm-theme] :where(.ga-glass-card, .ga-service-card, .ga-portfolio-card, .ga-cta-panel, .ga-faq, .ga-feature-card, .ga-usecase-card, .ga-product-highlight, .ga-disclaimer) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
    box-shadow: var(--pm-theme-shadow) !important;
}

html[data-pm-theme="light"] .ga-product-hero {
    background:
        radial-gradient(circle at 72% 24%, rgba(8, 122, 84, .14), transparent 34%),
        radial-gradient(circle at 16% 74%, rgba(11, 85, 170, .08), transparent 30%),
        linear-gradient(145deg, #f7faf8, #e5f3eb) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="light"] .ga-product-hero::after {
    background: radial-gradient(circle, rgba(8, 122, 84, .12), transparent 68%) !important;
}

html[data-pm-theme="dark"] .ga-product-hero {
    background:
        radial-gradient(circle at 72% 24%, rgba(110, 231, 183, .18), transparent 34%),
        radial-gradient(circle at 16% 74%, rgba(34, 211, 238, .09), transparent 28%),
        linear-gradient(145deg, rgba(6, 20, 15, .96), rgba(11, 31, 23, .84)) !important;
    color: var(--pm-theme-text) !important;
}

/* Legacy website inner pages were authored as permanently dark heroes. Keep
   their layout, but make the visual surface follow the selected template. */
html[data-pm-theme="light"] .hero-header {
    background-image:
        radial-gradient(circle at 72% 24%, rgba(8, 122, 84, .14), transparent 34%),
        linear-gradient(145deg, #f7faf8, #e5f3eb) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="light"] .hero-header::before {
    background: linear-gradient(135deg, rgba(247, 250, 248, .94), rgba(229, 243, 235, .82)) !important;
}

html[data-pm-theme="light"] .hero-header :where(.display-4, .lead, p, .text-white, .text-white-50) {
    color: var(--pm-theme-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-pm-theme="light"] :where(.container-fluid.bg-primary, section.bg-primary) {
    background: linear-gradient(145deg, var(--pm-theme-surface-2), var(--pm-theme-bg-2)) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="light"] :where(.container-fluid.bg-primary, section.bg-primary) :where(.text-white, .text-white-50, p, span) {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="light"] :where(.container-fluid.bg-light, .bg-light, .bg-white) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme="light"] .container-fluid.bg-light span {
    color: var(--pm-theme-muted) !important;
}

/* Product imagery needs its own visual surface. Reusing the generic content
   card made the accounting showcase look like a large plain white panel. */
html[data-pm-theme] .ga-product-showcase {
    overflow: hidden;
}

html[data-pm-theme] .ga-product-showcase-image {
    display: block;
    width: 100%;
    border: 1px solid var(--pm-theme-border-strong);
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(8, 45, 31, .16);
}

html[data-pm-theme="light"] .ga-product-showcase {
    background:
        radial-gradient(circle at 82% 8%, rgba(38, 196, 139, .18), transparent 34%),
        linear-gradient(145deg, #dcefe5, #c8e3d5) !important;
    border-color: #8bbba3 !important;
}

html[data-pm-theme="light"] .case-study-image {
    background:
        radial-gradient(circle at 82% 8%, rgba(38, 196, 139, .14), transparent 34%),
        linear-gradient(145deg, #dcefe5, #c8e3d5) !important;
}

html[data-pm-theme="light"] .ga-product-showcase-card {
    background: rgba(255, 255, 255, .72) !important;
    border-color: #9fc8b3 !important;
    box-shadow: 0 12px 28px rgba(8, 45, 31, .1) !important;
}

html[data-pm-theme="light"] .ga-product-showcase .home-metric {
    background: rgba(255, 255, 255, .72) !important;
    border-color: #9fc8b3 !important;
    box-shadow: 0 12px 28px rgba(8, 45, 31, .1) !important;
}

html[data-pm-theme="light"] .ga-product-showcase .home-metric .text-white {
    color: #14251d !important;
}

html[data-pm-theme="light"] .ga-product-showcase .home-metric .text-muted {
    color: #52695d !important;
}

html[data-pm-theme="light"] .ga-product-showcase-card :where(.text-white, strong) {
    color: #14251d !important;
}

html[data-pm-theme="light"] .ga-product-showcase-card .text-muted {
    color: #52695d !important;
}

html[data-pm-theme="dark"] .ga-product-showcase {
    background:
        radial-gradient(circle at 82% 8%, rgba(110, 231, 183, .16), transparent 34%),
        linear-gradient(145deg, #123529, #0b241b) !important;
    border-color: var(--pm-theme-border-strong) !important;
}

html[data-pm-theme="dark"] .case-study-image {
    background: linear-gradient(145deg, #123529, #0b241b) !important;
}

html[data-pm-theme="dark"] .ga-product-showcase-card {
    background: rgba(7, 27, 20, .72) !important;
    border-color: var(--pm-theme-border-strong) !important;
}

html[data-pm-theme="dark"] .ga-product-showcase .home-metric {
    background: rgba(7, 27, 20, .72) !important;
    border-color: var(--pm-theme-border-strong) !important;
}

html[data-pm-theme="dark"] .ga-product-showcase-card .text-white {
    color: #f8fafc !important;
}

html[data-pm-theme="dark"] .ga-product-showcase-card .text-muted {
    color: #cbd5e1 !important;
}

/* Website contact band intentionally stays dark in both themes so its
   white call-to-action copy never loses contrast against a pale page. */
html[data-pm-theme] .newsletter {
    background:
        radial-gradient(circle at 18% 48%, rgba(110, 231, 183, .13), transparent 34%),
        linear-gradient(135deg, #0a2f23, #0d3d2c) !important;
    border-color: rgba(159, 197, 177, .42) !important;
    color: #f8fafc !important;
}

html[data-pm-theme] .newsletter :where(h1, h2, h3, h4, h5, h6, strong, label, .text-white) {
    color: #f8fafc !important;
}

html[data-pm-theme] .newsletter :where(p, small, .text-muted, .text-white-50) {
    color: #d6e5dd !important;
    opacity: 1 !important;
}

html[data-pm-theme] .newsletter .form-control {
    background: rgba(255, 255, 255, .08) !important;
    border-color: rgba(159, 197, 177, .58) !important;
    color: #f8fafc !important;
}

html[data-pm-theme] .newsletter .form-control::placeholder {
    color: #d6e5dd !important;
    opacity: 1 !important;
}

html[data-pm-theme] .newsletter .btn.border.rounded-pill {
    background: rgba(255, 255, 255, .08) !important;
    border-color: rgba(159, 197, 177, .58) !important;
    color: #f8fafc !important;
}

html[data-pm-theme] :where(.ga-page, .ga-section, .ga-hero, .newsletter, footer, .footer) {
    background: linear-gradient(145deg, var(--pm-theme-bg), var(--pm-theme-bg-2)) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.pm-nav-menu, .pm-topbar-dropdown-menu, .dropdown-menu, .pm-notification-menu) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(a, .nav-link, .pm-topbar-link, .pm-topbar-dropdown-button, .pm-nav-group > button) {
    color: var(--pm-theme-text);
}

html[data-pm-theme] .pm-navbar .navbar-brand .pm-brand-title,
html[data-pm-theme] .pm-navbar .navbar-nav .nav-link,
html[data-pm-theme] .pm-navbar .dropdown-item {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .pm-navbar .navbar-collapse,
html[data-pm-theme] .pm-navbar .dropdown-menu {
    background: var(--pm-theme-nav) !important;
    border-color: var(--pm-theme-border) !important;
}

/* Bootstrap's navbar-dark icon stays white even when the site switches to the
   light theme. Draw the mobile menu icon with currentColor so it always keeps
   sufficient contrast against the active theme surface. */
html[data-pm-theme] .pm-navbar .navbar-toggler {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .pm-navbar .navbar-toggler-icon {
    position: relative;
    width: 20px;
    height: 14px;
    background-image: none !important;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
}

html[data-pm-theme] .pm-navbar .navbar-toggler-icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    border-top: 2px solid currentColor;
    transform: translateY(-50%);
}

html[data-pm-theme="light"] .pm-navbar .navbar-toggler {
    background: #f1f7f3 !important;
    color: #14251d !important;
}

html[data-pm-theme="dark"] .pm-navbar .navbar-toggler {
    background: #123529 !important;
    color: #f8fafc !important;
}

html[data-pm-theme] :where(input, select, textarea) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.accordion, .accordion-item, .accordion-body, .accordion-button) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .accordion .accordion-button {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .accordion .accordion-button:not(.collapsed) {
    background: var(--pm-theme-surface-2) !important;
    color: var(--pm-theme-accent) !important;
}

html[data-pm-theme="light"] .accordion-button::after {
    filter: none !important;
}

html[data-pm-theme] :where(input, textarea)::placeholder {
    color: var(--pm-theme-muted) !important;
    opacity: 1;
}

html[data-pm-theme] :where(table, td, th) {
    border-color: var(--pm-theme-border) !important;
}

html[data-pm-theme] :where(td, tbody tr, .list-item) {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(button, .btn, .pm-button, .pm-greener-action) {
    border-color: var(--pm-theme-border-strong);
}

html[data-pm-theme] :where(.btn-primary, button.primary, .pm-button-primary, .pm-greener-action, .ga-btn-primary, form button[type="submit"]) {
    background: var(--pm-theme-accent) !important;
    border-color: var(--pm-theme-accent) !important;
    color: var(--pm-theme-accent-text) !important;
}

html[data-pm-theme] :where(.btn-light, .btn-outline-primary) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.pm-button:not(.pm-button-secondary), .wf-primary, .pm-btn-primary) {
    background: var(--pm-theme-accent) !important;
    border-color: var(--pm-theme-accent) !important;
    color: var(--pm-theme-accent-text) !important;
    opacity: 1;
}

html[data-pm-theme] :where(.pm-button-secondary, .pm-link-button, .pm-inline-link, .wf-secondary, .pm-btn-secondary, .pm-btn-ghost, .pm-table-action) {
    background: var(--pm-theme-surface-2) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.pm-button, .pm-link-button, .pm-inline-link, .wf-primary, .wf-secondary, .pm-btn-primary, .pm-btn-secondary, .pm-btn-ghost, .pm-table-action):hover,
html[data-pm-theme] :where(.pm-button, .pm-link-button, .pm-inline-link, .wf-primary, .wf-secondary, .pm-btn-primary, .pm-btn-secondary, .pm-btn-ghost, .pm-table-action):focus-visible {
    background: var(--pm-theme-accent-hover) !important;
    border-color: var(--pm-theme-accent-hover) !important;
    color: var(--pm-theme-accent-text) !important;
}

html[data-pm-theme] :where(.wf-badge, .pm-greener-badge, .wf-product-status.ready, .wf-payment-badge.approved, .wf-operation-badge.ok, .wf-status.completed, .pm-status-success) {
    background: var(--pm-theme-success-bg) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-success-text) !important;
}

html[data-pm-theme] :where(.wf-alert, .wf-admin-warning, .wf-product-status.pending, .wf-payment-badge:not(.approved):not(.rejected), .wf-operation-badge.warning, .pm-alert-warning, .pm-product-callout-warning) {
    background: var(--pm-theme-warning-bg) !important;
    border-color: var(--pm-theme-warning-text) !important;
    color: var(--pm-theme-warning-text) !important;
}

html[data-pm-theme] :where(.wf-product-status.blocked, .wf-payment-badge.rejected, .wf-operation-badge.error, .wf-status.failed, .pm-alert-error, .pm-alert-danger, .pm-btn-danger) {
    background: var(--pm-theme-danger-bg) !important;
    border-color: var(--pm-theme-danger-text) !important;
    color: var(--pm-theme-danger-text) !important;
}

html[data-pm-theme] :where(.wf-table-wrap, .pm-grid-container, .pm-table-scroll, .pm-syncfusion-grid .e-grid, .pm-syncfusion-grid.e-grid) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.wf-table th, .pm-syncfusion-grid .e-gridheader, .pm-syncfusion-grid .e-headercell) {
    background: var(--pm-theme-surface-2) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.wf-table td, .pm-syncfusion-grid .e-rowcell) {
    background: var(--pm-theme-surface) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.btn-primary, button.primary, .pm-button-primary, .pm-greener-action, .ga-btn-primary, form button[type="submit"]):hover {
    background: var(--pm-theme-accent-hover) !important;
    border-color: var(--pm-theme-accent-hover) !important;
    color: var(--pm-theme-accent-text) !important;
}

.pm-theme-switch,
.pm-theme-settings {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.pm-theme-toggle,
.pm-theme-choice {
    min-height: 42px;
    padding: .55rem .85rem;
    border: 1px solid var(--pm-theme-border-strong);
    border-radius: 12px;
    background: var(--pm-theme-surface);
    color: var(--pm-theme-text);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.pm-lang-wrap .pm-theme-toggle {
    flex: 0 0 auto;
    min-width: 86px;
    height: 42px;
    min-height: 42px;
    padding: 0 .75rem;
    white-space: nowrap;
}

html[data-pm-theme="light"] .pm-navbar .pm-nav-cta {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-accent) !important;
    color: var(--pm-theme-accent) !important;
    box-shadow: none !important;
}

html[data-pm-theme="light"] .pm-navbar .pm-nav-cta:hover,
html[data-pm-theme="light"] .pm-navbar .pm-nav-cta.active {
    background: var(--pm-theme-accent) !important;
    color: var(--pm-theme-accent-text) !important;
}

html[data-pm-theme="dark"] .pm-navbar .pm-nav-cta {
    background: rgba(15, 42, 32, .72) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-accent) !important;
    box-shadow: none !important;
}

html[data-pm-theme] .pm-lang-btn:not(.active):not(:disabled) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-accent) !important;
}

html[data-pm-theme] .ga-btn-secondary {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-accent) !important;
}

html[data-pm-theme] .ga-btn-secondary:hover,
html[data-pm-theme] .ga-btn-secondary:focus-visible {
    background: var(--pm-theme-surface-2) !important;
    border-color: var(--pm-theme-accent) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] :where(.home-metric, .home-proof-note) {
    background: var(--pm-theme-surface-2) !important;
    border-color: var(--pm-theme-border) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .home-metric .text-white {
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .home-metric :where(.text-muted, small) {
    color: var(--pm-theme-muted) !important;
}

html[data-pm-theme] .home-floating-link:not(.primary) {
    background: var(--pm-theme-surface) !important;
    border-color: var(--pm-theme-border-strong) !important;
    color: var(--pm-theme-text) !important;
}

html[data-pm-theme] .home-floating-link.primary {
    background: var(--pm-theme-accent) !important;
    border-color: var(--pm-theme-accent) !important;
    color: var(--pm-theme-accent-text) !important;
}

html[data-pm-theme] .home-floating-link:hover,
html[data-pm-theme] .home-floating-link:focus-visible {
    background: var(--pm-theme-accent-hover) !important;
    border-color: var(--pm-theme-accent-hover) !important;
    color: var(--pm-theme-accent-text) !important;
}

.pm-theme-toggle:hover,
.pm-theme-choice:hover,
.pm-theme-choice.active {
    border-color: var(--pm-theme-accent);
    background: var(--pm-theme-accent);
    color: var(--pm-theme-accent-text);
}

.pm-theme-settings select {
    min-width: 190px;
    min-height: 42px;
    padding: .5rem 2rem .5rem .75rem;
    border-radius: 12px;
    font: inherit;
    font-weight: 700;
}

.pm-theme-menu-label {
    display: block;
    padding: .65rem .85rem .25rem;
    color: var(--pm-theme-muted) !important;
    font-size: .8rem;
    font-weight: 800;
}

.pm-theme-menu-options {
    display: grid;
    gap: .45rem;
    min-width: 240px;
    padding: .45rem .65rem .7rem;
}

@media (max-width: 768px) {
    .pm-theme-settings {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .pm-theme-settings select {
        width: 100%;
    }
}