/* Phase 3: form/detail/report ergonomics. Existing desktop styling and data paths stay intact. */
.app-item-label { display: none; }
.app-workspace, .reports-page, .report-content-card, .role-access-module { min-width: 0; overflow-wrap: anywhere; }
.dashboard-donut-wrap, .dashboard-donut-legend, .dashboard-donut-legend-label { min-width: 0; }
.dashboard-donut-wrap { grid-template-columns: minmax(0, 1fr); }
.dashboard-donut-legend-label { overflow-wrap: anywhere; }
.dashboard-page :is(.dashboard-bar-list, .dashboard-rank-list) { grid-template-columns: minmax(0, 1fr); }
.dashboard-page :is(.dashboard-bar-list-label, .dashboard-rank-name) { min-width: 0; overflow-wrap: anywhere; }
.dashboard-page .dashboard-bar-list-row { flex-wrap: wrap; }
.dashboard-page .dashboard-bar-list-value { white-space: normal; }
.dashboard-page .dashboard-category-strip-legend li { min-width: 0; flex-wrap: wrap; }
.dashboard-page :is(.dashboard-category-strip-legend-label, .dashboard-rank-meta, .dashboard-rank-footer) { min-width: 0; overflow-wrap: anywhere; }
.dashboard-page .dashboard-rank-footer { flex-wrap: wrap; }
.app-workspace :is(dd, p, h1, h2, h3, .badge), .role-access-permission-text { overflow-wrap: anywhere; }
.app-workspace :is(.overflow-x-auto, .table-responsive) { position: relative; }
@media (max-width: 767.98px) {
    .app-workspace :is(.p-5, .px-5, .px-6) { padding-inline: .875rem !important; }
    .app-workspace :is(.grid-cols-3, dl.grid) { grid-template-columns: minmax(0, 1fr); }
    .app-workspace dl.grid { gap: .2rem; }
    .app-workspace dl.grid > dd { margin-bottom: .65rem; }
    .app-workspace :is(.row > .col, .flex > .flex-1) { flex: 1 1 100%; min-width: 0; }
    .app-workspace :is(.form-control, .form-select),
    .app-modal-body :is(.form-control, .form-select) {
        min-width: 0; max-width: 100%; min-height: 44px; font-size: 1rem;
    }
    .app-workspace :is(.d-flex, .transaction-total), .app-modal-body .d-flex { flex-wrap: wrap; }
    .app-workspace .btn, .app-modal-body .btn { white-space: normal; overflow-wrap: anywhere; }
    .app-workspace :is(.transaction-card, .transaction-product-copy, .transaction-product-action) { min-width: 0; }
    .transaction-product-copy strong { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
    .transaction-product-copy small { font-size: .8125rem; overflow-wrap: anywhere; }
    .transaction-action-buttons .btn { white-space: normal; }
    .transaction-total { gap: .5rem; }
    .transaction-total strong { overflow-wrap: anywhere; }
    /* Keep the original inputs and callbacks once in the DOM, laid out as labelled item cards. */
    .app-content .app-item-region { overflow: visible; contain: none; }
    .app-content .app-item-table { display: block; min-width: 0 !important; width: 100%; border: 0; }
    .app-item-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .app-item-table tbody { display: grid; gap: .75rem; }
    .app-item-table tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .75rem; border: 1px solid var(--app-border); border-radius: .5rem; background: var(--app-surface); }
    .app-content .app-item-table td { display: block; width: auto !important; min-width: 0 !important; padding: .4rem !important; border: 0 !important; text-align: left !important; overflow-wrap: anywhere; }
    .app-item-table td:first-child { grid-column: 1 / -1; font-weight: 650; }
    .app-item-table td:has(input, select, textarea, button) { grid-column: 1 / -1; }
    .app-item-table .app-item-label { display: block; margin-bottom: .3rem; font-size: .8125rem; font-weight: 400; color: var(--app-text-secondary); }
    .app-item-table td:first-child .app-item-label { display: none; }
    .app-item-table :is(input, select, textarea) { width: 100%; min-width: 0 !important; }
    .app-item-table td > .btn { min-height: 44px; width: 100%; }
    .app-item-table td:has(.btn) .app-item-label { display: none; }
    .app-workspace :is(dd, .transaction-total strong) { font-variant-numeric: tabular-nums; }
    .app-workspace :is(input, select, textarea) { scroll-margin-block: 6rem 10rem; }
    /* A focused field must remain reachable when a software keyboard shrinks the viewport. */
    .app-workspace:has(input:focus, textarea:focus, select:focus) .transaction-action-bar { position: static; }
    .app-workspace:has(input:focus, textarea:focus, select:focus) .app-action-bar { position: static; }
    .product-editor-workspace, .product-details-workspace { min-width: 0; }
    .product-media-column, .product-details-media-column, .product-editor-section, .product-details-section { min-width: 0; }
    .product-media-panel :is(input, .product-gallery-thumbnails), .product-details-thumbnails { max-width: 100%; flex-wrap: wrap; }
    .product-details-preview { height: min(13rem, 35dvh) !important; min-height: 0 !important; }
    .product-details-price-list > div, .product-details-header-actions { flex-wrap: wrap; gap: .5rem; }
    .product-details-readonly-grid, .product-details-split { grid-template-columns: minmax(0, 1fr) !important; }
    .product-details-section :is(dd, .product-details-name, p) { overflow-wrap: anywhere; min-width: 0; }
    .app-modal-body:has(input:focus, textarea:focus, select:focus) .product-form-actions { position: static; }
    .app-modal-body .row > .col { flex: 1 1 100%; }
    .app-modal-body :is(label, .form-text, .validation-message, .alert) { overflow-wrap: anywhere; }
    .app-modal-body .d-flex > .btn { flex: 1 1 8rem; }
    .report-content-card { padding: .875rem !important; }
    .report-toolbar, .report-actions { width: 100%; min-width: 0; }
    .report-actions .btn { flex: 1 1 8rem; min-height: 44px; white-space: normal; }
    .report-pdf-preview { height: 65dvh !important; min-height: 16rem !important; max-height: 40rem !important; }
    .app-modal-actions { flex-wrap: wrap; }
    .app-modal-body input[type="date"] { min-width: 0; width: 100%; }
    .role-selector .form-select { max-width: 100% !important; width: 100%; min-height: 44px; }
    .role-access-modules { grid-template-columns: minmax(0, 1fr) !important; }
    .role-access-permission-item { min-height: 44px; align-items: flex-start; }
    .role-access-permission-item input { flex-shrink: 0; margin-top: .25rem; }
    .role-access-permission-text { min-width: 0; }
    .role-access-footer { flex-wrap: wrap; gap: .75rem; }
    .role-access-footer .btn { width: 100%; min-height: 44px; }
    .role-access-footer-hint, .settings-card-description { overflow-wrap: anywhere; }
    .settings-page :is(.theme-mode-options, .accent-options) { grid-template-columns: minmax(0, 1fr); }
    .settings-page .accent-preview { flex-wrap: wrap; }
    .catalog-edit-btn, .catalog-tab { min-width: 44px; min-height: 44px; }
}
@media (max-width: 767.98px) and (max-height: 540px) {
    .transaction-action-bar, .app-action-bar, .product-form-actions { position: static !important; }
    .product-image-preview { height: 8rem !important; }
}

.app-item-selection { display: inline-flex; align-items: center; gap: .75rem; min-height: 44px; }
.app-item-selection input { width: auto !important; min-height: 0 !important; flex-shrink: 0; }
.report-open-preview { display: none; }
@media (max-width: 767.98px) {
    .report-open-preview { display: inline-flex; width: 100%; justify-content: center; min-height: 44px; }
    .app-item-selection { width: 100%; }
}

/* Keep financial values scan-readable in the retained tablet/desktop tables. */
@media (min-width: 768px) {
    .app-item-table td:is(.text-end, .text-right) { white-space: nowrap; }
}