/* Phone/PWA: normal page size + a compact, sticky-column scoring table. */
html {
    zoom: 1 !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

html.hris-compact-ui,
html.hris-compact-ui body {
    max-width: 100vw !important;
    overflow-x: hidden !important;
    zoom: 1 !important;
}
html.hris-compact-ui body {
    font-size: 16px;
    line-height: 1.45;
}
html.hris-compact-ui .wrapper,
html.hris-compact-ui .content-wrapper,
html.hris-compact-ui .content,
html.hris-compact-ui .container-fluid,
html.hris-compact-ui .dashboard-admin-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    overflow-x: hidden !important;
}
html.hris-compact-ui .content-wrapper,
html.hris-compact-ui .main-header,
html.hris-compact-ui .main-footer {
    margin-left: 0 !important;
}
html.hris-compact-ui .content-header,
html.hris-compact-ui .hris-m-cards,
html.hris-compact-ui .pwa-table-hint {
    display: none !important;
}

html.hris-compact-ui #dashboardRecapSummaryRow {
    display: flex !important;
    flex-wrap: wrap !important;
}
html.hris-compact-ui #dashboardRecapSummaryRow > [class*="col-"] {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
}
html.hris-compact-ui .metric-card {
    padding: 14px 12px !important;
    margin-bottom: 10px !important;
    border-radius: 16px !important;
}
html.hris-compact-ui .metric-card-icon { display: none !important; }
html.hris-compact-ui .metric-label { font-size: 12px !important; }
html.hris-compact-ui .metric-value { font-size: 1.2rem !important; }
html.hris-compact-ui .db-hero-title { font-size: 1.35rem !important; }
html.hris-compact-ui .db-hero-sub { font-size: 13px !important; }

html.hris-compact-ui .detail-scoring-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    overflow: visible !important;
}
html.hris-compact-ui .detail-scoring-toolbar__group,
html.hris-compact-ui .detail-scoring-toolbar__group--roi {
    width: 100%;
    margin-left: 0 !important;
    flex-wrap: wrap;
}
html.hris-compact-ui .dashboard-recap-tabs.detail-scoring-filter,
html.hris-compact-ui #dashboardRecapAlertTabs {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    width: 100%;
    gap: 6px;
}
html.hris-compact-ui .dashboard-recap-tabs .btn,
html.hris-compact-ui #dashboardRecapAlertTabs .btn {
    flex: 0 0 auto !important;
    min-height: 32px !important;
    font-size: 11px !important;
    padding: 6px 9px !important;
    white-space: nowrap;
}

html.hris-compact-ui .ds-dt-toolbar__left,
html.hris-compact-ui .js-pwa-detail-col,
html.hris-compact-ui .js-perf-indicator-col,
html.hris-compact-ui .detail-scoring-note {
    display: none !important;
}

html.hris-compact-ui .detail-scoring-table-wrap,
html.hris-compact-ui .detail-scoring-card .ds-dt-scroll,
html.hris-compact-ui .dashboard-card .table-responsive {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    border-radius: 14px;
    margin: 8px 0 12px;
}

html.hris-compact-ui #dashboardRecapTable,
html.hris-compact-ui .detail-scoring-card #dashboardRecapTable,
html.hris-compact-ui #dashboardAccountRelationTable,
html.hris-compact-ui .dashboard-recap-table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

html.hris-compact-ui .detail-scoring-card #dashboardRecapTable,
html.hris-compact-ui .detail-scoring-card.is-country-dim #dashboardRecapTable {
    min-width: 0 !important;
}

html.hris-compact-ui #dashboardRecapTable th,
html.hris-compact-ui #dashboardRecapTable td,
html.hris-compact-ui .detail-scoring-card #dashboardRecapTable thead th,
html.hris-compact-ui .detail-scoring-card #dashboardRecapTable tbody td,
html.hris-compact-ui #dashboardAccountRelationTable th,
html.hris-compact-ui #dashboardAccountRelationTable td,
html.hris-compact-ui .dashboard-recap-table th,
html.hris-compact-ui .dashboard-recap-table td {
    font-size: 12px !important;
    line-height: 1.3 !important;
    padding: 8px 9px !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    width: auto !important;
    height: auto !important;
}

