/* Customer dashboard refresh, scoped to the client home view. */
body.customers .wmpt-client-dashboard {
  color: #17233a;
}

body.customers .navbar-default.header {
  min-height: 72px;
  border: 0;
  background: #10213f;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.customers .navbar-default.header .container {
  display: flex;
  align-items: center;
  min-height: 72px;
}

body.customers .navbar-default.header .navbar-header {
  display: flex;
  align-items: center;
}

body.customers .navbar-default.header .wmpt-customer-logo {
  display: flex;
  align-items: center;
  height: 72px;
  padding: 0;
}

body.customers .navbar-default.header .wmpt-customer-logo img {
  display: block;
  width: min(230px, 48vw);
  max-height: 42px;
  object-fit: contain;
}

body.customers .navbar-default.header .navbar-collapse {
  flex: 1 1 auto;
}

body.customers .navbar-default.header .navbar-nav > li > a {
  margin: 16px 3px;
  padding: 10px 13px;
  border-radius: 9px;
  color: rgba(255, 255, 255, 0.86) !important;
  font-weight: 800;
}

body.customers .navbar-default.header .navbar-nav > li > a:hover,
body.customers .navbar-default.header .navbar-nav > li > a:focus {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

body.customers .navbar-default.header .navbar-nav > .active > a,
body.customers .navbar-default.header .navbar-nav > .active > a:hover,
body.customers .navbar-default.header .navbar-nav > .active > a:focus,
body.customers .navbar-default.header .navbar-nav > .open > a,
body.customers .navbar-default.header .navbar-nav > .open > a:hover,
body.customers .navbar-default.header .navbar-nav > .open > a:focus {
  background: #2563eb !important;
  color: #ffffff !important;
}

body.customers .navbar-default.header .navbar-nav > .active > a i,
body.customers .navbar-default.header .navbar-nav > .open > a i {
  color: #ffffff !important;
}

body.customers .navbar-default.header .navbar-toggle {
  margin-top: 19px;
  border-color: rgba(255, 255, 255, 0.24);
}

body.customers .navbar-default.header .navbar-toggle .icon-bar {
  background: #ffffff;
}

body.customers .navbar-default.header .dropdown-menu {
  border: 1px solid #dbe4ef;
  border-radius: 10px;
  box-shadow: 0 16px 36px rgba(15, 32, 62, 0.14);
}

body.customers .navbar-default.header .dropdown-menu > li > a {
  color: #334155 !important;
  font-weight: 700;
}

body.customers .navbar-default.header .dropdown-menu > li.active > a,
body.customers .navbar-default.header .dropdown-menu > li > a:hover,
body.customers .navbar-default.header .dropdown-menu > li > a:focus {
  background: #eef5ff !important;
  color: #1d4ed8 !important;
}

body.customers #content > .container:has(.wmpt-client-dashboard) {
  width: min(1320px, calc(100% - 48px));
  max-width: none;
}

body.customers #content > .container:has(.wmpt-client-dashboard) > .row {
  margin-right: -12px;
  margin-left: -12px;
}

body.customers .wmpt-client-dashboard__hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  margin: 22px 0 22px;
  padding: 34px;
  border: 1px solid #dbe4ef;
  border-radius: 16px;
  background:
    radial-gradient(circle at 100% 0%, rgba(37, 99, 235, 0.16), transparent 34%),
    linear-gradient(135deg, #ffffff, #f7fbff);
  box-shadow: 0 18px 46px rgba(15, 32, 62, 0.08);
}

body.customers .wmpt-client-dashboard__eyebrow,
body.customers .wmpt-client-dashboard__section-kicker {
  display: block;
  margin-bottom: 8px;
  color: #2563eb;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body.customers .wmpt-client-dashboard__title {
  margin: 0;
  color: #101828;
  font-size: clamp(2rem, 3vw, 3.2rem);
  font-weight: 800;
  line-height: 1.05;
}

body.customers .wmpt-client-dashboard__intro {
  max-width: 680px;
  margin: 14px 0 0;
  color: #64748b;
  font-size: 1rem;
  line-height: 1.65;
}

