@media (max-width: 1199.98px) {

}

@media (max-width: 991.98px) {

    .left-sidebar {
        position: fixed;
        z-index: 11 !important;
        top: 136px;
        height: 100%;
        left: -250px;
    }

    body.open .left-sidebar {
        left: 0;
        padding: 24px;
        width: 245px;
    }

    .sidebar-overlay {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.4);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease;
        z-index: 10;
    }

    body.open .sidebar-overlay {
        opacity: 1;
        visibility: visible;
    }

    .content-area {
        min-width: 100%;
    }

    /* Page Heading */
    .page-heading .welcome-text p {
        font-size: 14px;
    }

    /* Modules */
    .page-modules .module-item .module-title {
        font-size: 16px;
    }
    .page-modules .module-item .module-box{
        padding: 26px;
    }
}

@media (max-width: 767.98px) {

    /* Header */
    .header .logo {
        width: 120px;
        padding-right: 16px;
    }

    .header .logo img {
        max-width: 90px;
    }
    .header .logo small{
        font-size: 10px;
        line-height: normal;
    }

    .header .dropdown-menu.notifications {
        width: 300px;
        overflow-y: auto;
    }

    .header .dropdown-menu.notifications a {
        width: 276px;
    }

    .page-breadcrumbs {
        top: 61px;
    }

    .page-breadcrumbs .back-btn {
        min-width: auto;
        padding-right: 16px;
    }
    .page-name{
        font-size: 16px;
    }

    /* Modules */
    .left-sidebar {
        top: 104px;
    }
    body.open .left-sidebar {
        width: 280px;
    }
    .left-sidebar .nav-sidebar{
        width: 100%;
    }

    .login-container > .row{
        height: 100vh;
    }

    /* table list and mobile grid view */
    .table-row-grid tr {
        display: flex;
        flex-direction: column;
        margin-bottom: 5px;
        padding: 16px 0;
    }

    .table-row-grid tr td {
        width: 100%;
        text-align: center;
    }

    .event-list tr td img {
        width: 330px !important;
    }
}
/* Responsive shell hardening: support unified mobile sidebar state */
@media (max-width: 991.98px) {
    body.sidebar-open .left-sidebar,
    body.open .left-sidebar {
        left: 0;
        padding: 24px;
        width: 245px;
    }

    body.sidebar-open .sidebar-overlay,
    body.open .sidebar-overlay {
        opacity: 1;
        visibility: visible;
    }
}

@media (max-width: 767.98px) {
    body.sidebar-open .left-sidebar,
    body.open .left-sidebar {
        width: min(280px, calc(100vw - 56px));
        max-width: calc(100vw - 56px);
    }

    .header .container-fluid,
    .page-breadcrumbs .container-fluid {
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }

    .header .navbar-right {
        min-width: 0;
    }

    .header .navbar-right > li {
        flex-shrink: 0;
    }
}

/* Phase 3: shared responsive shell hardening */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

body.no-scroll {
    overflow: hidden;
    touch-action: none;
}

.content-wrapper,
.content-area,
.container,
.container-fluid {
    min-width: 0;
}

.content-wrapper,
.content-area {
    overflow-x: clip;
}

.card,
.modal-content,
.dropdown-menu,
.alert,
.list-group-item {
    min-width: 0;
}

