/* Shared mobile action controls. Desktop styles are deliberately outside this query. */
@media (max-width: 900px) {
    body .mud-button-root.mud-button:not(.app-back-button),
    body .mud-fab.mud-button-root,
    body .faktury-mobile-fullscreen {
        font-size: 11.5px !important;
        line-height: 14px !important;
        min-height: 32px !important;
        height: auto !important;
        min-width: 0 !important;
        max-width: 100%;
        width: auto !important;
        padding: 5px 8px !important;
        text-transform: none;
        letter-spacing: normal;
        flex: 0 1 auto !important;
        white-space: normal;
        overflow-wrap: normal;
    }
    body .mud-button:not(.app-back-button) .mud-button-label,
    body .mud-fab .mud-button-label {
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        min-width: 0;
        font-size: 11.5px !important;
        line-height: 14px !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal;
    }
    body .mud-button:not(.app-back-button) .mud-typography { font-size: inherit !important; line-height: inherit !important; }
    body .mud-button:not(.app-back-button) .mud-svg-icon,
    body .mud-fab .mud-svg-icon { font-size: 16px !important; }
    body .mud-button-icon-start { flex-shrink: 0; margin-left: 0; margin-right: 4px; }
    body .mud-button-icon-end { flex-shrink: 0; margin-right: 0; margin-left: 4px; }
    body .mud-icon-button.mud-button-root {
        width: 32px; height: 32px; min-width: 32px; min-height: 32px; padding: 6px;
    }
    body .mud-icon-button .mud-svg-icon { font-size: 20px; }
    /* These are action bars, including tooltip-wrapped actions. Other contents
       (form fields, headings, help) keep their own row instead of being squeezed. */
    :is(.mud-stack, .d-flex, .mud-dialog-actions, .invoice-actions, .invoice-list-actions):has(> :is(.mud-button, .mud-tooltip-root)),
    :is(div, section, form):not(.mud-toolbar):has(> .mud-button ~ .mud-button) {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center;
        gap: 6px !important;
    }
    :is(.mud-stack, .d-flex, .mud-dialog-actions, .invoice-actions, .invoice-list-actions):has(> :is(.mud-button, .mud-tooltip-root)) > :is(.mud-button, .mud-tooltip-root),
    :is(div, section, form):not(.mud-toolbar):has(> .mud-button ~ .mud-button) > .mud-button {
        flex: 0 1 auto !important;
        width: auto !important;
        max-width: 100%;
        margin: 0 !important;
        min-width: 0;
    }
    :is(div, section, form):not(.mud-toolbar):has(> .mud-button ~ .mud-button) > :not(.mud-button):not(.mud-tooltip-root):not(.mud-spacer) {
        flex-basis: 100%;
        min-width: 0;
    }
    :is(.invoice-actions, .invoice-list-actions, .mud-dialog-actions) > .mud-spacer { display: none; }
    .mud-tooltip-root:has(> .mud-button) { min-width: 0; max-width: 100%; }
    body .mud-tab {
        font-size: 11.5px !important; line-height: 14px;
        min-height: 36px; min-width: 0 !important; padding: 6px 10px;
        white-space: normal;
    }
    /* The list return stays an unmistakable, comfortable touch target. */
    body .app-back-button { min-height: 44px; }
}

@media (max-width: 600px) {
    /* Two columns for real toolbars; long standalone instructions may use a row. */
    :is(.mud-stack, .d-flex, .mud-dialog-actions, .invoice-actions, .invoice-list-actions):has(> :is(.mud-button, .mud-tooltip-root) ~ :is(.mud-button, .mud-tooltip-root)) > :is(.mud-button:not(.app-back-button), .mud-tooltip-root) {
        flex: 0 1 calc((100% - 6px) / 2) !important;
    }
}

