/* Responsive refinements shared by every Shop route. Keep desktop and print
   layouts intact; component selectors intentionally win over legacy inline CSS. */
.transaction-filter-toggle { display: none !important; }
.transaction-options { padding-block: 1rem; border-bottom: 1px solid var(--rule); margin-bottom: 1rem; }
.directory-divider { margin: 1rem 0; border-color: var(--rule-strong); opacity: 1; }
.customer-search .search-embedded { margin: 0; }
.record-overview .fact-value { font-weight: 600; font-variant-numeric: tabular-nums; }
body .home-layout .content-container { padding: 0; max-width: none; }
.record-card-heading { gap: .5rem; flex-wrap: wrap; }
.record-card-heading > div { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.record-card-heading > div:first-child { flex: 1 1 150px; }
.customer-last-visit { font-size: .8125rem; margin-top: .25rem; }
.twofa-page-header { flex-direction: column; align-items: flex-start !important; }
.twofa-page-header .breadcrumb { margin-bottom: 0; font-size: .875rem; }

@media screen and (max-width: 991.98px) {
    :root { --header-height: 56px; --bottom-nav-height: 60px; --pane-pad: 1rem; }
    html { scroll-padding-top: calc(var(--header-height) + 1rem); }
    body .content-container { padding-top: 1rem; }
    body .topbar { padding-inline: max(.75rem, env(safe-area-inset-left)); }
    body .bottom-nav { padding-inline: env(safe-area-inset-left) env(safe-area-inset-right); }
    body .bottom-nav-link { gap: .2rem; font-size: .75rem; }
    body .bottom-nav-link.active { box-shadow: inset 0 3px 0 var(--navy-700); }
    body .page-header, body .page-head { padding-block: 0 1rem; gap: .75rem; }
    body .page-header h1, body .page-header h2, body .page-head h1 { font-size: 1.375rem; font-weight: 700; letter-spacing: -.025em; }
    body .page-header p, .page-head-sub { line-height: 1.45; }
    body .section-card, body .card, body .store-card { margin-bottom: 1rem; border-radius: var(--border-radius); }
    body .section-card-header, body .card-header { padding: .875rem var(--pane-pad); gap: .5rem; }
    body .section-card-footer, body .card-footer { padding: .875rem var(--pane-pad); }
    body .section-card-header h5, body .card-header h5, body .section-title { font-size: 1rem; font-weight: 600; }
    body .workflow-page > .page-head, body .detail-page > .page-head { padding: .875rem var(--pane-pad); }
    body .workflow-page .page-head h1 { flex: 1 1 130px; }
    body .workflow-page .page-head > .btn { flex: 0 1 auto; }
    body .workflow-page .stage-item { min-height: 56px; padding: .5rem .25rem; gap: .25rem; font-size: .75rem; }
    body .workflow-action-bar { gap: .4rem; padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom)); }
    body .workflow-action-bar .action-buttons { gap: .5rem; }
    body .workflow-action-bar .context-content { font-size: .8125rem; line-height: 1.4; }
    body .workflow-page .pane { padding: 1rem; }
    body .workflow-page .eyebrow { margin-bottom: .75rem; }
    body .workflow-page .customer-create-form .section-title { padding-bottom: .5rem; }
    body .workflow-page .customer-create-form .form-actions { margin-top: 1rem !important; }
    body .customer-search { margin: 0; }
    body .customer-search .search-form-container { margin: 0; padding: 0; background: transparent; border: 0; }
    body .customer-search .search-actions { flex-direction: row; gap: .5rem; }
    body .customer-search .search-btn-row { gap: .5rem; flex-wrap: wrap; }
    body .customer-search .search-btn-row > .btn { flex: 1 1 auto; }
    body .customer-search .search-btn-row > .btn-primary { flex: 1 1 auto; }
    body .customer-search .search-filter-toggle { font-size: .875rem; }
    body .customer-search .extra-filters { overflow: visible; }
    body .customer-search .extra-filters.expanded { padding-top: .75rem; border-top: 1px solid var(--rule); }
    body .customer-search .form-check { margin-block: 0 !important; }
    body .customer-search .form-check-label { line-height: 1.5; }
    body .customer-search .search-actions > .btn { width: auto; flex: 1 1 auto; }
    body .customer-search .search-actions:has(> .btn) { display: grid; grid-template-columns: minmax(0, 1fr); }
    body .customer-search .search-actions:has(> .btn) .search-btn-row { flex: none; width: 100%; min-width: 0; }
    body .customer-search .search-actions:has(> .btn) > .btn { width: 100%; min-height: 44px; }
    body .customer-result-card .crc-name { font-size: 1rem; line-height: 1.4; }
    body .customer-result-card .crc-detail { align-items: baseline; gap: .5rem; }
    body .customer-result-card .crc-detail i { width: 1rem; flex: 0 0 1rem; text-align: center; }
    body .dashboard-container .store-card { padding: .875rem 1rem; gap: .75rem; margin-bottom: 1rem; }
    body .dashboard-container .store-icon { width: 40px; height: 40px; border-radius: 8px; background: var(--navy-800); }
    body .dashboard-container .store-name { font-size: 1rem; line-height: 1.4; }
    body .dashboard-container .store-label { font-size: .75rem; text-transform: none; letter-spacing: 0; }
    body .dashboard-container .store-address { font-size: .8125rem; }
    body .dashboard-container .header-actions { flex-wrap: nowrap; }
    body .dashboard-container .search-box { flex: 1 1 0; }
    body .settings-page { padding-block: 0 !important; }
    body .settings-page .profile-tab-body { padding: 1rem !important; }
    body .settings-page .section-card-header:has(.profile-nav-pills) { padding: .5rem !important; border-bottom: 1px solid var(--rule) !important; }
    body .settings-page .profile-nav-pills { display: flex; flex-wrap: nowrap; gap: .25rem !important; }
    body .settings-page .profile-nav-pills .nav-item { flex: 1 1 0; min-width: 0; }
    body .settings-page .profile-nav-pills .nav-link { flex-direction: column; padding: .5rem .2rem !important; border-radius: var(--radius-control) !important; font-size: .8125rem; line-height: 1.35; }
    body .settings-page .profile-tab-body h5 { font-size: 1.0625rem; margin-bottom: .5rem !important; }
    body .settings-page .profile-tab-body h5 + p { font-size: .875rem; }
    body .team-manager--editing .team-manager-heading { display: none !important; }
    body .settings-page .team-member-form { border: 0; margin-bottom: 1rem !important; background: white !important; }
    body .team-member-form > .section-card-body { padding: 0 !important; }
    body .team-member-form > .section-card-body > .border-bottom { margin-bottom: 1rem !important; }
    body .settings-page .profile-avatar + div > .d-flex { margin-top: .35rem !important; }
    body .settings-page .profile-avatar + div .badge { padding: .2rem .5rem !important; border-radius: 5px !important; font-size: .75rem; }
    body .password-rule-checklist { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: .2rem .75rem; }
    body .password-rule-checklist li { display: flex; align-items: baseline; gap: .4rem; font-size: .8125rem; line-height: 1.5; }
    body .password-rule-checklist li i { margin: 0 !important; flex: 0 0 .8125rem; }
    body .auth-content-container { align-items: flex-start; min-height: calc(100dvh - var(--header-height)); padding: 1rem .75rem; }
    body .auth-card-wrapper .card-body { padding: 1.25rem !important; }
    body .auth-card-wrapper .auth-header, body .auth-card-wrapper .section-header { margin-bottom: 1rem; }
    body .auth-card-wrapper h1 { font-size: 1.375rem; }
    body .auth-card-wrapper p { font-size: .875rem; }
    body .auth-card-wrapper .logo-section { margin-bottom: .5rem; }
    body .receipt-page { padding: 0 !important; }
    body .receipt-toolbar { margin-bottom: 1rem !important; }
    body .receipt-toolbar .btn { flex: 1 1 auto; }
    body .home-landing { padding: 1.5rem; background: var(--color-bg); }
    body .home-landing h1 { font-size: 1.5rem; }
    body .error-page h1 { font-size: 1.375rem; }
    body .error-page p { font-size: .875rem; }
}