.text-truncate,
.nav-title,
.card-title,
.page-name {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .left-sidebar {
        box-shadow: 0 1rem 2rem rgba(15, 23, 42, .18);
        max-width: calc(100vw - 48px);
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .content-wrapper.content-wrapper-radius {
        border-radius: 0;
    }

    .content-wrapper.content-wrapper-radius .content-area {
        border-radius: 0;
    }

    .content-area {
        width: 100%;
        flex: 1 1 auto;
    }

    .sidebar-overlay {
        backdrop-filter: blur(1px);
    }

    .page-breadcrumbs .right-breadcrumb {
        min-width: 0;
    }

    .page-breadcrumbs .page-action {
        min-width: 0;
    }

    .page-breadcrumbs .page-action > li {
        flex: 0 0 auto;
    }
}

@media (max-width: 767.98px) {
    body:not(.chat-page-body) .content-wrapper {
        min-height: calc(100dvh - 112px);
    }

    body:not(.chat-page-body) .content-area {
        padding-top: 1rem !important;
        padding-bottom: 1.25rem !important;
    }

    .page-breadcrumbs {
        font-size: 16px;
    }

    .page-breadcrumbs .d-flex.align-items-stretch.justify-content-between {
        min-width: 0;
    }

    .page-breadcrumbs .right-breadcrumb {
        gap: .5rem;
    }

    .page-breadcrumbs .page-name {
        max-width: 48vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .page-breadcrumbs .page-action {
        gap: .5rem !important;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 2px;
    }

    .page-breadcrumbs .page-action::-webkit-scrollbar {
        display: none;
    }

    .page-breadcrumbs .page-action .btn,
    .page-breadcrumbs .page-action a {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
    }

    .page-breadcrumbs .page-action .btn-sm {
        --bs-btn-padding-x: .75rem;
        --bs-btn-padding-y: .35rem;
    }

    .card-body,
    .modal-body {
        min-width: 0;
    }

    .card .card-header,
    .card .card-body,
    .card .card-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .row.g-4,
    .row.gy-4 {
        --bs-gutter-y: 1rem;
    }

    .row.g-3,
    .row.gy-3 {
        --bs-gutter-y: .85rem;
    }

    .form-control,
    .form-select,
    .input-group,
    .btn {
        max-width: 100%;
    }

    .input-group {
        flex-wrap: nowrap;
    }

    .modal-dialog:not(.modal-sm) {
        margin: .75rem;
    }

    .modal-dialog-scrollable {
        max-height: calc(100dvh - 1.5rem);
    }

    .modal-dialog-scrollable .modal-content {
        max-height: calc(100dvh - 1.5rem);
    }

    .dropdown-menu {
        max-width: calc(100vw - 1.5rem);
    }

    .list-group-item,
    .dropdown-item,
    .dropdown-item-text {
        white-space: normal;
    }

    .table-responsive {
        border-radius: .85rem;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive > .table,
    .table-responsive > table {
        margin-bottom: 0;
    }
}

@media (max-width: 575.98px) {
    .header .container-fluid,
    .page-breadcrumbs .container-fluid,
    .content-area .container-fluid {
        padding-left: .85rem !important;
        padding-right: .85rem !important;
    }

    .page-breadcrumbs .back-btn {
        padding-right: .75rem;
    }

    .page-breadcrumbs .page-name {
        max-width: 42vw;
    }

    .btn-group,
    .btn-toolbar {
        flex-wrap: wrap;
    }

    .modal-footer {
        gap: .5rem;
    }

    .modal-footer > * {
        margin: 0;
    }
}

/* Phase 4: screen-level mobile polish for dashboard, admin, work, storage, org and setup screens */
@media (max-width: 1199.98px) {
    .row-deck > [class*="col-"] {
        margin-bottom: 0;
    }

    .cockpit-hero .row,
    .summary-card .row,
    .perm-hero-card .row,
    .setup-mode-root .row {
        min-width: 0;
    }

    .org-map-workspace,
    .org-map-viewport,
    .org-map-stage {
        min-width: 0;
    }
}

@media (max-width: 991.98px) {
    /* Large dashboard / feature hero cards */
    .cockpit-hero .card-body,
    .card.rounded-4.border-0.shadow-sm.overflow-hidden .card-body,
    .summary-card .card-body,
    .perm-hero-card .card-body,
    .setup-mode-root .card-body {
        padding: 1.25rem !important;
    }

    .cockpit-hero h1,
    .cockpit-hero .fw-semibold,
    .summary-panel h1,
    .summary-panel h2,
    .summary-panel .mb-2,
    .perm-hero-card h1,
    .perm-hero-card h2 {
        overflow-wrap: anywhere;
    }

    .hero-note-box,
    .storage-summary-card,
    .summary-tile,
    .quick-card,
    .quick-link-card,
    .action-card,
    .metric-card,
    .kpi-card,
    .perm-kpi-card,
    .mini-stat,
    .onboarding-status-card,
    .onboarding-step-card,
    .onboarding-choice-card,
    .onboarding-pack-card,
    .onboarding-module-card,
    .onboarding-sector-card {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .users-tab-nav,
    .nav.nav-underline,
    .perm-top,
    .perm-module-actions,
    .org-current-actions,
    .org-map-toolbar,
    .onboarding-page-nav-links,
    .onboarding-secondary-links,
    .onboarding-cta-bar {
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: .2rem;
    }

    .users-tab-nav::-webkit-scrollbar,
    .nav.nav-underline::-webkit-scrollbar,
    .perm-top::-webkit-scrollbar,
    .perm-module-actions::-webkit-scrollbar,
    .org-current-actions::-webkit-scrollbar,
    .org-map-toolbar::-webkit-scrollbar,
    .onboarding-page-nav-links::-webkit-scrollbar,
    .onboarding-secondary-links::-webkit-scrollbar,
    .onboarding-cta-bar::-webkit-scrollbar {
        display: none;
    }

    .users-tab-nav .nav-item,
    .nav.nav-underline .nav-item,
    .perm-module-actions > *,
    .org-current-actions > *,
    .org-map-toolbar > *,
    .onboarding-page-nav-links > *,
    .onboarding-secondary-links > *,
    .onboarding-cta-bar > * {
        flex: 0 0 auto;
    }

    .summary-table,
    .simple-table,
    .table-summary,
    .expense-table-wrap,
    .storage-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 1rem;
    }

    .summary-table table,
    .simple-table table,
    .table-summary table,
    .expense-table-wrap table,
    .storage-table-wrap table {
        min-width: 720px;
    }

    .actions-cell {
        white-space: nowrap;
    }

    .actions-cell .btn,
    .actions-cell a,
    .actions-cell button {
        margin-bottom: .25rem;
    }
}

@media (max-width: 767.98px) {
    /* Page-level density */
    .content-area .row.g-4,
    .content-area .row.g-3 {
        --bs-gutter-x: .85rem;
    }

    .cockpit-hero .card-body,
    .card.rounded-4.border-0.shadow-sm.overflow-hidden .card-body,
    .summary-card .card-body,
    .perm-hero-card .card-body,
    .setup-mode-root .card-body,
    .card.p-3.p-lg-4.rounded-4 {
        padding: 1rem !important;
    }

    .cockpit-hero .display-5,
    .cockpit-hero h1,
    .summary-panel h1,
    .summary-panel h2,
    .perm-hero-card h1,
    .perm-hero-card h2 {
        font-size: clamp(1.35rem, 7vw, 1.85rem) !important;
        line-height: 1.15;
    }

    .hero-chip,
    .signal-badge,
    .status-pill,
    .expense-pill,
    .storage-scope-pill,
    .storage-soft-badge,
    .org-map-chip,
    .choice-badge,
    .journey-chip,
    .onboarding-pack-chip,
    .badge.rounded-pill {
        max-width: 100%;
        white-space: normal;
        text-align: left;
    }

    .kpi-card,
    .metric-card,
    .perm-kpi-card,
    .summary-tile,
    .mini-stat,
    .storage-summary-card,
    .quick-card,
    .quick-link-card,
    .action-card {
        padding: 1rem !important;
    }

    .kpi-value,
    .storage-kpi-value,
    .metric-card .fw-bold,
    .summary-tile .value,
    .mini-stat .value,
    .fs-3.fw-bold {
        font-size: clamp(1.35rem, 8vw, 2rem) !important;
        line-height: 1.15;
    }

    .quick-list,
    .activity-list,
    .comment-list,
    .attachment-list,
    .storage-access-list,
    .perm-role-list,
    .perm-module-list {
        max-width: 100%;
    }

    .quick-item,
    .activity-item,
    .comment-item,
    .attachment-item,
    .manage-item,
    .perm-role-item,
    .perm-item,
    .soft-list-item,
    .approval-row {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .storage-file-cell,
    .receipt-box,
    .file-pill,
    .attachment-dropzone,
    .storage-empty-state,
    .empty-state-box,
    .empty-soft {
        max-width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .storage-file-cell img,
    .receipt-box img,
    .expense-preview-card img {
        max-width: 100%;
        height: auto;
    }

    .users-tab-nav,
    .nav.nav-underline {
        gap: .85rem !important;
        margin-bottom: 1rem !important;
    }

    .users-tab-nav .nav-link,
    .nav.nav-underline .nav-link {
        min-width: max-content;
        padding-left: .25rem;
        padding-right: .25rem;
    }

    .perm-grid,
    .onboarding-checklist-grid,
    .onboarding-choice-grid,
    .onboarding-module-grid,
    .onboarding-pack-grid,
    .onboarding-sector-grid,
    .onboarding-status-grid,
    .org-map-info-grid,
    .org-map-stats,
    .org-map-grid {
        display: grid;
        grid-template-columns: 1fr !important;
        gap: .85rem !important;
    }

    .perm-module-header,
    .onboarding-choice-header,
    .onboarding-step-header,
    .d-flex.flex-wrap.align-items-start.justify-content-between,
    .d-flex.justify-content-between.align-items-center {
        align-items: flex-start !important;
        gap: .75rem !important;
    }

    .perm-module-header > *,
    .onboarding-choice-header > *,
    .onboarding-step-header > *,
    .d-flex.flex-wrap.align-items-start.justify-content-between > *,
    .d-flex.justify-content-between.align-items-center > * {
        min-width: 0;
    }

    .perm-code,
    .project-code,
    .task-no,
    .desc-muted,
    .reason-clamp {
        overflow-wrap: anywhere;
        white-space: normal;
    }

    /* Organization map / tree screens */
    .org-tree-card,
    .org-node,
    .org-map-node,
    .org-map-panel,
    .org-map-guard-block {
        min-width: 0;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .org-node-head,
    .org-map-toolbar,
    .org-map-toolbar-left,
    .org-map-toolbar-actions,
    .org-map-links {
        flex-wrap: wrap !important;
        min-width: 0;
    }

    .org-map-workspace,
    .org-map-viewport {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .org-map-stage {
        min-width: 640px;
    }

    .org-map-modal .modal-dialog,
    .nested-modal-top .modal-dialog {
        margin: .5rem;
        max-width: calc(100vw - 1rem);
    }

    /* Setup / onboarding screens */
    .summary-panel,
    .onboarding-decision-shell,
    .onboarding-selection-summary,
    .onboarding-impact-confirmation,
    .onboarding-warning-box,
    .onboarding-sector-preview,
    .onboarding-pack-summary {
        padding: 1rem !important;
        min-width: 0;
    }

    .onboarding-progress-strip {
        overflow-x: auto;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .onboarding-progress-strip::-webkit-scrollbar {
        display: none;
    }

    .onboarding-progress-step {
        min-width: 160px;
        flex: 0 0 auto;
    }

    .onboarding-scale-row,
    .onboarding-switch-row,
    .onboarding-cta-card,
    .meta-item {
        align-items: flex-start !important;
        min-width: 0;
    }

    .onboarding-cta-bar .btn,
    .onboarding-page-nav-links .btn,
    .onboarding-secondary-links .btn,
    .perm-module-actions .btn,
    .org-current-actions .btn {
        white-space: nowrap;
    }

    /* Mobile modal/form behavior for dense admin screens */
    .modal-header,
    .modal-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .modal-title {
        overflow-wrap: anywhere;
    }

    .modal-footer {
        align-items: stretch;
    }

    .modal-footer .btn {
        flex: 1 1 auto;
        min-height: 42px;
    }

    .form-check,
    .form-switch {
        min-width: 0;
    }

    .form-check-label {
        overflow-wrap: anywhere;
    }
}

@media (max-width: 575.98px) {
    .page-heading,
    .cockpit-hero,
    .summary-panel,
    .perm-hero-card,
    .setup-mode-root {
        border-radius: 1rem !important;
    }

    .card.rounded-4,
    .modal-content.rounded-4,
    .quick-card,
    .quick-link-card,
    .action-card,
    .kpi-card,
    .metric-card,
    .perm-kpi-card,
    .storage-summary-card,
    .summary-tile {
        border-radius: 1rem !important;
    }

    .page-breadcrumbs .page-action .btn,
    .page-breadcrumbs .page-action a,
    .onboarding-cta-bar .btn,
    .perm-module-actions .btn,
    .org-current-actions .btn {
        min-height: 40px;
    }

    .modal-footer {
        flex-direction: column;
    }

    .modal-footer .btn {
        width: 100%;
    }

    .summary-table table,
    .simple-table table,
    .table-summary table,
    .expense-table-wrap table,
    .storage-table-wrap table {
        min-width: 640px;
    }
}

/* Phase 15: project-wide responsive and dark-mode hardening */
:root {
    --meb-touch-target: 40px;
    --meb-card-radius: 1rem;
}

body.no-scroll {
    overflow: hidden;
}

/* Keep page breadcrumb title and actions vertically centered on every page. */
.page-breadcrumbs > .container-fluid > .d-flex,
.page-breadcrumbs .right-breadcrumb,
.page-breadcrumbs .back-btn,
.page-breadcrumbs .page-action {
    min-height: 44px;
    align-items: center !important;
}

.page-breadcrumbs .page-action {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .5rem !important;
}

.page-breadcrumbs .page-action > li {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto;
    margin: 0 !important;
}

.page-breadcrumbs .page-action a,
.page-breadcrumbs .page-action button {
    min-width: var(--meb-touch-target);
    min-height: var(--meb-touch-target);
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px;
}

.page-breadcrumbs .page-name {
    display: flex;
    align-items: center;
    min-height: var(--meb-touch-target);
    line-height: 1.2;
}

@media (max-width: 767.98px) {
    .page-breadcrumbs {
        padding-top: .55rem !important;
        padding-bottom: .55rem !important;
    }

    .page-breadcrumbs .right-breadcrumb {
        overflow: visible;
    }

    .page-breadcrumbs .page-name {
        flex: 1 1 auto;
        max-width: none !important;
    }

    .page-breadcrumbs .page-action {
        flex: 0 0 auto;
        overflow: visible !important;
        padding-bottom: 0 !important;
    }
}

/* Mobile sidebar must scroll inside the drawer when menu grows. */
@media (max-width: 991.98px) {
    .left-sidebar {
        height: calc(100dvh - 136px) !important;
        max-height: calc(100dvh - 136px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px)) !important;
    }

    .left-sidebar .nav-sidebar,
    .left-sidebar .nav-sidebar > ul {
        min-height: 0;
    }
}

@media (max-width: 767.98px) {
    .left-sidebar {
        height: calc(100dvh - 104px) !important;
        max-height: calc(100dvh - 104px) !important;
    }
}

/* Tenant home: use a predictable module grid instead of stretched flex rows. */
.page-heading .page-welcome {
    border: 1px solid var(--bs-border-color);
    border-radius: 1.35rem;
    background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), .08), rgba(var(--bs-body-bg-rgb), .92));
    box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .05);
    padding: clamp(1rem, 2.6vw, 1.5rem);
    gap: 1rem;
    margin-top: 40px;
}

.page-heading .welcome-text h1 {
    font-size: clamp(1.35rem, 3.8vw, 2rem);
    line-height: 1.15;
}

.page-heading .welcome-text p {
    color: var(--bs-secondary-color);
    margin-top: .35rem;
}

.page-modules #userModules,
.page-modules #adminModules {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    justify-content: stretch !important;
    align-items: stretch;
    gap: 1rem !important;
    margin-bottom: 2rem !important;
}

.page-modules .module-item {
    width: 100%;
    min-width: 0;
}

.page-modules .module-item > a {
    display: flex;
    height: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
}

.page-modules .module-item .module-box {
    width: 100%;
    aspect-ratio: 1 / .78;
    min-height: 82px;
    padding: 1rem !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 .5rem 1.25rem rgba(15, 23, 42, .045);
}

.page-modules .module-item .module-box svg {
    width: clamp(30px, 10vw, 46px);
    height: clamp(30px, 10vw, 46px);
}

.page-modules .module-item .module-title {
    max-width: 100%;
    min-height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-wrap: anywhere;
    text-align: center;
    font-size: .95rem;
    line-height: 1.15rem;
}

@media (max-width: 575.98px) {
    .page-heading .page-welcome {
        align-items: flex-start !important;
        padding: 1rem;
    }

    .page-heading .welcome-text h1 {
        font-size: 1.35rem;
    }

    .page-heading .welcome-text p {
        font-size: .92rem;
    }

    .page-modules #userModules,
    .page-modules #adminModules {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .75rem !important;
    }

    .page-modules .module-item .module-box {
        min-height: 74px;
        border-radius: 1rem !important;
    }

    .page-modules .module-item .module-title {
        font-size: .82rem !important;
        line-height: 1rem;
        margin-top: .45rem !important;
    }
}

@media (max-width: 374.98px) {
    .page-modules #userModules,
    .page-modules #adminModules {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Action buttons in tables: same hit-area and same shape on mobile/tablet. */
.actions-cell,
.table-actions,
.document-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .4rem;
    flex-wrap: wrap;
    position: relative;
    z-index: 3;
    pointer-events: auto;
}

.actions-cell .btn,
.actions-cell button,
.actions-cell a.btn,
.table-actions .btn,
.document-actions .btn {
    min-height: 34px;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    line-height: 1.1;
    padding: .35rem .7rem;
    pointer-events: auto;
    position: relative;
    z-index: 4;
}

.actions-cell .btn-link {
    min-width: 36px;
    padding-left: .45rem !important;
    padding-right: .45rem !important;
    border: 1px solid transparent;
}

.actions-cell .btn-link:hover,
.actions-cell .btn-link:focus-visible {
    background: rgba(var(--bs-primary-rgb), .08);
    border-color: rgba(var(--bs-primary-rgb), .18);
}

@media (max-width: 767.98px) {
    .actions-cell,
    .table-actions,
    .document-actions {
        justify-content: flex-start !important;
        gap: .45rem;
    }

    .actions-cell .btn,
    .actions-cell button,
    .actions-cell a.btn {
        min-height: 38px;
        padding: .42rem .75rem;
    }
}

/* Users list: compact mobile cards and consistent inline controls. */
#usersTable .user-row-primary {
    min-width: 0;
}

