/* Mosaic theme: autorska prilagodba KNT Monitora prema Mosaic dashboardu autora Cruip.
   Svijetlosiva osnova, bijele kartice i ljubičasti akcenti imaju odgovarajuću tamnu paletu.
   Završni sloj je ograničen na Mosaic i pokriva konkretne boje u izolovanim stilovima komponenti. */

/* Svijetli režim odvaja bijele radne površine od sive pozadine i koristi tamne glavne akcije. */
html:root[data-theme="mosaic"] {
    --bm-bg: #f3f4f6;
    --bm-page-bg: #f3f4f6;
    --bm-page-bg-soft: #f9fafb;
    --bm-shell-bg: #f3f4f6;
    --bm-sidebar-bg: #ffffff;
    --bm-topbar-bg: #f3f4f6;
    --bm-surface: #ffffff;
    --bm-surface-raised: #ffffff;
    --bm-surface-modal: #ffffff;
    --bm-surface-hover: #f3f4f6;
    --bm-border: #e5e7eb;
    --bm-border-subtle: #f0f1f3;
    --bm-border-strong: #d1d5db;
    --bm-text: #1f2937;
    --bm-text-primary: #1f2937;
    --bm-text-secondary: #4b5563;
    --bm-text-muted: #6b7280;
    --bm-text-soft: #6b7280;
    --bm-text-placeholder: #6b7280;
    --bm-accent: #8470ff;
    --bm-accent-2: #67c2e4;
    --bm-row-hover: #f9fafb;
    --bm-row-selected: #f1edff;
    --bm-table-hover: #f9fafb;
    --bm-sortable-hover: #6d55de;
    --bm-search-bg: #ffffff;
    --bm-search-border: #e5e7eb;
    --bm-search-icon: #6b7280;
    --bm-search-icon-active: #6d55de;
    --bm-scrollbar-thumb: #d1d5db;
    --bm-skeleton-from: #f3f4f6;
    --bm-skeleton-to: #e5e7eb;
    --bm-shadow-soft: 0 1px 2px rgba(17, 24, 39, 0.05);
    --bm-shadow-panel: 0 1px 2px rgba(17, 24, 39, 0.05);
    --bm-brand-primary: #1f2937;
    --bm-brand-secondary: #6b7280;
    --bm-brand-hover: #6d55de;
    --bm-brand-divider: #d1d5db;
    --bm-tooltip-bg: #111827;
    --bm-tooltip-color: #f3f4f6;
    --bm-tooltip-text: #f3f4f6;
    --bm-tooltip-border: transparent;
    --bm-tooltip-shadow: 0 4px 12px rgba(17, 24, 39, 0.12);
    --mosaic-link: #6d55de;
    --mosaic-primary-bg: #111827;
    --mosaic-primary-text: #f3f4f6;
    --mosaic-focus: #8470ff;
    --mosaic-success: #18794e;
    --mosaic-success-bg: #dcfce7;
    --mosaic-warning: #986015;
    --mosaic-warning-bg: #fef3c7;
    --mosaic-error: #c23948;
    --mosaic-error-bg: #ffe4e6;
    --mosaic-blue: #e8f6fc;
    --mosaic-blue-ink: #24779b;
    --mosaic-green: #dcfce7;
    --mosaic-green-ink: #18794e;
    --mosaic-violet: #f1edff;
    --mosaic-violet-ink: #6d55de;
    --mosaic-amber: #fef3c7;
    --mosaic-amber-ink: #986015;
    --mosaic-nav-active: #6d55de;
    --mosaic-nav-bg: #f1edff;
}

