/* CMD P17.1-H5 — consistent Mobile form, keyboard, safe-area and file presentation. */

:root {
  --cmd-mobile-form-height-p17h5: 100dvh;
}

@media (max-width: 760px), (orientation: landscape) and (max-height: 600px) and (max-width: 980px) {
body.cmd-p17-mobile dialog.cmd-mobile-form-dialog-p17h5[open] {
  width: calc(100vw - 8px) !important;
  max-width: calc(100vw - 8px) !important;
  height: calc(var(--cmd-mobile-form-height-p17h5) - 8px);
  max-height: calc(var(--cmd-mobile-form-height-p17h5) - 8px);
  margin: 4px auto;
  border-radius: 14px;
  overflow: hidden;
}

body.cmd-p17-mobile dialog.cmd-mobile-form-dialog-p17h5 > .cmd-mobile-form-shell-p17h5,
body.cmd-p17-mobile dialog.cmd-mobile-form-dialog-p17h5 > .cmd-mobile-form-shell-p17h5.wide {
  display: flex;
  flex-direction: column;
  width: 100% !important;
  max-width: 100% !important;
  height: 100%;
  max-height: 100%;
  min-width: 0;
  padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-x: none;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  scroll-padding-block: 72px 104px;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 > .dialog-header {
  flex: 0 0 auto;
  min-width: 0;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--cmd-color-border, var(--line));
  background: var(--cmd-color-surface, #fff);
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 > .dialog-header > :first-child,
body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 > .dialog-header h3,
body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 > .dialog-header small {
  min-width: 0;
  overflow-wrap: anywhere;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 :is(.form-grid, .item-grid, label, input, select, textarea) {
  min-width: 0;
  max-width: 100%;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea, button) {
  min-height: 44px;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 textarea {
  resize: vertical;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .cmd-mobile-file-field-p17h5 {
  min-width: 0;
  padding: 10px;
  border: 1px dashed color-mix(in srgb, var(--cmd-color-primary, var(--primary)) 42%, var(--cmd-color-border, var(--line)));
  border-radius: 12px;
  background: color-mix(in srgb, var(--cmd-color-primary-soft, var(--secondary)) 45%, #fff);
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .cmd-mobile-file-input-p17h5 {
  width: 100%;
  max-width: 100%;
  padding: 6px;
  overflow: hidden;
  white-space: normal;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .cmd-mobile-file-input-p17h5::file-selector-button {
  min-height: 38px;
  margin-right: 8px;
  border: 1px solid var(--cmd-color-border, var(--line));
  border-radius: 9px;
  padding: 7px 10px;
  background: var(--cmd-color-surface, #fff);
  color: var(--cmd-color-primary-strong, var(--primary-dark));
  font-weight: 750;
}

body.cmd-p17-mobile .cmd-mobile-file-status-p17h5 {
  display: block;
  min-width: 0;
  margin-top: 5px;
  color: var(--cmd-color-muted, var(--muted));
  font-size: .7rem;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 :is(.existing-files, .attachment-list) {
  min-width: 0;
}

body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 :is(.existing-file, .attachment-row) {
  min-width: 0;
  overflow-wrap: anywhere;
}

body.cmd-p17-mobile .cmd-mobile-form-actions-p17h5 {
  position: sticky;
  bottom: -10px;
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
  flex: 0 0 auto;
  gap: 8px;
  margin: 18px -10px 0;
  padding: 10px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
  border-top: 1px solid var(--cmd-color-border, var(--line));
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -8px 22px rgba(15, 23, 42, .07);
  backdrop-filter: blur(10px);
}

body.cmd-p17-mobile .cmd-mobile-form-actions-p17h5 > .btn {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding-inline: 8px;
  white-space: normal;
}

body.cmd-p17-mobile .cmd-mobile-form-actions-p17h5:has(> :nth-child(3)) > .primary:last-child {
  grid-column: 1 / -1;
}

/* H5 debt-detail corrections: preserve accounting meaning after H4 turns the footer into a card. */
body.cmd-p17-mobile .qscm-debt-detail-table .qscm-debt-detail-total-empty-p17h5 {
  display: none !important;
}

body.cmd-p17-mobile .qscm-debt-detail-table :is(th, td):nth-child(8) {
  text-align: right;
}

body.cmd-p17-mobile .qscm-debt-detail-table .qscm-debt-detail-total-label-p17h5 {
  grid-column: 1 / -1;
  text-align: left;
}

body.cmd-p17-mobile .qscm-debt-detail-table .qscm-debt-detail-total-value-p17h5 {
  text-align: right;
}
}

@media (max-width: 760px) {
  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .form-grid > .span-2 {
    grid-column: auto;
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .item-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .item-grid > [class*="col-"] {
    grid-column: 1 / -1;
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 :is(.existing-file, .attachment-row) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    align-items: start;
  }

  body.cmd-p17-mobile.cmd-mobile-keyboard-focus .cmd-mobile-form-actions-p17h5 {
    padding-bottom: 8px;
  }
}

@media (orientation: landscape) and (max-height: 600px) and (max-width: 980px) {
  body.cmd-p17-mobile dialog.cmd-mobile-form-dialog-p17h5[open] {
    width: calc(100vw - 6px) !important;
    max-width: calc(100vw - 6px) !important;
    height: calc(var(--cmd-mobile-form-height-p17h5) - 6px);
    max-height: calc(var(--cmd-mobile-form-height-p17h5) - 6px);
    margin: 3px auto;
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.cmd-p17-mobile .cmd-mobile-form-shell-p17h5 .form-grid > .span-2 {
    grid-column: 1 / -1;
  }
}