/* Application navigation is never an action grid, regardless of its buttons. */
@media (max-width: 900px) {
    .faktury-appbar .mud-toolbar { display: flex !important; flex-flow: row nowrap !important; justify-content: flex-start !important; }
    .faktury-appbar .mud-toolbar > * { flex-basis: auto !important; }
    .faktury-appbar .faktury-app-title { flex: 1 1 auto !important; min-width: 0; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; margin: 0 4px !important; }
    .faktury-appbar .mud-spacer { display: none; }
    .faktury-appbar .mud-icon-button { flex: 0 0 44px !important; width: 44px !important; height: 44px !important; margin: 0 !important; }
    .faktury-appbar .faktury-menu-button { order: -1; }
    .mud-dialog { min-width: 0 !important; }
    .mud-dialog .mud-input-control { max-width: 100%; min-width: 0; }
}
.faktury-focus-tools[hidden] { display: none !important; }
.faktury-focus .faktury-appbar,
.faktury-focus .faktury-mobile-company,
.faktury-focus .mud-drawer,
.faktury-focus .mud-drawer-overlay { display: none !important; }
.faktury-focus .faktury-main-content { margin-left: 0 !important; margin-right: 0 !important; padding-top: calc(36px + env(safe-area-inset-top)) !important; }
.faktury-focus .faktury-page-container { margin-top: 0 !important; margin-bottom: 0 !important; }
.faktury-focus-tools { position: fixed; inset: 0 0 auto 0; height: calc(36px + env(safe-area-inset-top)); z-index: 1300; display: flex; justify-content: flex-end; padding: calc(2px + env(safe-area-inset-top)) 8px 2px; background: var(--mud-palette-surface, #fff); }
.faktury-focus-tools button { min-height: 32px; font-size: 12px; color: var(--mud-palette-text-primary); }

/* Fit the containing panel; horizontal scrolling belongs to a table, never the page. */
@media (max-width: 900px) {
    .faktury-page-container :is(.mud-paper, .mud-tabs, .mud-tabs-panels, .mud-tab-panel, .mud-grid-item) { min-width: 0; }
    .faktury-page-container :is(.mud-paper, .mud-tabs, .mud-table) { max-width: 100%; }
    .faktury-page-container .mud-table { min-width: 0 !important; }
    .faktury-page-container .mud-table-container { max-width: 100%; }
    .faktury-page-container .mud-input-control { min-width: 0 !important; max-width: 100%; }
    .faktury-page-container .d-flex.flex-row:has(> :is(.mud-input-control, .mud-typography, .mud-chip)) { flex-wrap: wrap !important; }
    .faktury-page-container .d-flex.flex-row > :is(.mud-input-control, .mud-typography, .mud-chip) { min-width: 0; max-width: 100%; }
    .faktury-page-container .mud-typography { overflow-wrap: anywhere; }
    .faktury-page-container .mobile-compact-table .mud-table-root { min-width: 0 !important; }
    .faktury-page-container .mobile-compact-table .mud-table-container { min-height: 0 !important; }
    .faktury-page-container .mobile-record-text { overflow-wrap: normal; }
    .faktury-page-container .warehouse-summary-band { grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr)); }
    .faktury-page-container .warehouse-summary-band > div { min-width: 0; }
    .faktury-page-container .pkpir-print-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .faktury-page-container .pkpir-print-summary { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
    .faktury-page-container .pkpir-print-summary > div { min-width: 0; overflow-wrap: anywhere; }
}
@media (max-width: 600px) {
    .faktury-page-container .pkpir-print-toolbar { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 900px) {
    /* All tabs remain visible. Wrapped tabs use their own active underline,
       instead of the desktop slider positioned for a single scrolling row. */
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tabs-tabbar-wrapper {
        width: 100% !important; max-width: 100%; flex-wrap: wrap;
        transform: none !important; left: 0 !important; transition: none;
    }
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tabs-scroll-button,
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tab-slider { display: none !important; }
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tooltip-root { min-width: 0; max-width: 100%; }
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tab { height: auto; max-width: 100%; border-bottom: 2px solid transparent; touch-action: manipulation; }
    .mud-tabs:not(.mud-tabs-vertical) > .mud-tabs-tabbar .mud-tab-active { border-bottom-color: currentColor; }
    .mud-alert-message { min-width: 0; overflow-wrap: anywhere; }
}

/* An autocomplete is an editable field: its dismissal layer must not cover
   the input or consume the first tap on the next field. form-focus.js closes
   suggestions on focus/click outside while keeping suggestion items usable. */
@media (max-width: 900px) {
    .mud-autocomplete .mud-overlay,
    :has(> .mud-autocomplete) > .mud-overlay { pointer-events: none; }
}

/* One Save beside Back in every host; mobile keeps its compact action grid. */
#invoice-editor .invoice-actions { flex-wrap: wrap; }
.invoice-back-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
#invoice-editor .invoice-secondary-save { display: none !important; }
@media (max-width: 900px) {
    #invoice-editor .invoice-back-actions {
        flex: 0 0 100% !important; width: 100%; min-width: 0;
        display: flex !important; flex-flow: row nowrap !important; gap: 8px !important;
    }
    body #invoice-editor .invoice-back-actions > .app-back-button { flex: 0 1 auto !important; width: auto !important; }
    body #invoice-editor .invoice-back-actions > .invoice-top-save {
        display: inline-flex !important; flex: 0 0 auto !important;
        min-height: 36px !important; padding: 6px 10px !important;
    }
}
