/* Mobile finance and mail layouts. Loaded after the application stylesheet.
   Screen-only rules deliberately leave printed invoices and reports unchanged. */
@media screen and (max-width: 767px) {
  /* Only form grids are collapsed; invoice tables retain all their columns. */
  html:is([data-ddd-page="fakturisanje"], [data-ddd-page="naplata"], [data-ddd-page="ulazne-fakture"], [data-ddd-page="dobavljaci-ulaz"], [data-ddd-page="blagajna"], [data-ddd-page="putni-nalozi"], [data-ddd-page="posta"])
    :is(.ddd-pageShell, .ddd-modalBody) .ddd-field {
    min-width: 0 !important;
    max-width: 100%;
  }

  html:is([data-ddd-page="fakturisanje"], [data-ddd-page="naplata"], [data-ddd-page="ulazne-fakture"], [data-ddd-page="dobavljaci-ulaz"], [data-ddd-page="blagajna"], [data-ddd-page="putni-nalozi"], [data-ddd-page="posta"])
    :is(.ddd-pageShell, .ddd-modalBody) :is(.ddd-grid, div[style*="grid-template-columns"]):has(> .ddd-field) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html:is([data-ddd-page="fakturisanje"], [data-ddd-page="naplata"], [data-ddd-page="ulazne-fakture"], [data-ddd-page="dobavljaci-ulaz"], [data-ddd-page="blagajna"], [data-ddd-page="putni-nalozi"], [data-ddd-page="posta"])
    .ddd-pageIntroAside {
    align-items: stretch;
  }

  html:is([data-ddd-page="fakturisanje"], [data-ddd-page="naplata"], [data-ddd-page="ulazne-fakture"], [data-ddd-page="dobavljaci-ulaz"], [data-ddd-page="blagajna"], [data-ddd-page="putni-nalozi"], [data-ddd-page="posta"])
    .ddd-pageIntroAside > :is(.ddd-field, .ddd-btn) {
    flex: 1 1 150px;
    max-width: 100%;
    white-space: normal;
  }

  /* Billing controls, review forms and fiscal actions. */
  .ddd-billingHeroControls,
  .ddd-billingSectionOrderToolbarActions,
  .ddd-invoicePipelineTools,
  .ddd-fieldExtraFilters,
  .ddd-billingSectionActions,
  .ddd-finalizedToolbarGroup,
  .ddd-billingModalFooterActions,
  .ddd-elinkFiscalActions {
    min-width: 0;
    width: 100%;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-start;
  }

  :is(.ddd-billingHeroControls, .ddd-billingSectionOrderToolbarActions,
      .ddd-invoicePipelineTools, .ddd-fieldExtraFilters, .ddd-billingSectionActions,
      .ddd-finalizedToolbarGroup, .ddd-billingModalFooterActions, .ddd-elinkFiscalActions)
    > :is(.ddd-btn, .ddd-field) {
    flex: 1 1 150px;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    white-space: normal;
  }

  .ddd-billingModeTabs {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .ddd-billingModeTabs > .ddd-btn {
    width: 100%;
    min-height: 46px;
    text-align: left;
    justify-content: flex-start;
  }

  .ddd-billingSectionOrderControl,
  .ddd-invoicePipelineHead,
  .ddd-fieldExtraTopline,
  .ddd-preparedObjectHead,
  .ddd-invoiceReviewSectionHead,
  .ddd-invoiceLineItemHead {
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
  }

  .ddd-billingSectionOrderButton,
  .ddd-preparedObjectRemoveLine {
    min-width: 44px;
    min-height: 44px;
  }

  .ddd-billingInvoiceTableWrap,
  .ddd-fieldExtraTableWrap,
  .ddd-preparedObjectServices {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  /* Keep headings associated with service cells in this grid-based table. */
  .ddd-preparedObjectServicesHead,
  .ddd-preparedObjectServiceRow {
    min-width: 780px;
    grid-template-columns: minmax(180px, 1.5fr) 120px 100px 110px 110px 44px;
  }

  .ddd-invoiceReviewForm {
    padding: 10px;
    gap: 12px;
    min-width: 0;
  }

  .ddd-invoiceReviewFields,
  .ddd-invoiceReviewBottomGrid,
  .ddd-invoiceLineItem,
  .ddd-invoiceObjectGrid,
  .ddd-elinkFiscalCards,
  .ddd-elinkFiscalGrid,
  .ddd-elinkFiscalPeriodGrid {
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
  }

  .ddd-invoiceReviewSection,
  .ddd-invoiceLineItem,
  .ddd-invoicePricingCard,
  .ddd-elinkFiscalBody,
  .ddd-elinkFiscalToggle {
    padding: 12px;
  }

  .ddd-invoicePricingCard > div[style*="grid-template-columns"] {
    grid-template-columns: minmax(0, 1fr) auto !important;
    overflow-wrap: anywhere;
  }

  .ddd-invoiceReviewFooter,
  .ddd-elinkFiscalHeadRight {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .ddd-invoiceReviewFooter .ddd-btn {
    min-height: 44px;
    white-space: normal;
  }

  .ddd-elinkFiscalIntro,
  .ddd-elinkFiscalCard {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .ddd-bulkProgressGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Collection statements and cash vouchers have explicit desktop columns. */
  html[data-ddd-page="naplata"] .ddd-pageShell > .ddd-panel > div[style*="1.1fr"],
  html[data-ddd-page="naplata"] .ddd-modalBody div[style*="grid-template-columns: repeat(3"],
  html[data-ddd-page="blagajna"] .ddd-pageShell div[style*="grid-template-columns: 2fr 1fr 1fr"],
  html[data-ddd-page="dobavljaci-ulaz"] .ddd-pageShell > section[style*="grid-template-columns"],
  html[data-ddd-page="ulazne-fakture"] .ddd-modalBody > div[style*="minmax(720px"] {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0;
  }

  .ddd-collectionFilters {
    grid-template-columns: minmax(0, 1fr);
  }

  .ddd-collectionFilters > .ddd-btn {
    margin-top: 0;
    min-height: 44px;
    white-space: normal;
  }

  .ddd-collectionClientSuggestions {
    max-height: 36vh;
    max-height: 36dvh;
  }

  .ddd-collectionClientSuggestion {
    min-height: 48px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  /* Incoming invoices, scanning and VAT export. */
  .incoming-transfer-row,
  .incoming-scan-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .incoming-scan-body,
  .incoming-editor-dialog .ddd-panel,
  .incoming-kuf-preview {
    min-width: 0;
    max-width: 100%;
  }

  .incoming-invoice-actions,
  .incoming-scan-actions,
  .incoming-scan-files li {
    flex-wrap: wrap;
  }

  :is(.incoming-invoice-actions, .incoming-scan-actions, .incoming-kuf-controls) .ddd-btn,
  .incoming-vat-editor .ddd-btn,
  .incoming-received-date-editor .ddd-btn {
    min-height: 44px;
    white-space: normal;
  }

  .incoming-scan-actions > .ddd-btn,
  .incoming-kuf-controls > :is(.ddd-field, .ddd-btn) {
    flex: 1 1 150px;
    min-width: 0;
    max-width: 100%;
  }

  .incoming-kuf-export,
  .incoming-scan-upload,
  .incoming-scan-line {
    padding: 12px;
  }

  .incoming-kuf-scroll {
    max-width: 100%;
    max-height: 58vh;
    max-height: 58dvh;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .incoming-material-options {
    max-height: 32vh;
    max-height: 32dvh;
  }

  /* Mailbox and reader stack without making the page wider than the phone. */
  html[data-ddd-page="outlook-mail"] .ddd-pageIntro {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
  }

  html[data-ddd-page="outlook-mail"] .ddd-pageIntro > .ddd-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
    max-width: 100%;
    justify-items: stretch;
  }

  html[data-ddd-page="outlook-mail"] .ddd-pageIntro > .ddd-actions > :is(.ddd-btn, .ddd-badge),
  .ddd-outlookAccountsBarLabel,
  .ddd-outlookAccountsSelect {
    min-width: 0;
    max-width: 100%;
    margin-left: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html[data-ddd-page="outlook-mail"] .ddd-pageIntro > .ddd-actions > .ddd-btn,
  .ddd-outlookAccountsSelect {
    width: 100%;
    min-height: 44px;
  }

  .ddd-outlookWorkspace {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0;
  }

  .ddd-outlookMailboxPanel,
  .ddd-outlookPreviewPane,
  .ddd-outlookPreviewBody,
  .ddd-outlookComposeMain,
  .ddd-outlookComposeAside {
    min-width: 0;
    max-width: 100%;
  }

  .ddd-outlookMailboxPanel {
    padding: 12px !important;
  }

  .ddd-outlookMailboxTopbar,
  .ddd-outlookToolbarFilters,
  .ddd-outlookPreviewActions,
  .ddd-outlookPager {
    flex-wrap: wrap;
    gap: 8px;
  }

  :is(.ddd-outlookMailboxTopbar, .ddd-outlookToolbarFilters, .ddd-outlookPreviewActions, .ddd-outlookPager) .ddd-btn {
    min-height: 44px;
    max-width: 100%;
    white-space: normal;
  }

  .ddd-outlookSearch,
  .ddd-outlookFilterDrawer > summary {
    min-height: 44px;
  }

  .ddd-outlookSearch input {
    font-size: 16px;
  }

  .ddd-outlookListScroller {
    max-height: 54vh;
    max-height: 54dvh;
    min-width: 0;
    padding: 4px;
    -webkit-overflow-scrolling: touch;
  }

  .ddd-outlookMessageCard {
    padding: 12px;
  }

  .ddd-outlookMessageTopRow {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 8px;
  }

  .ddd-outlookMessageCheck {
    width: 36px;
    height: 44px;
  }

  .ddd-outlookMessageCheck input {
    width: 20px;
    height: 20px;
  }

  .ddd-outlookMessageIdentity {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 8px;
  }

  .ddd-outlookMessageAvatar {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .ddd-outlookMessageMetaStack {
    grid-column: 2;
    min-width: 0;
    justify-items: start;
  }

  .ddd-outlookMessageTags {
    justify-content: flex-start;
    gap: 5px;
  }

  .ddd-outlookMessageTags .ddd-badge,
  .ddd-outlookMessageCounterparty,
  .ddd-outlookMessageSubject,
  .ddd-outlookDetailMeta,
  .ddd-outlookPreviewTitle,
  .ddd-outlookPlainBody {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .ddd-outlookPlainBody {
    white-space: pre-wrap;
  }

  .ddd-outlookPreviewPane {
    border-left: 0;
    border-radius: 16px;
    padding: 12px;
    scroll-margin-top: 80px;
  }

  .ddd-outlookPreviewPane::before {
    content: none;
  }

  .ddd-outlookPreviewHead {
    flex-direction: column;
    align-items: stretch;
  }

  .ddd-outlookPreviewAttachments,
  .ddd-outlookAttachmentList {
    grid-template-columns: minmax(0, 1fr);
  }

  .ddd-outlookDetailBody {
    min-width: 0;
    max-width: 100%;
    padding: 12px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ddd-outlookDocName,
  .ddd-outlookAttachmentChip {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .ddd-outlookComposeModal {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  .ddd-outlookComposeMain {
    grid-template-rows: auto auto auto minmax(240px, 1fr) auto;
    border-right: 0;
  }

  .ddd-outlookRibbon,
  .ddd-outlookComposeSwitches,
  .ddd-outlookAttachmentList,
  .ddd-outlookComposeAside {
    padding: 12px;
  }

  .ddd-outlookRibbonGroup {
    flex-wrap: wrap;
    max-width: 100%;
  }

  .ddd-outlookToolBtn,
  .ddd-outlookSendBtn,
  .ddd-outlookColorInput {
    min-height: 44px;
  }

  .ddd-outlookMetaRow {
    grid-template-columns: minmax(0, 1fr);
  }

  .ddd-outlookEditor {
    min-height: 240px;
    padding: 14px;
    font-size: 16px;
    overflow-wrap: anywhere;
  }

  .ddd-outlookAttachmentPreview,
  .ddd-outlookAttachmentFrame {
    min-height: 55vh;
    min-height: 55dvh;
    max-width: 100%;
  }
}