:root {
  --dmwi-ink: #141721;
  --dmwi-muted: #667085;
  --dmwi-line: #e5e7eb;
  --dmwi-surface: #ffffff;
  --dmwi-soft: #f5f7fb;
  --dmwi-blue: #437ca4;
  --dmwi-violet: #4e32a8;
  --dmwi-red: #d80b57;
  --dmwi-orange: #ffb24c;
}

.dmwi {
  box-sizing: border-box;
  color: var(--dmwi-ink);
  font-family: Figtree, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.dmwi *, .dmwi *::before, .dmwi *::after { box-sizing: inherit; }

.dmwi-dashboard {
  align-items: center;
  background: var(--dmwi-ink);
  border-radius: 22px;
  color: #fff;
  display: flex;
  gap: 28px;
  justify-content: space-between;
  margin-top: 28px;
  overflow: hidden;
  padding: 34px 36px;
  position: relative;
}

.dmwi-dashboard::before,
.dmwi-hero::before,
.dmwi-document::before {
  background: linear-gradient(90deg, var(--dmwi-blue), var(--dmwi-violet) 37%, var(--dmwi-red) 70%, var(--dmwi-orange));
  content: "";
  height: 4px;
  inset: 0 0 auto;
  position: absolute;
}

.dmwi-dashboard h2 { color: inherit; font-size: clamp(25px, 4vw, 36px); margin: 4px 0 8px; }
.dmwi-dashboard p { color: #d7d9e0; margin: 0; }
.dmwi-eyebrow { font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }

.dmwi-button {
  align-items: center;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 999px;
  color: var(--dmwi-ink) !important;
  display: inline-flex;
  flex: 0 0 auto;
  font-weight: 800;
  gap: 12px;
  justify-content: center;
  padding: 13px 20px;
  text-decoration: none !important;
}

.dmwi-portal { color: #f7f8fa; margin: 0 auto; max-width: 1120px; padding: 12px 0 50px; }
.dmwi-hero {
  background: var(--dmwi-ink);
  border-radius: 18px;
  color: #fff;
  display: block;
  margin-bottom: 18px;
  min-height: 0;
  overflow: hidden;
  padding: 24px 28px 26px;
  position: relative;
}
.dmwi.dmwi-portal .dmwi-hero h1 { color: #fff; font-size: clamp(30px, 4vw, 42px); letter-spacing: -.035em; line-height: 1.08; margin: 0 0 5px !important; padding: 0 !important; }
.dmwi.dmwi-portal .dmwi-hero p { color: #d7d9e0; font-size: 16px; line-height: 1.45; margin: 0 !important; padding: 0 !important; }

.dmwi-empty {
  background: var(--dmwi-soft);
  border: 1px solid var(--dmwi-line);
  border-radius: 20px;
  padding: 32px;
}
.dmwi-empty h2 { margin-top: 0; }

.dmwi-portal .dmwi-empty {
  background: #1b2434;
  border-color: #354557;
  color: #f7f8fa;
}
.dmwi-portal .dmwi-empty h2 { color: #f7f8fa; }
.dmwi-portal .dmwi-empty p { color: #b8c5d4; }

.dmwi-table-wrap { background: #fff; border: 1px solid var(--dmwi-line); border-radius: 20px; overflow: hidden; }
.dmwi-table { border-collapse: collapse; margin: 0; width: 100%; }
.dmwi-table th, .dmwi-table td { border-bottom: 1px solid var(--dmwi-line); padding: 18px 20px; text-align: left; }
.dmwi-table tbody tr:last-child td { border-bottom: 0; }
.dmwi-table th { background: var(--dmwi-soft); color: var(--dmwi-muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.dmwi-table td strong, .dmwi-table td small { display: block; }
.dmwi-table td small { color: var(--dmwi-muted); margin-top: 3px; }
.dmwi-link { color: var(--dmwi-violet); font-weight: 800; text-decoration: none; white-space: nowrap; }

.dmwi-portal .dmwi-table-wrap {
  background: #1b2434;
  border-color: #354557;
}
.dmwi-portal .dmwi-table th,
.dmwi-portal .dmwi-table td { border-color: #354557; }
.dmwi-portal .dmwi-table th {
  background: #202a3b;
  color: #aebdce;
}
.dmwi-portal .dmwi-table td { color: #f7f8fa; }
.dmwi-portal .dmwi-table td strong { color: #f7f8fa; }
.dmwi-portal .dmwi-table td small { color: #aebdce; }
.dmwi-portal .dmwi-table tbody tr { background: #1b2434; }
.dmwi-portal .dmwi-table tbody tr:hover { background: #222c3f; }
.dmwi-portal .dmwi-link { color: #f7b0d0; }

.dmwi-document-shell { background: #f0f2f6; color: var(--dmwi-ink); font-family: Figtree, Inter, system-ui, sans-serif; margin: 0; padding: 38px 18px; }
.dmwi-document {
  background: #fff;
  border: 1px solid var(--dmwi-line);
  border-radius: 20px;
  box-shadow: 0 18px 70px rgba(20,23,33,.08);
  margin: 0 auto;
  max-width: 940px;
  overflow: hidden;
  padding: 48px;
  position: relative;
}
.dmwi-document-head { align-items: flex-start; display: flex; gap: 30px; justify-content: space-between; padding-top: 12px; }
.dmwi-document-head h1 { font-size: 42px; letter-spacing: -.04em; margin: 8px 0; }
.dmwi-document-head p { color: var(--dmwi-muted); margin: 0; }
.dmwi-document-brand { align-items: flex-end; display: flex; flex-direction: column; gap: 5px; text-align: right; }
.dmwi-document-customer { background: var(--dmwi-soft); border-radius: 16px; display: flex; flex-direction: column; gap: 4px; margin: 38px 0; padding: 20px; }
.dmwi-document-customer span, .dmwi-document-customer small { color: var(--dmwi-muted); }
.dmwi-document-lines { border-collapse: collapse; width: 100%; }
.dmwi-document-lines th, .dmwi-document-lines td { border-bottom: 1px solid var(--dmwi-line); padding: 15px 12px; text-align: left; vertical-align: top; }
.dmwi-document-lines th { color: var(--dmwi-muted); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.dmwi-document-lines th:last-child, .dmwi-document-lines td:last-child { text-align: right; }
.dmwi-document-totals { margin: 28px 0 0 auto; max-width: 360px; }
.dmwi-document-totals div { display: flex; justify-content: space-between; padding: 8px 0; }
.dmwi-document-totals .is-total { border-top: 2px solid var(--dmwi-ink); font-size: 21px; margin-top: 8px; padding-top: 14px; }
.dmwi-document-note { color: var(--dmwi-muted); font-size: 13px; margin-top: 38px; }
.dmwi-document-actions { align-items: center; border-top: 1px solid var(--dmwi-line); display: flex; gap: 18px; justify-content: flex-end; margin-top: 24px; padding-top: 24px; }
.dmwi-document-actions a { color: var(--dmwi-ink); font-weight: 700; text-decoration: none; }

@media (max-width: 720px) {
  .dmwi-dashboard, .dmwi-document-head { align-items: stretch; flex-direction: column; }
  .dmwi-dashboard .dmwi-button { width: 100%; }
  .dmwi-hero { border-radius: 16px; padding: 22px 20px 24px; }
  .dmwi-table thead { display: none; }
  .dmwi-table, .dmwi-table tbody, .dmwi-table tr, .dmwi-table td { display: block; width: 100%; }
  .dmwi-table tr { border-bottom: 1px solid var(--dmwi-line); padding: 14px 0; }
  .dmwi-table td { border: 0; padding: 5px 20px; }
  .dmwi-document { padding: 32px 20px; }
  .dmwi-document-brand { align-items: flex-start; text-align: left; }
  .dmwi-document-lines { font-size: 13px; }
  .dmwi-document-lines th, .dmwi-document-lines td { padding: 10px 5px; }
  .dmwi-document-actions { align-items: stretch; flex-direction: column; }
}

@media print {
  .dmwi-document-shell { background: #fff; padding: 0; }
  .dmwi-document { border: 0; border-radius: 0; box-shadow: none; max-width: none; padding: 20mm 14mm; }
  .dmwi-document-actions { display: none; }
}