#erp-workspace.order-workspace-shell .sale-order{ --order-glass:linear-gradient(135deg,#ffffffeb,#f7fbffcc); --order-control:#ffffffe6; --order-edge:#8ea5be; --order-sheen:#ffffffeb; --order-shadow:#27456e1a; --order-table:#dfe8f3e6; --order-payment:#ffedf2; --order-total:linear-gradient(120deg,#e3fff0,#eaf9f2); --order-total-edge:#83c9aa; --order-total-ink:#087c53; color:var(--ui-ink); } :root[data-erp-theme=dark] #erp-workspace.order-workspace-shell .sale-order{ --order-glass:linear-gradient(135deg,#1b2d40bf,#102030e6); --order-control:#0d1c2c80; --order-edge:#506d8b; --order-sheen:#d3e7ff26; --order-shadow:#020a1529; --order-table:#263b51a6; --order-payment:#4b193599; --order-total:linear-gradient(120deg,#103c35e6,#0c302bcc); --order-total-edge:#23745e; --order-total-ink:#53e4b9; } :root:not([data-erp-theme=dark]) #erp-workspace .workspace-content .sale-order :is(.sale-section,.sale-summary){background:var(--order-glass);border-color:var(--order-edge);box-shadow:inset 0 1px 0 var(--order-sheen),0 4px 16px var(--order-shadow)} :root:not([data-erp-theme=dark]) #erp-workspace .workspace-content .sale-order .sale-items-table th{background:var(--order-table);border-color:var(--order-edge)} #erp-workspace.order-workspace-shell .workspace-main{background:linear-gradient(145deg,var(--ui-bg),color-mix(in srgb,var(--ui-info-bg) 28%,var(--ui-bg)))} #erp-workspace .sale-order .sale-heading{margin-bottom:10px;gap:10px} #erp-workspace .sale-order .sale-title{gap:10px} #erp-workspace .sale-order .sale-title-icon{width:36px;height:36px;border:1px solid #ff7694;border-radius:8px;background:linear-gradient(135deg,#ff4169,var(--ui-accent-hover));box-shadow:inset 0 1px 0 #ffffff66,0 3px 10px #d7093426} #erp-workspace .sale-order .sale-title-icon img{width:23px;height:23px;filter:brightness(0) invert(1)} #erp-workspace .sale-order .sale-heading h1{font-size:22px} #erp-workspace .sale-order .sale-main{gap:10px} #erp-workspace .sale-order :is(.sale-section,.sale-summary){background:var(--order-glass);border:1px solid var(--order-edge);border-radius:8px;box-shadow:inset 0 1px 0 var(--order-sheen),0 4px 16px var(--order-shadow);backdrop-filter:blur(14px) saturate(125%);-webkit-backdrop-filter:blur(14px) saturate(125%);padding:10px 12px} #erp-workspace .sale-order h2{font-size:13px;gap:8px;margin-bottom:8px} #erp-workspace .sale-order h2>.icon{width:18px;height:18px} #erp-workspace .sale-order :is(.sale-client,.sale-product){display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:6px 10px;flex:none} #erp-workspace .sale-order :is(.sale-client,.sale-product)>h2{margin:0} #erp-workspace .sale-order :is(.sale-client-search,.sale-product-entry){flex-wrap:nowrap;align-items:center;gap:7px;min-width:0} #erp-workspace .sale-order :is(.sale-client-search,.sale-product-entry) .sale-search{flex:1;flex-basis:auto;min-width:0} #erp-workspace .sale-order .sale-product-context{grid-column:1/-1} #erp-workspace .sale-order .sale-product-entry :is(.sale-quantity,.sale-price){display:flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap} #erp-workspace .sale-order .sale-quantity{width:92px} #erp-workspace .sale-order .sale-price{width:108px} #erp-workspace .sale-order .sale-product-entry :is(.sale-quantity,.sale-price)>input{width:0;flex:1} #erp-workspace .sale-order .sale-layout :is(input:not([type=checkbox]):not([type=radio]),select){height:34px;min-height:34px;border:1px solid var(--order-edge);border-radius:7px;background:var(--order-control);color:var(--ui-ink);box-shadow:inset 0 1px 2px #17304a08;padding:6px 9px;font-size:13px} #erp-workspace .sale-order .sale-layout input::placeholder{color:var(--ui-muted);opacity:1} #erp-workspace .sale-order .sale-layout :is(input,select):focus-visible{outline:2px solid color-mix(in srgb,var(--ui-info) 30%,transparent);outline-offset:2px;border-color:var(--ui-info)} #erp-workspace .sale-order .sale-layout :is(button,.command-link){min-height:34px;padding:6px 10px;font-size:12px;line-height:1.25;border:1px solid var(--order-edge);border-radius:7px;background:var(--order-glass);color:var(--ui-ink);box-shadow:inset 0 1px 0 var(--order-sheen),0 2px 5px var(--order-shadow);transition:background 180ms ease,border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease} #erp-workspace .sale-order .sale-layout :is(button,.command-link):hover:not(:disabled){background:color-mix(in srgb,var(--ui-hover) 65%,transparent);border-color:var(--ui-info);box-shadow:inset 0 1px 0 var(--order-sheen),0 3px 9px var(--order-shadow)} #erp-workspace .sale-order .sale-layout :is(button,.command-link):active:not(:disabled){transform:translateY(1px)} #erp-workspace .sale-order .sale-layout button.primary{color:#fff;background:linear-gradient(135deg,#ff2855,var(--ui-accent-hover));border-color:#fa5274;box-shadow:inset 0 1px 0 #ffffff66,0 3px 9px #d7093426} #erp-workspace .sale-order .sale-layout button.primary:hover:not(:disabled){background:linear-gradient(135deg,#ff4169,var(--ui-accent));border-color:#ff88a2} #erp-workspace .sale-order .sale-layout button:disabled{opacity:.45;box-shadow:inset 0 1px 0 var(--order-sheen);cursor:not-allowed;transform:none} #erp-workspace .sale-order .sale-layout .icon-button{width:34px;height:34px;min-height:34px;padding:7px} #erp-workspace .sale-order .sale-layout .sale-danger{color:var(--ui-danger)} #erp-workspace .sale-order .sale-client:has(.sale-selected-customer) .sale-client-search{display:none} #erp-workspace .sale-order .sale-selected-customer{grid-column:2;grid-row:1;display:flex;align-items:center;min-width:0;min-height:34px;padding:0;margin:0;gap:8px;background:transparent} #erp-workspace .sale-order .sale-customer-symbol,#erp-workspace .sale-order .sale-customer-contact{display:none} #erp-workspace .sale-order .sale-customer-name{flex:1;min-width:0} #erp-workspace .sale-order .sale-customer-name>strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #erp-workspace .sale-order .sale-customer-actions{flex:none;flex-wrap:nowrap;gap:5px} #erp-workspace .sale-order .sale-items-section{display:flex;flex-direction:column;min-height:0} #erp-workspace .sale-order .sale-section-heading{flex:none;gap:10px;align-items:center;margin-bottom:9px} #erp-workspace .sale-order .sale-section-heading>h2{margin:0 auto 0 0} #erp-workspace .sale-order .sale-section-heading>span{font-size:11px;color:var(--ui-muted)} #erp-workspace .sale-order .order-price-toggle{color:var(--ui-ink);font-size:12px;font-weight:400} #erp-workspace .sale-order .sale-items-scroll{border:0;border-bottom:1px solid var(--ui-line);border-radius:6px 6px 0 0;scrollbar-color:var(--ui-control) transparent;overscroll-behavior:contain} #erp-workspace .sale-order .sale-items-table{min-width:700px} #erp-workspace .sale-order .order-essential-columns{min-width:520px} #erp-workspace .sale-order .sale-items-table th{height:36px;padding:8px;background:var(--order-table);border-bottom:1px solid var(--order-edge);color:var(--ui-ink);font-size:12px;font-weight:500} #erp-workspace .sale-order .sale-items-table td{padding:9px 8px;border-color:color-mix(in srgb,var(--ui-line) 65%,transparent);color:var(--ui-ink);font-size:12px} #erp-workspace .sale-order .sale-items-table tbody tr{background:transparent} #erp-workspace .sale-order .sale-items-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--ui-raised) 35%,transparent)} #erp-workspace .sale-order .sale-items-table tbody tr:hover{background:var(--ui-hover)} #erp-workspace .sale-order .sale-items-table tbody tr.selected{background:var(--ui-accent-soft);box-shadow:inset 3px 0 var(--ui-accent)} #erp-workspace .sale-order .sale-items-table .row-actions .icon-button{width:28px;height:28px;min-height:28px;padding:5px} #erp-workspace .sale-order .sale-items-table .sale-col-code{width:62px} #erp-workspace .sale-order .sale-items-table .sale-col-select{width:34px} #erp-workspace .sale-order .sale-items-table .order-item-select{padding:8px;text-align:center} #erp-workspace .sale-order .order-item-select input[type=checkbox]{width:17px;height:17px;min-height:17px;margin:auto;cursor:pointer} #erp-workspace .sale-order .order-item-select input:disabled{opacity:.4;cursor:default} #erp-workspace .sale-order .sale-items-table tbody tr.sale-line-removed{background:color-mix(in srgb,var(--ui-danger) 10%,var(--ui-surface));box-shadow:inset 3px 0 var(--ui-danger);cursor:default} #erp-workspace .sale-order .sale-items-table .sale-line-removed td{position:relative;color:var(--ui-danger)} #erp-workspace .sale-order .sale-items-table .sale-line-removed td::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);background:var(--ui-danger);pointer-events:none;z-index:1} #erp-workspace .sale-order .sale-line-removed .sale-line-value{text-decoration:none;color:inherit} #erp-workspace .sale-order .order-removed-count{color:var(--ui-danger)} #erp-workspace .sale-order .sale-empty{min-height:170px;gap:9px;color:var(--ui-muted)} #erp-workspace .sale-order .sale-empty>.icon{width:28px;height:28px} #erp-workspace .sale-order .sale-empty strong{color:var(--ui-muted);font-weight:500} #erp-workspace .sale-order .sale-items-footer{color:var(--ui-muted);padding-top:8px;font-size:11px} #erp-workspace .sale-order .sale-summary{display:flex;flex-direction:column;gap:0;scrollbar-color:var(--ui-control) transparent;overscroll-behavior:contain} #erp-workspace .sale-order .sale-summary>h2{margin-bottom:10px} #erp-workspace .sale-order .sale-summary>dl{font-size:12px;gap:8px;margin:0 0 10px} #erp-workspace .sale-order .sale-summary>dl dt{color:var(--ui-muted)} #erp-workspace .sale-order .sale-summary>dl dd{color:var(--ui-ink)} #erp-workspace .sale-order .sale-total{background:var(--order-total);border:1px solid var(--order-total-edge);border-radius:7px;box-shadow:inset 0 1px 0 #ffffff14;padding:9px 11px;color:var(--order-total-ink)} #erp-workspace .sale-order .sale-total>span{font-size:11px;color:inherit} #erp-workspace .sale-order .sale-total>strong{font-size:var(--sale-total-size,30px);color:inherit;line-height:1.25;margin:3px 0 0;overflow-wrap:anywhere} #erp-workspace .sale-order .sale-payment-types{margin-top:10px;gap:6px} #erp-workspace .sale-order .sale-payment-types h3{font-size:12px;line-height:1.3;color:var(--ui-ink);margin:0} #erp-workspace .sale-order .sale-layout .sale-payment-type{min-height:54px;padding:6px;gap:5px;white-space:normal} #erp-workspace .sale-order .sale-layout .sale-payment-type.active{background:var(--order-payment);border-color:var(--ui-accent);color:var(--ui-accent-ink);box-shadow:inset 0 0 0 1px var(--ui-accent),inset 0 1px 0 var(--order-sheen)} #erp-workspace .sale-order .sale-payment-type.active .icon{filter:brightness(0) saturate(100%) invert(17%) sepia(87%) saturate(3860%) hue-rotate(332deg)} :root[data-erp-theme=dark] #erp-workspace .sale-order .sale-payment-type.active .icon{filter:brightness(0) saturate(100%) invert(73%) sepia(25%) saturate(1380%) hue-rotate(303deg)} #erp-workspace .sale-order .sale-current-payment{font-size:11px;color:var(--ui-muted);margin:6px 0 8px} #erp-workspace .sale-order .sale-layout .sale-discount{min-height:34px;justify-content:flex-start} #erp-workspace .sale-order .sale-primary-actions{display:flex;flex-direction:column;gap:7px;margin-top:8px} #erp-workspace .sale-order .sale-layout .sale-primary-actions button{min-height:34px;padding:7px 9px;font-size:12px} #erp-workspace .sale-order .sale-aux-actions{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--ui-line);padding-top:10px;margin-top:12px} #erp-workspace .sale-order .sale-layout .sale-aux-actions a{min-height:32px;justify-content:center} @media(min-width:1101px) and (min-height:681px){ #erp-workspace .sale-order .sale-layout{grid-template-columns:minmax(0,1fr) 280px;gap:12px} } @media(min-width:768px) and (max-width:1100px),(min-width:768px) and (max-height:680px){ #erp-workspace .sale-order :is(.sale-section,.sale-summary){padding:7px 9px} #erp-workspace .sale-order .sale-main{gap:7px} #erp-workspace .sale-order .sale-heading h1{font-size:20px} #erp-workspace .sale-order :is(.sale-client,.sale-product){grid-template-columns:72px minmax(0,1fr);gap:6px} #erp-workspace .sale-order .sale-layout .sale-client-search button{display:inline-flex;align-items:center;justify-content:center;gap:0;font-size:0;padding:0;width:32px;min-width:32px;height:34px;flex:none} #erp-workspace .sale-order .sale-client-search button .icon{display:block;width:17px;height:17px;flex:none} #erp-workspace .sale-order .sale-section-heading>span{display:none} #erp-workspace .sale-order .sale-summary{display:grid;grid-template-columns:minmax(100px,1fr) 32px 32px auto;gap:7px;align-items:center;overflow:visible} #erp-workspace .sale-order .sale-summary>.sale-aux-actions{display:none} #erp-workspace .sale-order .sale-empty{min-height:130px} #erp-workspace .sale-order .sale-summary>.sale-total{display:block;padding:4px 8px;min-width:0} #erp-workspace .sale-order .sale-summary>.sale-total>span{font-size:10px} #erp-workspace .sale-order .sale-summary>.sale-total>strong{font-size:min(var(--sale-total-size,30px),22px);margin:0} #erp-workspace .sale-order .sale-summary>.sale-discount{width:32px;min-height:32px;padding:7px} #erp-workspace .sale-order .sale-summary>.sale-primary-actions{flex-direction:row;margin:0;gap:6px} #erp-workspace .sale-order .sale-summary>.sale-primary-actions button{padding:6px 8px;min-height:32px;width:auto} } @media(max-width:767px){ #erp-workspace.order-workspace-shell .workspace-content{padding:10px} #erp-workspace .sale-order .sale-heading h1{font-size:20px} #erp-workspace .sale-order .sale-layout{display:flex;flex-direction:column;gap:10px} #erp-workspace .sale-order .sale-main{width:100%;gap:8px} #erp-workspace .sale-order :is(.sale-client,.sale-product){grid-template-columns:minmax(0,1fr);gap:6px} #erp-workspace .sale-order .sale-layout .sale-client-search button{display:inline-flex;align-items:center;justify-content:center;gap:0;font-size:0;padding:0;width:34px;min-width:34px;height:34px;flex:none} #erp-workspace .sale-order .sale-client-search button .icon{display:block;width:17px;height:17px;flex:none} #erp-workspace .sale-order .sale-selected-customer{grid-column:1;grid-row:auto} #erp-workspace .sale-order .sale-layout .sale-customer-actions button:not(.icon-button){font-size:0;padding:7px;width:34px} #erp-workspace .sale-order .sale-product-entry{flex-wrap:wrap} #erp-workspace .sale-order .sale-product-entry .sale-search{flex-basis:calc(100% - 44px)} #erp-workspace .sale-order .sale-product-entry .sale-add{flex:1} #erp-workspace .sale-order .sale-section-heading{flex-wrap:wrap;gap:7px} #erp-workspace .sale-order .sale-section-heading>span{display:none} #erp-workspace .sale-order .order-price-toggle{font-size:11px} #erp-workspace .sale-order .sale-items-scroll{min-height:200px;max-height:50svh} #erp-workspace .sale-order .sale-empty{width:calc(100vw - 126px);max-width:100%;min-height:170px} #erp-workspace .sale-order .sale-items-footer{font-size:10px} #erp-workspace .sale-order .sale-summary{position:sticky;bottom:0;z-index:2;width:100%;max-height:none;display:grid;grid-template-columns:minmax(0,1fr) 34px 34px;gap:7px;align-items:center;overflow:visible} #erp-workspace .sale-order .sale-summary>:is(h2,dl,.sale-payment-types,.sale-current-payment,.sale-aux-actions){display:none} #erp-workspace .sale-order .sale-summary>.sale-total{grid-column:1;grid-row:1;padding:5px 8px;min-width:0} #erp-workspace .sale-order .sale-summary>.sale-total>strong{font-size:min(var(--sale-total-size,30px),24px);margin:0} #erp-workspace .sale-order .sale-summary-toggle{display:flex;grid-column:2;grid-row:1} #erp-workspace .sale-order .sale-summary>.sale-discount{grid-column:3;grid-row:1;width:34px;padding:7px} #erp-workspace .sale-order .sale-summary>.sale-discount :is(span,kbd){display:none} #erp-workspace .sale-order .sale-summary>.sale-primary-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-column:1/-1;grid-row:2;gap:7px;margin:0} #erp-workspace .sale-order .sale-summary>.sale-primary-actions .sale-action-long,#erp-workspace .sale-order .sale-summary>.sale-primary-actions kbd{display:none} #erp-workspace .sale-order .sale-summary>.sale-primary-actions .sale-action-short{display:inline} }