@media screen and (max-width: 767.98px) {
    body .transaction-search-toolbar { margin-bottom: .75rem; }
    body .transaction-filter-toggle { display: inline-flex !important; width: 100%; margin-bottom: 1rem; }
    body .transaction-filter-toggle > i:last-child { margin-left: auto !important; }
    body .transaction-options { display: none; margin-top: -.25rem; padding-top: 0; }
    body .transaction-options.expanded { display: block; }
    body .transaction-list-page .page-header { margin-bottom: 0; }
    body .transaction-list-page .section-card-body { padding: 1rem; }
    body .inventory-page .inv-search-actions { display: flex; flex-direction: row; gap: .5rem; padding-bottom: 1rem !important; }
    body .inventory-page .inv-search-actions > .btn { width: auto; flex: 1 1 auto; }
    body .inventory-page .inv-search-actions > .inv-filter-toggle { display: inline-flex; }
    body .inventory-page .inv-search-actions > .btn[aria-label="Clear filters"] { flex: 0 0 44px; }
    body .inventory-page .inv-extra-filters { overflow: visible; }
    body .inventory-page .inv-extra-filters .row > div { width: 50%; }
    body .detail-page .pane-row { grid-template-columns: minmax(0, 1fr); }
    body .detail-page .pane-row > .pane + .pane { border-left: 0; border-top: 1px solid var(--rule); }
    body .detail-page .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; }
    body .detail-page .facts > div { min-width: 0; }
    body .detail-page .facts--wide { grid-template-columns: minmax(0, 1fr); }
    body .detail-page .fact-label { font-size: .8125rem; line-height: 1.4; margin-bottom: .2rem; }
    body .detail-page .fact-value { font-size: .875rem; }
    body .detail-page .stat-value { font-size: 1rem; }
    body .detail-page .page-head > div { flex: 1 1 180px; }
    body .detail-page .page-head > .d-flex { flex: 0 1 auto; flex-wrap: wrap; }
    body .detail-page .page-head h1 .pill { margin-left: 0 !important; vertical-align: middle; }
    body .detail-page .record-overview { padding-block: .75rem; }
    body .item-detail-page .image-carousel-viewport, body .item-detail-page .image-carousel-main-frame,
    body .item-detail-page .image-not-available, body .item-detail-page .image-skeleton-main { min-height: 140px; }
    body .item-detail-page .image-carousel-main { max-height: 180px; }
    body .item-detail-page .image-preview-button { height: 56px; width: 56px; }
    body .item-detail-page .image-carousel-meta { margin-top: .5rem; }
    body .item-detail-page .image-carousel-stage { gap: .5rem; }
    body .item-detail-page .eyebrow { margin-bottom: .5rem; }
    body .drafts-page > .card { margin-bottom: 1rem !important; border: 1px solid var(--rule) !important; }
    body .drafts-page .page-header > .d-flex { gap: .5rem !important; }
    body .drafts-page .card-body > .row { --bs-gutter-y: .75rem; }
    body .drafts-page .card-body > .row > .col-md-6:last-child > .d-flex { width: 100%; }
    body .drafts-page .card-body .form-select { flex: 1; }
    body .txn-card, body .transaction-mobile-card, body .customer-result-card, body .draft-card { border-radius: 8px; margin-bottom: .75rem; }
    body .txn-card { padding: 1rem; }
    body .txn-card-top { gap: .5rem; }
    body .txn-card-footer { padding-top: .75rem; margin-top: .75rem; gap: .5rem; }
    body .customer-directory-card .card-body > .mb-3,
    body .transaction-mobile-card .card-body > .mb-3 { margin-bottom: .75rem !important; }
    body .customer-directory-card .card-body > .border-top,
    body .transaction-mobile-card .card-body > .border-top { gap: .5rem; flex-wrap: wrap; }
    body .customer-directory-card .card-body > .border-top > .btn,
    body .transaction-mobile-card .card-body > .border-top > .btn { margin-left: auto; }
    body .customer-directory-card .card-body > .border-top > div { min-width: 0; }
    body .customer-directory-card .card-body > .border-top { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; }
    body .customer-last-visit small { font-size: inherit; }
    body .inventory-page .inv-extra-filters.expanded { padding-top: 1rem; border-bottom: 1px solid var(--rule); }
    body .drafts-page .mobile-cards .row-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; padding-block: 1rem; align-items: start; }
    body .drafts-page .mobile-cards .row-item > .d-flex { flex-direction: column; }
    body .drafts-page .mobile-cards .row-sub { font-size: .8125rem; line-height: 1.5; margin-top: .25rem; }
    body .pagination-footer { gap: .75rem; }
    body .pagination-meta { font-size: .8125rem; }
    body .empty-state-global { padding: 1.5rem 1rem; }
    body .empty-state-global p { margin-bottom: 1rem; font-size: .875rem; }
    body .modal.show { padding: .5rem; }
    body .modal-header { padding-block: .5rem; }
    body .modal-title { font-size: 1.0625rem; }
    body .modal-footer { gap: .5rem; padding-block: .75rem; }
}