body.customers .wmpt-client-dashboard__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

body.customers .wmpt-client-dashboard__action,
body.customers .wmpt-client-dashboard__section-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 15px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #ffffff;
  color: #334155 !important;
  font-weight: 800;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard__action--primary {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff !important;
}

body.customers .wmpt-client-dashboard__section {
  margin-bottom: 22px;
  padding: 24px;
  border: 1px solid #dbe4ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 32, 62, 0.055);
}

body.customers .wmpt-client-dashboard__section-header {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

body.customers .wmpt-client-dashboard__section-header h2 {
  margin: 0;
  color: #17233a;
  font-size: 1.35rem;
  font-weight: 800;
}

body.customers .wmpt-client-dashboard .projects-summary-heading,
body.customers .wmpt-client-dashboard .invoices-quick-info-heading {
  display: none;
}

body.customers .wmpt-client-dashboard dl.tw-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px !important;
  margin: 0 !important;
}

body.customers .wmpt-client-dashboard dl.tw-grid > a {
  min-height: 104px;
  border: 1px solid #d6e0eb !important;
  border-radius: 12px !important;
  background: #f9fbfd !important;
  color: #17233a !important;
  text-decoration: none !important;
  box-shadow: inset 3px 0 0 #2563eb, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard dl.tw-grid > a:nth-child(2) {
  box-shadow: inset 3px 0 0 #0284c7, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard dl.tw-grid > a:nth-child(3) {
  box-shadow: inset 3px 0 0 #f59e0b, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard dl.tw-grid > a:nth-child(4) {
  box-shadow: inset 3px 0 0 #16a34a, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard dl.tw-grid > a:nth-child(5) {
  box-shadow: inset 3px 0 0 #64748b, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard dl.tw-grid > a > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 102px;
  padding: 16px !important;
}

body.customers .wmpt-client-dashboard dl.tw-grid dt {
  color: #475569 !important;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.25;
  text-transform: uppercase;
}

body.customers .wmpt-client-dashboard dl.tw-grid dd {
  margin: 0 !important;
}

body.customers .wmpt-client-dashboard dl.tw-grid dd > div {
  color: #17233a !important;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
}

body.customers .wmpt-client-dashboard__invoice-panel {
  margin: 0;
  border: 0 !important;
  box-shadow: none !important;
}

body.customers .wmpt-client-dashboard__invoice-panel > .panel-body {
  padding: 0 !important;
  border: 0 !important;
}

