:root{--accent-color:#4e26e250;--select-color:#67078b3b;background:linear-gradient(90deg,#2a1ad8 0%,#4e26e2 25%,#7231ec 50%,#953df5 75%,#b948ff 100%);overflow-x:hidden}.app{color:#fff;flex-direction:column;justify-content:center;place-items:center;gap:30px;height:100vh;display:flex}.panels{flex:1;justify-content:center;gap:30px;width:100%;display:flex}.glass{-webkit-backdrop-filter:blur(15px);background:#ffffff4f;border:1px solid #ffffff6b;border-radius:16px;box-shadow:0 4px 30px #0000001a}.main-panel{flex-direction:column;min-width:65vh;max-width:65vh;height:90vh;padding:10px;display:flex;overflow-x:hidden;box-shadow:0 4px 30px #0006}.title-card{justify-content:center;display:flex}@media (width<=1120px){.app{padding:5vh 2vh}.main-panel{min-width:0}.panels{flex-direction:column;align-items:center;margin:0;padding:0}}hr{color:#ffffff80;width:100%}textarea,input:not(.no-spinner){box-sizing:border-box;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);--webkit-backdrop-filter:blur(8px);background:#ffffff0f;border:1px solid #ffffff1f;border-radius:12px;outline:none;width:100%;min-width:0;min-height:47px;padding:8px 10px;font-family:DM Sans,system-ui,sans-serif;font-size:14px;font-weight:500;overflow:hidden}textarea{resize:none;height:100%}.mobile-tabs{justify-content:center;gap:10px;margin-bottom:10px;display:flex}.mobile-tabs button{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #fff3;border-radius:10px;padding:8px 14px}.mobile-tabs button.active{background:#fff3}*{box-sizing:border-box}.product-tab{flex-direction:column;flex:1;width:90%;max-width:100%;height:100%;min-height:0;display:flex;overflow-x:hidden}.products-title{flex-shrink:0;justify-content:space-between;align-items:center;width:100%;padding-bottom:12px;display:flex}.products-title h3{margin:0}.table-header,.table-row{box-sizing:border-box;border-radius:12px;width:100%;display:flex;overflow:hidden}.products-list-wrapper-outer{flex-direction:column;gap:10px;display:flex;overflow-y:auto}.products-list-wrapper{flex-direction:column;flex:1;gap:10px;min-height:0;display:flex;overflow:hidden auto}.table-header{border:1px solid #ffffff1f;min-height:44px}.table-row{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff0f;border:1px solid #ffffff1f;min-height:44px}.table-cell{border-right:1px solid #ffffff14;align-items:center;min-width:0;padding:2px 6px;display:flex}.no-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.no-spinner::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.product-row:hover{transform:translateY(-2px)}.product-row:hover:before{opacity:1}.product-row button:last-child:hover{background:#ef444459;transform:scale(1.05)}.product-row button:last-child:active{transform:scale(.95)}.customer-tab{width:100%}.customer-field{flex-direction:column;gap:8px;width:100%;display:flex}.customer-field-wrapper{flex-direction:column;gap:1rem;width:100%;display:flex}.input-error{background:#f50f0f33!important;border:1px solid #f50f0f80!important}.customer-input-wrapper{display:inline-block;position:relative}.speech-bubble{color:#fff;white-space:nowrap;pointer-events:none;background:#ff4d4f;border-radius:8px;padding:6px 12px;font-size:13px;animation:.15s ease-out popIn;position:absolute;bottom:calc(100% + 10px);left:0}.speech-bubble-arrow{border:6px solid #0000;border-top-color:#ff4d4f;position:absolute;top:100%;left:16px}@keyframes popIn{0%{opacity:0;transform:translateY(4px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.invoice-number-input{align-items:center;gap:8px;width:100%;display:flex}.invoice-item{flex-direction:column;align-items:start;gap:8px;display:flex}.Invoice-details{flex-direction:column;gap:1rem;display:flex}.Invoice-dates{justify-content:space-between;display:flex}.no-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.no-spinner::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.no-spinner{-moz-appearance:textfield}.spin-btn{transform:translateY(0)}.spin-btn:hover{background:linear-gradient(145deg,#374151,#1f2937);transform:translateY(-1px);box-shadow:0 4px 10px #00000080}.spin-btn:active{transform:translateY(1px)scale(.97);box-shadow:inset 0 2px 4px #0009}.payment-tab{width:100%;overflow:hidden}.payment-header h3{margin:0}.payment-header{flex-shrink:0;justify-content:space-between;align-items:center;width:100%;padding-bottom:12px;display:flex}.payment-header-buttons{gap:8px;display:inline-flex}.payment-options{flex-direction:column;gap:8px;display:flex;overflow-y:auto}.tabs{background-color:var(--accent-color);border-radius:16px;flex-wrap:wrap;flex:none;justify-content:center;align-self:center;padding:5px 20px;display:flex;position:relative;overflow:auto hidden}.tab-indicator{background:var(--select-color);-webkit-backdrop-filter:blur(14px);pointer-events:none;border:1px solid #67078b9e;border-radius:8px;height:calc(1em + 20px);transition:transform .3s,width .3s;position:absolute;top:5px;left:0;box-shadow:3px 2px #0000001a}.tab-wrapper{flex-direction:column;flex:1;justify-content:center;height:100%;min-height:0;padding-bottom:10px;display:flex;overflow:hidden}.tabs button{z-index:1;cursor:pointer;color:#fff;background:0 0;border:none;border-radius:8px;outline:none;height:7.5%;padding:14px 16px;position:relative}.tabs button.active{box-shadow:none;-webkit-backdrop-filter:none;background:0 0;border:none}.tabcontent{background-color:#0000;border-top:none;height:92%;min-height:0;padding:6px 0;display:none;overflow:hidden}.tabcontent.active{flex-direction:column;align-items:center;display:flex}.tab{flex-direction:column;height:97%;min-height:0;padding:5px 10px;display:flex;overflow:hidden}.preview-table-header,.preview-table-row{box-sizing:border-box;border-radius:12px;gap:10px;width:100%;padding:10px;display:flex;overflow:hidden}.preview-table-cell{align-items:center;min-width:0;padding:2px 6px;display:flex}.preview-table-header{font-size:16px;font-weight:700}.Preview-table hr{color:#ffffff80}.Preview-table{font-size:14px}.total-row{justify-content:space-between;display:flex}.totaling-wrapper{justify-content:flex-end;margin-top:2rem;display:flex}.Totaling{flex-direction:column;justify-content:space-between;font-size:20px;display:flex}.total-row{gap:2rem}
