/* HireFlow v50.5 - compact black-and-white customer document and A4 print system */
:root {
  --doc-charcoal: #000;
  --doc-charcoal-2: #1d1d1d;
  --doc-orange: #000;
  --doc-orange-dark: #000;
  --doc-amber: #fff;
  --doc-ink: #111;
  --doc-muted: #555;
  --doc-line: #bdbdbd;
  --doc-soft: #f2f2f2;
  --doc-warm: #f7f7f7;
  --doc-green: #000;
  --doc-red: #000;
}

.invoicebody,
body:has(.statement-page),
body:has(.a4receipt),
body:has(.receiptbar + .receipt) {
  margin: 0;
  background: #e8e8e8;
  color: var(--doc-ink);
  font: 13px/1.48 Inter, Aptos, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.invoicebody *,
.statement-page *,
.a4receipt *,
.receiptbar + .receipt *,
.giftprint *,
.admininvoice *,
body:has(.gcrecordhero) .app > main * {
  box-sizing: border-box;
}

.statement-tools,
.receipt-actions,
.receiptbar,
.posinvoiceactions,
.printactions {
  width: min(210mm, calc(100% - 28px));
  margin: 18px auto 10px;
}

.statement-tools a,
.statement-tools button,
.receipt-actions a,
.receipt-actions button,
.receiptbar a,
.receiptbar button,
.posinvoiceactions a,
.posinvoiceactions button,
.printactions a,
.printactions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid #aaa;
  border-radius: 6px;
  background: #fff;
  color: var(--doc-charcoal);
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
}

.statement-tools button,
.receipt-actions .primary,
.receiptbar .primary,
.posinvoiceactions button,
.printactions button {
  border-color: var(--doc-orange);
  background: var(--doc-orange);
  color: #fff;
}

.receipt-payment button {
  background: #000 !important;
  color: #fff !important;
}

.invoicebody .success,
.invoicebody .error {
  border: 1px solid #777 !important;
  background: #eee !important;
  color: #000 !important;
}

/* Shared A4 page surfaces */
.invoicebody .invoice,
.statement-page,
.a4receipt {
  position: relative;
  width: 210mm;
  max-width: calc(100% - 28px);
  min-height: 297mm;
  margin: 0 auto 34px;
  overflow: hidden;
  border: 0;
  border-top: 6px solid var(--doc-orange);
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.15);
}

/* Invoice and fine invoice */
.invoicebody .invoice > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  padding: 15mm 15mm 10mm;
  border: 0;
  border-bottom: 1px solid #444;
  background: var(--doc-charcoal);
  color: #fff;
}

.invoicebody .invoice > header > div:last-child {
  text-align: right;
}