#usersTable .user-row-primary > div {
    min-width: 0;
}

#usersTable .user-email-inline {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#usersTable .inline-edit-cell {
    min-width: min(260px, 100%);
}

@media (max-width: 767.98px) {
    #usersTable thead {
        display: none;
    }

    #usersTable,
    #usersTable tbody,
    #usersTable tr,
    #usersTable td {
        display: block;
        width: 100% !important;
    }

    #usersTable tbody tr {
        border: 1px solid var(--bs-border-color);
        border-radius: 1rem;
        background: var(--bs-body-bg);
        box-shadow: 0 .35rem 1rem rgba(15, 23, 42, .045);
        margin-bottom: .85rem;
        padding: .75rem;
    }

    #usersTable tbody td {
        border: 0 !important;
        padding: .35rem 0 !important;
    }

    #usersTable tbody td:first-child {
        display: none;
    }

    #usersTable tbody td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: .18rem;
        color: var(--bs-secondary-color);
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .035em;
        text-transform: uppercase;
    }

    #usersTable tbody td[data-label="Kullanıcı"]::before,
    #usersTable tbody td[data-label="İşlemler"]::before {
        display: none;
    }

    #usersTable .user-row-primary {
        align-items: flex-start !important;
        gap: .65rem !important;
    }

    #usersTable .user-row-primary img {
        width: 38px !important;
        height: 38px !important;
    }

    #usersTable .user-email-inline {
        max-width: calc(100vw - 7rem);
    }

    #usersTable .inline-edit-cell .small,
    #usersTable .user-row-role-stack .small {
        margin-top: .25rem !important;
    }

    #usersTable .table-inline-phone,
    #usersTable .table-inline-department {
        min-height: 38px;
        font-size: .9rem;
    }

    #usersTable .actions-cell {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        margin-top: .35rem;
    }

    #usersTable .actions-cell .btn {
        width: 100%;
        min-height: 38px;
        padding-left: .45rem;
        padding-right: .45rem;
        font-size: .82rem;
    }
}