/* Tamni režim koristi plavosivu osnovu i svjetlije kartice, uz isti ljubičasti identitet. */
html:root[data-theme="mosaic"].dark-theme {
    --bm-bg: #111827;
    --bm-page-bg: #111827;
    --bm-page-bg-soft: #18202f;
    --bm-shell-bg: #111827;
    --bm-sidebar-bg: #1f2937;
    --bm-topbar-bg: #111827;
    --bm-surface: #1f2937;
    --bm-surface-raised: #1f2937;
    --bm-surface-modal: #1f2937;
    --bm-surface-hover: #293548;
    --bm-border: #374151;
    --bm-border-subtle: #293343;
    --bm-border-strong: #4b5563;
    --bm-text: #f3f4f6;
    --bm-text-primary: #f3f4f6;
    --bm-text-secondary: #d1d5db;
    --bm-text-muted: #9ca3af;
    --bm-text-soft: #9ca3af;
    --bm-text-placeholder: #9ca3af;
    --bm-accent: #a998ff;
    --bm-accent-2: #67c2e4;
    --bm-row-hover: #293548;
    --bm-row-selected: #34304e;
    --bm-table-hover: #293548;
    --bm-sortable-hover: #a998ff;
    --bm-search-bg: #1f2937;
    --bm-search-border: #374151;
    --bm-search-icon: #9ca3af;
    --bm-search-icon-active: #a998ff;
    --bm-scrollbar-thumb: #4b5563;
    --bm-skeleton-from: #293548;
    --bm-skeleton-to: #374151;
    --bm-brand-primary: #f3f4f6;
    --bm-brand-secondary: #9ca3af;
    --bm-brand-hover: #a998ff;
    --bm-brand-divider: #4b5563;
    --bm-tooltip-bg: #f3f4f6;
    --bm-tooltip-color: #111827;
    --bm-tooltip-text: #111827;
    --mosaic-link: #a998ff;
    --mosaic-primary-bg: #f3f4f6;
    --mosaic-primary-text: #111827;
    --mosaic-focus: #a998ff;
    --mosaic-success: #6ee7b7;
    --mosaic-success-bg: #1e4038;
    --mosaic-warning: #fcd34d;
    --mosaic-warning-bg: #453b24;
    --mosaic-error: #fda4af;
    --mosaic-error-bg: #482e39;
    --bm-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.10);
    --bm-shadow-panel: 0 1px 2px rgba(0, 0, 0, 0.10);
    --mosaic-nav-active: #a998ff;
    --mosaic-nav-bg: #34304e;
    --mosaic-blue: #223e50;
    --mosaic-blue-ink: #7dd3fc;
    --mosaic-green: #1e4038;
    --mosaic-green-ink: #6ee7b7;
    --mosaic-violet: #34304e;
    --mosaic-violet-ink: #a998ff;
    --mosaic-amber: #453b24;
    --mosaic-amber-ink: #fcd34d;
}

/* Ravne površine uklanjaju postojeće teksture, gradijente i blur samo u Mosaic temi. */
html:root[data-theme="mosaic"],
html:root[data-theme="mosaic"] :is(body, .app-shell, .workspace, .workspace-body, .content, .login-shell) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-page-bg) !important;
    background-image: none !important;
}

html:root[data-theme="mosaic"] :is(.sidebar, .topbar) {
    background: var(--bm-topbar-bg) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html:root[data-theme="mosaic"] .topbar {
    border-bottom: 1px solid var(--bm-border);
}

html:root[data-theme="mosaic"] .sidebar {
    background: var(--bm-sidebar-bg) !important;
    border-radius: 0 16px 16px 0;
    border-right-color: transparent !important;
    box-shadow: var(--bm-shadow-soft) !important;
}

html:root[data-theme="mosaic"] :is(.sidebar-wordmark, .sidebar-wordmark--compact, .topbar-page-title) {
    color: var(--bm-text-primary) !important;
    text-shadow: none;
}

html:root[data-theme="mosaic"] .sidebar-wordmark__divider {
    background: var(--bm-border-strong);
}

html:root[data-theme="mosaic"] .sidebar-link {
    color: var(--bm-text-secondary) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    font-weight: 500;
}

html:root[data-theme="mosaic"] .sidebar-link:hover {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-hover) !important;
    border-radius: 8px !important;
}