html.hris-compact-ui .detail-scoring-card #dashboardRecapTable tbody td.ds-keputusan-cell {
    min-width: 0 !important;
    max-width: none !important;
}
html.hris-compact-ui .detail-scoring-card .ds-domain-cell,
html.hris-compact-ui .detail-scoring-card .ds-domain-badges {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 4px;
}
html.hris-compact-ui .detail-scoring-card .ds-domain-name,
html.hris-compact-ui .detail-scoring-card button.ds-domain-name-btn {
    font-size: 12px !important;
    font-weight: 700;
}
html.hris-compact-ui .detail-scoring-card .ds-tag,
html.hris-compact-ui .detail-scoring-card .ds-pill,
html.hris-compact-ui .detail-scoring-card .ds-keputusan-cell,
html.hris-compact-ui .detail-scoring-card .hris-roi-badge {
    font-size: 10px !important;
    padding: 2px 6px !important;
    line-height: 1.2 !important;
}

html.hris-compact-ui #dashboardRecapTable th:nth-child(n),
html.hris-compact-ui #dashboardRecapTable td:nth-child(n),
html.hris-compact-ui #dashboardAccountRelationTable th:nth-child(n),
html.hris-compact-ui #dashboardAccountRelationTable td:nth-child(n) {
    position: static !important;
    left: auto !important;
    max-width: none !important;
    box-shadow: none !important;
}

html.hris-compact-ui #dashboardRecapTable th:first-child,
html.hris-compact-ui #dashboardRecapTable td:first-child,
html.hris-compact-ui #dashboardAccountRelationTable th:first-child,
html.hris-compact-ui #dashboardAccountRelationTable td:first-child {
    display: table-cell !important;
    position: sticky !important;
    left: 0 !important;
    z-index: 4;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 46px !important;
    text-align: center !important;
    background: #fff !important;
    box-shadow: 8px 0 10px -8px rgba(15, 23, 42, 0.4);
}

html.hris-compact-ui #dashboardRecapTable thead th:first-child,
html.hris-compact-ui #dashboardAccountRelationTable thead th:first-child {
    z-index: 5;
    background: #eef2ff !important;
}

html[data-theme="dark"].hris-compact-ui #dashboardRecapTable th:first-child,
html[data-theme="dark"].hris-compact-ui #dashboardRecapTable td:first-child,
html[data-theme="dark"].hris-compact-ui #dashboardAccountRelationTable th:first-child,
html[data-theme="dark"].hris-compact-ui #dashboardAccountRelationTable td:first-child {
    background: #1e293b !important;
}
html[data-theme="dark"].hris-compact-ui #dashboardRecapTable thead th:first-child,
html[data-theme="dark"].hris-compact-ui #dashboardAccountRelationTable thead th:first-child {
    background: #0f172a !important;
}

@media (max-width: 991.98px) {
    .content-wrapper,
    .main-header,
    .main-footer {
        margin-left: 0 !important;
    }
}

