/* Complete browser invoice document: one stable page, one natural viewport scroll. */
body.mary-web-invoice-document-open { overflow: hidden; }

.mary-web-account .mary-web-invoice-document {
  --invoice-navy: var(--ink, #102d49);
  --invoice-blue: var(--brand, #123a60);
  --invoice-gold: var(--gold, #e5aa2c);
  --invoice-line: var(--line, #dce5ee);
  position: fixed;
  inset: 0;
  z-index: 400000;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  color: var(--invoice-navy);
  background: #e8eef4;
  font-family: "AppArabic", "Segoe UI", "Noto Sans Arabic", Tahoma, sans-serif;
}

.mary-web-account .mary-web-invoice-document__toolbar {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 68px;
  padding: 10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));
  color: #fff;
  background: var(--invoice-navy);
  box-shadow: 0 8px 24px rgba(16, 45, 73, .2);
}

.mary-web-account .mary-web-invoice-document__toolbar::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--invoice-blue) 0 76%, var(--invoice-gold) 76% 100%);
}

.mary-web-account .mary-web-invoice-document__title {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mary-web-account .mary-web-invoice-document__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mary-web-account .mary-web-invoice-document__action {
  min-width: 44px;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 12px;
  color: #fff;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
  cursor: pointer;
}

.mary-web-account .mary-web-invoice-document__action:hover:not(:disabled) { background: rgba(255, 255, 255, .1); }
.mary-web-account .mary-web-invoice-document__print { border-color: var(--invoice-gold); color: #251900; background: var(--invoice-gold); }
.mary-web-account .mary-web-invoice-document__print:hover:not(:disabled) { background: #f0bd4e; }
.mary-web-account .mary-web-invoice-document__action:disabled { cursor: wait; opacity: .55; }
.mary-web-account .mary-web-invoice-document__action:focus-visible,
.mary-web-account .mary-web-invoice-document__viewport:focus-visible { outline: 3px solid var(--invoice-gold); outline-offset: 2px; }

.mary-web-account .mary-web-invoice-document__viewport {
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #7890a8 #dce5ee;
  scrollbar-width: thin;
  padding: 28px max(18px, calc((100vw - 900px) / 2)) 48px;
}

.mary-web-account .mary-web-invoice-document__frame {
  --mary-invoice-page-scale: 1;
  position: relative;
  width: 794px;
  height: 1123px;
  margin-inline: auto;
  flex: none;
}

.mary-web-account .mary-web-invoice-document__paper {
  position: absolute;
  inset: 0 auto auto 0;
  width: 794px;
  min-height: 1123px;
  padding: 54px 58px;
  overflow: visible;
  color: #152238;
  background: #fff;
  box-shadow: 0 18px 48px rgba(16, 45, 73, .18);
  transform: scale(var(--mary-invoice-page-scale));
  transform-origin: top left;
}

.mary-web-account .mary-web-invoice-document__paper > .doc-card {
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.mary-web-account .mary-web-invoice-document__paper .doc-tscroll { width: 100%; overflow: visible; }
.mary-web-account .mary-web-invoice-document__paper table { width: 100%; min-width: 0; table-layout: fixed; }
.mary-web-account .mary-web-invoice-document__paper th,
.mary-web-account .mary-web-invoice-document__paper td { min-width: 0; overflow-wrap: anywhere; white-space: normal; }
.mary-web-account .mary-web-invoice-document__paper bdi { font-variant-numeric: tabular-nums; }
.mary-web-account .mary-web-invoice-document__paper .phone-invoice-scroll-hint { display: none; }

.mary-web-account .mary-web-invoice-document.is-fit-width .mary-web-invoice-document__frame { width: 100%; height: auto; }
.mary-web-account .mary-web-invoice-document.is-fit-width .mary-web-invoice-document__paper { position: static; width: 100%; min-height: 0; transform: none; }

@media (max-width: 599px) {
  .mary-web-account .mary-web-invoice-document__toolbar { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; min-height: 62px; padding-block: 8px; }
  .mary-web-account .mary-web-invoice-document__title { font-size: 15px; }
  .mary-web-account .mary-web-invoice-document__action { padding-inline: 11px; font-size: 12px; }
  .mary-web-account .mary-web-invoice-document__viewport { padding: 12px 0 32px; }
  .mary-web-account .mary-web-invoice-document.is-fit-width .mary-web-invoice-document__paper { width: 100%; min-height: 100%; padding: 26px 16px 40px; box-shadow: none; }
  .mary-web-account .mary-web-invoice-document__paper .doc-head-pro,
  .mary-web-account .mary-web-invoice-document__paper .doc-info-grid { grid-template-columns: minmax(0, 1fr); }
  .mary-web-account .mary-web-invoice-document__paper table { font-size: 11px; }
  .mary-web-account .mary-web-invoice-document__paper th,
  .mary-web-account .mary-web-invoice-document__paper td { padding-inline: 4px; }
}

@media (max-width: 430px) {
  .mary-web-account .mary-web-invoice-document__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .mary-web-account .mary-web-invoice-document__toolbar { grid-template-columns: auto 1fr auto; }
  .mary-web-account .mary-web-invoice-document__actions { gap: 4px; }
  .mary-web-account .mary-web-invoice-document__action { padding-inline: 8px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .mary-web-account .mary-web-invoice-document * { scroll-behavior: auto !important; }
}

@media print {
  body.mary-web-account.mary-web-invoice-document-print > :not(.mary-web-invoice-document) { display: none !important; }
  body.mary-web-invoice-document-print .mary-web-account > :not(.mary-web-invoice-document) { display: none !important; }
  body.mary-web-invoice-document-print .mary-web-invoice-document { position: static; display: block; overflow: visible; background: #fff; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__toolbar { display: none !important; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__viewport { overflow: visible; padding: 0; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__frame { width: 100% !important; height: auto !important; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__paper { position: static; width: 100%; min-height: 0; padding: 0; box-shadow: none; transform: none; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__paper thead { display: table-header-group; }
  body.mary-web-invoice-document-print .mary-web-invoice-document__paper tr { break-inside: avoid; }
  body.mary-financial-print .mary-web-invoice-document { display: none !important; }
}