html:root[data-theme="mosaic"] .sidebar-link.active {
    color: var(--mosaic-nav-active) !important;
    background: var(--mosaic-nav-bg) !important;
    border-radius: 8px !important;
}

html:root[data-theme="mosaic"] .sidebar-link.active::before {
    background: var(--bm-accent) !important;
    box-shadow: none;
}

html:root[data-theme="mosaic"] .sidebar-link .sbi {
    color: inherit !important;
    opacity: 0.85;
}

html:root[data-theme="mosaic"] .sidebar-link :is(.sbi svg, .sbi svg *) {
    color: inherit !important;
    stroke: currentColor !important;
}

html:root[data-theme="mosaic"] :is(.topbar-brand-logo, .login-card__logo) {
    filter: none;
    opacity: 1;
}

/* Standardne kartice imaju blagu sjenu, a tekst i oznake prate paletu aktivnog režima. */
html:root[data-theme="mosaic"] :is(h1, h2, h3, h4, .surface-title, .bm-page-title, .bm-modal-title, .d2-modal-title) {
    color: var(--bm-text-primary) !important;
    font-weight: 600;
    letter-spacing: -0.02em;
}

html:root[data-theme="mosaic"] :is(.text-muted, .form-text, .bm-muted, .breadcrumb-shell, .eyebrow, .d2-eyebrow) {
    color: var(--bm-text-muted) !important;
}

html:root[data-theme="mosaic"] :is(.card, .panel, .status-panel, .upload-panel, .bm-dashboard-card,
    .bm-analytics-card, .bm-cfg-card, .bm-profile-panel, .bm-info-card, .bm-command-list-card,
    .bm-command-editor-card, .bm-command-info-card, .bm-command-sql-panel, .bm-hotelier-modal-card,
    .bm-certificate-detail-card, .wg-panel, .wg-stat-card, .wg-settings-card, .d2-panel,
    .chat-sidebar, .chat-thread, .chat-info, .chat-info__card, .auth-result-card, .login-card) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface) !important;
    border-color: var(--bm-border-subtle) !important;
    border-radius: 12px;
    box-shadow: var(--bm-shadow-panel) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html:root[data-theme="mosaic"] :is(.bm-modal, .bm-column-modal, .d2-modal, .wg-modal,
    .bm-hoteli-info-modal, .topbar-user-dropdown, .topbar-theme-menu) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-modal) !important;
    border-color: var(--bm-border) !important;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html:root[data-theme="mosaic"] :is(.bm-modal-header, .bm-modal-footer, .d2-modal-header, .d2-modal-footer,
    .wg-modal__header, .wg-modal__footer, .bm-hoteli-info-body, .bm-info-card-title,
    .login-card__header, .login-card__footer, .chat-thread__header) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-modal) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.bm-info-label, .topbar-user-name, .topbar-user-chevron,
    .topbar-user-dropdown-item, .topbar-theme-heading, .bm-profile-label) {
    color: var(--bm-text-secondary) !important;
}

/* Topbar, meniji i obrasci koriste odvojene površine i ljubičasti fokus za jasan izbor. */
html:root[data-theme="mosaic"] :is(.sidebar-toggle, .topbar-chat-button, .topbar-user, .theme-segment,
    .topbar-theme-button, .icon-button, .installer-copy-button, .search-shell, .bm-searchbar, .chat-search) {
    color: var(--bm-text-secondary) !important;
    background: var(--bm-surface) !important;
    border-color: var(--bm-border-subtle) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.topbar-user-avatar, .chat-avatar) {
    color: var(--bm-text-primary);
    background: var(--bm-row-selected) !important;
}

html:root[data-theme="mosaic"] :is(.theme-segment__button, .search-input, .bm-search-input, .topbar-theme-item) {
    color: var(--bm-text-secondary) !important;
    background: transparent !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] .theme-segment .theme-segment__button.active,