@media screen and (max-width: 575.98px) {
    body .content-container { padding-inline: max(.75rem, env(safe-area-inset-left)) max(.75rem, env(safe-area-inset-right)); }
    body .page-header-actions { gap: .5rem; }
    body .settings-page .section-card-body:has(> .profile-avatar) { padding: .875rem 1rem !important; gap: .75rem !important; }
    body .settings-page .profile-avatar { width: 36px; height: 36px; }
    body .settings-page .profile-avatar + div > h4 { font-size: .875rem; }
    body .customer-search .customer-search-grid { --bs-gutter-x: .75rem; --bs-gutter-y: .75rem; }
    body .customer-search .form-control { padding-inline: .625rem; }
    body .customer-search .search-btn-row .btn { padding-inline: .625rem; }
    body .customer-search .search-filter-toggle > i:last-child { display: none; }
    body .workflow-page .customer-create-form .row { --bs-gutter-y: .875rem; }
    body .workflow-page .customer-create-form .mobile-half-field { width: 50%; }
    body .workflow-page .customer-create-form .form-actions { position: sticky; bottom: 0; z-index: 20; background: white; padding: .75rem 0 calc(.75rem + env(safe-area-inset-bottom)); }
    body .workflow-page .customer-create-form .form-actions .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); --bs-gutter-x: .5rem; }
    body .workflow-page .customer-create-form .form-actions .row > div { width: 100%; margin-top: 0; }
    body .workflow-page .form-actions .btn { min-width: 0; }
    body .workflow-page .row-item .row-end { white-space: normal; max-width: 100%; }
    body .workflow-page .draft-idcard-creator { padding: 1rem; }
    body .workflow-page .pane--flush { padding: 0; }
    body .modal .draft-idcard-creator { padding: 1rem; background: white; }
    body .modal .draft-idcard-creator form > fieldset > .row > .col-12:last-child { position: sticky; bottom: 0; z-index: 20; background: white; border-top: 1px solid var(--rule); padding-top: .75rem; padding-bottom: .5rem; }
    body .draft-idcard-creator .id-upload-zone.empty-zone { min-height: 0; padding: .75rem; border-radius: 8px; }
    body .draft-idcard-creator .empty-zone .icon-circle { display: none; }
    body .draft-idcard-creator .empty-zone .upload-actions .btn { border-radius: var(--radius-control) !important; }
    body .draft-idcard-creator .empty-zone .upload-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
    body .draft-idcard-creator .empty-zone .upload-actions > button { grid-column: 1 / -1; }
    body .draft-idcard-creator .id-date-field { width: 50%; }
    body .receipt-page .receipt-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); font-size: .875rem; gap: .75rem; }
}