.invoicebody .invoice > header span {
  display: block;
  color: var(--doc-amber);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.invoicebody .invoice > header h1 {
  margin: 5px 0 9px;
  color: #fff;
  font-size: 29px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.045em;
}

.invoicebody .invoicebrand img {
  display: block;
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
  object-position: left center;
}

.invoicebody .invoicebrand > small {
  display: block;
  margin-top: 7px;
  color: #d5d5d5;
}

.invoicebody .invoicestatus {
  display: inline-flex;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 4px;
  background: #fff;
  color: var(--doc-charcoal);
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.invoicebody .invoicestatus.unpaid,
.invoicebody .invoicestatus.overdue {
  border-color: #777;
  background: #ededed;
  color: var(--doc-red);
}

.invoicebody .invoiceparties {
  display: grid;
  grid-template-columns: 1fr 1fr 0.85fr;
  gap: 7mm;
  padding: 9mm 15mm;
  border-bottom: 1px solid var(--doc-line);
}

.invoicebody .invoiceparties > div > span,
.invoicebody .invoiceintro > span {
  display: block;
  margin-bottom: 5px;
  color: var(--doc-orange-dark);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.invoicebody .invoiceparties b {
  color: var(--doc-ink);
  font-size: 12px;
}

.invoicebody .invoiceparties p {
  margin: 5px 0 0;
  color: var(--doc-muted);
  font-size: 10px;
  line-height: 1.55;
}

.invoicebody .invoiceintro {
  margin: 7mm 15mm;
  padding: 5mm;
  border: 1px solid #aaa;
  border-left: 4px solid var(--doc-orange);
  border-radius: 5px;
  background: var(--doc-warm);
}

.invoicebody .invoiceintro > div > b {
  color: var(--doc-charcoal);
  font-size: 16px;
}

.invoicebody .invoiceintro > div > p {
  margin: 3px 0 0;
  color: var(--doc-muted);
  font-size: 10px;
}

.invoicebody .hireinfogrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 10px;
}

.invoicebody .hireinfogrid p {
  margin: 0 !important;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background: #fff;
}

.invoicebody .hireinfogrid span,
.invoicebody .hireinfogrid b,
.invoicebody .hireinfogrid small {
  display: block;
}

.invoicebody .hireinfogrid span {
  color: var(--doc-muted);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.invoicebody .hireinfogrid b {
  margin-top: 3px;
  font-size: 9px;
}

.invoicebody .hireinfogrid small {
  margin-top: 2px;
  color: var(--doc-muted);
  font-size: 8px;
}

.invoicebody .invoice > table {
  width: calc(100% - 30mm);
  margin: 0 15mm;
  border-collapse: collapse;
  table-layout: auto;
}

.invoicebody .invoice > table thead,
.statement-page table thead,
.a4receipt table thead {
  background: var(--doc-charcoal);
  color: #fff;
}

.invoicebody .invoice > table th,
.statement-page table th,
.a4receipt table th {
  padding: 8px 9px;
  color: #fff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.07em;
  text-align: left;
  text-transform: uppercase;
}

.invoicebody .invoice > table td,
.statement-page table td,
.a4receipt table td {
  padding: 9px;
  border-bottom: 1px solid var(--doc-line);
  color: var(--doc-ink);
  font-size: 10px;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.invoicebody .invoice > table td small {
  display: block;
  margin-top: 2px;
  color: var(--doc-muted);
  font-size: 8px;
}

.invoicebody .money,
.statement-page .money,
.a4receipt .money {
  text-align: right !important;
  white-space: nowrap;
}

.invoicebody .addedcharge td:first-child {
  border-left: 3px solid var(--doc-orange);
}

.invoicebody .invoicechargealert {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 5mm 15mm 0;
  padding: 9px 11px;
  border: 1px solid #999;
  border-radius: 4px;
  background: #f5f5f5;
  color: #222;
  font-size: 9px;
}

.invoicebody .totals {
  width: min(89mm, calc(100% - 30mm));
  margin: 6mm 15mm 7mm auto;
}

.invoicebody .totals > div {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 5px 10px;
  border-bottom: 1px solid #ddd;
  font-size: 10px;
}

.invoicebody .totals .due,
.invoicebody .totals > div:last-child {
  align-items: center;
  margin-top: 5px;
  padding: 11px;
  border: 0;
  border-radius: 4px;
  background: var(--doc-charcoal);
  color: #fff;
}

.invoicebody .totals .due span,
.invoicebody .totals .due strong,
.invoicebody .totals > div:last-child span,
.invoicebody .totals > div:last-child strong {
  color: #fff;
}

.invoicebody .totals .due strong,
.invoicebody .totals > div:last-child strong {
  font-size: 16px;
}

.invoicebody .invoiceterms {
  margin: 5mm 15mm;
  padding: 9px 11px;
  border: 1px solid var(--doc-line);
  border-radius: 4px;
}

.invoicebody .invoiceterms summary {
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
}

.invoicebody .invoiceterms p {
  color: var(--doc-muted);
  font-size: 8px;
}

.invoicebody .invoice > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: auto;
  padding: 6mm 15mm;
  border-top: 1px solid var(--doc-line);
  background: var(--doc-soft);
  color: var(--doc-muted);
  font-size: 9px;
}

.invoicebody .invoice > footer p {
  max-width: 115mm;
  margin: 0;
}

/* Statements and booking receipts */
.statement-page {
  display: flex;
  flex-direction: column;
}

.statement-page > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 13mm 15mm 9mm;
  border-bottom: 5px solid var(--doc-orange);
  background: var(--doc-charcoal);
  color: #fff;
}

.statement-page > header img {
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
}

.statement-page > header > div:last-child {
  text-align: right;
}

.statement-page > header span {
  display: block;
  color: var(--doc-amber);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.15em;
}

.statement-page > header h1 {
  margin: 4px 0 7px;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.04em;
}

.statement-page > header em {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 4px;
  background: #fff;
  color: var(--doc-charcoal);
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.statement-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.statement-brand b {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 5px;
  background: var(--doc-orange);
  color: #fff;
}

.statement-page .parties {
  display: grid;
  grid-template-columns: 1fr 1.25fr 0.9fr;
  gap: 6mm;
  padding: 8mm 15mm;
  border-bottom: 1px solid var(--doc-line);
}

.statement-page .parties > div > span,
.statement-page .section-title span,
.statement-page .payment-box span {
  display: block;
  color: var(--doc-orange-dark);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.statement-page .parties b {
  font-size: 11px;
}

.statement-page .parties p {
  margin: 5px 0 0;
  color: var(--doc-muted);
  font-size: 9px;
  line-height: 1.55;
}

.statement-page .account-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  padding: 6mm 15mm;
}

.statement-page .account-summary > div {
  padding: 10px;
  border: 1px solid var(--doc-line);
  border-top: 3px solid var(--doc-orange);
  border-radius: 4px;
  background: #fafafa;
}

.statement-page .account-summary span,
.statement-page .account-summary b,
.statement-page .account-summary strong {
  display: block;
}

.statement-page .account-summary span {
  color: var(--doc-muted);
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}

.statement-page .account-summary b {
  margin-top: 4px;
  font-size: 14px;
}

.statement-page .account-summary .closing {
  border-color: var(--doc-charcoal);
  background: var(--doc-charcoal);
  color: #fff;
}

.statement-page .account-summary .closing span {
  color: #d5d5d5;
}

.statement-page .account-summary strong {
  margin-top: 4px;
  color: #fff;
  font-size: 15px;
}

.statement-page .activity {
  padding: 2mm 15mm 5mm;
}

.statement-page .section-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 9px;
}

.statement-page .section-title h2 {
  margin: 3px 0 0;
  color: var(--doc-charcoal);
  font-size: 16px;
}

.statement-page .section-title small {
  color: var(--doc-muted);
  font-size: 8px;
}

.statement-page table {
  width: 100%;
  border-collapse: collapse;
}

.statement-page .payment-box {
  display: grid;
  grid-template-columns: 58mm 1fr;
  gap: 16px;
  align-items: center;
  margin: 5mm 15mm;
  padding: 11px 13px;
  border: 1px solid #aaa;
  border-left: 4px solid var(--doc-orange);
  border-radius: 4px;
  background: var(--doc-warm);
}

.statement-page .payment-box strong,
.statement-page .payment-box small {
  display: block;
}

.statement-page .payment-box strong {
  color: var(--doc-charcoal);
  font-size: 18px;
}

.statement-page .payment-box p,
.statement-page .payment-box small {
  color: var(--doc-muted);
  font-size: 9px;
}

.statement-page .receipt-note {
  margin: 4mm 15mm !important;
  padding: 10px 12px !important;
  border: 1px solid #999;
  border-left: 4px solid var(--doc-orange);
  border-radius: 4px !important;
  background: #f5f5f5 !important;
  color: #222 !important;
  font-size: 9px;
}

.statement-page .receipt-note.confirmed {
  border-color: #777;
  border-left-color: var(--doc-green);
  background: #eee !important;
  color: #111 !important;
}

.statement-page > footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: auto;
  padding: 5mm 15mm;
  border-top: 1px solid var(--doc-line);
  background: var(--doc-soft);
  color: var(--doc-muted);
  font-size: 8px;
}

.statement-page > footer p {
  margin: 0;
}

/* A4 payment receipt */
.a4receipt {
  padding: 15mm;
}

.a4receipt .receipt-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 26px;
  margin: -15mm -15mm 9mm;
  padding: 13mm 15mm 9mm;
  border: 0;
  border-bottom: 5px solid var(--doc-orange);
  background: var(--doc-charcoal);
  color: #fff;
}