html:root[data-theme="mosaic"] .topbar-theme-item[aria-checked="true"],
html:root[data-theme="mosaic"] :is(.theme-segment__button, .topbar-theme-item, .topbar-user-dropdown-item):hover {
    color: var(--bm-text-primary) !important;
    background: var(--bm-row-hover) !important;
}

html:root[data-theme="mosaic"] :is(.form-control, .form-select, .bm-input, .login-input, .wg-input, .wg-search),
html:root[data-theme="mosaic"] input.login-input {
    color: var(--bm-text-primary) !important;
    background-color: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    border-radius: 8px;
    box-shadow: none;
}

html:root[data-theme="mosaic"] :is(input, textarea)::placeholder {
    color: var(--bm-text-placeholder) !important;
    opacity: 1;
}

html:root[data-theme="mosaic"] :is(.form-control, .form-select, .bm-input, .login-input, .wg-input):focus {
    border-color: var(--mosaic-focus) !important;
    box-shadow: 0 0 0 3px var(--bm-row-selected) !important;
}

html:root[data-theme="mosaic"] :is(.form-control, .form-select, .bm-input, .wg-input):disabled {
    color: var(--bm-text-muted) !important;
    background: var(--bm-surface) !important;
}

html:root[data-theme="mosaic"] :is(.btn-primary, .bm-btn-primary, .bm-btn-primary-modal, .wg-btn--primary, .d2-button--primary) {
    color: var(--mosaic-primary-text) !important;
    background: var(--mosaic-primary-bg) !important;
    border-color: var(--mosaic-primary-bg) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.btn-outline-secondary, .bm-btn-ghost, .bm-btn-icon-columns,
    .d2-button--ghost, .wg-btn:not(.wg-btn--primary):not(.wg-btn--danger):not(.wg-btn--danger-ghost)) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.btn-danger, .btn-outline-danger, .bm-btn-danger-modal, .wg-btn--danger, .wg-btn--danger-ghost) {
    color: var(--mosaic-error) !important;
    background: var(--mosaic-error-bg) !important;
    border-color: var(--mosaic-error) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.btn, .bm-btn-ghost, .wg-btn, .d2-button):hover:not(:disabled) {
    filter: brightness(0.96);
}

html:root[data-theme="mosaic"] :is(.bm-filter-tab, .bm-filter-chip, .bm-segment-button, .wg-tab, .chat-tab--active) {
    color: var(--bm-text-secondary) !important;
    background: var(--bm-surface) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.bm-filter-tab.active, .bm-filter-tab--active, .bm-filter-chip--active,
    .bm-segment-button.active, .wg-tab--active, .chat-conversation--active) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-row-selected) !important;
    border-color: var(--bm-border-strong) !important;
}

/* Zajednička HoteliTable i ostale tabele dobijaju neutralno zaglavlje i jasnu selekciju reda. */
html:root[data-theme="mosaic"] :is(.bm-table-modern-wrapper, .bm-table-scroll, .bm-table-x-scroll,
    .bm-analytics-table-wrap, .wg-table-wrap, .wg-companies-scroll, .wg-ports-scroll, .wg-history-scroll) {
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) {
    --bs-table-color: var(--bm-text-primary);
    --bs-table-bg: var(--bm-surface-raised);
    --bs-table-border-color: var(--bm-border);
    --bs-table-hover-bg: var(--bm-row-hover);
    --bs-table-hover-color: var(--bm-text-primary);
    color: var(--bm-text-primary) !important;
    border-color: var(--bm-border) !important;
}

html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) thead th,
html:root[data-theme="mosaic"] body .content .bm-hoteli-table .bm-table-modern-wrapper .bm-table-header thead th,
html:root[data-theme="mosaic"] body .content .bm-clients-page .bm-client-table-wrap .bm-table-header thead th {
    color: var(--bm-text-muted) !important;
    -webkit-text-fill-color: var(--bm-text-muted) !important;
    background: var(--bm-page-bg-soft) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none;
}

html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) tbody td {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border-subtle) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) tbody tr:hover td {
    background: var(--bm-row-hover) !important;
    border-color: var(--bm-border) !important;
}