/* Compact visible controls retain a minimum 44px target. Text is never scaled
   down in fields to make a crowded row fit. */
@media screen and (max-width: 991.98px) {
    body .btn, body .btn-sm { min-height: 44px; padding: .45rem .65rem; font-size: .875rem; line-height: 1.3; }
    body .workflow-action-bar .action-buttons .btn, body .item-form-actions .btn,
    body .workflow-page .form-actions .btn { min-height: 44px; padding: .5rem .625rem; font-size: .875rem; }
    body .workflow-page .form-actions .btn > i { display: none; }
    body .workflow-page .customer-create-form .form-actions .row { align-items: stretch; }
    body .workflow-page .customer-create-form .form-actions .btn { height: 100%; }
    body .workflow-page .transaction-review .facts > .fact-full-width { grid-column: 1 / -1; }
    body .item-form-modal .item-category-select { display: block; }
    body .item-form-modal .item-category-chips { display: none; }
    body .item-form-actions { gap: .25rem; }
    body .item-form-actions .form-check { padding-block: .25rem; }
}
.item-category-select { display: none; }

/* Short landscape screens need reading room; primary actions remain reachable
   in normal document flow and the top menu continues to expose every route. */
@media screen and (max-width: 991.98px) and (max-height: 480px) {
    body .mobile-topbar { position: static; }
    body .bottom-nav { display: none; }
    body .content-container { padding-bottom: 1rem; }
    body .workflow-action-bar { position: static; }
    body .workflow-container.has-sticky-actions { padding-bottom: 0; }
}

