/* v220 — modal Anggaran & Realisasi: lebar normal, tanpa scroll horizontal. */
:is(#modal,#foundationModal) .modal-card:has(.ab-modal) {
  width:min(980px,calc(100vw - 36px)) !important;
  max-width:980px !important;
  max-height:calc(100dvh - 32px) !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:24px !important;
  position:relative !important;
}

#modal .modal-card:has(.ab-modal) #modalBody,
#foundationModal .modal-card:has(.ab-modal) #foundationModalBody {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  max-height:calc(100dvh - 32px) !important;
  padding:28px 30px 30px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}

:is(#modal,#foundationModal) .modal-card:has(.ab-modal) > :is(.close,.modal-close) {
  position:absolute !important;
  inset:14px 14px auto auto !important;
  z-index:1000 !important;
  display:grid !important;
  place-items:center !important;
  width:38px !important;
  min-width:38px !important;
  height:38px !important;
  padding:0 !important;
  margin:0 !important;
  border:1px solid rgba(8,118,95,.14) !important;
  border-radius:50% !important;
  background:#eaf6f2 !important;
  color:#125448 !important;
  box-shadow:0 8px 22px rgba(18,84,72,.16) !important;
  opacity:1 !important;
  visibility:visible !important;
  font-size:22px !important;
  line-height:1 !important;
}

:is(#modal,#foundationModal) .modal-card:has(.ab-modal) > :is(.close,.modal-close):hover {
  background:#d9f1e9 !important;
  color:#073f37 !important;
}

:is(#modal,#foundationModal) .ab-modal,
:is(#modal,#foundationModal) .ab-modal form,
:is(#modal,#foundationModal) .ab-modal :is(.grid,.ab-form-section,#abLines,#abAttachments) {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}

:is(#modal,#foundationModal) .ab-modal {
  max-width:none !important;
  overflow-x:hidden !important;
}

:is(#modal,#foundationModal) .ab-modal-head,
:is(#modal,#foundationModal) .ab-detail-head {
  padding-right:54px !important;
}

#modal .ab-modal #abBudgetForm > .grid.two {
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

#modal .ab-modal #abBudgetForm > .grid.three {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

:is(#modal,#foundationModal) .ab-modal :is(label,input,select,textarea,button),
:is(#modal,#foundationModal) .ab-modal .grid > *,
:is(#modal,#foundationModal) .ab-line > *,
:is(#modal,#foundationModal) .ab-attachment > *,
:is(#modal,#foundationModal) .ab-realization-row > * {
  min-width:0 !important;
  max-width:100%;
}

:is(#modal,#foundationModal) .ab-line {
  grid-template-columns:minmax(170px,2fr) minmax(72px,.65fr) minmax(78px,.7fr) minmax(110px,1fr) minmax(110px,1fr) 34px !important;
}

@media (max-width:780px) {
  :is(#modal,#foundationModal).modal {
    padding:8px 8px 0 !important;
  }

  :is(#modal,#foundationModal) .modal-card:has(.ab-modal) {
    width:100% !important;
    max-width:100% !important;
    max-height:94dvh !important;
    border-radius:24px 24px 0 0 !important;
  }

  #modal .modal-card:has(.ab-modal) #modalBody,
  #foundationModal .modal-card:has(.ab-modal) #foundationModalBody {
    max-height:94dvh !important;
    padding:24px 17px calc(22px + env(safe-area-inset-bottom)) !important;
    scrollbar-gutter:auto;
  }

  :is(#modal,#foundationModal) .modal-card:has(.ab-modal) > :is(.close,.modal-close) {
    position:fixed !important;
    top:calc(14px + env(safe-area-inset-top)) !important;
    right:18px !important;
  }

  :is(#modal,#foundationModal) .ab-modal-head,
  :is(#modal,#foundationModal) .ab-detail-head {
    padding-right:48px !important;
  }

  #modal .ab-modal #abBudgetForm > :is(.grid.two,.grid.three) {
    grid-template-columns:minmax(0,1fr) !important;
    gap:13px !important;
  }

  :is(#modal,#foundationModal) .ab-line-head {
    display:none !important;
  }

  :is(#modal,#foundationModal) .ab-line {
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:8px !important;
    padding:12px !important;
    border:1px solid #deebe7;
    border-radius:13px;
    background:#fff;
  }

  :is(#modal,#foundationModal) .ab-line input[name="description"] {
    grid-column:1/-1 !important;
  }

  :is(#modal,#foundationModal) .ab-line :is(b,.ab-remove) {
    align-self:center;
  }

  :is(#modal,#foundationModal) .ab-attachment {
    grid-template-columns:minmax(0,1fr) 34px !important;
  }

  :is(#modal,#foundationModal) .ab-attachment input[name="attachmentUrl"] {
    grid-column:1/2 !important;
  }
}

@media (max-width:480px) {
  :is(#modal,#foundationModal) .ab-line {
    grid-template-columns:minmax(0,1fr) !important;
  }

  :is(#modal,#foundationModal) .ab-line > * {
    grid-column:1 !important;
  }

  :is(#modal,#foundationModal) .ab-form-actions {
    display:grid !important;
    grid-template-columns:1fr !important;
  }
}