html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) tbody tr.bm-row-selected td,
html:root[data-theme="mosaic"] :is(.table, .bm-table, .bm-analytics-table, .wg-table) tbody tr.selected td {
    background: var(--bm-row-selected) !important;
    border-color: var(--bm-border-strong) !important;
}

html:root[data-theme="mosaic"] .bm-table tbody tr.bm-row-offline:not(.bm-row-selected):not(:hover) td {
    color: var(--bm-text-secondary) !important;
    background: var(--bm-surface) !important;
}

/* Dashboard ima otvoreno zaglavlje i neutralne KPI kartice; akcenti ističu ikone i izbor. */
html:root[data-theme="mosaic"] .d2-hero {
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 0;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.d2-hero, .d2-kpi-card)::after,
html:root[data-theme="mosaic"] .d2-software-card::before {
    content: none !important;
}

html:root[data-theme="mosaic"] .d2-kpi-card {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface) !important;
    border-color: var(--bm-border-subtle) !important;
    border-radius: 12px;
    box-shadow: var(--bm-shadow-panel) !important;
}

html:root[data-theme="mosaic"] .d2-kpi-card:hover {
    border-color: var(--bm-accent) !important;
    box-shadow: var(--bm-shadow-panel) !important;
    transform: translateY(-1px);
}

html:root[data-theme="mosaic"] :is(.d2-kpi-icon, .d2-quick-icon) {
    color: var(--mosaic-violet-ink) !important;
    background: var(--mosaic-violet) !important;
    border-radius: 10px;
}

html:root[data-theme="mosaic"] .d2-tone-teal .d2-kpi-icon {
    color: var(--mosaic-green-ink) !important;
    background: var(--mosaic-green) !important;
}

html:root[data-theme="mosaic"] .d2-tone-blue .d2-kpi-icon {
    color: var(--mosaic-blue-ink) !important;
    background: var(--mosaic-blue) !important;
}

html:root[data-theme="mosaic"] .d2-tone-amber .d2-kpi-icon {
    color: var(--mosaic-amber-ink) !important;
    background: var(--mosaic-amber) !important;
}

html:root[data-theme="mosaic"] :is(.d2-live-status, .d2-update-progress-title, .d2-update-progress-meta,
    .d2-panel-link, .d2-nefiscal-name, .d2-recent-heading, .d2-software-caption) {
    color: var(--bm-text-secondary) !important;
}

html:root[data-theme="mosaic"] :is(.d2-live-status small, .d2-kpi-meta, .d2-kpi-label, .d2-kpi-state-label) {
    color: var(--bm-text-secondary) !important;
}

html:root[data-theme="mosaic"] :is(.d2-update-progress, .d2-certificate-alert, .d2-wg-stats div, .d2-quick-card) {
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border-subtle) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] .d2-update-progress-segment:not(.is-filled) {
    background: var(--bm-border-strong) !important;
}

html:root[data-theme="mosaic"] .d2-update-progress-segment.is-filled {
    background: #34d399 !important;
}

html:root[data-theme="mosaic"] .d2-software-card {
    --d2-software-accent: var(--mosaic-blue-ink);
    --d2-software-tint: var(--mosaic-blue);
    --d2-software-border: var(--bm-border);
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    border-radius: 12px;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] .d2-software-card.d2-tone-teal {
    --d2-software-accent: var(--mosaic-green-ink);
    --d2-software-tint: var(--mosaic-green);
}

html:root[data-theme="mosaic"] .d2-software-card.d2-tone-violet {
    --d2-software-accent: var(--mosaic-violet-ink);
    --d2-software-tint: var(--mosaic-violet);
}

html:root[data-theme="mosaic"] .d2-software-card.d2-tone-amber {
    --d2-software-accent: var(--mosaic-amber-ink);
    --d2-software-tint: var(--mosaic-amber);
}