.a4receipt .receipt-brand img {
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
}

.a4receipt .receipt-brand h1,
.a4receipt .receipt-title h2 {
  color: #fff;
}

.a4receipt .receipt-brand h1 {
  margin: 0 0 6px;
}

.a4receipt .receipt-brand p {
  margin: 3px 0;
  color: #d5d5d5;
  font-size: 9px;
}

.a4receipt .receipt-title {
  text-align: right;
}

.a4receipt .receipt-title > span {
  color: var(--doc-amber);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.a4receipt .receipt-title h2 {
  margin: 4px 0 8px;
  font-size: 28px;
  line-height: 1;
}

.a4receipt .paidstamp {
  display: inline-flex;
  padding: 5px 9px;
  border: 0;
  border-radius: 4px;
  background: #fff;
  color: var(--doc-charcoal);
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
}

.a4receipt .receipt-parties {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10mm;
  margin: 0 0 8mm;
}

.a4receipt .receipt-parties span,
.a4receipt .receipt-details span,
.a4receipt .summary span,
.a4receipt .account-summary span,
.a4receipt .notes > span {
  display: block;
  color: var(--doc-orange-dark);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.a4receipt .receipt-parties b {
  display: block;
  margin: 5px 0;
  color: var(--doc-charcoal);
  font-size: 15px;
}

.a4receipt .receipt-parties p {
  color: var(--doc-muted);
  font-size: 9px;
  line-height: 1.55;
}

.a4receipt .receipt-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 7mm;
}

.a4receipt .receipt-details > div {
  padding: 10px;
  border: 1px solid var(--doc-line);
  border-top: 3px solid var(--doc-orange);
  border-radius: 4px;
  background: #fafafa;
}

.a4receipt .receipt-details b {
  display: block;
  margin-top: 4px;
  font-size: 10px;
}

.a4receipt .allocation h3 {
  margin: 0 0 8px;
  color: var(--doc-charcoal);
  font-size: 16px;
}

.a4receipt .allocation table {
  width: 100%;
  border-collapse: collapse;
}

.a4receipt .summary {
  width: 88mm;
  margin: 6mm 0 6mm auto;
}

.a4receipt .summary .received {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border-radius: 4px;
  background: var(--doc-charcoal);
  color: #fff;
}

.a4receipt .summary .received span,
.a4receipt .summary .received strong {
  color: #fff;
}

.a4receipt .summary .received strong {
  font-size: 16px;
  white-space: nowrap;
}

.a4receipt .account-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 5mm 0;
  padding: 11px;
  border-radius: 4px;
  background: var(--doc-soft);
}

.a4receipt .account-summary b {
  display: block;
  margin-top: 4px;
  font-size: 12px;
}

.a4receipt .notes {
  margin-top: 5mm;
  padding: 11px;
  border: 1px solid var(--doc-line);
  border-left: 4px solid var(--doc-orange);
  border-radius: 4px;
}

.a4receipt .receipt-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin: 10mm -15mm -15mm;
  padding: 5mm 15mm;
  border-top: 1px solid var(--doc-line);
  background: var(--doc-soft);
  color: var(--doc-muted);
  font-size: 8px;
}

.a4receipt .receipt-footer p {
  margin: 0;
}

/* POS receipt printed on A4 */
.receiptbar + .receipt {
  width: 210mm;
  max-width: calc(100% - 28px);
  min-height: 297mm;
  margin: 0 auto 34px;
  padding: 15mm;
  border-top: 6px solid var(--doc-orange);
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.15);
  color: var(--doc-ink);
  font-size: 11px;
}

.receiptbar + .receipt .receiptlogo {
  margin: -15mm -15mm 8mm;
  padding: 11mm 15mm 8mm;
  border-bottom: 5px solid var(--doc-orange);
  background: var(--doc-charcoal);
  color: #fff;
  text-align: left;
}

