:root {
  --blue: #0094da;
  --blue-dark: #0073ad;
  --blue-soft: #e8f6fd;
  --blue-ink: #075d88;
  --ink: #102331;
  --muted: #607586;
  --line: #dce8ef;
  --canvas: #f5f9fc;
  --surface: #ffffff;
  --surface-muted: #f8fbfd;
  --danger: #c43e4b;
  --success: #168063;
  --shadow: 0 18px 42px rgba(33, 91, 122, .09);
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 11px;
}

* { box-sizing: border-box; min-width: 0; }
html { background: var(--canvas); scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(circle at 95% -10%, #d9f3ff 0, transparent 31rem), var(--canvas); color: var(--ink); font: 15px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; overflow-x: hidden; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid rgba(0, 148, 218, .25); outline-offset: 2px; }
svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.hidden { display: none !important; }

.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 73px; padding: 12px clamp(18px, 4vw, 58px); border-bottom: 1px solid rgba(220, 232, 239, .85); background: rgba(255, 255, 255, .91); backdrop-filter: blur(16px) saturate(1.25); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 12px; color: #fff; background: linear-gradient(145deg, var(--blue), #39b7ee); box-shadow: 0 8px 20px rgba(0, 148, 218, .23); }
.brand-mark svg { width: 21px; height: 21px; }
.brand b { display: block; font-size: 17px; letter-spacing: -.04em; }.brand small { display: block; margin-top: -1px; color: var(--muted); font-size: 10px; font-weight: 650; letter-spacing: .015em; }
.top-actions { display: flex; align-items: center; gap: 5px; }.link-button { padding: 9px 10px; border: 0; background: transparent; color: var(--muted); font-size: 13px; font-weight: 750; }.link-button.active { color: var(--blue-dark); }
.account-button { display: inline-flex; align-items: center; gap: 8px; margin-left: 6px; padding: 5px 10px 5px 5px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font-size: 12px; font-weight: 750; box-shadow: 0 4px 12px rgba(31, 75, 97, .04); }.avatar { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--blue-soft); color: var(--blue-dark); font-size: 12px; }
main { width: min(100% - 32px, 1440px); margin: 0 auto; padding: clamp(25px, 4vw, 56px) 0 64px; }
.page { animation: page-in .35s ease both; } @keyframes page-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.shop-intro, .admin-title-row { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }.shop-intro h1, .admin-title-row h1 { max-width: 700px; margin: 6px 0 8px; font-size: clamp(31px, 4.4vw, 54px); line-height: 1.02; letter-spacing: -.065em; }.shop-intro p, .admin-title-row p { max-width: 580px; margin: 0; color: var(--muted); font-size: 15px; }.eyebrow { display: block; color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.price-state { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid #cceaf8; border-radius: 999px; background: rgba(255,255,255,.65); color: var(--blue-ink); font-size: 12px; font-weight: 750; }.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(22, 128, 99, .12); }
.buyer-banner { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; padding: 12px 14px; border: 1px solid #cbeaf9; border-radius: var(--radius-md); background: linear-gradient(98deg, #e9f7fe, #fff); }.buyer-banner__icon { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #fff; color: var(--blue); }.buyer-banner__icon svg { width: 20px; height: 20px; }.buyer-banner b { font-size: 13px; }.buyer-banner p { margin: 1px 0 0; color: var(--muted); font-size: 12px; }.buyer-banner .button { margin-left: auto; }
.card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.92); box-shadow: var(--shadow); }.billing-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(335px, 390px); gap: 18px; align-items: start; }.catalog-panel { padding: clamp(17px, 2.5vw, 25px); }.estimate-panel { position: sticky; top: 92px; padding: 20px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }.section-heading h2, .form-card h2, .table-card h2, .price-editor h2 { margin: 3px 0 0; color: var(--ink); font-size: 20px; letter-spacing: -.045em; }.count-pill { padding: 5px 8px; border-radius: 8px; background: var(--blue-soft); color: var(--blue-ink); font-size: 11px; font-weight: 800; }.icon-button { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); color: var(--muted); }.icon-button:hover { color: var(--danger); border-color: #f2cbd0; }.icon-button svg { width: 17px; height: 17px; }
.search-field { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 46px; padding: 0 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-muted); color: var(--muted); }.search-field svg { flex: 0 0 auto; width: 19px; height: 19px; }.search-field input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); }.search-field:focus-within { border-color: var(--blue); background: #fff; box-shadow: 0 0 0 4px rgba(0, 148, 218, .1); }
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(174px, 1fr)); gap: 10px; min-height: 270px; margin-top: 15px; }.product-card { display: flex; flex-direction: column; min-height: 160px; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); transition: transform .2s, box-shadow .2s, border-color .2s; }.product-card:hover { border-color: #a4dcf5; box-shadow: 0 12px 22px rgba(23, 106, 145, .09); transform: translateY(-2px); }.product-card h3 { min-height: 39px; margin: 0; color: var(--ink); font-size: 13px; line-height: 1.35; }.product-card small { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; font-weight: 750; }.product-card__bottom { display: flex; align-items: end; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 10px; }.product-card__price { color: var(--blue-dark); font-size: 14px; font-weight: 850; letter-spacing: -.025em; }.product-card__badge { display: block; margin-top: 2px; color: var(--success); font-size: 9px; font-weight: 800; }.add-button { display: grid; place-items: center; width: 31px; height: 31px; border: 0; border-radius: 10px; background: var(--blue-soft); color: var(--blue); font-size: 20px; line-height: 1; transition: background .18s, color .18s, transform .18s; }.add-button:hover { background: var(--blue); color: #fff; transform: scale(1.05); }.catalog-footer { display: flex; justify-content: center; padding-top: 15px; }
.cart-lines { display: grid; gap: 9px; max-height: 370px; overflow: auto; padding: 2px 2px 12px; }.empty-cart { display: grid; place-items: center; padding: 33px 16px; border: 1px dashed #bfddea; border-radius: 16px; color: var(--muted); text-align: center; }.empty-cart span { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 8px; border-radius: 14px; background: var(--blue-soft); color: var(--blue); }.empty-cart svg { width: 21px; height: 21px; }.empty-cart b { color: var(--ink); font-size: 13px; }.empty-cart p { margin: 2px 0 0; font-size: 12px; }.cart-line { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-muted); }.cart-line__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: 12px; font-weight: 800; }.cart-line__meta { display: flex; align-items: center; gap: 5px; margin-top: 3px; color: var(--muted); font-size: 10px; }.cart-line__right { display: flex; flex-direction: column; align-items: end; justify-content: space-between; }.cart-line__amount { color: var(--blue-dark); font-size: 12px; font-weight: 850; }.quantity-control { display: inline-grid; grid-template-columns: 25px 34px 25px; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; }.quantity-control button { width: 25px; height: 26px; border: 0; background: transparent; color: var(--blue-dark); font-size: 16px; }.quantity-control input { width: 34px; height: 26px; padding: 0; border: 0; border-inline: 1px solid var(--line); outline: 0; background: transparent; text-align: center; font-size: 11px; font-weight: 750; }.quantity-control input::-webkit-inner-spin-button { appearance: none; }.remove-line { align-self: end; padding: 0; border: 0; background: none; color: #9cb0bc; font-size: 17px; line-height: 1; }.remove-line:hover { color: var(--danger); }
.totals { display: grid; gap: 8px; padding-top: 15px; border-top: 1px solid var(--line); }.totals > div:not(.admin-adjustment) { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 12px; }.totals > div b { color: var(--ink); font-variant-numeric: tabular-nums; }.admin-adjustment { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 9px; border-radius: 12px; background: var(--blue-soft); }.admin-adjustment label { color: var(--blue-ink); font-size: 10px; font-weight: 750; }.admin-adjustment input { width: 100%; min-height: 32px; margin-top: 3px; padding: 0 7px; border: 1px solid #c0e6f8; border-radius: 8px; background: #fff; color: var(--ink); font-size: 11px; }.grand-total { padding-top: 10px; border-top: 1px dashed #c7d9e2; }.totals .grand-total { color: var(--ink); font-size: 14px; font-weight: 800; }.totals .grand-total b { color: var(--blue-dark); font-size: 22px; letter-spacing: -.05em; }
.checkout { margin-top: 18px; padding: clamp(18px, 2.7vw, 26px); }.secure-note { display: inline-flex; align-items: center; gap: 5px; color: var(--success); font-size: 11px; font-weight: 800; }.secure-note svg { width: 14px; height: 14px; }.form-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }.form-grid label, .form-card label, .price-editor label, .modal-card label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 750; }.form-wide { grid-column: span 2; }.form-grid input, .form-card input, .price-editor input, .price-editor select, .modal-card input { width: 100%; min-height: 43px; padding: 0 11px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: var(--surface-muted); color: var(--ink); }.form-grid input:focus, .form-card input:focus, .price-editor input:focus, .price-editor select:focus, .modal-card input:focus { border-color: var(--blue); background: #fff; box-shadow: 0 0 0 4px rgba(0, 148, 218,.1); }.checkout-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); }.checkout-actions p { max-width: 560px; margin: 0; color: var(--muted); font-size: 11px; }.checkout-actions > div { display: flex; gap: 8px; }
.button { min-height: 40px; padding: 0 14px; border: 1px solid transparent; border-radius: 11px; font-size: 12px; font-weight: 800; transition: transform .18s, box-shadow .18s, background .18s, border-color .18s; }.button:hover { transform: translateY(-1px); }.button:active { transform: scale(.98); }.button-primary { background: linear-gradient(135deg, var(--blue), #00a9ea); color: #fff; box-shadow: 0 9px 16px rgba(0, 148, 218, .2); }.button-outline { border-color: #b9e2f4; background: #fff; color: var(--blue-dark); }.button-outline:hover { background: var(--blue-soft); }.button-quiet { border-color: var(--line); background: var(--surface-muted); color: var(--muted); }.my-estimates { margin-top: 18px; padding: 20px; }.record-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 0; border-top: 1px solid var(--line); }.record-row b { display: block; font-size: 13px; }.record-row span { color: var(--muted); font-size: 11px; }.record-row__right { display: flex; align-items: center; gap: 12px; }.record-row__right b { color: var(--blue-dark); }

.admin-title-row { align-items: center; }.admin-title-row h1 { font-size: clamp(31px, 4vw, 47px); }.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }.metric-card { display: grid; gap: 4px; padding: 18px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: 0 9px 23px rgba(24,81,108,.05); }.metric-card span, .metric-card small { color: var(--muted); font-size: 11px; font-weight: 700; }.metric-card b { color: var(--ink); font-size: 25px; letter-spacing: -.055em; }.metric-card--brand { border-color: transparent; background: linear-gradient(135deg, var(--blue-dark), var(--blue)); }.metric-card--brand span, .metric-card--brand small, .metric-card--brand b { color: #fff; }.admin-tabs { display: flex; gap: 7px; margin: 25px 0 14px; padding-bottom: 1px; border-bottom: 1px solid var(--line); }.admin-tab { padding: 11px 13px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; }.admin-tab.active { border-color: var(--blue); color: var(--blue-dark); }.admin-split { display: grid; grid-template-columns: minmax(300px,.42fr) minmax(0,.98fr); gap: 16px; }.form-card, .table-card, .price-editor { padding: 20px; }.form-card { display: grid; align-content: start; gap: 12px; }.form-card h2 { margin-bottom: 4px; }.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.form-actions { display: flex; gap: 8px; margin-top: 4px; }.table-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }.search-field.compact { width: min(100%, 260px); min-height: 40px; }.data-table-wrap { max-height: 560px; overflow: auto; border: 1px solid var(--line); border-radius: 14px; } table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; } th, td { padding: 11px 10px; border-bottom: 1px solid var(--line); text-align: left; } th { position: sticky; top: 0; z-index: 1; background: var(--surface-muted); color: var(--muted); font-size: 10px; letter-spacing: .04em; text-transform: uppercase; } td { background: #fff; color: var(--ink); } tr:last-child td { border-bottom: 0; } .right { text-align: right; }.cell-title { display: block; font-weight: 780; }.cell-sub { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }.row-actions { display: flex; justify-content: end; gap: 5px; }.table-button { min-height: 28px; padding: 0 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-muted); color: var(--blue-dark); font-size: 10px; font-weight: 800; }.table-button.danger { color: var(--danger); }.account-fields { display: grid; gap: 3px; padding: 11px; border: 1px solid #cceaf8; border-radius: 13px; background: var(--blue-soft); }.account-fields b { color: var(--blue-ink); font-size: 12px; }.account-fields small { color: #477285; font-size: 10px; }.customer-list { display: grid; gap: 8px; max-height: 520px; overflow: auto; }.customer-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-muted); }.customer-row b { display: block; font-size: 12px; }.customer-row small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }.customer-row__actions { display: flex; gap: 5px; }.admin-split-customers { grid-template-columns: minmax(300px,.48fr) minmax(0,.92fr); }.price-editor { display: grid; gap: 15px; margin-top: 16px; }.price-editor .section-heading { margin: 0; }.price-editor p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }.price-editor-controls { display: grid; grid-template-columns: minmax(0, 1fr) 185px auto; align-items: end; gap: 10px; }.empty-cell { color: var(--muted); text-align: center; }

.modal { width: min(100% - 28px, 440px); padding: 0; border: 0; border-radius: 21px; background: transparent; box-shadow: 0 24px 70px rgba(11, 51, 72, .28); }.modal::backdrop { background: rgba(12, 32, 44, .48); backdrop-filter: blur(3px); }.modal-card { display: grid; gap: 12px; padding: 25px; border-radius: 21px; background: #fff; }.modal-card h2 { margin: 1px 0; font-size: 24px; letter-spacing: -.05em; }.modal-card p { margin: 0 0 5px; color: var(--muted); font-size: 12px; }.modal-close { position: absolute; top: 11px; right: 12px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--surface-muted); color: var(--muted); font-size: 21px; }.form-message { min-height: 18px; margin: 0 !important; color: var(--danger) !important; }.bill-modal { width: min(100% - 20px, 680px); max-height: min(100% - 20px, 900px); background: #edf2f5; }.bill-modal__toolbar { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 13px; background: #fff; color: var(--ink); font-size: 12px; font-weight: 800; }.bill-modal__toolbar div { display: flex; gap: 7px; }.bill-stage { display: grid; place-items: start center; max-height: calc(100vh - 100px); overflow: auto; padding: 22px; }

.estimate-bill { width: 11.5cm; min-height: 19cm; padding: 3.1mm 2.4mm; border: 1px solid #181818; background: white; color: #111; font-family: Arial, sans-serif; font-size: 8px; line-height: 1.18; box-shadow: 0 2px 5px rgba(0,0,0,.16); }.estimate-bill__head { display: grid; grid-template-columns: 23px 1fr 23px; align-items: center; padding-bottom: 3px; border-bottom: 1px solid #555; text-align: center; }.estimate-bill__head p { margin: 0; font-size: 7px; font-weight: 700; }.estimate-bill__head h2 { margin: 2px 0; font-size: 10px; letter-spacing: .03em; }.estimate-bill__head b { display: inline-block; padding: 1px 11px; border: 1px solid #111; border-radius: 999px; font-size: 11px; font-style: italic; }.emblem { font-size: 17px; }.bill-number-row { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; text-align: right; }.bill-customer p { min-height: 15px; margin: 0; padding: 2px 0; border-bottom: 1px dotted #777; }.bill-customer p span { float: right; }.paper-table { table-layout: fixed; margin-top: 5px; border-collapse: collapse; font-size: 8px; }.paper-table th, .paper-table td { height: 16px; padding: 2px; border: 1px solid #777; background: #fff; color: #111; font-size: 8px; font-weight: normal; text-transform: none; letter-spacing: 0; }.paper-table th { position: static; font-weight: 700; text-align: center; }.paper-table th:nth-child(1) { width: 7%; }.paper-table th:nth-child(2) { width: 45%; }.paper-table th:nth-child(3) { width: 16%; }.paper-table th:nth-child(4) { width: 13%; }.paper-table th:nth-child(5) { width: 19%; }.paper-table td:nth-child(1), .paper-table td:nth-child(3) { text-align: center; }.paper-table td:nth-child(4), .paper-table td:nth-child(5), .paper-table tfoot td:last-child { text-align: right; }.paper-table tfoot td { height: 15px; font-weight: 700; text-align: right; }.paper-table .paper-grand td { font-weight: 800; }.bill-words { min-height: 22px; margin: 0; padding: 4px 1px; border-bottom: 1px dotted #777; }.estimate-bill__foot { display: flex; align-items: end; justify-content: space-between; gap: 8px; margin-top: 9px; }.estimate-bill__foot span:not(.bill-thanks) { width: 30%; padding-top: 4px; border-top: 1px dotted #555; text-align: center; }.bill-thanks { padding: 3px; border: 1px solid #222; font-size: 7px; }.bill-note { margin: 6px 0 0; padding-top: 3px; border-top: 1px solid #777; font-size: 7px; }
.toast-region { position: fixed; right: 18px; bottom: 18px; z-index: 80; display: grid; gap: 8px; width: min(360px, calc(100% - 36px)); }.toast { padding: 12px 14px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: 0 16px 32px rgba(19,68,95,.17); color: var(--ink); font-size: 12px; font-weight: 700; animation: toast-in .25s ease both; }.toast.error { border-color: #f2c7cc; color: #a12d39; }.toast.success { border-color: #bfe9dc; color: #0f7157; } @keyframes toast-in { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.form-hint { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.admin-login-page { min-height: 100vh; background: radial-gradient(circle at 0 0, rgba(0,148,218,.14), transparent 31rem), var(--surface); }
.admin-login-shell { width: min(100% - 2rem, 28rem); min-height: 100vh; margin: auto; display: grid; align-content: center; gap: 1.5rem; padding: 2rem 0; }
.admin-login-brand { justify-self: center; }.admin-login-card { display: grid; gap: 1rem; padding: clamp(1.3rem, 5vw, 2rem); }.admin-login-card h1, .admin-login-card p { margin: 0; }.admin-login-card form { display: grid; gap: 1rem; }.button-full { width: 100%; justify-content: center; }.text-link { color: var(--blue-dark); font-weight: 700; text-decoration: none; }.text-link:hover { text-decoration: underline; }

@media (max-width: 930px) { .billing-layout { grid-template-columns: 1fr; }.estimate-panel { position: static; }.cart-lines { max-height: 280px; }.form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.admin-split, .admin-split-customers { grid-template-columns: 1fr; }.metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 620px) { .topbar { min-height: 62px; padding: 9px 16px; }.brand small, .link-button { display: none; }.top-actions { gap: 4px; }.account-button { margin-left: 0; padding-right: 5px; }.account-button > span:last-child { display: none; } main { width: min(100% - 22px, 1440px); padding-top: 25px; }.shop-intro, .admin-title-row { display: grid; align-items: start; }.shop-intro h1, .admin-title-row h1 { font-size: 34px; }.price-state { justify-self: start; }.buyer-banner { align-items: flex-start; flex-wrap: wrap; }.buyer-banner .button { margin-left: 51px; }.catalog-panel, .estimate-panel, .checkout, .form-card, .table-card, .price-editor { padding: 15px; border-radius: 19px; }.product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }.product-card { min-height: 148px; padding: 11px; }.product-card h3 { font-size: 12px; }.form-grid { grid-template-columns: 1fr; }.form-wide { grid-column: auto; }.checkout-actions { display: grid; }.checkout-actions > div { display: grid; grid-template-columns: 1fr 1fr; }.checkout-actions .button { padding: 0 8px; }.metric-grid { gap: 8px; }.metric-card { padding: 14px; }.metric-card b { font-size: 22px; }.admin-tabs { overflow-x: auto; }.admin-tab { flex: 0 0 auto; }.table-toolbar { align-items: stretch; flex-direction: column; }.search-field.compact { width: 100%; }.two-fields, .price-editor-controls { grid-template-columns: 1fr; }.customer-row { align-items: start; flex-direction: column; }.customer-row__actions { width: 100%; }.customer-row__actions button { flex: 1; }.bill-stage { justify-content: start; padding: 13px; }.bill-modal { width: 100%; max-height: 100%; border-radius: 0; }.bill-modal__toolbar { flex-wrap: wrap; }.estimate-bill { flex: 0 0 auto; } }
@media print { @page { size: 11.5cm 19cm; margin: 0; } body * { visibility: hidden !important; } #bill-modal, #bill-modal *, #printable-bill, #printable-bill * { visibility: visible !important; } #bill-modal { position: static !important; display: block !important; width: auto !important; max-width: none !important; max-height: none !important; overflow: visible !important; background: #fff !important; box-shadow: none !important; } .bill-modal__toolbar { display: none !important; } .bill-stage { display: block !important; max-height: none !important; overflow: visible !important; padding: 0 !important; } .estimate-bill { width: 11.5cm !important; height: 19cm !important; min-height: 19cm !important; margin: 0 !important; box-shadow: none !important; } }