body.customers .wmpt-client-dashboard .invoice-quick-info {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

body.customers .wmpt-client-dashboard .invoice-quick-info::before,
body.customers .wmpt-client-dashboard .invoice-quick-info::after {
  display: none;
}

body.customers .wmpt-client-dashboard .invoice-quick-info > [class*="col-"] {
  width: auto;
  min-height: 112px;
  padding: 16px;
  border: 1px solid #d6e0eb;
  border-radius: 12px;
  background: #f9fbfd;
  box-shadow: inset 3px 0 0 #dc2626, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard .invoice-quick-info > .invoices-stats-paid {
  box-shadow: inset 3px 0 0 #16a34a, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard .invoice-quick-info > .invoices-stats-overdue,
body.customers .wmpt-client-dashboard .invoice-quick-info > .invoices-stats-partially-paid {
  box-shadow: inset 3px 0 0 #f59e0b, 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.customers .wmpt-client-dashboard .invoice-quick-info > [class*="col-"] > .row {
  display: flex;
  flex-direction: column;
  min-height: 80px;
  margin: 0;
}

body.customers .wmpt-client-dashboard .invoice-quick-info .stats-status,
body.customers .wmpt-client-dashboard .invoice-quick-info .stats-numbers,
body.customers .wmpt-client-dashboard .invoice-quick-info .col-md-12 {
  width: 100%;
  padding: 0;
  text-align: left;
}

body.customers .wmpt-client-dashboard .invoice-quick-info .stats-status a {
  color: #475569 !important;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.25;
  text-decoration: none;
  text-transform: uppercase;
}

body.customers .wmpt-client-dashboard .invoice-quick-info .stats-numbers {
  order: -1;
  margin-bottom: 10px;
  color: #17233a;
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1;
}

body.customers .wmpt-client-dashboard .progress {
  height: 8px;
  margin: 13px 0 0;
  border-radius: 999px;
  background: #e9eef5;
  box-shadow: none;
}

body.customers .wmpt-client-dashboard .progress-bar {
  border-radius: inherit;
}

body.customers .wmpt-client-dashboard__chart-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

body.customers .wmpt-client-dashboard__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: end;
}

body.customers .wmpt-client-dashboard__filters .form-group {
  min-width: 160px;
  margin: 0;
}

body.customers .wmpt-client-dashboard__filters label {
  margin-bottom: 6px;
  color: #475569;
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

body.customers .wmpt-client-dashboard__filters .form-control,
body.customers .wmpt-client-dashboard__filters .bootstrap-select > .dropdown-toggle {
  min-height: 40px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #ffffff;
  box-shadow: none;
}

body.customers .wmpt-client-dashboard__chart {
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #ffffff;
}

body.customers .wmpt-client-dashboard__chart .relative {
  max-height: 360px !important;
}

body.customers .wmpt-client-dashboard .panel_s,
body.customers .wmpt-client-dashboard .panel-body {
  background: transparent;
}

@media (max-width: 991px) {
  body.customers #content > .container:has(.wmpt-client-dashboard) {
    width: min(100% - 32px, 760px);
  }

  body.customers .wmpt-client-dashboard__hero {
    grid-template-columns: 1fr;
    align-items: start;
    padding: 28px;
  }

  body.customers .wmpt-client-dashboard__actions {
    justify-content: flex-start;
  }

  body.customers .wmpt-client-dashboard dl.tw-grid,
  body.customers .wmpt-client-dashboard .invoice-quick-info {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body.customers .navbar-default.header .container {
    display: block;
    min-height: 64px;
    padding-right: 16px;
    padding-left: 16px;
  }

  body.customers .navbar-default.header .wmpt-customer-logo {
    height: 64px;
    margin-left: 52px;
  }

  body.customers .navbar-default.header .wmpt-customer-logo img {
    max-height: 36px;
  }

  body.customers .navbar-default.header .navbar-collapse {
    clear: both;
    margin-right: -16px;
    margin-left: -16px;
    padding: 8px 16px 14px;
    border-top-color: rgba(255, 255, 255, 0.14);
    background: #10213f !important;
  }

  body.customers .navbar-default.header #theme-navbar-collapse,
  body.customers .navbar-default.header #theme-navbar-collapse.in,
  body.customers .navbar-default.header #theme-navbar-collapse.collapsing,
  body.customers .navbar-default.header #theme-navbar-collapse.wpmaintain-mobile-nav-open {
    background: #10213f !important;
  }

  body.customers .navbar-default.header .navbar-collapse.in,
  body.customers .navbar-default.header #theme-navbar-collapse.in,
  body.customers .navbar-default.header #theme-navbar-collapse.collapsing,
  body.customers .navbar-default.header #theme-navbar-collapse.wpmaintain-mobile-nav-open {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  body.customers .navbar-default.header .navbar-toggle {
    float: left;
    width: 44px;
    min-height: 44px;
    margin: 10px 0;
    padding: 10px;
  }

  body.customers .navbar-default.header .navbar-nav {
    float: none !important;
    margin: 8px 0 14px;
  }

  body.customers .navbar-default.header .navbar-nav > li {
    display: block;
    float: none;
  }

  body.customers .navbar-default.header .navbar-nav > li > a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 44px;
    margin: 4px 0;
    color: #ffffff !important;
    background: transparent !important;
  }

  body.customers .navbar-default.header .navbar-nav > li > a:hover,
  body.customers .navbar-default.header .navbar-nav > li > a:focus,
  body.customers .navbar-default.header .navbar-nav > li.active > a,
  body.customers .navbar-default.header .navbar-nav > li.open > a {
    background: #2563eb !important;
    color: #ffffff !important;
  }

  body.customers #content > .container:has(.wmpt-client-dashboard) {
    width: 100%;
  }

  body.customers .wmpt-client-dashboard__hero,
  body.customers .wmpt-client-dashboard__section {
    margin-right: -5px;
    margin-left: -5px;
    padding: 20px;
    border-radius: 12px;
  }

  body.customers .wmpt-client-dashboard__title {
    font-size: 2rem;
  }

  body.customers .wmpt-client-dashboard__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  body.customers .wmpt-client-dashboard__section-header {
    align-items: flex-start;
    flex-direction: column;
  }

  body.customers .wmpt-client-dashboard dl.tw-grid,
  body.customers .wmpt-client-dashboard .invoice-quick-info {
    grid-template-columns: 1fr;
  }

  body.customers .wmpt-client-dashboard__chart-tools {
    justify-content: stretch;
  }

  body.customers .wmpt-client-dashboard__filters,
  body.customers .wmpt-client-dashboard__filters .form-group {
    width: 100%;
  }

  body.customers .wmpt-client-dashboard__chart {
    padding: 12px;
    overflow-x: auto;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  body.customers #content > .container > .row.col-md-offset-1,
  body.customers #content > .container > .row[class*="col-md-offset-"] {
    margin-right: 0;
    margin-left: 0;
  }
}