.receiptbar + .receipt .receiptlogo img {
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
}

.receiptbar + .receipt .receiptlogo h1 {
  margin: 7px 0 3px;
  color: #fff;
  font-size: 20px;
}

.receiptbar + .receipt .receiptlogo p {
  display: inline;
  margin-right: 10px;
  color: #d5d5d5;
  font-size: 9px;
}

.receiptbar + .receipt .receipt-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 15px;
  margin: 0 0 7mm;
  padding: 0 0 5mm;
  border: 0;
  border-bottom: 1px solid var(--doc-line);
  text-align: left;
}

.receiptbar + .receipt .receipt-title > span {
  color: var(--doc-orange-dark);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.receiptbar + .receipt .receipt-title b {
  color: var(--doc-charcoal);
  font-size: 21px;
}

.receiptbar + .receipt .facts {
  display: grid;
  grid-template-columns: 38mm 1fr;
  gap: 0;
  margin-bottom: 7mm;
  border: 1px solid var(--doc-line);
  border-radius: 4px;
}

.receiptbar + .receipt .facts span {
  padding: 6px 8px;
  border-bottom: 1px solid var(--doc-line);
}

.receiptbar + .receipt .facts span:nth-child(odd) {
  background: var(--doc-soft);
  color: var(--doc-muted);
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

.receiptbar + .receipt .facts span:nth-child(even) {
  text-align: left;
}

.receiptbar + .receipt table {
  width: 100%;
  border-collapse: collapse;
}

.receiptbar + .receipt table thead {
  background: var(--doc-charcoal);
  color: #fff;
}

.receiptbar + .receipt table th {
  padding: 8px;
  border: 0;
  color: #fff;
  font-size: 8px;
}

.receiptbar + .receipt table td {
  padding: 9px 8px;
  border-bottom: 1px solid var(--doc-line);
}

.receiptbar + .receipt .receipttotal {
  width: 88mm;
  margin: 7mm 0 7mm auto;
  padding-top: 0;
  border-top: 0;
}

.receiptbar + .receipt .receipttotal > div {
  padding: 5px 9px;
  border-bottom: 1px solid var(--doc-line);
}

.receiptbar + .receipt .receipttotal .grand {
  padding: 11px;
  border: 0;
  border-radius: 4px;
  background: var(--doc-charcoal);
  color: #fff;
}

.receiptbar + .receipt .accountnote {
  border-left: 4px solid var(--doc-orange);
  border-radius: 4px;
  background: var(--doc-warm);
}

.receiptbar + .receipt .thanks {
  margin-top: 10mm;
  padding-top: 5mm;
  border-top: 1px solid var(--doc-line);
  color: var(--doc-muted);
  text-align: left;
}

/* Gift card output centred on an A4 sheet */
.gcresult .giftprint.business-gift-card {
  width: 170mm;
  max-width: calc(100% - 28px);
  min-height: 96mm;
  margin: 45px auto 24px;
  padding: 14mm;
  border: 1px solid #333;
  border-radius: 7mm;
  background: linear-gradient(135deg, #050505, #222 64%, #444);
  color: #fff;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.22);
  transform: none;
}

.gcresult .giftprint .giftvalue {
  color: #fff;
  font-size: 34px;
  font-weight: 900;
}

.gcresult .giftprint .business-gift-brand img {
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
}

.gcresult .giftprint .business-gift-brand b {
  color: #fff;
}

.gcresult .giftprint .business-gift-brand b:first-child:not(:last-child) {
  background: #fff;
  color: #000;
}

.gcresult .giftprint .giftcodes {
  display: grid;
  grid-template-columns: 1.35fr 0.65fr;
  gap: 8px;
  margin-top: 10mm;
}

.gcresult .giftprint .giftcodes > div {
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 4px;
  background: rgba(18, 24, 32, 0.25);
}

.gcresult .giftprint .giftcodes span {
  display: block;
  color: #ddd;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.gcresult .giftprint .giftcodes b {
  display: block;
  margin-top: 3px;
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 15px;
  letter-spacing: 0.08em;
}

/* Staff-opened customer invoice uses the same A4 document treatment */
body:has(.admininvoice),
body:has(.gcrecordhero) {
  background: #e8e8e8;
}

.admininvoice {
  width: min(210mm, 100%);
  max-width: 210mm !important;
  margin: 0 auto 34px;
  overflow: hidden;
  padding: 0 15mm 15mm !important;
  border: 0 !important;
  border-top: 6px solid var(--doc-orange) !important;
  border-radius: 5px !important;
  background: #fff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.15);
  color: var(--doc-ink);
}

.admininvoice .invoicehero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin: 0 -15mm 9mm;
  padding: 13mm 15mm 9mm;
  border-bottom: 5px solid var(--doc-orange);
  background: var(--doc-charcoal);
  color: #fff;
}

.admininvoice .invoicehero img {
  display: block;
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
}

.admininvoice .invoicehero > div:last-child {
  text-align: right;
}

.admininvoice .invoicehero span {
  color: var(--doc-amber);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.admininvoice .invoicehero h2 {
  margin: 5px 0 7px;
  color: #fff;
  font-size: 27px;
  letter-spacing: -0.04em;
}

.admininvoice .invoicehero em {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 4px;
  background: #fff;
  color: var(--doc-charcoal);
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.admininvoice .brandfallback {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 17px;
  font-weight: 900;
}

.admininvoice .brandfallback b {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border-radius: 4px;
  background: var(--doc-orange);
}

.admininvoice .invoicefacts {
  gap: 7px;
  margin: 0 0 7mm;
}

.admininvoice .invoicefacts > div,
.admininvoice .driverline,
.admininvoice .hireinfogrid p {
  padding: 10px;
  border: 1px solid var(--doc-line);
  border-top: 3px solid var(--doc-orange);
  border-radius: 4px;
  background: var(--doc-soft);
}

.admininvoice .invoicefacts span,
.admininvoice .driverline span,
.admininvoice .hireinfogrid span {
  color: var(--doc-muted);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admininvoice .invoicefacts b,
.admininvoice .hireinfogrid b {
  display: block;
  margin-top: 4px;
  color: var(--doc-ink);
  font-size: 10px;
}

.admininvoice .invoicefacts small,
.admininvoice .hireinfogrid small,
.admininvoice .driverline small {
  display: block;
  margin-top: 3px;
  color: var(--doc-muted);
  font-size: 8px;
}

.admininvoice .hireinfogrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 5mm 0 7mm;
}

.admininvoice > h2 {
  margin: 7mm 0 3px;
  color: var(--doc-charcoal);
  font-size: 17px;
}

.admininvoice > p {
  color: var(--doc-muted);
  font-size: 9px;
}

.admininvoice table {
  width: 100%;
  border-collapse: collapse;
}

.admininvoice table thead {
  background: var(--doc-charcoal);
  color: #fff;
}

.admininvoice table th {
  padding: 8px 9px;
  border: 0;
  color: #fff;
  font-size: 8px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.admininvoice table td {
  padding: 9px;
  border-bottom: 1px solid var(--doc-line);
  color: var(--doc-ink);
  font-size: 9px;
}

.admininvoice .invoicebalance {
  width: 88mm;
  margin: 6mm 0 7mm auto;
  padding: 0;
}

.admininvoice .invoicebalance > div {
  padding: 5px 9px;
  border-bottom: 1px solid var(--doc-line);
  font-size: 9px;
}

.admininvoice .invoicebalance .due {
  margin-top: 5px;
  padding: 11px;
  border: 0;
  border-radius: 4px;
  background: var(--doc-charcoal);
  color: #fff;
  font-size: 11px;
}

.admininvoice .invoicebalance .due b {
  color: #fff;
  font-size: 15px;
}

.admininvoice .drivergrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

/* Printable gift-card administration report */
body:has(.gcrecordhero) .gcrecordhero {
  border-bottom: 5px solid var(--doc-orange);
  border-radius: 5px;
  background: var(--doc-charcoal);
}

body:has(.gcrecordhero) .gcrecordhero small {
  color: var(--doc-amber);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

body:has(.gcrecordhero) .gcrecordhero h1,
body:has(.gcrecordhero) .gcbalance strong {
  color: #fff;
}

body:has(.gcrecordhero) .gcrecordbrand {
  min-height: 18mm;
  margin-bottom: 8px;
}

body:has(.gcrecordhero) .gcrecordbrand img {
  display: block;
  max-width: 52mm;
  max-height: 18mm;
  padding: 5px;
  border-radius: 4px;
  background: #fff;
  object-fit: contain;
}

body:has(.gcrecordhero) .gcrecordbrand strong {
  display: block;
  color: #fff;
  font-size: 18px;
}

body:has(.gcrecordhero) .gcbalance strong {
  font-size: 30px;
}

body:has(.gcrecordhero) .gcstatus {
  border-radius: 4px;
  background: #fff;
  color: var(--doc-charcoal);
  text-transform: uppercase;
}

body:has(.gcrecordhero) .recordgrid > div > .panel {
  border: 1px solid var(--doc-line);
  border-radius: 5px;
  background: #fff;
  box-shadow: none;
}

body:has(.gcrecordhero) .facts > div {
  border: 1px solid var(--doc-line);
  border-top: 3px solid var(--doc-orange);
  border-radius: 4px;
  background: var(--doc-soft);
}

body:has(.gcrecordhero) .history table {
  border-collapse: collapse;
}

body:has(.gcrecordhero) .history thead {
  background: var(--doc-charcoal);
  color: #fff;
}

body:has(.gcrecordhero) .history th,
body:has(.gcrecordhero) .history td {
  padding: 8px;
  border-bottom: 1px solid var(--doc-line);
  font-size: 9px;
  text-align: left;
}

body:has(.gcrecordhero) .history th {
  color: #fff;
  font-size: 7px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body:has(.gcrecordhero) .positive,
body:has(.gcrecordhero) .negative {
  color: #000 !important;
}

/* HireFlow v50.5 - compact white document headers and denser A4 use */
.invoicebody .invoice,
.statement-page,
.a4receipt,
.receiptbar + .receipt,
.admininvoice {
  border-top: 0 !important;
}

.invoicebody .invoice > header,
.statement-page > header,
.a4receipt .receipt-head,
.receiptbar + .receipt .receiptlogo,
.admininvoice .invoicehero {
  border: 0;
  border-bottom: 2px solid #000;
  background: #fff;
  color: #000;
}

.invoicebody .invoice > header {
  align-items: center;
  padding: 4.5mm 10mm 4mm;
}

.invoicebody .invoice > header span,
.invoicebody .invoice > header h1,
.statement-page > header span,
.statement-page > header h1,
.a4receipt .receipt-brand h1,
.a4receipt .receipt-title h2,
.a4receipt .receipt-title > span,
.receiptbar + .receipt .receiptlogo h1,
.admininvoice .invoicehero span,
.admininvoice .invoicehero h2 {
  color: #000;
}

.invoicebody .invoice > header h1,
.statement-page > header h1,
.a4receipt .receipt-title h2,
.admininvoice .invoicehero h2 {
  font-size: 21px;
}

.invoicebody .invoice > header h1 {
  margin: 3px 0 5px;
}

.invoicebody .invoicebrand img,
.statement-page > header img,
.a4receipt .receipt-brand img,
.receiptbar + .receipt .receiptlogo img,
.admininvoice .invoicehero img,
body:has(.gcrecordhero) .gcrecordbrand img {
  max-width: 44mm;
  max-height: 11mm;
  padding: 2px;
  border: 1px solid #ddd;
  background: #fff;
}

.invoicebody .invoicebrand > small {
  display: none;
}

.invoicebody .invoicebrand > small,
.a4receipt .receipt-brand p,
.receiptbar + .receipt .receiptlogo p {
  color: #555;
}

.invoicebody .invoicebrand .portalbrand,
.invoicebody .invoicebrand .portalbrand span {
  color: #000;
}

.invoicebody .invoicebrand .portalbrand b {
  background: #000;
  color: #fff;
}

.invoicebody .invoicestatus,
.statement-page > header em,
.a4receipt .paidstamp,
.admininvoice .invoicehero em {
  border: 1px solid #000;
  background: #fff;
  color: #000;
}

.invoicebody .invoiceparties {
  grid-template-columns: 1fr 1fr 0.82fr;
  gap: 4mm;
  padding: 4mm 10mm;
}

.invoicebody .invoiceintro {
  display: grid;
  grid-template-columns: 38mm minmax(0, 1fr);
  align-items: start;
  gap: 4mm;
  margin: 3.5mm 10mm;
  padding: 3.5mm;
}

.invoicebody .invoiceintro > span {
  min-width: 0;
  margin: 2px 0 0;
}

.invoicebody .hireinfogrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-top: 6px;
}

.invoicebody .hireinfogrid p {
  padding: 6px;
}

/* Customer hire invoice summary */
.invoicebody .invoiceintro.hiresummary {
  display: block;
  overflow: hidden;
  padding: 0;
  border-left-width: 4px;
  background: #fff;
}

.invoicebody .hiresummaryhead {
  display: flex;
  align-items: center;
  gap: 6mm;
  padding: 3mm 4mm;
  border-bottom: 1px solid var(--doc-line);
  background: var(--doc-warm);
}

.invoicebody .hiresummaryhead > span {
  flex: 0 0 34mm;
  color: #000;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0.13em;
}

.invoicebody .hiresummaryasset {
  min-width: 0;
}

.invoicebody .hiresummaryasset b,
.invoicebody .hiresummaryasset small {
  display: block;
}

.invoicebody .hiresummaryasset b {
  font-size: 17px;
  line-height: 1.1;
}

.invoicebody .hiresummaryasset small {
  margin-top: 3px;
  color: var(--doc-muted);
  font-size: 8px;
}

.invoicebody .summarycore {
  display: grid;
  grid-template-columns: 1fr 1fr 1.25fr 1.25fr 0.8fr;
}

.invoicebody .summarycore > div {
  min-width: 0;
  padding: 2.5mm 3mm;
  border-right: 1px solid var(--doc-line);
}

.invoicebody .summarycore > div:last-child {
  border-right: 0;
}

.invoicebody .summarycore span,
.invoicebody .summarycore b,
.invoicebody .summarycore small,
.invoicebody .kmusage small,
.invoicebody .kmusage b,
.invoicebody .kmusage strong {
  display: block;
}

.invoicebody .summarycore span,
.invoicebody .kmusage small {
  color: var(--doc-muted);
  font-size: 6.5px;
  font-weight: 950;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.invoicebody .summarycore b {
  margin-top: 3px;
  font-size: 8.5px;
  line-height: 1.3;
}

.invoicebody .summarycore small {
  margin-top: 2px;
  color: var(--doc-muted);
  font-size: 7px;
  line-height: 1.25;
}

.invoicebody .kmusage {
  display: grid;
  grid-template-columns: 38mm 1fr 1fr 1.05fr;
  align-items: stretch;
  border-top: 1px solid var(--doc-line);
  background: var(--doc-soft);
}

.invoicebody .kmusage > span {
  display: flex;
  align-items: center;
  padding: 2.5mm 4mm;
  color: #000;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: 0.11em;
}

.invoicebody .kmusage > div {
  padding: 2.5mm 3mm;
  border-left: 1px solid var(--doc-line);
}

.invoicebody .kmusage b,
.invoicebody .kmusage strong {
  margin-top: 3px;
  color: #000;
  font-size: 12px;
  line-height: 1.15;
}

.invoicebody .kmusage .kmtotal {
  background: #000;
}

.invoicebody .kmusage .kmtotal small,
.invoicebody .kmusage .kmtotal strong {
  color: #fff;
}

.invoicebody .hiresummary,
.invoicebody .hiresummaryhead,
.invoicebody .summarycore,
.invoicebody .kmusage {
  break-inside: avoid;
  page-break-inside: avoid;
}

.invoicebody .invoice > table {
  width: calc(100% - 20mm);
  margin: 0 10mm;
}

.invoicebody .invoicechargealert {
  margin: 3mm 10mm 0;
}

.invoicebody .totals {
  width: min(89mm, calc(100% - 20mm));
  margin: 4mm 10mm 4mm auto;
}

.invoicebody .invoiceterms {
  margin: 3mm 10mm;
}

.invoicebody .invoice > footer {
  padding: 3.5mm 10mm;
}

.statement-page > header {
  padding: 5mm 10mm 4mm;
}

.statement-page > header em {
  padding: 4px 8px;
}

.statement-brand {
  color: #000;
}

.statement-brand b {
  width: 32px;
  height: 32px;
  background: #000;
  color: #fff;
}

.statement-page .parties {
  gap: 4mm;
  padding: 4mm 10mm;
}

.statement-page .account-summary {
  padding: 4mm 10mm;
}

.statement-page .activity {
  padding: 1mm 10mm 4mm;
}

.statement-page .payment-box {
  margin: 3mm 10mm;
}

.statement-page > footer {
  padding: 3.5mm 10mm;
}

.a4receipt {
  padding: 12mm;
}

.a4receipt .receipt-head {
  margin: -12mm -12mm 6mm;
  padding: 5mm 12mm 4mm;
}

.a4receipt .receipt-brand p {
  margin: 2px 0;
}

.a4receipt .receipt-parties {
  gap: 7mm;
  margin-bottom: 6mm;
}

.a4receipt .receipt-details {
  margin-bottom: 5mm;
}

.a4receipt .summary {
  margin-top: 5mm;
  margin-bottom: 5mm;
}

.a4receipt .receipt-footer {
  margin: 7mm -12mm -12mm;
  padding: 4mm 12mm;
}

.receiptbar + .receipt {
  padding: 12mm;
}

.receiptbar + .receipt .receiptlogo {
  margin: -12mm -12mm 5mm;
  padding: 5mm 12mm 4mm;
  text-align: left;
}

.receiptbar + .receipt .receipt-title {
  margin-bottom: 5mm;
  padding-bottom: 4mm;
}

.receiptbar + .receipt .facts {
  margin-bottom: 5mm;
}

.receiptbar + .receipt .receipttotal {
  margin-top: 5mm;
  margin-bottom: 5mm;
}

.receiptbar + .receipt .thanks {
  margin-top: 6mm;
}

.admininvoice {
  padding: 0 12mm 12mm !important;
}

.admininvoice .invoicehero {
  margin: 0 -12mm 6mm;
  padding: 5mm 12mm 4mm;
}

.admininvoice .invoicehero .brandfallback {
  color: #000;
}

.admininvoice .invoicehero .brandfallback b {
  background: #000;
  color: #fff;
}

.admininvoice .invoicefacts {
  margin-bottom: 5mm;
}

.admininvoice .hireinfogrid {
  margin: 4mm 0 5mm;
}

.admininvoice > h2 {
  margin-top: 5mm;
}

body:has(.gcrecordhero) .gcrecordhero {
  padding: 7mm 10mm;
  border: 1px solid var(--doc-line);
  border-bottom: 2px solid #000;
  border-radius: 5px;
  background: #fff;
  color: #000;
}

body:has(.gcrecordhero) .gcrecordhero small,
body:has(.gcrecordhero) .gcrecordhero h1,
body:has(.gcrecordhero) .gcbalance strong,
body:has(.gcrecordhero) .gcrecordbrand strong {
  color: #000;
}

body:has(.gcrecordhero) .gcrecordbrand {
  min-height: 0;
  margin-bottom: 5px;
}

body:has(.gcrecordhero) .gcstatus {
  border: 1px solid #000;
  background: #fff;
  color: #000;
}

/* Keep structured blocks and rows intact wherever possible */
.invoiceparties > div,
.invoiceintro,
.hireinfogrid p,
.totals,
.parties > div,
.account-summary > div,
.payment-box,
.receipt-details > div,
.notes,
.giftcodes,
table tr {
  break-inside: avoid;
  page-break-inside: avoid;
}

table thead {
  display: table-header-group;
}

table tfoot {
  display: table-footer-group;
}

h1,
h2,
h3,
.section-title {
  break-after: avoid;
  page-break-after: avoid;
}

/* A4 is about 794 CSS pixels wide. Do not trigger the phone layout at A4 width. */
@media (max-width: 600px) {
  .invoicebody .invoice,
  .statement-page,
  .a4receipt,
  .receiptbar + .receipt,
  .admininvoice {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    margin: 0;
    border-radius: 0;
  }

  .invoicebody .invoiceparties,
  .statement-page .parties,
  .a4receipt .receipt-parties {
    grid-template-columns: 1fr;
  }

  .invoicebody .hireinfogrid,
  .statement-page .account-summary,
  .a4receipt .receipt-details,
  .a4receipt .account-summary {
    grid-template-columns: 1fr 1fr;
  }

  .invoicebody .invoiceintro {
    grid-template-columns: 1fr;
    gap: 2mm;
  }

  .invoicebody .hiresummaryhead {
    align-items: flex-start;
    flex-direction: column;
    gap: 2mm;
  }

  .invoicebody .hiresummaryhead > span {
    flex-basis: auto;
  }

  .invoicebody .summarycore {
    grid-template-columns: 1fr 1fr;
  }

  .invoicebody .summarycore > div:nth-child(even) {
    border-right: 0;
  }

  .invoicebody .kmusage {
    grid-template-columns: 1fr;
  }

  .invoicebody .kmusage > div {
    border-top: 1px solid var(--doc-line);
    border-left: 0;
  }

  .invoicebody .invoice > header,
  .statement-page > header,
  .a4receipt .receipt-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .invoicebody .invoice > header > div:last-child,
  .statement-page > header > div:last-child,
  .a4receipt .receipt-title {
    text-align: left;
  }

  .statement-page .activity {
    overflow-x: auto;
  }

  .admininvoice .invoicefacts,
  .admininvoice .hireinfogrid,
  .admininvoice .drivergrid {
    grid-template-columns: 1fr 1fr;
  }
}

@media print {
  @page {
    size: A4 portrait;
    margin: 8mm;
  }

  html,
  body,
  .invoicebody,
  body:has(.statement-page),
  body:has(.a4receipt),
  body:has(.receiptbar + .receipt),
  body:has(.admininvoice),
  body:has(.gcrecordhero) {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }

  .statement-tools,
  .receipt-actions,
  .receiptbar,
  .posinvoiceactions,
  .printactions,
  .invoice > footer > div,
  .receipt-payment,
  .upgradebanner,
  .businessnav,
  .hire-servicebar,
  .business-footer {
    display: none !important;
  }

  body:has(.admininvoice) .app > aside,
  body:has(.admininvoice) .app > main > header,
  body:has(.gcrecordhero) .app > aside,
  body:has(.gcrecordhero) .app > main > header,
  body:has(.gcrecordhero) .management {
    display: none !important;
  }

  body:has(.admininvoice) .app,
  body:has(.gcrecordhero) .app {
    display: block !important;
  }

  body:has(.admininvoice) .app > main,
  body:has(.gcrecordhero) .app > main {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .invoicebody .invoice,
  .statement-page,
  .a4receipt,
  .receiptbar + .receipt {
    width: 100% !important;
    max-width: none !important;
    min-height: 279mm !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  .invoicebody .invoice > header,
  .statement-page > header,
  .a4receipt .receipt-head {
    align-items: center !important;
    flex-direction: row !important;
  }

  .invoicebody .invoice > header > div:last-child,
  .statement-page > header > div:last-child,
  .a4receipt .receipt-title {
    text-align: right !important;
  }

  .invoicebody .invoiceparties,
  .statement-page .parties {
    grid-template-columns: 1fr 1fr 0.82fr !important;
  }

  .a4receipt .receipt-parties {
    grid-template-columns: 1fr 1fr !important;
  }

  .invoicebody .hireinfogrid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .invoicebody .summarycore {
    grid-template-columns: 1fr 1fr 1.25fr 1.25fr 0.8fr !important;
  }

  .invoicebody .kmusage {
    grid-template-columns: 38mm 1fr 1fr 1.05fr !important;
  }

  .invoicebody .invoice > footer {
    display: block !important;
    min-height: 0 !important;
    padding: 3mm 10mm !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  .invoicebody .invoice > footer p {
    max-width: none !important;
    margin: 0 !important;
    line-height: 1.35;
  }

  .admininvoice {
    width: 100% !important;
    max-width: none !important;
    min-height: 279mm !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body:has(.gcrecordhero) .gcrecordhero,
  body:has(.gcrecordhero) .recordgrid {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body:has(.gcrecordhero) .gcrecordhero {
    border-radius: 0;
  }

  body:has(.gcrecordhero) .recordgrid {
    display: block !important;
  }

  body:has(.gcrecordhero) .recordgrid > div > .panel {
    margin: 6mm 0 0 !important;
    padding: 5mm !important;
    border-radius: 0;
    break-inside: auto;
  }

  body:has(.gcrecordhero) .facts,
  body:has(.gcrecordhero) .history tr,
  .admininvoice .invoicefacts > div,
  .admininvoice .hireinfogrid > p,
  .admininvoice .driverline,
  .admininvoice .invoicebalance {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .invoicebody .invoice,
  .statement-page,
  .a4receipt,
  .receiptbar + .receipt,
  .invoicebody .invoice > header,
  .statement-page > header,
  .a4receipt .receipt-head,
  .receiptbar + .receipt .receiptlogo,
  .invoicebody .invoice > table thead,
  .statement-page table thead,
  .a4receipt table thead,
  .receiptbar + .receipt table thead,
  .invoicebody .totals .due,
  .invoicebody .totals > div:last-child,
  .invoicebody .kmusage .kmtotal,
  .statement-page .account-summary .closing,
  .a4receipt .summary .received,
  .receiptbar + .receipt .receipttotal .grand,
  .gcresult .giftprint.business-gift-card {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .invoicebody .invoice > header,
  .statement-page > header,
  .a4receipt .receipt-head,
  .receiptbar + .receipt .receiptlogo {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .invoicebody .invoiceterms {
    display: block;
  }

  .invoicebody .invoiceterms[open] p {
    display: block;
  }

  .gcresult {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .gcresult .giftprint.business-gift-card {
    width: 170mm;
    min-height: 96mm;
    margin: 60mm auto 0;
    box-shadow: none;
  }
}