/* Users analysis/dashboard components must not force horizontal overflow. */
.users-analytics-card,
.users-surface-card,
.users-hero-card,
.users-form-card,
.users-kpi-card,
.users-note-card,
.analysis-mini-card,
.analysis-chart-empty,
.users-action-panel,
.analysis-hero-grid,
.demographic-list,
.workload-list,
.health-list,
.insight-list,
.chart-card,
.chart-shell,
.org-summary-card,
.user-health-card {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-wrap: anywhere;
}

.analysis-hero-grid,
.users-analytics-card .row,
.users-surface-card .row,
.users-hero-card .row {
    min-width: 0 !important;
}

.users-analytics-card canvas,
.users-surface-card canvas,
.users-hero-card canvas,
.users-analytics-card svg,
.users-surface-card svg,
.users-hero-card svg {
    max-width: 100% !important;
}

@media (max-width: 767.98px) {
    .analysis-hero-grid {
        grid-template-columns: 1fr !important;
        gap: .75rem !important;
    }

    .users-analytics-card .card-body,
    .users-surface-card .card-body,
    .users-hero-card .card-body,
    .users-form-card .card-body {
        padding: 1rem !important;
    }

    .users-kpi-card,
    .analysis-mini-card,
    .users-note-card,
    .users-action-panel {
        padding: .85rem !important;
        border-radius: 1rem !important;
    }

    .users-tab-nav {
        margin-left: -.15rem;
        margin-right: -.15rem;
        padding-left: .15rem;
        padding-right: .15rem;
    }

    .users-tab-nav .nav-link {
        gap: .55rem !important;
    }

    .users-tab-nav .tab-icon {
        width: 36px !important;
        height: 36px !important;
        border-radius: .85rem !important;
    }
}