/* Public invoice presentation. */
body.customers.viewinvoice {
  display: block;
  min-height: 100vh;
  background: linear-gradient(145deg, #f6f9fc 0%, #edf3f8 100%);
  color: #334155;
}

body.customers.viewinvoice #content {
  padding: 30px 0 52px;
}

body.customers.viewinvoice #content > .container,
body.customers.viewinvoice .preview-sticky-container {
  width: min(1080px, calc(100% - 40px));
  max-width: none;
}

body.customers.viewinvoice .invoice-html-logo {
  display: flex;
  align-items: center;
  min-height: 0;
  margin: 0 auto 18px;
  padding: 14px 20px;
  border-radius: 12px;
  background: #17365f;
  box-shadow: 0 10px 24px rgba(25, 52, 82, 0.14);
}

body.customers.viewinvoice .invoice-html-logo img {
  display: none !important;
}

body.customers.viewinvoice .invoice-html-logo::before {
  content: '';
  display: block;
  width: min(290px, 74vw);
  aspect-ratio: 4.2 / 1;
  background: url('/modules/theme_style/assets/images/wp-maintain-logo-white.png') left center / contain no-repeat;
}

body.customers.viewinvoice .preview-sticky-container {
  display: flex;
  align-items: center;
  min-height: 48px;
  margin-bottom: 18px;
  padding: 7px 8px 7px 16px;
  border: 1px solid #d8e2ed;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 7px 20px rgba(25, 52, 82, 0.06);
}