html:root[data-theme="mosaic"] .d2-software-card .d2-software-mark {
    color: var(--d2-software-accent) !important;
    background: var(--d2-software-tint) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] .d2-software-card .d2-software-mark--logo {
    background: #ffffff !important;
    border-color: var(--bm-border) !important;
}

html:root[data-theme="mosaic"] :is(.d2-recent-row, .d2-contabo-kpi-row, .d2-wireguard-kpi-row) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface) !important;
    border-color: var(--bm-border) !important;
}

html:root[data-theme="mosaic"] :is(.d2-software-link, .d2-recent-row, .d2-quick-card):hover {
    background: var(--bm-row-hover) !important;
}

html:root[data-theme="mosaic"] :is(.d2-software-ok, .d2-terminal-status--online, .d2-kpi-state-label strong) {
    color: var(--mosaic-success) !important;
}

html:root[data-theme="mosaic"] .d2-software-ok {
    background: var(--mosaic-success-bg) !important;
}

html:root[data-theme="mosaic"] :is(.d2-software-alert, .d2-alert-badge, .d2-terminal-status--offline,
    .d2-certificate-status.is-expiring, .d2-certificate-detail-row .is-expiring) {
    color: var(--mosaic-warning) !important;
}

html:root[data-theme="mosaic"] :is(.d2-software-alert, .d2-alert-badge) {
    background: var(--mosaic-warning-bg) !important;
}

html:root[data-theme="mosaic"] :is(.d2-certificate-status.is-expired, .d2-certificate-detail-row .is-expired) {
    color: var(--mosaic-error) !important;
}

html:root[data-theme="mosaic"] .d2-nefiscal-bar span {
    background: var(--bm-accent) !important;
}

/* Ostali prikazi, dijalozi i paginacija koriste istu paletu umjesto dekorativnih gradijenata. */
html:root[data-theme="mosaic"] :is(.file-drop, .upload-result, .bm-profile-session-item,
    .bm-profile-image-modal-preview, .bm-largest-db, .bm-chart-empty, .bm-analytics-empty,
    .bm-analytics-loading, .chat-composer, .chat-conversation, .chat-user-row) {
    color: var(--bm-text-secondary) !important;
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.pagination, .bm-pagination) :is(.page-link, button) {
    color: var(--bm-text-secondary) !important;
    background: var(--bm-surface-raised) !important;
    border-color: var(--bm-border) !important;
    box-shadow: none !important;
}

html:root[data-theme="mosaic"] :is(.pagination, .bm-pagination) :is(.active .page-link, button.active) {
    color: var(--bm-text-primary) !important;
    background: var(--bm-row-selected) !important;
}

html:root[data-theme="mosaic"] :is(.bm-panel-link, .bm-info-link, .btn-link, .bm-search-result-title) {
    color: var(--mosaic-link) !important;
}

html:root[data-theme="mosaic"] :is(.topbar-theme-button, .topbar-theme-item, .sidebar-link, .d2-quick-card):focus-visible {
    outline: 2px solid var(--mosaic-focus);
    outline-offset: 2px;
}

/* Bočni meni koristi Mosaic ljubičasti izbor uz neutralne neaktivne stavke. */
html:root[data-theme="mosaic"] .sidebar-link {
    color: var(--bm-text-secondary) !important;
    background: transparent !important;
}

html:root[data-theme="mosaic"] .sidebar-link:hover {
    color: var(--bm-text-primary) !important;
    background: var(--bm-surface-hover) !important;
}

html:root[data-theme="mosaic"] .sidebar-link.active {
    color: var(--mosaic-nav-active) !important;
    background: var(--mosaic-nav-bg) !important;
}

html:root[data-theme="mosaic"] .sidebar-link.active .sbi,
html:root[data-theme="mosaic"] .sidebar-link.active .sbt,
html:root[data-theme="mosaic"] .sidebar-link.active .sbi svg,
html:root[data-theme="mosaic"] .sidebar-link.active .sbi svg * {
    color: inherit !important;
    stroke: currentColor !important;
}