/* Dark mode normalization for custom cards/tables that used fixed light colors. */
[data-bs-theme=dark] .page-heading .page-welcome,
[data-bs-theme=dark] .users-hero-card,
[data-bs-theme=dark] .users-surface-card,
[data-bs-theme=dark] .users-analytics-card,
[data-bs-theme=dark] .users-form-card,
[data-bs-theme=dark] .users-kpi-card,
[data-bs-theme=dark] .analysis-mini-card,
[data-bs-theme=dark] .analysis-chart-empty,
[data-bs-theme=dark] .users-note-card,
[data-bs-theme=dark] .users-action-panel,
[data-bs-theme=dark] .summary-tile,
[data-bs-theme=dark] .metric-card,
[data-bs-theme=dark] .kpi-card,
[data-bs-theme=dark] .quick-card,
[data-bs-theme=dark] .quick-link-card,
[data-bs-theme=dark] .action-card,
[data-bs-theme=dark] .storage-summary-card,
[data-bs-theme=dark] .mini-stat,
[data-bs-theme=dark] .card,
[data-bs-theme=dark] .modal-content,
[data-bs-theme=dark] .dropdown-menu,
[data-bs-theme=dark] .list-group-item {
    background: var(--bs-body-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] .users-kpi-card,
[data-bs-theme=dark] .analysis-mini-card,
[data-bs-theme=dark] .summary-tile,
[data-bs-theme=dark] .metric-card,
[data-bs-theme=dark] .quick-card,
[data-bs-theme=dark] .quick-link-card,
[data-bs-theme=dark] .action-card,
[data-bs-theme=dark] .mini-stat {
    box-shadow: none !important;
}

[data-bs-theme=dark] .table,
[data-bs-theme=dark] table.dataTable,
[data-bs-theme=dark] table.dataTable tbody tr,
[data-bs-theme=dark] table.dataTable.display tbody tr.odd,
[data-bs-theme=dark] table.dataTable.display tbody tr.even,
[data-bs-theme=dark] table.dataTable.display tbody tr.odd > .sorting_1,
[data-bs-theme=dark] table.dataTable.display tbody tr.even > .sorting_1,
[data-bs-theme=dark] table.dataTable.order-column.stripe tbody tr.odd > .sorting_1,
[data-bs-theme=dark] table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    --bs-table-bg: var(--bs-body-bg);
    --bs-table-color: var(--bs-body-color);
    --bs-table-border-color: var(--bs-border-color);
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] .table-light,
[data-bs-theme=dark] .table-light th,
[data-bs-theme=dark] .table-light td,
[data-bs-theme=dark] thead.table-light {
    --bs-table-bg: var(--bs-tertiary-bg);
    --bs-table-color: var(--bs-body-color);
    background-color: var(--bs-tertiary-bg) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] .form-control,