body.customers.viewinvoice .preview-sticky-container .invoice-html-number {
  margin: 0;
  color: #172b4d;
  font-size: 0.92rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

body.customers.viewinvoice .preview-sticky-container .invoice-html-status {
  margin-left: 10px;
}

body.customers.viewinvoice .invoice-html-status .label {
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.customers.viewinvoice .preview-sticky-container .action-button {
  min-height: 36px;
  margin-left: 8px;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 800;
  box-shadow: none;
}

body.customers.viewinvoice .preview-sticky-container .action-button:first-of-type {
  margin-left: auto;
  border-color: #c4d2e1;
  background: #ffffff;
  color: #41536a !important;
}

body.customers.viewinvoice .preview-sticky-container .pay-now-top {
  border-color: #1d82d1;
  background: #1d82d1;
  color: #ffffff !important;
}

body.customers.viewinvoice .panel_s.tw-mt-6 {
  width: min(1080px, calc(100% - 40px));
  max-width: none;
  margin: 0 auto !important;
  border: 1px solid #d4dfeb;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(25, 52, 82, 0.1);
  overflow: hidden;
}

body.customers.viewinvoice .panel_s.tw-mt-6 > .panel-body {
  padding: 38px 42px;
}

body.customers.viewinvoice .panel_s.tw-mt-6 .alert {
  margin-bottom: 26px;
  padding: 14px 18px;
  border: 0;
  border-left: 4px solid #ef6a72;
  border-radius: 8px;
  background: #fff1f2;
  color: #a43b48;
}

body.customers.viewinvoice .panel_s.tw-mt-6 .alert p {
  margin: 0;
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

body.customers.viewinvoice .transaction-html-info-col-left,
body.customers.viewinvoice .transaction-html-info-col-right {
  min-height: 190px;
}

body.customers.viewinvoice .invoice-html-number {
  margin: 0 0 14px;
  color: #172b4d !important;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

body.customers.viewinvoice address,
body.customers.viewinvoice .invoice-html-date,
body.customers.viewinvoice .invoice-html-duedate,
body.customers.viewinvoice .invoice-html-sale-agent,
body.customers.viewinvoice .invoice-html-project {
  color: #52657d !important;
  font-size: 0.9rem;
  line-height: 1.6;
}

body.customers.viewinvoice .invoice-html-company-info b,
body.customers.viewinvoice .invoice-html-customer-billing-info b,
body.customers.viewinvoice .transaction-html-info-col-right > span,
body.customers.viewinvoice .invoice-html-date span,
body.customers.viewinvoice .invoice-html-duedate span,
body.customers.viewinvoice .invoice-html-sale-agent span,
body.customers.viewinvoice .invoice-html-project span {
  color: #263b56 !important;
  font-weight: 800;
}

body.customers.viewinvoice .invoice-html-company-info,
body.customers.viewinvoice .invoice-html-customer-billing-info,
body.customers.viewinvoice .invoice-html-customer-shipping-info,
body.customers.viewinvoice .invoice-html-company-info *,
body.customers.viewinvoice .invoice-html-customer-billing-info *,
body.customers.viewinvoice .invoice-html-customer-shipping-info * {
  color: #52657d !important;
}

body.customers.viewinvoice .invoice-html-company-info.tw-text-neutral-500,
body.customers.viewinvoice .invoice-html-customer-billing-info.tw-text-neutral-500,
body.customers.viewinvoice .invoice-html-customer-shipping-info.tw-text-neutral-500 {
  color: #52657d !important;
}

body.customers.viewinvoice .invoice-html-company-info b,
body.customers.viewinvoice .invoice-html-customer-billing-info b {
  color: #263b56 !important;
}

body.customers.viewinvoice .invoice-html-items {
  margin-top: 28px;
}

body.customers.viewinvoice .table-responsive {
  margin-top: 26px;
  border: 1px solid #d5e0eb;
  border-radius: 10px;
  background: #ffffff;
}

body.customers.viewinvoice .invoice-items-preview {
  margin: 0;
}

body.customers.viewinvoice .invoice-items-preview > thead > tr > th {
  padding: 13px 14px;
  border-bottom: 1px solid #cbd7e4 !important;
  background: #f2f5f8 !important;
  color: #334155 !important;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.customers.viewinvoice .invoice-items-preview > tbody > tr > td {
  padding: 16px 14px;
  border-top: 1px solid #e1e8f0 !important;
  background: #ffffff !important;
  color: #334155 !important;
  vertical-align: top;
}

body.customers.viewinvoice .invoice-items-preview > tbody > tr:nth-child(even) > td {
  background: #f8fafc !important;
}

body.customers.viewinvoice .invoice-items-preview .description strong {
  color: #263b56 !important;
  font-weight: 800;
}

body.customers.viewinvoice .invoice-items-preview .amount {
  color: #334155 !important;
  font-weight: 800;
}

/* Override the legacy inline invoice palette loaded after the theme stylesheet. */
body.customers.viewinvoice #content .table.items.items-preview.invoice-items-preview > thead > tr > th,
body.customers.viewinvoice #content .table.items.items-preview > thead > tr > th,
body.customers.viewinvoice #content .invoice-html .table.items > thead > tr > th {
  border-color: #cbd7e4 !important;
  background: #f2f5f8 !important;
  color: #334155 !important;
}

body.customers.viewinvoice #content .table.items.items-preview.invoice-items-preview > tbody > tr > td,
body.customers.viewinvoice #content .table.items.items-preview > tbody > tr > td,
body.customers.viewinvoice #content .invoice-html .table.items > tbody > tr > td {
  border-color: #e1e8f0 !important;
  background: #ffffff !important;
  color: #334155 !important;
}

body.customers.viewinvoice #content .invoice-html address.invoice-html-company-info,
body.customers.viewinvoice #content .invoice-html address.invoice-html-customer-billing-info,
body.customers.viewinvoice #content .invoice-html address.invoice-html-customer-shipping-info,
body.customers.viewinvoice #content address.invoice-html-company-info,
body.customers.viewinvoice #content address.invoice-html-customer-billing-info,
body.customers.viewinvoice #content address.invoice-html-customer-shipping-info {
  color: #52657d !important;
}

body.customers.viewinvoice .invoice-items-preview + * {
  margin-top: 16px;
}

body.customers.viewinvoice .table.text-right {
  margin: 22px 0 18px;
}

body.customers.viewinvoice .table.text-right td {
  padding: 9px 10px;
  border-top-color: #e4ebf2;
}

body.customers.viewinvoice .table.text-right tr:last-child td {
  border-top: 2px solid #b9d2ea;
  background: #f6f8fa;
  color: #263b56;
  font-size: 1rem;
  font-weight: 800;
}

body.customers.viewinvoice .invoice-html-payments,
body.customers.viewinvoice #online_payment_form {
  margin-top: 14px;
  padding: 20px;
  border: 1px solid #d8e2ec;
  border-radius: 10px;
  background: #f8fbfe;
}

