@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&display=swap');
:root { --ink:#1d2926; --muted:#75807c; --line:#e6e9e5; --cream:#f6f7f3; --card:#fff; --accent:#e87952; --accent-dark:#cb5e3a; --nav:#23332f; }
* { box-sizing:border-box; }
body { margin:0; min-width:1080px; background:var(--cream); color:var(--ink); font-family:'DM Sans',system-ui,sans-serif; font-size:14px; }
button, input { font:inherit; }
button { border:0; cursor:pointer; }
.app-shell { display:flex; min-height:100vh; }
.sidebar { width:238px; background:var(--nav); color:#eaf0ea; display:flex; flex-direction:column; padding:25px 16px 18px; }
.brand-mark { display:flex; align-items:center; gap:9px; color:#fff; font-size:23px; font-weight:700; letter-spacing:-.8px; padding:0 11px 30px; }
.brand-dot { width:12px; height:12px; background:var(--accent); display:inline-block; border-radius:50% 50% 50% 0; transform:rotate(-45deg); }
.store-switcher { display:flex; align-items:center; gap:10px; padding:12px 10px; background:#30443e; border:1px solid #3a5049; border-radius:10px; }
.store-avatar,.profile-avatar { flex:none; display:grid; place-items:center; background:#dce9dc; color:#315047; font-weight:700; border-radius:8px; }
.store-avatar { width:31px; height:31px; font-size:13px; }.store-switcher strong,.profile strong { display:block; font-size:12px; font-weight:600; }.store-switcher small,.profile small { display:block; color:#9eaca5; font-size:11px; margin-top:2px; }.chevron { margin-left:auto; color:#a7b6ae; font-size:18px; }
.main-nav { margin-top:29px; }.nav-item { display:flex; align-items:center; gap:12px; width:100%; padding:12px 12px; color:#a9b8b1; background:transparent; text-align:left; border-radius:8px; margin-bottom:3px; }.nav-item:hover,.nav-item.active { color:#fff; background:#30443e; }.nav-item.active { box-shadow:inset 3px 0 var(--accent); }.nav-icon { width:19px; text-align:center; color:#a9b8b1; font-size:17px; }.nav-item.active .nav-icon { color:var(--accent); }.import-nav-item { margin-top:18px; color:#f0b29d; border-top:1px solid #3a4a45; border-radius:0 0 8px 8px; padding-top:18px; }.import-nav-item .nav-icon { color:#e87952; }.import-nav-item:hover { color:#fff; background:#30443e; }.sidebar-bottom { margin-top:auto; }.profile { display:flex; align-items:center; gap:9px; border-top:1px solid #3a4a45; padding:18px 10px 0; margin-top:16px; }.profile-avatar { width:30px; height:30px; border-radius:50%; font-size:11px; }.more { margin-left:auto; color:#95a69e; letter-spacing:2px; }
.workspace { flex:1; min-width:0; }.topbar { height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; background:var(--card); border-bottom:1px solid var(--line); }.eyebrow { margin:0 0 5px; color:#89938f; font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }.topbar h1,.cart-header h2 { margin:0; font-size:21px; letter-spacing:-.6px; }.topbar-actions { display:flex; align-items:center; gap:15px; }.connection { display:flex; align-items:center; gap:7px; color:#4d655b; font-size:12px; }.connection small { color:#a0aaa5; margin-left:2px; }.connection-dot { width:7px; height:7px; background:#5ba876; border-radius:50%; }.icon-button,.help-button { width:34px; height:34px; border:1px solid var(--line); border-radius:8px; background:#fff; color:#65716c; font-size:19px; }.help-button { border-radius:50%; font-size:13px; }
.pos-layout { display:grid; grid-template-columns:minmax(520px,1fr) 385px; min-height:calc(100vh - 94px); }.catalog-panel { padding:29px 34px 35px 39px; }.catalog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:20px; }.category-tabs { display:flex; gap:20px; }.category-tab { background:transparent; color:#8a9590; padding:8px 0; border-bottom:2px solid transparent; white-space:nowrap; }.category-tab.selected { color:var(--ink); border-color:var(--accent); font-weight:600; }.search-box { display:flex; align-items:center; gap:8px; width:185px; padding:8px 10px; background:#fff; border:1px solid var(--line); border-radius:7px; color:#9da7a2; }.item-search-box { width:min(66%, 720px); min-width:300px; }.search-box input { min-width:0; flex:1; border:0; outline:0; color:var(--ink); background:transparent; font-size:12px; }.search-box kbd { border:1px solid #e2e6e2; border-radius:4px; padding:1px 4px; font-family:inherit; font-size:10px; color:#9da7a2; }.customer-picker-group { display:flex; align-items:center; gap:6px; }.customer-picker { position:relative; width:220px; }.customer-search-box { width:100%; }.walk-in-toggle { display:flex; align-items:center; gap:6px; min-height:34px; padding:6px 8px; color:#738078; border:1px solid #dfe6e0; border-radius:17px; background:#f4f6f3; font-size:10px; font-weight:700; white-space:nowrap; }.walk-in-toggle:hover { border-color:#82ad91; }.walk-in-toggle.selected { color:#fff; border-color:#4f8c69; background:#4f8c69; }.walk-in-toggle-track { position:relative; width:25px; height:14px; border-radius:8px; background:#c3ccc5; }.walk-in-toggle-knob { position:absolute; top:2px; left:2px; width:10px; height:10px; border-radius:50%; background:#fff; transition:transform .16s ease; }.walk-in-toggle.selected .walk-in-toggle-track { background:#d9f0de; }.walk-in-toggle.selected .walk-in-toggle-knob { transform:translateX(11px); background:#347252; }.customer-picker-results { position:absolute; z-index:4; top:43px; left:0; right:0; overflow:hidden; border:1px solid #dfe6e0; border-radius:6px; background:#fff; box-shadow:0 8px 18px rgba(29,41,38,.12); }.customer-picker-results button { display:flex; flex-direction:column; align-items:flex-start; gap:3px; width:100%; padding:9px 10px; color:#42524a; background:#fff; text-align:left; font-size:11px; }.customer-picker-results button:hover { background:#fff7f3; color:var(--accent-dark); }.customer-picker-results button small { color:#9aa49e; font-size:9px; }.quick-add { display:flex; align-items:center; gap:8px; margin-bottom:17px; color:#8a9590; font-size:12px; }.quick-add button { color:#c96849; padding:6px 10px; border:1px solid #f0c5b6; background:#fff8f5; border-radius:5px; font-size:11px; }.product-grid { display:grid; grid-template-columns:repeat(4,minmax(125px,1fr)); gap:13px; }.product-card { min-height:153px; padding:14px; text-align:left; background:#fff; border:1px solid #edf0ec; border-radius:10px; box-shadow:0 2px 6px rgba(29,41,38,.025); transition:transform .15s,box-shadow .15s,border-color .15s; }.product-card:hover { transform:translateY(-2px); border-color:#e9b09d; box-shadow:0 6px 14px rgba(29,41,38,.08); }.product-icon,.mini-icon { display:grid; place-items:center; background:#f2e8d9; }.product-icon { width:48px; height:48px; border-radius:10px; font-size:24px; margin-bottom:14px; }.product-name { display:block; font-weight:600; font-size:13px; line-height:1.2; }.product-meta { display:flex; justify-content:space-between; margin-top:7px; color:#98a19d; font-size:10px; }.product-meta strong { color:#53605a; font-family:'DM Mono',monospace; font-weight:500; }.product-icon.blue,.mini-icon.blue { background:#e0edf5; }.product-icon.green,.mini-icon.green { background:#e5f0df; }.product-icon.yellow,.mini-icon.yellow { background:#f8efca; }.product-icon.purple,.mini-icon.purple { background:#eee4f3; }.product-icon.peach,.mini-icon.peach { background:#f8e3d6; }.product-icon.orange,.mini-icon.orange { background:#fae5cf; }.product-icon.lime,.mini-icon.lime { background:#e8f1d6; }.product-icon.mint,.mini-icon.mint { background:#def0e8; }.product-icon.sky,.mini-icon.sky { background:#dcecf2; }.empty-state { padding:70px 10px; text-align:center; color:#9aa39e; }
.cart-panel { display:flex; flex-direction:column; min-height:calc(100vh - 94px); background:#fff; border-left:1px solid var(--line); padding:29px 26px 22px; }.cart-header { display:flex; justify-content:space-between; align-items:flex-start; }.cart-header h2 { font-size:18px; }.cart-header-actions { display:flex; align-items:center; gap:7px; }.walk-in-order-button { padding:5px 7px; color:#6c8176; border:1px solid #d6e4da; border-radius:5px; background:#f5faf6; font-size:9px; }.walk-in-order-button:hover,.walk-in-order-button.selected { color:#fff; border-color:#5b8870; background:#5b8870; }.clear-invoice-button { padding:5px 7px; color:#b5664d; border:1px solid #f0c5b6; border-radius:5px; background:#fff8f5; font-size:9px; }.clear-invoice-button:hover { background:#fff0eb; }.clear-invoice-button:disabled { cursor:not-allowed; opacity:.4; }.more-button { background:transparent; color:#9ca6a2; letter-spacing:2px; padding:5px; }.order-type { display:flex; gap:3px; padding:3px; background:#f2f4f1; border-radius:7px; margin:20px 0 18px; }.order-type button { flex:1; padding:8px; background:transparent; border-radius:5px; color:#89938e; font-size:11px; }.order-type button.selected { background:#fff; color:var(--ink); box-shadow:0 1px 3px #dfe4df; font-weight:600; }.cart-items { min-height:180px; }.cart-item { display:flex; align-items:center; gap:9px; padding:12px 0; border-bottom:1px solid #f0f2ef; }.mini-icon { width:32px; height:32px; border-radius:7px; font-size:16px; }.cart-item-info { flex:1; min-width:0; }.cart-item-info strong { display:block; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.cart-item-info small { display:block; color:#9ca5a0; font-size:10px; margin-top:3px; }.quantity-control { display:flex; align-items:center; gap:7px; color:#5b6963; font-size:11px; }.quantity-control button { display:grid; place-items:center; width:20px; height:20px; border-radius:5px; background:#f1f3f0; color:#728079; }.line-total { width:44px; text-align:right; font-family:'DM Mono',monospace; font-size:11px; font-weight:500; }.empty-cart { min-height:180px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; color:#93a09a; border-bottom:1px solid #f0f2ef; }.empty-cart span { display:grid; place-items:center; width:36px; height:36px; margin-bottom:4px; border:1px dashed #cbd4ce; border-radius:50%; font-size:20px; }.empty-cart strong { color:#64736b; font-size:12px; }.empty-cart small { font-size:11px; }.add-customer { margin:18px 0; padding:10px; border:1px dashed #c8d1cb; border-radius:6px; color:#76847d; background:#fafbfa; font-size:11px; }.summary { border-top:1px solid var(--line); padding-top:15px; }.summary > div { display:flex; justify-content:space-between; margin:9px 0; color:#76827c; font-size:12px; }.summary em { font-style:normal; color:#aab2ad; font-size:10px; margin-left:4px; }.summary strong { color:#52615a; font-family:'DM Mono',monospace; font-size:11px; font-weight:500; }.summary .total-row { padding-top:12px; margin-top:13px; border-top:1px solid var(--line); color:var(--ink); font-weight:600; font-size:15px; }.summary .total-row strong { color:var(--ink); font-size:16px; }.cart-actions { display:flex; gap:8px; margin-top:18px; }.secondary-action,.primary-action { flex:1; padding:12px 10px; border-radius:6px; font-size:11px; font-weight:600; }.secondary-action { background:#f2f4f1; color:#66756d; }.primary-action { background:var(--accent); color:#fff; }.primary-action:hover { background:var(--accent-dark); }.primary-action:disabled,.clear-order:disabled { cursor:not-allowed; opacity:.5; }.primary-action span { float:right; font-size:16px; line-height:10px; }.clear-order { background:transparent; color:#a2aba6; font-size:10px; padding:12px; }
.tax-toggle { display:flex; align-items:center; justify-content:space-between; margin:12px 0 7px; color:#76827c; font-size:11px; cursor:pointer; }.tax-toggle input { position:absolute; opacity:0; pointer-events:none; }.toggle-switch { position:relative; width:31px; height:18px; border-radius:10px; background:#e2e8e3; transition:background .15s; }.toggle-switch::after { content:""; position:absolute; top:3px; left:3px; width:12px; height:12px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(29,41,38,.16); transition:transform .15s; }.tax-toggle input:checked + .toggle-switch { background:var(--accent); }.tax-toggle input:checked + .toggle-switch::after { transform:translateX(13px); }.tax-toggle input:focus-visible + .toggle-switch { outline:2px solid #e3a18c; outline-offset:2px; }
.tax-rate-control { display:flex; align-items:center; justify-content:space-between; margin:7px 0 9px; color:#76827c; font-size:11px; }.tax-rate-field { display:flex; align-items:center; gap:3px; padding:3px 6px; border:1px solid #e0e7e1; border-radius:5px; background:#fbfcfb; color:#89958e; font-family:'DM Mono',monospace; }.tax-rate-field:focus-within { border-color:#e39d86; background:#fffaf7; }.tax-rate-field input { width:42px; padding:0; border:0; outline:0; background:transparent; color:#34473f; font-family:inherit; font-size:10px; text-align:right; }.tax-rate-field b { font-size:10px; font-weight:400; }
.walk-in-editor { margin:-3px 0 19px; padding:14px; border:1px solid #e7c1b4; border-radius:9px; background:#fffaf7; }.walk-in-editor-heading { display:flex; align-items:flex-start; justify-content:space-between; }.walk-in-editor-heading strong { display:block; font-size:13px; }.walk-in-editor-heading small { display:block; margin-top:4px; color:#8f9a94; font-size:10px; }.walk-in-close { color:#a06e5c; background:transparent; font-size:18px; }.walk-in-editor-fields { display:grid; grid-template-columns:minmax(180px,2fr) 110px 100px auto; gap:8px; align-items:end; margin-top:11px; }.walk-in-editor-fields label { display:flex; flex-direction:column; gap:4px; color:#7c8982; font-size:9px; }.walk-in-editor-fields select,.walk-in-editor-fields input { width:100%; min-width:0; padding:7px; border:1px solid #e4d7d1; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:10px; }.walk-in-editor-fields select:focus,.walk-in-editor-fields input:focus { border-color:#e3a18c; }.walk-in-editor-fields .save-price-button { height:30px; white-space:nowrap; }.product-price-actions { display:flex; gap:7px; margin-top:auto; }.secondary-price-link { color:#7b8a82 !important; border-color:#dfe6e0 !important; background:#fbfcfa !important; }
.invoice-import-modal { position:relative; width:min(1220px, calc(100vw - 80px)); max-height:90vh; overflow:auto; padding:30px; background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(16,33,27,.24); }.invoice-import-modal h2 { margin:0; font-size:20px; }.import-intro { margin:8px 0 18px; color:#8f9a94; font-size:11px; }.invoice-upload { display:flex; flex-direction:column; align-items:center; gap:5px; padding:20px; border:1px dashed #d5a694; border-radius:8px; background:#fffaf7; color:#b95f46; text-align:center; cursor:pointer; }.invoice-upload input { display:none; }.invoice-upload strong { font-size:12px; }.invoice-upload small { color:#9a938e; font-size:10px; }.import-status { margin:12px 0; color:#6c8176; font-size:11px; }.import-error { margin:12px 0; padding:9px 10px; color:#a94f3c; background:#fff0eb; border-radius:5px; font-size:10px; }.import-review { margin-top:18px; }.import-review-head { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:9px; }.import-review-head strong { display:block; font-size:13px; }.import-review-head small { display:block; margin-top:4px; color:#8f9a94; font-size:10px; }.import-table { overflow:auto; border:1px solid #e5ebe5; border-radius:7px; }.import-table-head,.import-row { display:grid; grid-template-columns:24px 115px minmax(230px,2fr) minmax(170px,1.5fr) 120px 62px 58px 90px 90px; gap:7px; align-items:center; min-width:1050px; padding:8px 10px; }.import-table-head { color:#8b9690; background:#f5f7f4; font-size:9px; text-transform:uppercase; letter-spacing:.04em; }.import-row { border-top:1px solid #eef1ed; font-size:10px; }.import-row.existing { background:#f7faf7; }.import-row input,.import-row select { width:100%; min-width:0; padding:6px 6px; border:1px solid #dfe6e0; border-radius:4px; outline:0; background:#fff; color:#42524a; font-size:10px; }.import-row input[type="checkbox"] { width:14px; height:14px; }.import-row input:focus,.import-row select:focus { border-color:#e3a18c; }.import-description { color:#64736b; line-height:1.25; font-size:9px; }.import-code { display:flex; flex-direction:column; gap:3px; color:#64736b; font-family:'DM Mono',monospace; font-size:9px; }.import-code em { color:#6c9a78; font-family:'DM Sans',sans-serif; font-size:8px; font-style:normal; }.import-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }.import-actions button { flex:0 0 160px; }
.import-row-wrap { min-width:1050px; border-top:1px solid #eef1ed; background:#fff; }.import-table-head + .import-row-wrap { border-top:0; }.import-row-wrap .import-row { border-top:0; }.import-primary-unit,.import-primary-pack { color:#64736b; font-size:10px; }.import-unit-editor { display:flex; align-items:flex-start; gap:12px; padding:6px 10px 9px 154px; background:#fbfcfa; border-top:1px dashed #e5ebe5; }.import-unit-editor-head { flex:0 0 115px; padding-top:5px; }.import-unit-editor-head strong { display:block; color:#53635b; font-size:10px; }.import-unit-editor-head small { display:block; margin-top:3px; color:#9aa49e; font-size:8px; line-height:1.25; }.import-unit-list { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }.import-unit-option { display:flex; align-items:center; gap:4px; }.import-unit-option input { width:72px; padding:5px 5px; border:1px solid #dfe6e0; border-radius:4px; outline:0; color:#42524a; background:#fff; font-size:9px; }.import-unit-option input:first-child { width:76px; }.import-unit-option input:nth-child(2) { width:54px; }.import-unit-option input:focus { border-color:#e3a18c; }.import-unit-option button { width:20px; height:24px; color:#a36b5a; background:#f8e9e3; border-radius:4px; font-size:13px; }.import-unit-option button:disabled { cursor:not-allowed; opacity:.35; }.import-add-unit { padding:5px 7px; color:#b95f46; border:1px dashed #e4b5a5; border-radius:4px; background:#fff8f5; font-size:9px; }
.import-margin-control { display:flex; align-items:center; gap:6px; margin-left:auto; color:#6c7b73; font-size:10px; }.import-margin-field { display:flex; align-items:center; gap:3px; padding:4px 6px; border:1px solid #dfe6e0; border-radius:5px; background:#fbfcfa; color:#697870; font-family:'DM Mono',monospace; }.import-margin-field:focus-within { border-color:#e3a18c; background:#fffaf7; }.import-margin-field input { width:34px; padding:0; border:0; outline:0; background:transparent; color:#34473f; font-family:inherit; font-size:10px; text-align:right; }.import-margin-field b { font-size:10px; font-weight:400; }
.modal-backdrop { position:fixed; inset:0; display:grid; place-items:center; background:rgba(25,39,34,.45); z-index:5; }.payment-modal { position:relative; width:370px; padding:35px; text-align:center; background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(16,33,27,.24); }.modal-close { position:absolute; top:13px; right:15px; color:#98a39d; background:transparent; font-size:22px; }.payment-icon { display:grid; place-items:center; width:42px; height:42px; margin:0 auto 18px; color:#fff; background:var(--accent); border-radius:50%; font-size:19px; }.payment-modal h2 { margin:0; font-size:20px; }.payment-total { margin:10px 0 25px; color:var(--ink); font-family:'DM Mono',monospace; font-size:29px; }.payment-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.payment-options button { display:flex; flex-direction:column; align-items:center; gap:4px; padding:17px 8px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#fcfdfc; }.payment-options button:hover { border-color:#e6a38e; background:#fff8f5; }.payment-options span { color:var(--accent); font-size:20px; }.payment-options strong { font-size:12px; }.payment-options small { color:#9ba49f; font-size:9px; }.toast { display:flex; align-items:center; gap:14px; position:fixed; right:28px; bottom:25px; z-index:10; padding:10px 11px 10px 15px; color:#fff; background:#273a34; border-radius:7px; box-shadow:0 8px 25px rgba(27,44,37,.18); font-size:12px; }.toast button { padding:6px 9px; color:#fff; background:#e87952; border-radius:4px; font-size:10px; font-weight:600; }.toast button:hover { background:#cb5e3a; }.toast-enter-active,.toast-leave-active { transition:all .25s ease; }.toast-enter-from,.toast-leave-to { opacity:0; transform:translateY(8px); }
.quick-add small { margin-left:auto; color:#a2aba6; font-size:10px; }
.product-brand { display:block; margin-top:4px; color:#b95f46; font-size:10px; font-weight:600; }.product-description { display:block; max-height:23px; margin-top:3px; overflow:hidden; color:#89958e; font-size:9px; line-height:1.25; }.product-supplier { display:block; margin-top:3px; color:#6b8578; font-size:9px; }.cart-variant-detail { color:#8c9891 !important; font-size:9px !important; line-height:1.25; }.cart-supplier { color:#6b8578 !important; font-size:9px !important; }.brand-icon { font-family:'DM Mono',monospace; font-size:13px; font-weight:600; letter-spacing:-.04em; }.brand-mini-icon { font-family:'DM Mono',monospace; font-size:9px; font-weight:600; letter-spacing:-.05em; }.picker-results button em { color:#b95f46; font-size:10px; font-style:normal; }
.account-tag { display:inline-block; margin-top:7px; padding:4px 7px; color:#6f7e76; background:#f1f5f1; border-radius:4px; font-size:10px; }
.inline-price-editor { display:flex; align-items:center; width:max-content; margin-top:5px; padding:3px 6px; border:1px solid #e0e7e1; border-radius:5px; color:#89958e; background:#fbfcfb; font-family:'DM Mono',monospace; font-size:10px; }.inline-price-editor:focus-within { border-color:#e39d86; background:#fffaf7; }.inline-price-editor input { width:58px; padding:0; border:0; outline:0; color:#34473f; background:transparent; font-family:inherit; font-size:11px; }.inline-price-editor em { margin-left:6px; color:#c46b4d; font-family:'DM Sans',sans-serif; font-size:9px; font-style:normal; }
.pricing-panel { margin:-3px 0 19px; padding:15px; border:1px solid #e5ebe5; border-radius:9px; background:#fbfcfa; box-shadow:0 3px 10px rgba(29,41,38,.035); }
.pricing-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.pricing-panel-head strong { display:block; font-size:13px; }.pricing-panel-head small { display:block; margin-top:4px; color:#8f9b94; font-size:10px; }.saved-badge { padding:4px 7px; color:#4e8b61; background:#e8f4e9; border-radius:4px; font-size:9px; font-weight:600; }
.pricing-row { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:9px; margin-top:13px; }.pricing-row label { display:flex; flex-direction:column; gap:5px; color:#718078; font-size:10px; }.pricing-row select,.pricing-row input { width:100%; min-width:0; padding:8px 8px; border:1px solid #dfe6e0; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:11px; }.pricing-row select:focus,.pricing-row input:focus { border-color:#e3a18c; }.pricing-divider { height:1px; margin:14px 0 12px; background:#e7ece7; }.adjustment-input { display:flex; }.adjustment-input input { border-radius:5px 0 0 5px; }.adjustment-input select { width:50px; border-left:0; border-radius:0 5px 5px 0; }.pricing-buttons { display:flex; align-items:center; gap:7px; }.pricing-buttons .secondary-action { padding:9px 10px; }.text-action { color:#9a6d61; background:transparent; font-size:10px; }.pricing-help { display:block; margin-top:7px; color:#99a39e; font-size:9px; line-height:1.35; }.permanent-row { grid-template-columns:1.4fr .75fr .65fr auto; }.save-price-button { padding:8px 10px; color:#fff; background:#30463e; border-radius:5px; font-size:10px; font-weight:600; white-space:nowrap; }
.payment-context { margin-top:8px; color:#8f9a94; font-size:11px; }
.bulk-price-block { padding:12px; border:1px solid #eadfd5; border-radius:7px; background:#fffaf6; }.bulk-price-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.bulk-price-head strong { display:block; font-size:12px; }.bulk-price-head small { display:block; margin-top:4px; color:#9a938e; font-size:10px; }.bulk-badge { padding:4px 7px; color:#a8684d; background:#f9e9df; border-radius:4px; font-size:9px; font-weight:600; }.bulk-row { grid-template-columns:1.35fr .75fr .55fr .38fr auto; }.bulk-mode { align-self:end; width:48px; height:31px; padding:0 4px; border:1px solid #dfe6e0; border-radius:5px; background:#fff; color:#42524a; font-size:11px; }
.product-picker { position:relative; min-width:0; }.product-picker > label { display:flex; flex-direction:column; gap:5px; color:#718078; font-size:10px; }.product-picker input { width:100%; min-width:0; padding:8px; border:1px solid #dfe6e0; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:11px; }.product-picker input:focus { border-color:#e3a18c; }.picker-results { position:absolute; z-index:4; top:49px; left:0; right:0; overflow:hidden; border:1px solid #dfe6e0; border-radius:6px; background:#fff; box-shadow:0 8px 18px rgba(29,41,38,.12); }.picker-results button { display:flex; align-items:center; justify-content:space-between; width:100%; padding:9px 10px; color:#42524a; background:#fff; text-align:left; font-size:11px; }.picker-results button:hover { background:#fff7f3; color:var(--accent-dark); }.picker-results button small { color:#9aa49e; font-family:'DM Mono',monospace; font-size:9px; }.no-results { display:block; padding:10px; color:#9aa49e; font-size:10px; }
.price-link { display:block; width:100%; margin-top:8px; padding:3px 0 0; color:#b96b51; background:transparent; text-align:left; font-size:9px; }.price-link:hover { color:var(--accent-dark); text-decoration:underline; }
.product-card { display:flex; flex-direction:column; min-height:196px; padding:12px; }
.custom-product-card { border-color:#f0c5b6; background:#fffaf7; }.custom-product-icon { margin-bottom:10px; }.custom-product-name,.custom-product-fields label { display:flex; flex-direction:column; gap:5px; color:#8a817b; font-size:9px; }.custom-product-name input,.custom-product-fields input,.custom-product-fields select,.custom-unit-code { width:100%; min-width:0; padding:6px 7px; border:1px solid #eadbd3; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:11px; }.custom-product-name input:focus,.custom-product-fields input:focus,.custom-product-fields select:focus,.custom-unit-code:focus { border-color:#e3a18c; }.custom-unit-code { margin-top:7px; }.custom-product-fields { display:grid; grid-template-columns:.9fr 1.1fr; gap:6px; margin-top:8px; }.custom-product-add { margin-top:auto; padding:7px 6px; color:#fff; background:var(--accent); border-radius:5px; font-size:10px; font-weight:600; }.custom-product-add:hover { background:var(--accent-dark); }.custom-product-add:disabled { opacity:.5; cursor:not-allowed; }
.product-card { position:relative; }
.product-main { display:block; width:100%; padding:2px; text-align:left; background:transparent; color:inherit; }
.product-main:hover .product-name { color:var(--accent-dark); }
.unit-options { display:flex; gap:4px; margin-top:auto; padding-top:10px; border-top:1px solid #f0f2ef; }
.unit-options button { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; align-items:center; padding:5px 2px; border:1px solid #dfe6e0; border-radius:5px; background:#fbfcfb; color:#697770; font-size:9px; }
.unit-options button:hover { border-color:#e8a28d; background:#fff7f3; color:var(--accent-dark); }
.unit-options strong { font-family:'DM Mono',monospace; font-size:9px; font-weight:500; }
.unit-options span { color:#9ca7a1; font-size:9px; }
.quick-price-modal { position:relative; width:380px; padding:28px; background:#fff; border-radius:12px; box-shadow:0 20px 60px rgba(16,33,27,.24); }.quick-price-modal h2 { margin:0; padding-right:18px; font-size:19px; line-height:1.2; }.quick-price-context { margin:7px 0 21px; color:#8f9a94; font-size:11px; }.quick-price-modal label { display:flex; flex-direction:column; gap:5px; margin-top:12px; color:#718078; font-size:10px; }.quick-price-modal select,.quick-price-modal input { width:100%; padding:10px; border:1px solid #dfe6e0; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:12px; }.quick-price-modal select:focus,.quick-price-modal input:focus { border-color:#e3a18c; }.quick-price-help { display:block; margin-top:10px; color:#99a39e; font-size:9px; line-height:1.35; }.quick-price-actions button { flex:1; min-height:38px; }.quick-price-single { margin-top:18px; padding:12px; border:1px solid #dfe8e1; border-radius:7px; background:#fbfdfb; }.quick-price-section-heading strong { display:block; color:#53635b; font-size:11px; }.quick-price-section-heading small { display:block; margin-top:4px; color:#8e9b94; font-size:9px; }.quick-price-single label { margin-top:10px; }.quick-price-save-button { width:100%; margin-top:10px; padding:9px; color:#fff; background:#30463e; border-radius:5px; font-size:10px; font-weight:600; }.quick-price-save-button:hover { background:#233b32; }.quick-price-bulk { margin-top:10px; padding:12px; border:1px solid #efd2c5; border-radius:7px; background:#fff8f4; }.quick-price-bulk strong { display:block; color:#9f5d47; font-size:11px; }.quick-price-bulk small { display:block; margin-top:4px; color:#9a8178; font-size:9px; line-height:1.35; }.quick-price-bulk-row { display:grid; grid-template-columns:1fr 52px auto; gap:6px; margin-top:10px; }.quick-price-bulk-row input,.quick-price-bulk-row select { min-width:0; padding:8px; border:1px solid #dfd9d3; border-radius:5px; background:#fff; color:#42524a; font-size:11px; }.quick-price-bulk-row button { padding:8px 9px; color:#fff; background:#bd6e52; border-radius:5px; font-size:10px; font-weight:600; white-space:nowrap; }.quick-price-bulk-row button:hover { background:#a95d44; }.quick-price-undo-button { width:100%; margin-top:10px; padding:9px; color:#9f5d47; background:#fff4ee; border:1px solid #e6b9a8; border-radius:5px; font-size:10px; font-weight:600; }.quick-price-undo-button:hover { background:#ffebe2; }.quick-price-cancel-button { width:100%; margin-top:10px; padding:8px; color:#718078; background:transparent; border:1px solid #e5ebe6; border-radius:5px; font-size:10px; }
.cart-unit { width:45px; padding:5px 2px; border:1px solid #e2e7e2; border-radius:5px; background:#fbfcfb; color:#697770; font-family:'DM Mono',monospace; font-size:9px; }
.custom-cart-unit-editor { display:flex; align-items:center; gap:4px; }.custom-cart-unit-input { width:58px; padding:5px 5px; border:1px solid #e2e7e2; border-radius:5px; outline:0; background:#fff; color:#697770; font-family:'DM Mono',monospace; font-size:9px; }.custom-cart-unit-input:focus { border-color:#e3a18c; }
.custom-name-input { display:block; width:100%; padding:5px 7px; border:1px solid #e0e7e1; border-radius:5px; outline:0; color:var(--ink); background:#fbfcfb; font-weight:600; font-size:12px; }.custom-name-input:focus { border-color:#e39d86; background:#fffaf7; }.custom-unit { display:inline-grid; place-items:center; width:auto; min-width:45px; padding:5px 6px; }
.misc-modal { text-align:left; }.modal-subtext { margin:8px 0 22px; color:#8f9a94; font-size:11px; }.misc-form { display:flex; flex-direction:column; gap:12px; }.misc-form label { display:flex; flex-direction:column; gap:5px; color:#718078; font-size:10px; }.misc-form input,.misc-form select { width:100%; padding:9px 10px; border:1px solid #dfe6e0; border-radius:5px; outline:0; background:#fff; color:#42524a; font-size:12px; }.misc-form-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.misc-actions { display:flex; gap:8px; margin-top:20px; }.misc-actions button { flex:1; }
/* Larger touch targets for the invoice side of the POS. */
.pos-layout { grid-template-columns:minmax(520px,1fr) 435px; }.cart-panel { padding:30px 30px 24px; }.cart-header h2 { font-size:21px; }.account-tag { padding:6px 8px; font-size:11px; }.order-type { margin:22px 0 20px; }.order-type button { min-height:44px; padding:10px 8px; font-size:13px; }.cart-item { gap:12px; padding:15px 0; }.mini-icon { width:40px; height:40px; font-size:19px; }.cart-item-info strong { font-size:14px; }.cart-item-info small { font-size:11px; margin-top:4px; }.cart-variant-detail { font-size:10px !important; }.cart-unit { width:60px; min-height:40px; padding:8px 4px; font-size:11px; }.quantity-control { gap:9px; font-size:13px; }.quantity-control button { width:32px; height:32px; border-radius:7px; font-size:17px; }.quantity-control span { min-width:15px; text-align:center; }.line-total { width:58px; font-size:13px; }.inline-price-editor { padding:6px 8px; }.inline-price-editor input { width:70px; font-size:13px; }.cart-actions button { min-height:45px; font-size:12px; }.clear-order { padding:14px; font-size:11px; }.tax-toggle,.tax-rate-control { font-size:12px; }.tax-rate-field { padding:6px 8px; }.tax-rate-field input { width:46px; font-size:12px; }
.pos-layout { grid-template-columns:minmax(520px,1fr) 470px; }.cart-panel { padding:26px 24px 20px; }.cart-header h2 { font-size:20px; }.order-type { margin:20px 0 18px; }.order-type button { min-height:40px; padding:9px 7px; font-size:12px; }.cart-item { gap:9px; padding:13px 0; }.mini-icon { width:36px; height:36px; font-size:17px; }.cart-item-info { min-width:105px; }.cart-item-info strong { font-size:13px; line-height:1.2; white-space:normal; overflow:visible; text-overflow:clip; }.cart-item-info small { font-size:10px; }.cart-unit { width:72px; min-width:72px; min-height:36px; padding:7px 3px; font-size:10px; }.quantity-control { gap:7px; font-size:12px; }.quantity-control button { width:28px; height:28px; border-radius:6px; font-size:15px; }.line-total { width:50px; font-size:12px; }.inline-price-editor { min-height:36px; padding:5px 7px; }.inline-price-editor input { width:60px; font-size:12px; }.cart-actions button { min-height:42px; font-size:11px; }
.product-grid { align-items:start; }.customer-required-notice { margin:-5px 0 14px; padding:9px 11px; color:#9a6d5f; border:1px solid #efd2c5; border-radius:6px; background:#fff8f4; font-size:11px; font-weight:600; }.catalog-locked { opacity:.5; }.catalog-locked .product-main,.catalog-locked .unit-options button,.catalog-locked input { cursor:not-allowed; }.catalog-locked .product-main,.catalog-locked .unit-options,.catalog-locked .custom-product-add { pointer-events:none; }.catalog-locked .product-main:hover .product-name { color:inherit; }.product-card { min-height:245px; align-self:start; }.product-card-main-layout { display:flex; align-items:flex-start; gap:14px; }.product-card-copy { min-width:0; padding-top:7px; text-align:left; }.product-card-copy .product-name { font-size:14px; }.product-card-copy .product-description,.product-card-copy .product-supplier { display:block; }.product-icon { flex:0 0 128px; width:128px; height:128px; font-size:48px; margin-bottom:12px; }.custom-product-card { min-height:245px; }.custom-product-card .custom-product-icon { flex:0 0 64px; width:64px; height:64px; margin:0 0 10px; font-size:30px; }.unit-options { gap:0; margin-top:8px; padding-top:0; }.unit-options button { min-height:62px; padding:10px 5px; border-radius:0; font-size:11px; }.unit-options button:first-child { border-radius:7px 0 0 7px; }.unit-options button:last-child { border-radius:0 7px 7px 0; }.unit-options strong { font-size:12px; }.unit-options span { font-size:11px; }
.product-details-modal { position:relative; width:500px; max-height:86vh; overflow:auto; padding:27px; background:#fff; border-radius:12px; box-shadow:0 20px 60px rgba(16,33,27,.24); }.product-details-photo { display:grid; place-items:center; width:84px; height:84px; margin-bottom:15px; overflow:hidden; border-radius:10px; background:#edf3ee; }.product-details-photo.has-photo { cursor:zoom-in; }.product-details-photo img { width:100%; height:100%; object-fit:cover; }.product-details-photo .product-icon { margin:0; }.product-details-modal h2 { margin:0; padding-right:20px; font-size:21px; }.product-details-code { margin:6px 0 20px; color:#8d9992; font-family:'DM Mono',monospace; font-size:11px; }.product-details-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.product-details-grid > div { padding:10px; border:1px solid #e5ebe6; border-radius:6px; background:#fbfdfb; }.product-details-grid small { color:#98a39d; font-size:9px; }.product-details-grid p { margin:5px 0 0; color:#53635b; font-size:11px; line-height:1.35; }.product-purchase-history { margin-top:14px; padding:11px; border:1px solid #e5ebe6; border-radius:6px; }.product-purchase-history > strong { display:block; color:#53635b; font-size:11px; }.product-purchase-history div { display:flex; justify-content:space-between; gap:10px; margin-top:7px; color:#77847d; font-size:9px; }.product-details-units { margin-top:16px; }.product-details-units-heading { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:7px; }.product-details-units-heading strong { color:#53635b; font-size:12px; }.product-details-units-heading small { color:#98a39d; font-size:9px; }.product-detail-unit { display:grid; grid-template-columns:1fr 55px 82px 48px; align-items:center; gap:7px; padding:9px 0; border-top:1px solid #eef1ed; }.product-detail-unit > div { display:flex; flex-direction:column; gap:3px; }.product-detail-unit strong { color:#53635b; font-family:'DM Mono',monospace; font-size:11px; }.product-detail-unit small { color:#9ca7a1; font-size:9px; }.product-detail-unit b { color:#33453e; font-family:'DM Mono',monospace; font-size:12px; }.product-detail-unit button { padding:6px 5px; color:#9a6d5f; border:1px solid #efcfc3; border-radius:4px; background:#fff8f5; font-size:9px; }.product-detail-unit .product-detail-add { color:#fff; border-color:#4f8c69; background:#4f8c69; }.image-preview-modal { position:relative; display:flex; flex-direction:column; align-items:center; gap:14px; max-width:88vw; max-height:90vh; padding:22px; background:#fff; border-radius:12px; box-shadow:0 20px 60px rgba(16,33,27,.24); }.image-preview-modal img { display:block; max-width:82vw; max-height:78vh; object-fit:contain; }.image-preview-modal strong { color:#53635b; font-size:14px; }.quick-price-photo { display:flex; align-items:center; gap:12px; margin:15px 0 4px; padding:10px; border:1px solid #e4ebe5; border-radius:7px; background:#fbfdfb; }.quick-price-photo-preview { display:grid; place-items:center; width:54px; height:54px; overflow:hidden; border-radius:8px; background:#edf3ee; color:#718078; font-size:24px; }.quick-price-photo-preview img { width:100%; height:100%; object-fit:cover; }.quick-price-photo > div:last-child { min-width:0; }.quick-price-photo strong,.quick-price-photo small { display:block; }.quick-price-photo strong { color:#53635b; font-size:11px; }.quick-price-photo small { margin-top:3px; color:#99a39e; font-size:9px; }.photo-upload-button { display:inline-flex !important; width:auto !important; margin:8px 5px 0 0 !important; padding:6px 8px; color:#fff !important; background:#4f8c69; border-radius:4px; font-size:9px !important; font-weight:600; cursor:pointer; }.photo-upload-button input { display:none; }.remove-photo-button { margin-top:8px; padding:6px 7px; color:#a36b5a; background:#fff0eb; border-radius:4px; font-size:9px; }.photo-icon img { width:100%; height:100%; object-fit:cover; border-radius:10px; }.photo-mini-icon { overflow:hidden; }.photo-mini-icon img { width:100%; height:100%; object-fit:cover; }
.catalog-toolbar { display:grid; grid-template-columns:minmax(520px,1.4fr) minmax(360px,1fr); align-items:center; justify-content:initial; gap:14px; }.item-search-box { width:100%; min-width:0; }.customer-picker-group { width:100%; justify-content:flex-end; }.customer-picker { flex:1; width:auto; }.walk-in-toggle { flex:0 0 auto; }
.sidebar { flex:0 0 238px; overflow:hidden; transition:width .2s ease, flex-basis .2s ease, padding .2s ease; }.sidebar-collapsed .sidebar { flex-basis:76px; width:76px; padding:25px 10px 18px; }.sidebar-collapsed .brand-mark { justify-content:center; padding:0 0 30px; }.sidebar-collapsed .brand-label,.sidebar-collapsed .store-details,.sidebar-collapsed .store-switcher .chevron,.sidebar-collapsed .nav-label,.sidebar-collapsed .profile-details,.sidebar-collapsed .profile .more { display:none; }.sidebar-collapsed .store-switcher { justify-content:center; padding:12px 0; }.sidebar-collapsed .nav-item { justify-content:center; padding:12px 0; }.sidebar-collapsed .nav-icon { width:auto; }.sidebar-collapsed .profile { justify-content:center; padding-left:0; padding-right:0; }.topbar-heading { display:flex; align-items:center; gap:12px; }.sidebar-edge-toggle { position:fixed; right:auto; top:auto; bottom:96px; left:214px; z-index:6; display:grid; place-items:center; width:24px; height:70px; padding:0; border:0; background:#b8bbca; color:#0d1b30; clip-path:polygon(100% 0, 100% 100%, 50% 85%, 20% 72%, 20% 28%, 50% 15%); transition:left .2s ease, background .15s ease; }.sidebar-edge-toggle span { display:block; width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-right:8px solid currentColor; }.sidebar-edge-toggle:not(.sidebar-open) { left:76px; clip-path:polygon(0 0, 0 100%, 50% 85%, 80% 72%, 80% 28%, 50% 15%); }.sidebar-edge-toggle:not(.sidebar-open) span { border-right:0; border-left:8px solid currentColor; }.sidebar-edge-toggle:hover { background:#a9adbf; }.sidebar-collapsed .sidebar-edge-toggle { left:76px; }
@media (max-width:1200px) { .product-grid { grid-template-columns:repeat(3,minmax(125px,1fr)); }.catalog-toolbar { display:flex; align-items:flex-start; flex-direction:column; }.item-search-box { width:100%; }.customer-picker-group { width:100%; }.customer-picker { width:260px; flex:0 1 260px; }.customer-search-box { width:100%; }.category-tabs { width:100%; justify-content:space-between; } }
.pos-layout,.cart-panel { min-height:calc(100vh - 64px); }
.print-invoice-button { flex:1; min-height:42px; padding:12px 10px; border-radius:6px; color:#fff; background:#e87952; font-size:11px; font-weight:700; }.print-invoice-button:hover { background:#cb5e3a; }.print-invoice-button:disabled { cursor:not-allowed; opacity:.5; }
.cart-actions { display:flex; flex-direction:column; gap:8px; margin-top:18px; }.cart-action-row { display:flex; width:100%; gap:8px; }.cart-action-row > button { flex:1; min-height:52px; }.clear-order-button { min-height:52px; padding:12px 10px; border:1px solid #f0c5b6; border-radius:6px; color:#b5664d; background:#fff0eb; font-size:11px; font-weight:700; }.clear-order-button:hover { background:#ffe4dc; }.clear-order-button:disabled { cursor:not-allowed; opacity:.5; }.clear-order-full { width:100%; }
.delivery-action-row { flex-direction:column; }
.cart-actions .secondary-action,.cart-actions .primary-action,.cart-actions .print-invoice-button,.cart-actions .clear-order-button { height:52px; min-height:52px; box-sizing:border-box; }
.remove-cart-item { position:relative; display:grid; place-items:center; flex:0 0 32px; width:32px; height:32px; padding:0; border:0; border-radius:6px; color:#c85d52; background:transparent; font-size:0; }.remove-cart-item::before { content:""; display:block; width:16px; height:18px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3h6l1 2h4v2H4V5h4l1-2zm-3 6h12l-1 12H7L6 9zm3 2v8h2v-8H9zm4 0v8h2v-8h-2z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3h6l1 2h4v2H4V5h4l1-2zm-3 6h12l-1 12H7L6 9zm3 2v8h2v-8H9zm4 0v8h2v-8h-2z'/%3E%3C/svg%3E") center/contain no-repeat; }.remove-cart-item:hover { color:#ae443b; background:#fff4f2; }
.line-total { flex:0 0 50px; align-self:center; line-height:1; }.remove-cart-item { align-self:center; margin-left:2px; line-height:0; }
.cart-items { max-height:520px; overflow-y:scroll; overflow-x:hidden; padding:0 4px 2px 0; overscroll-behavior:contain; scrollbar-gutter:stable; scrollbar-color:#111 #f1f4f1; scrollbar-width:auto; }
.cart-items::-webkit-scrollbar { width:9px; }.cart-items::-webkit-scrollbar-track { border-radius:8px; background:#f1f4f1; }.cart-items::-webkit-scrollbar-thumb { min-height:34px; border:2px solid #f1f4f1; border-radius:8px; background:#111; }.cart-items::-webkit-scrollbar-thumb:hover { background:#000; }
.cart-item { touch-action:pan-y; transition:transform .18s ease; will-change:transform; }
.cart-panel .add-customer { display:none; }
.cart-panel .cart-header-actions { display:none; }
.cart-panel .cart-header h2 { font-size:0; }.cart-panel .cart-header h2::after { content:"Invoice"; font-size:20px; }
.invoice-customer-phone { position:relative; margin:0 0 16px; }.invoice-customer-phone label { display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid #dfe6e0; border-radius:7px; background:#fbfcfb; color:#718078; font-size:11px; }.invoice-customer-phone label span { white-space:nowrap; }.invoice-customer-phone input { min-width:0; flex:1; border:0; outline:0; color:#42524a; background:transparent; font-size:12px; }.invoice-customer-phone input::placeholder { color:#a4ada7; }.invoice-phone-results { position:absolute; z-index:5; top:42px; left:0; right:0; overflow:hidden; border:1px solid #dfe6e0; border-radius:6px; background:#fff; box-shadow:0 8px 18px rgba(29,41,38,.12); }.invoice-phone-results button { display:flex; flex-direction:column; align-items:flex-start; gap:3px; width:100%; padding:9px 10px; color:#42524a; background:#fff; text-align:left; }.invoice-phone-results button:hover { background:#fff7f3; }.invoice-phone-results button small { color:#9aa49e; font-size:9px; }
.new-customer-button { margin-top:7px; padding:4px 0; color:#bd6e52; background:transparent; font-size:10px; font-weight:700; }.new-customer-button:hover { color:#9f5d47; }.new-customer-form { display:flex; flex-direction:column; gap:8px; margin-top:8px; padding:10px; border:1px solid #e6d7cf; border-radius:7px; background:#fffaf7; }.new-customer-form label { display:flex; flex-direction:column; align-items:stretch; gap:4px; padding:0; border:0; background:transparent; color:#718078; font-size:10px; }.new-customer-form input { width:100%; padding:8px; border:1px solid #dfe6e0; border-radius:5px; background:#fff; }.new-customer-form > div { display:flex; gap:6px; }.new-customer-form > div button { flex:1; padding:8px; border-radius:5px; color:#718078; background:#eef2ef; font-size:10px; }.new-customer-form > div .save-new-customer { color:#fff; background:#4f8c69; }.new-customer-form > div button:disabled { cursor:not-allowed; opacity:.5; }
.product-pagination { display:flex; justify-content:center; align-items:center; width:max-content; max-width:100%; margin:22px auto 4px; overflow:hidden; border-radius:24px; background:#fff; box-shadow:0 4px 12px rgba(29,41,38,.1); }.product-pagination button { min-width:78px; height:44px; padding:0 16px; border:0; color:#8b90ad; background:#fff; font-size:13px; font-weight:500; }.product-pagination .page-number { min-width:44px; padding:0 12px; }.product-pagination .page-number.current { display:grid; place-items:center; color:#fff; background:#1296d4; font-size:15px; font-weight:600; }.product-pagination button:hover:not(:disabled) { color:#536c5d; background:#f3f7f3; }.product-pagination button.page-number.current:hover { color:#fff; background:#1296d4; }.product-pagination button:disabled { cursor:not-allowed; color:#c4c8d2; }