/* Compact transaction details, with consistent alignment and reachable actions. */
body .workflow-page > .page-head { align-items: center; flex-wrap: nowrap; }
body .workflow-page > .page-head h1 { margin: 0; line-height: 1.25; }
body .workflow-page > .page-head > .btn { flex-shrink: 0; }
body .idcard-selector .idcard-item { padding: .875rem; }
body .idcard-selector .idcard-content { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem .75rem; align-items: start; }
body .idcard-selector .idcard-images { min-width: 0; width: auto; padding-right: 0; }
body .idcard-selector .idcard-images .badge { font-size: .6875rem; font-weight: 500; padding: .3rem .4rem; }
body .idcard-selector .idcard-type { font-size: .9375rem; line-height: 1.35; }
body .idcard-selector .idcard-number { font-size: .8125rem; }
body .idcard-selector .selected-indicator { display: none; }
body .idcard-selector .idcard-item:disabled { opacity: 1; }
body .idcard-selector .idcard-item:disabled .text-danger { color: #b42318 !important; }
.id-form-toolbar { position: relative; }
.id-help { display: inline-flex; position: static; margin-left: .25rem; vertical-align: middle; }
body .id-help-trigger { position: relative; display: inline-grid; place-items: center; width: 22px; height: 22px; min-width: 22px; min-height: 22px; padding: 0; border: 1px solid var(--rule-strong); border-radius: 50%; background: white; color: var(--navy-700); font-size: .75rem; line-height: 1; }
.id-help-trigger::after { content: ''; position: absolute; inset: -11px; }
.id-help-content { visibility: hidden; opacity: 0; position: absolute; z-index: 1080; top: calc(100% + .5rem); right: 0; width: 220px; padding: .6rem .75rem; border-radius: 6px; background: var(--navy-900); color: white; box-shadow: 0 4px 16px #0003; font-size: .75rem; line-height: 1.45; font-weight: 400; }
.id-help:hover .id-help-content, .id-help:focus-within .id-help-content { visibility: visible; opacity: 1; }
body .workflow-item-totals { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; width: 100%; font-size: .8125rem; }
.workflow-item-totals strong { color: var(--navy-900); font-variant-numeric: tabular-nums; }
.workflow-item-totals > span:last-child { text-align: right; }
body .item-manager .item-card { border-radius: 8px; box-shadow: none; }
body .item-manager .item-card-inner { align-items: flex-start; padding: .875rem; gap: .875rem; }
body .item-manager .item-visual { position: relative; }
body .item-manager .item-number-badge { position: absolute; left: -5px; top: -5px; z-index: 1; width: 22px; height: 22px; border: 2px solid white; font-size: .625rem; }
body .item-manager .item-thumbnail { width: 56px; height: 56px; border-radius: 6px; }
body .item-manager .item-name { font-size: 1rem; line-height: 1.35; }
body .item-manager .item-values { margin-left: auto; }
body .item-manager .value-amount { font-size: 1rem; }
body .item-manager .item-actions-mobile { justify-content: flex-end; padding: .375rem .75rem; background: var(--surface-muted); gap: .5rem; }
body .item-manager .item-actions-mobile .btn { flex: 0 0 auto !important; width: auto; padding: .4rem .75rem; }
body .item-manager .items-summary { flex-direction: row; align-items: center; }
body .optional-photo-modal .modal-footer .btn { min-width: 90px; }
body .submit-confirmation-modal .submission-summary > div { padding-block: .45rem; }
body .submit-confirmation-modal .confirmation-content > p { font-size: .875rem; line-height: 1.4; }
body .submit-confirmation-modal #confirmationDateHint:not(.text-danger) { display: none; }
body .submit-confirmation-modal .final-confirmation .form-check-label { font-size: .875rem; line-height: 1.4; }
@media (max-width: 575.98px) {
    body .workflow-page > .page-head { gap: .5rem; }
    body .workflow-page > .page-head h1 { font-size: 1.25rem; flex: 1 1 0; }
    body .workflow-page > .page-head > .btn { padding-inline: .5rem; }
    body .workflow-page > .page-head > .btn i { display: none; }
    body .item-manager .item-header-row { flex-direction: column; align-items: stretch; gap: .25rem; }
    body .item-manager .item-values { margin-left: 0; }
    body .item-manager .value-block { display: flex; flex-direction: row; align-items: baseline; gap: .5rem; }
    body .item-manager .item-tags { margin-top: .5rem; }
}