body.customers.viewinvoice #online_payment_form {
  margin-top: 12px;
  background: #ffffff;
}

body.customers.viewinvoice #online_payment_form .form-control {
  height: 42px;
  border-color: #c7d6e5;
  border-radius: 7px;
  box-shadow: none;
}

body.customers.viewinvoice #pay_now .btn {
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 8px;
  border-color: #1d82d1;
  background: #1d82d1;
  font-weight: 800;
}

@media (max-width: 767px) {
  body.customers.viewinvoice #content {
    padding: 18px 0 34px;
  }

  body.customers.viewinvoice #content > .container,
  body.customers.viewinvoice .preview-sticky-container,
  body.customers.viewinvoice .panel_s.tw-mt-6 {
    width: calc(100% - 24px);
  }

  body.customers.viewinvoice .invoice-html-logo {
    min-height: 58px;
    margin-bottom: 12px;
  }

  body.customers.viewinvoice .invoice-html-logo img {
    width: min(250px, 74vw) !important;
    max-height: 58px;
  }

  body.customers.viewinvoice .preview-sticky-container {
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 10px;
  }

  body.customers.viewinvoice .preview-sticky-container .action-button:first-of-type {
    margin-left: auto;
  }

  body.customers.viewinvoice .panel_s.tw-mt-6 > .panel-body {
    padding: 24px 18px;
  }

  body.customers.viewinvoice .transaction-html-info-col-left,
  body.customers.viewinvoice .transaction-html-info-col-right {
    min-height: 0;
  }

  body.customers.viewinvoice .transaction-html-info-col-right {
    margin-top: 22px;
    text-align: left;
  }

  body.customers.viewinvoice .table-responsive {
    margin-top: 18px;
    overflow-x: auto;
  }

  body.customers.viewinvoice .invoice-items-preview {
    min-width: 680px;
  }

  body.customers.viewinvoice .invoice-html-payments,
  body.customers.viewinvoice #online_payment_form {
    padding: 16px;
  }
}