[data-bs-theme=dark] .form-select,
[data-bs-theme=dark] .input-group-text,
[data-bs-theme=dark] .dataTables_filter input,
[data-bs-theme=dark] .dataTables_wrapper .dataTables_length select {
    background-color: var(--bs-tertiary-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] .badge.text-bg-light,
[data-bs-theme=dark] .bg-body-secondary,
[data-bs-theme=dark] .btn-light {
    background-color: var(--bs-tertiary-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] .border,
[data-bs-theme=dark] .border-bottom,
[data-bs-theme=dark] .border-top,
[data-bs-theme=dark] .border-start,
[data-bs-theme=dark] .border-end,
[data-bs-theme=dark] .border-dark-subtle,
[data-bs-theme=dark] .border-bottom-dashed,
[data-bs-theme=dark] .border-top-dashed {
    border-color: var(--bs-border-color) !important;
}

/* Shell layout: make page content fill all remaining horizontal space */
.content-wrapper.content-wrapper-radius {
    width: 100%;
    align-items: stretch;
}

    .content-wrapper.content-wrapper-radius > .content-area {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
    }

/* Expense manual test cleanup: keep OCR field labels readable in demo screens */
.expense-receipt-fields-table th:first-child,
.expense-receipt-fields-table td:first-child {
  width: 118px;
  min-width: 118px;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}
.expense-receipt-field-name {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
.expense-receipt-fields-table td:nth-child(2) {
  min-width: 150px;
}
.expense-receipt-fields-table td:nth-child(4) {
  min-width: 220px;
}
.expense-receipt-correction-input {
  min-width: 170px;
}
@media (max-width: 991.98px) {
  .expense-receipt-fields-table th:first-child,
  .expense-receipt-fields-table td:first-child {
    min-width: 96px;
  }
  .expense-receipt-correction-input {
    min-width: 140px;
  }
}

/* Expense list action buttons: use readable text buttons like other operation tables. */
.expense-actions-cell {
    min-width: 112px;
}

.expense-actions-cell .expense-action-btn {
    min-width: 48px;
    padding-left: .65rem !important;
    padding-right: .65rem !important;
    font-weight: 500;
    white-space: nowrap;
}


/* Expense table demo-friendly cells */
.expense-table .expense-employee-cell,
.expense-employee-cell {
    min-width: 160px;
    max-width: 220px;
}

.expense-table .expense-employee-cell .employee-name,
.expense-employee-cell .employee-name {
    display: block;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.expense-table .expense-employee-cell .employee-email,
.expense-employee-cell .employee-email {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}