/* ── Detail Scoring modal: phone + PWA ── */
html.hris-compact-ui .score-detail-modal {
    padding: 0 !important;
    align-items: stretch !important;
    justify-content: stretch !important;
}
html.hris-compact-ui .score-detail-modal__dialog {
    max-width: 100% !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    border-radius: 0 !important;
    min-width: 0 !important;
}
html.hris-compact-ui .score-detail-modal__header {
    padding: 10px 12px !important;
    gap: 8px !important;
}
html.hris-compact-ui .score-detail-modal__icon {
    width: 34px !important;
    height: 34px !important;
    font-size: 1rem !important;
}
html.hris-compact-ui .score-detail-modal__title {
    font-size: 14px !important;
    line-height: 1.3 !important;
    word-break: break-word;
}
html.hris-compact-ui .score-detail-modal__close {
    padding: 7px 10px !important;
    font-size: 11px !important;
}
html.hris-compact-ui .score-detail-modal__close span {
    display: none;
}
html.hris-compact-ui .score-detail-modal__body {
    padding: 10px 10px 78px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
}
html.hris-compact-ui .score-detail-modal__body .scx-modal-nav {
    padding: 10px 10px 12px !important;
    margin-bottom: 12px !important;
    border-radius: 14px !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-modal-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-modal-tab {
    padding: 7px 10px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-card {
    padding: 12px !important;
    border-radius: 14px !important;
    min-width: 0 !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-grid,
html.hris-compact-ui .score-detail-modal__body .scx-kpi-grid,
html.hris-compact-ui .score-detail-modal__body .scx-summary-grid,
html.hris-compact-ui .score-detail-modal__body .scx-insight-grid,
html.hris-compact-ui .score-detail-modal__body .scx-history-layout,
html.hris-compact-ui .score-detail-modal__body .scx-pane-shell,
html.hris-compact-ui .score-detail-modal__body .scx-pane-mini-grid,
html.hris-compact-ui .score-detail-modal__body .scx-pane-metrics,
html.hris-compact-ui .score-detail-modal__body .scx-focus-stats,
html.hris-compact-ui .score-detail-modal__body .scx-metric-summary-grid,
html.hris-compact-ui .score-detail-modal__body .scx-metric-summary-grid.scx-metric-summary-grid--4col,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-insights,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-insights,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-source-grid,
html.hris-compact-ui .score-detail-modal__body .scx-mini-compare-grid,
html.hris-compact-ui .score-detail-modal .scx-grid {
    grid-template-columns: 1fr !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-metric-summary-grid.scx-metric-summary-grid--4col {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-hero,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-head,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-head,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-toolbar,
html.hris-compact-ui .score-detail-modal__body .scx-focus-card-head,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-detail-summary,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-overview-head,
html.hris-compact-ui .score-detail-modal__body .sd-det-meta {
    flex-direction: column !important;
    align-items: flex-start !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-analytic-lead,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-lead,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-shell .scx-invalid-lead {
    max-width: 100% !important;
}

/* Filters / search: stack, full width, no overflow */
html.hris-compact-ui .score-detail-modal__body .scx-analytic-toolbar,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-toolbar,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-toolbar,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-daily-controls,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-hourly-toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 10px !important;
    min-width: 0 !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-range-filters,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-range-filters,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-toolbar .scx-range-filters {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-range-field,
html.hris-compact-ui .score-detail-modal__body .scx-campaign-search-field,
html.hris-compact-ui .score-detail-modal__body .scx-campaign-active-field {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-campaign-search-field,
html.hris-compact-ui .score-detail-modal__body .scx-campaign-active-field,
html.hris-compact-ui .score-detail-modal__body .scx-invalid-toolbar .scx-range-field:last-child {
    grid-column: 1 / -1;
}
html.hris-compact-ui .score-detail-modal__body .scx-campaign-search-wrap .form-control,
html.hris-compact-ui .score-detail-modal__body .scx-range-field .form-control {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: 16px !important; /* avoid iOS zoom */
}
html.hris-compact-ui .score-detail-modal__body .scx-analytic-compare-bar,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-compare-bar__chips,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-hourly-day-tabs,
html.hris-compact-ui .score-detail-modal__body .scx-analytic-hourly-view-tabs,
html.hris-compact-ui .score-detail-modal__body .dashboard-recap-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    gap: 6px !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-analytic-toggle-row {
    display: flex !important;
    align-items: flex-start !important;
    white-space: normal !important;
    line-height: 1.35;
}

/* DataTables toolbar + search */
html.hris-compact-ui .score-detail-modal .ds-dt-toolbar,
html.hris-compact-ui #scxCampaignTableWrap .ds-dt-toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
}
html.hris-compact-ui .score-detail-modal .ds-dt-toolbar__center,
html.hris-compact-ui .score-detail-modal .ds-dt-toolbar__right,
html.hris-compact-ui #scxCampaignTableWrap .ds-dt-toolbar__center,
html.hris-compact-ui #scxCampaignTableWrap .ds-dt-toolbar__right {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    margin-left: 0 !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
}
html.hris-compact-ui .score-detail-modal .scx-campaign-perf-filter-inline,
html.hris-compact-ui #scxCampaignTableWrap .scx-campaign-perf-filter-inline {
    width: 100% !important;
    flex-wrap: wrap !important;
}
html.hris-compact-ui .score-detail-modal .dataTables_length,
html.hris-compact-ui .score-detail-modal .dataTables_filter,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_length,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_filter {
    float: none !important;
    width: 100% !important;
    text-align: left !important;
    margin: 0 !important;
}
html.hris-compact-ui .score-detail-modal .dataTables_filter label,
html.hris-compact-ui .score-detail-modal .dataTables_length label,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_filter label,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_length label {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-align: left !important;
}
html.hris-compact-ui .score-detail-modal .dataTables_filter input,
html.hris-compact-ui .score-detail-modal .dataTables_length select,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_filter input,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_length select {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    height: 38px !important;
    font-size: 16px !important;
}
html.hris-compact-ui .score-detail-modal .dataTables_info,
html.hris-compact-ui .score-detail-modal .dataTables_paginate,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_info,
html.hris-compact-ui #scxCampaignTableWrap .dataTables_paginate {
    float: none !important;
    width: 100% !important;
    text-align: left !important;
    padding-top: 8px !important;
    overflow-x: auto;
    white-space: nowrap;
}

/* Tables: scroll sideways, never squeeze/overlap cells */
html.hris-compact-ui .score-detail-modal .table-responsive,
html.hris-compact-ui .score-detail-modal .scx-table-scroll,
html.hris-compact-ui .score-detail-modal .scx-data-table-wrap,
html.hris-compact-ui .score-detail-modal .scx-analytic-hourly-scroll,
html.hris-compact-ui .score-detail-modal .dataTables_wrapper,
html.hris-compact-ui .score-detail-modal .dataTables_scroll,
html.hris-compact-ui .score-detail-modal .dataTables_scrollBody,
html.hris-compact-ui #scxCampaignTableWrap,
html.hris-compact-ui #sdCampaignTable,
html.hris-compact-ui #sdCampaignLogTable,
html.hris-compact-ui #scxAnalyticDailyWrap,
html.hris-compact-ui #scxAnalyticHourlyWrap,
html.hris-compact-ui #scxMonitoringTableWrap,
html.hris-compact-ui #scxMonitoringDailyWrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
}
html.hris-compact-ui .score-detail-modal .scx-table-scroll .table-responsive {
    overflow: visible !important;
    max-width: none !important;
}
html.hris-compact-ui .score-detail-modal table,
html.hris-compact-ui .score-detail-modal .table,
html.hris-compact-ui .score-detail-modal .scx-data-table,
html.hris-compact-ui .score-detail-modal .dataTables_wrapper .dataTable,
html.hris-compact-ui #scxCampaignTableWrap table.dataTable,
html.hris-compact-ui #scxCampaignDataTable,
html.hris-compact-ui #sdCampaignTable table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
}
html.hris-compact-ui .score-detail-modal th,
html.hris-compact-ui .score-detail-modal td,
html.hris-compact-ui .score-detail-modal .scx-data-table thead th,
html.hris-compact-ui .score-detail-modal .scx-data-table tbody td,
html.hris-compact-ui #sdCampaignTable th,
html.hris-compact-ui #sdCampaignTable td {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    vertical-align: middle !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
    padding: 7px 8px !important;
    box-sizing: border-box !important;
}
html.hris-compact-ui .score-detail-modal .scx-campaign-name-cell,
html.hris-compact-ui .score-detail-modal .scx-campaign-name-text,
html.hris-compact-ui .score-detail-modal .scx-campaign-account-cell {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    word-break: normal !important;
}
html.hris-compact-ui .score-detail-modal .sd-camp-actions {
    flex-wrap: nowrap !important;
}
html.hris-compact-ui .score-detail-modal .scx-invalid-metric-list li {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2px !important;
}
html.hris-compact-ui .score-detail-modal .scx-invalid-compare-row {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    gap: 4px !important;
}
html.hris-compact-ui .score-detail-modal .scx-chart-box,
html.hris-compact-ui .score-detail-modal .scx-analytic-chart-box {
    height: 200px !important;
}
html.hris-compact-ui .score-detail-modal .scx-monitoring-chart-box {
    height: 180px !important;
}
html.hris-compact-ui .score-detail-modal .sd-det-body > div[style*="height:320px"] {
    height: 210px !important;
}
html.hris-compact-ui .score-detail-modal .scx-analytic-day-grid,
html.hris-compact-ui .score-detail-modal .scx-monitoring-country-grid {
    grid-template-columns: 1fr !important;
}
html.hris-compact-ui .score-detail-modal .scx-analytic-detail-body {
    padding: 10px !important;
}
html.hris-compact-ui .score-detail-modal .scx-analytic-detail-summary__hint {
    align-self: flex-start;
}
html.hris-compact-ui .sd-campaign-log-modal {
    padding: 0 !important;
}
html.hris-compact-ui .sd-campaign-log-modal__dialog {
    width: 100% !important;
    max-height: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
}
html.hris-compact-ui .sd-campaign-log-modal__body .table {
    min-width: 720px !important;
}
html.hris-compact-ui .score-detail-modal .scx-pane-title {
    font-size: 16px !important;
}
html.hris-compact-ui .score-detail-modal .sd-wrap,
html.hris-compact-ui .score-detail-modal .sd-card,
html.hris-compact-ui .score-detail-modal .sd-plat {
    min-width: 0 !important;
    width: 100% !important;
    flex: 1 1 100% !important;
}
html.hris-compact-ui .score-detail-modal .sd-grid {
    grid-template-columns: 1fr !important;
}
html.hris-compact-ui .score-detail-modal .sd-kv td {
    white-space: normal !important;
}
html.hris-compact-ui .score-detail-modal__body #scoreDetailDecisionBody .decision-detail-modal-content {
    overflow-x: auto !important;
    max-width: 100% !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-country-search {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    width: 100% !important;
    font-size: 16px !important;
}
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-country-filter-head,
html.hris-compact-ui .score-detail-modal__body .scx-monitoring-country-filter-actions {
    width: 100% !important;
}

html[data-theme="dark"].hris-compact-ui .score-detail-modal th,
html[data-theme="dark"].hris-compact-ui .score-detail-modal td {
    background-clip: padding-box;
}

/* User-controlled zoom: content only, never the page/html. */
html.hris-compact-ui {
    --hris-user-zoom: 1;
}
html.hris-compact-ui .dashboard-admin-content,
html.hris-compact-ui .score-detail-modal__body {
    zoom: var(--hris-user-zoom, 1);
}
html.hris-compact-ui.hris-zoom-transform .dashboard-admin-content,
html.hris-compact-ui.hris-zoom-transform .score-detail-modal__body {
    zoom: 1 !important;
    transform: scale(var(--hris-user-zoom, 1));
    transform-origin: top left;
    width: calc(100% / var(--hris-user-zoom, 1));
}
html.hris-compact-ui.is-user-zoomed-in .content-wrapper,
html.hris-compact-ui.is-user-zoomed-in .content,
html.hris-compact-ui.is-user-zoomed-in .container-fluid,
html.hris-compact-ui.is-user-zoomed-in .dashboard-admin-content,
html.hris-compact-ui.is-user-zoomed-in .score-detail-modal__body {
    overflow-x: auto !important;
}
html.hris-compact-ui .dashboard-admin-content {
    padding-bottom: 72px;
}
.hris-zoom-control {
    display: none;
    position: fixed;
    right: max(12px, env(safe-area-inset-right, 0px));
    bottom: max(14px, env(safe-area-inset-bottom, 0px));
    z-index: 40000;
    align-items: center;
    gap: 2px;
    padding: 4px;
    border-radius: 999px;
    border: 1px solid rgba(99, 102, 241, 0.22);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    zoom: 1 !important;
    transform: none !important;
}
html.hris-compact-ui .hris-zoom-control.is-on {
    display: flex;
}
.hris-zoom-control button {
    appearance: none;
    border: 0;
    background: transparent;
    color: #312e81;
    min-width: 38px;
    height: 36px;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
    padding: 0 8px;
    cursor: pointer;
}
.hris-zoom-control button[data-zoom-reset] {
    min-width: 52px;
    font-size: 12px;
    letter-spacing: 0.02em;
    color: #4f46e5;
}
.hris-zoom-control button:active {
    background: rgba(99, 102, 241, 0.12);
}
.hris-zoom-control button:disabled {
    opacity: 0.35;
    cursor: default;
}
html[data-theme="dark"] .hris-zoom-control {
    background: rgba(15, 23, 42, 0.92);
    border-color: rgba(148, 163, 184, 0.28);
}
html[data-theme="dark"] .hris-zoom-control button {
    color: #e2e8f0;
}
html[data-theme="dark"] .hris-zoom-control button[data-zoom-reset] {
    color: #c7d2fe;
}