:root{--blue:#075bd5;--ink:#11213a;--line:#e5eaf1}*{box-sizing:border-box}body{margin:0;background:#edf1f6;font:13px Arial;color:var(--ink)}.app{background:#fff;max-width:430px;min-height:100vh;margin:auto;position:relative}.top,.bar{height:64px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 18px}.top button,.bar button{background:0;border:0;color:#fff;font-size:22px}.top b,.bar b{font-size:16px}.view{display:none;padding-bottom:70px}.view.active{display:block}.hero{background:linear-gradient(135deg,#075bd5,#0845b5);color:#fff;padding:28px 20px 35px;border-radius:0 0 20px 20px}.hero small{font-size:10px;letter-spacing:.1em}.hero h1{font-size:22px;margin:10px 0 4px}.hero p{margin:0;color:#d8e7ff}.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 18px}.stats div{padding:12px;border-radius:8px;background:#edf5ff;color:var(--blue);font-size:18px}.stats div:nth-child(2){background:#ecfff1;color:#14934e}.stats div:nth-child(3){background:#fff9e8;color:#cb9100}.stats div:nth-child(4){background:#f4efff;color:#7437db}.stats b,.stats small{display:block;color:var(--ink);margin-top:5px}.stats b{font-size:17px}.stats small{font-size:10px;color:#53657b}h3{font-size:13px;margin:10px 20px}.quick{padding:0 18px}.quick button{width:100%;display:flex;gap:12px;align-items:center;border:0;border-top:1px solid var(--line);background:#fff;padding:12px 5px;text-align:left;font-size:18px;color:var(--blue)}.quick span{flex:1}.quick b,.quick small{display:block;color:var(--ink);font-size:11px}.quick small{font-size:10px;color:#718096;margin-top:3px}.pad{padding:18px}.pad label{display:block;font-weight:bold;margin:0 0 8px}.input,.field{width:100%;border:1px solid #dfe6ef;border-radius:7px;background:#fff;padding:11px;margin-bottom:10px;text-align:left;color:#65758a}.input input{border:0;outline:0;width:75%}.field{display:flex;justify-content:space-between;font-size:10px}.field b{margin-left:auto;margin-right:10px;color:var(--ink)}.primary{width:100%;border:0;background:var(--blue);color:#fff;border-radius:6px;padding:13px;margin-top:14px;font-weight:bold}.chosen,.clientbox{background:#f4f6f8;padding:13px;margin:-2px 0 17px;border-radius:7px;font-size:11px}.chosen small,.clientbox small{display:block;color:#718096;margin-top:5px}.tabs{color:var(--blue);border-bottom:1px solid var(--line);padding:10px 2px;font-size:10px;word-spacing:14px;margin-bottom:5px}.product{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:12px 0}.pic{width:40px;height:45px;background:#f1f5f8;display:grid;place-items:center;font-size:27px;border-radius:5px}.product span{flex:1}.product strong,.product small,.product b{display:block}.product strong{font-size:11px}.product small{font-size:10px;color:#718096;margin:5px 0}.product button{background:var(--blue);color:#fff;border:0;border-radius:5px;font-size:20px}.cartbar{position:fixed;bottom:56px;max-width:430px;width:100%;background:#fff;border-top:1px solid var(--line);padding:9px 14px;display:flex;gap:10px;align-items:center;z-index:2}.cartbar span{flex:1;font-size:10px}.cartbar span b,.cartbar span strong{display:block}.cartbar button{border:0;background:#27a443;color:#fff;padding:10px;border-radius:6px;font-size:10px}.item{display:flex;gap:9px;padding:11px 0;border-bottom:1px solid var(--line)}.item span{flex:1}.item strong,.item small{display:block;font-size:11px}.item small{font-size:10px;color:#718096;margin:4px 0}.item button{border:1px solid #dce4ed;background:#fff;color:var(--blue)}.summary{background:#f5f7f9;padding:13px;margin-top:20px;font-size:11px}.summary>b{float:right}.summary h2{font-size:14px;margin-bottom:0}.summary h2 b{float:right;font-size:19px;color:#0b4dbe}.sales p{border-bottom:1px solid var(--line);padding:13px 0;margin:0;position:relative}.sales b,.sales strong,.sales small{display:block;font-size:11px}.sales strong{font-size:10px;margin:7px 0}.sales small{font-size:9px;color:#718096}.sales em{position:absolute;right:0;bottom:15px;font-style:normal;font-weight:bold;font-size:11px}.sales i{font-style:normal;background:#d8f6df;color:#168841;border-radius:8px;padding:4px;font-size:9px}nav{position:fixed;bottom:0;width:100%;max-width:430px;height:56px;background:#fff;border-top:1px solid var(--line);display:flex;z-index:3}nav button{flex:1;border:0;background:#fff;color:#68768a;font-size:18px}nav small{display:block;font-size:9px;margin-top:3px}nav .active{color:var(--blue)}#toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);background:#123f51;color:#fff;padding:11px;border-radius:6px;font-size:11px;opacity:0}#toast.show{opacity:1}@media(min-width:700px){.app{margin:20px auto;border-radius:18px;overflow:hidden;box-shadow:0 0 25px #12305022}nav,.cartbar{position:absolute}}
:root{--blue:#075bd5;--ink:#11213a;--line:#e5eaf1}*{box-sizing:border-box}button{transition:filter .08s ease,box-shadow .08s ease,opacity .08s ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:active{filter:brightness(.78);box-shadow:inset 0 2px 6px #0005;opacity:.88}body{margin:0;background:#edf1f6;font:13px Arial;color:var(--ink)}.app{background:#fff;max-width:430px;min-height:100vh;margin:auto;position:relative}.top,.bar{height:64px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 18px}.top button,.bar button{background:0;border:0;color:#fff;font-size:22px}.top b,.bar b{font-size:16px}.view{display:none;padding-bottom:70px}.view.active{display:block}.hero{background:linear-gradient(135deg,#075bd5,#0845b5);color:#fff;padding:28px 20px 35px;border-radius:0 0 20px 20px}.hero small{font-size:10px;letter-spacing:.1em}.hero h1{font-size:22px;margin:10px 0 4px}.hero p{margin:0;color:#d8e7ff}.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 18px}.stats div{padding:12px;border-radius:8px;background:#edf5ff;color:var(--blue);font-size:18px}.stats div:nth-child(2){background:#ecfff1;color:#14934e}.stats div:nth-child(3){background:#fff9e8;color:#cb9100}.stats div:nth-child(4){background:#f4efff;color:#7437db}.stats b,.stats small{display:block;color:var(--ink);margin-top:5px}.stats b{font-size:17px}.stats small{font-size:10px;color:#53657b}h3{font-size:13px;margin:10px 20px}.quick{padding:0 18px}.quick button{width:100%;display:flex;gap:12px;align-items:center;border:0;border-top:1px solid var(--line);background:#fff;padding:12px 5px;text-align:left;font-size:18px;color:var(--blue)}.quick span{flex:1}.quick b,.quick small{display:block;color:var(--ink);font-size:11px}.quick small{font-size:10px;color:#718096;margin-top:3px}.pad{padding:18px}.pad label{display:block;font-weight:bold;margin:0 0 8px}.input,.field{width:100%;border:1px solid #dfe6ef;border-radius:7px;background:#fff;padding:11px;margin-bottom:10px;text-align:left;color:#65758a}.input input{border:0;outline:0;width:75%}.field{display:flex;justify-content:space-between;font-size:10px}.field b{margin-left:auto;margin-right:10px;color:var(--ink)}.primary{width:100%;border:0;background:var(--blue);color:#fff;border-radius:6px;padding:13px;margin-top:14px;font-weight:bold}.chosen,.clientbox{background:#f4f6f8;padding:13px;margin:-2px 0 17px;border-radius:7px;font-size:11px}.chosen small,.clientbox small{display:block;color:#718096;margin-top:5px}.tabs{color:var(--blue);border-bottom:1px solid var(--line);padding:10px 2px;font-size:10px;word-spacing:14px;margin-bottom:5px}.product{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:12px 0}.pic{width:40px;height:45px;background:#f1f5f8;display:grid;place-items:center;font-size:27px;border-radius:5px}.product span{flex:1}.product strong,.product small,.product b{display:block}.product strong{font-size:11px}.product small{font-size:10px;color:#718096;margin:5px 0}.product button{background:var(--blue);color:#fff;border:0;border-radius:5px;font-size:20px}.cartbar{position:fixed;bottom:56px;max-width:430px;width:100%;background:#fff;border-top:1px solid var(--line);padding:9px 14px;display:flex;gap:10px;align-items:center;z-index:2}.cartbar span{flex:1;font-size:10px}.cartbar span b,.cartbar span strong{display:block}.cartbar button{border:0;background:#27a443;color:#fff;padding:10px;border-radius:6px;font-size:10px}.item{display:flex;gap:9px;padding:11px 0;border-bottom:1px solid var(--line)}.item span{flex:1}.item strong,.item small{display:block;font-size:11px}.item small{font-size:10px;color:#718096;margin:4px 0}.item button{border:1px solid #dce4ed;background:#fff;color:var(--blue)}.summary{background:#f5f7f9;padding:13px;margin-top:20px;font-size:11px}.summary>b{float:right}.summary h2{font-size:14px;margin-bottom:0}.summary h2 b{float:right;font-size:19px;color:#0b4dbe}.sales p{border-bottom:1px solid var(--line);padding:13px 0;margin:0;position:relative}.sales b,.sales strong,.sales small{display:block;font-size:11px}.sales strong{font-size:10px;margin:7px 0}.sales small{font-size:9px;color:#718096}.sales em{position:absolute;right:0;bottom:15px;font-style:normal;font-weight:bold;font-size:11px}.sales i{font-style:normal;background:#d8f6df;color:#168841;border-radius:8px;padding:4px;font-size:9px}nav{position:fixed;bottom:0;width:100%;max-width:430px;height:56px;background:#fff;border-top:1px solid var(--line);display:flex;z-index:3}nav button{flex:1;border:0;background:#fff;color:#68768a;font-size:18px}nav small{display:block;font-size:9px;margin-top:3px}nav .active{color:var(--blue)}#toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);background:#123f51;color:#fff;padding:11px;border-radius:6px;font-size:11px;opacity:0}#toast.show{opacity:1}@media(min-width:700px){.app{margin:20px auto;border-radius:18px;overflow:hidden;box-shadow:0 0 25px #12305022}nav,.cartbar{position:absolute}}
/* resultado e lista de pre-vendas */
.sale-row{width:100%;display:block;text-align:left;background:#fff;border:0;border-bottom:1px solid var(--line);padding:13px 0;position:relative;color:var(--ink)}.sale-row b,.sale-row strong,.sale-row small{display:block;font-size:11px}.sale-row strong{font-size:10px;margin:7px 0}.sale-row small{font-size:9px;color:#718096}.sale-row em{position:absolute;right:0;bottom:15px;font-style:normal;font-weight:bold;font-size:11px}.sale-row i{font-style:normal;background:#d8f6df;color:#168841;border-radius:8px;padding:4px;font-size:9px}.success-wrap{text-align:center;padding:30px 18px}.success-icon{width:62px;height:62px;line-height:62px;margin:0 auto 18px;border-radius:50%;background:#2db755;color:#fff;font-size:42px}.success-wrap h1{font-size:20px;line-height:1.25;margin:0 0 18px}.success-wrap p{margin:0 0 4px;color:#718096;font-size:11px}.success-code{font-size:25px;display:block;margin-bottom:20px}.success-card{background:#f4f6f8;border-radius:8px;padding:12px;text-align:left;margin-bottom:18px}.success-card span{display:flex;justify-content:space-between;font-size:10px;padding:5px 0;color:#65758a}.success-card b{color:var(--ink)}.secondary{width:100%;border:1px solid #c8d2df;background:#fff;color:var(--ink);border-radius:6px;padding:12px;margin:0 0 8px;font-weight:bold}
.cliente-modal-fix{max-height:84vh;display:flex;flex-direction:column}.cliente-resultados-fix{overflow-y:auto;min-height:80px;max-height:48vh}.cliente-sem-fix{position:sticky;bottom:0;background:var(--blue);z-index:1}
.swipe-item{position:relative;overflow:hidden;--swipe-x:0px;background:#fff}.swipe-item .item{position:relative;z-index:1;background:#fff;transform:translateX(var(--swipe-x));transition:transform .2s ease}.swipe-delete{position:absolute;right:0;top:0;bottom:0;width:92px;border:0;background:#dc3545;color:#fff;font-weight:bold;font-size:11px}
.sale-swipe{position:relative;overflow:hidden;--swipe-x:0px;background:#dc3545}.sale-swipe .sale-row{position:relative;z-index:1;transform:translateX(var(--swipe-x));transition:transform .2s ease;padding-left:2px;padding-right:2px}.sale-cancel{position:absolute;right:0;top:0;bottom:0;width:104px;border:0;background:#dc3545;color:#fff;font-weight:bold;font-size:11px}
.stock{color:#168841!important;font-weight:bold}
#prevenda-acoes{position:fixed;inset:0;background:#0008;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:18px}.prevenda-acoes-box{background:#fff;border-radius:16px 16px 10px 10px;padding:24px 18px 18px;width:100%;max-width:390px;text-align:center;position:relative}.prevenda-acoes-box h2{font-size:18px;margin:8px 0}.prevenda-acoes-box p{color:#718096;font-size:12px;margin:0 0 18px}.small-icon{width:44px;height:44px;line-height:44px;font-size:28px;margin-bottom:8px}.prevenda-acoes-box .secondary{margin-top:8px}.modal-close{position:absolute;right:12px;top:8px;border:0;background:transparent;font-size:25px;color:#718096}.modal-cancel{border:0;background:transparent;color:#718096;padding:12px;margin-top:4px;font-size:12px}

/* Celebração exibida ao salvar ou finalizar uma pré-venda. */
#success.active{overflow:hidden}
#success .success-wrap{animation:success-screen-in .5s ease-out both}
#success .success-celebration{width:150px;height:102px;margin:0 auto 2px;position:relative}
#success .success-icon{position:absolute;left:39px;top:13px;width:72px;height:72px;line-height:72px;margin:0;background:linear-gradient(145deg,#38c968,#20a94e);font-size:44px;box-shadow:0 12px 28px #20a94e55;transform:scale(.15) rotate(-18deg);animation:success-icon-pop .72s cubic-bezier(.2,1.35,.4,1) .08s both}
#success .success-icon span{display:block;opacity:0;transform:scale(.25) rotate(-25deg);animation:success-check-in .35s cubic-bezier(.2,1.5,.5,1) .48s both}
#success .success-icon:before{content:"";position:absolute;inset:-9px;border:3px solid #2db75566;border-radius:50%;opacity:0;animation:success-ring .7s ease-out .35s both}
#success .success-confetti{position:absolute;inset:0}
#success .success-confetti i{position:absolute;left:50%;top:50%;width:7px;height:14px;border-radius:3px;background:#ffbf00;opacity:0;animation:success-confetti .85s cubic-bezier(.15,.75,.35,1) .16s both}
#success .success-confetti i:nth-child(1){--x:-64px;--y:-37px;--r:-150deg;background:#075bd5}
#success .success-confetti i:nth-child(2){--x:-36px;--y:-56px;--r:120deg;background:#ffbf00;animation-delay:.21s}
#success .success-confetti i:nth-child(3){--x:1px;--y:-65px;--r:190deg;background:#ef476f;animation-delay:.12s}
#success .success-confetti i:nth-child(4){--x:42px;--y:-53px;--r:255deg;background:#06b6d4;animation-delay:.24s}
#success .success-confetti i:nth-child(5){--x:68px;--y:-24px;--r:135deg;background:#8b5cf6;animation-delay:.18s}
#success .success-confetti i:nth-child(6){--x:-67px;--y:17px;--r:-230deg;background:#2db755;animation-delay:.25s}
#success .success-confetti i:nth-child(7){--x:64px;--y:23px;--r:220deg;background:#ff8a00;animation-delay:.14s}
#success .success-confetti i:nth-child(8){--x:-45px;--y:42px;--r:-110deg;background:#ef476f;animation-delay:.2s}
#success .success-wrap h1{opacity:0;animation:success-rise .45s ease-out .42s both}
#success .success-wrap>p,#success .success-code{opacity:0;animation:success-rise .4s ease-out .53s both}
#success .success-card{opacity:0;animation:success-rise .45s ease-out .62s both}
#success .success-wrap>button{opacity:0;animation:success-rise .38s ease-out both}
#success .success-wrap>button:nth-of-type(1){animation-delay:.7s}
#success .success-wrap>button:nth-of-type(2){animation-delay:.77s}
#success .success-wrap>button:nth-of-type(3){animation-delay:.84s}
#success .success-wrap>button:nth-of-type(4){animation-delay:.91s}
@keyframes success-screen-in{from{opacity:0}to{opacity:1}}
@keyframes success-icon-pop{0%{opacity:0;transform:scale(.15) rotate(-18deg)}65%{opacity:1;transform:scale(1.12) rotate(4deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes success-check-in{from{opacity:0;transform:scale(.25) rotate(-25deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes success-ring{0%{opacity:.85;transform:scale(.65)}100%{opacity:0;transform:scale(1.45)}}
@keyframes success-confetti{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}25%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1) rotate(var(--r))}}
@keyframes success-rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#success .success-wrap,#success .success-icon,#success .success-icon span,#success .success-icon:before,#success .success-confetti i,#success .success-wrap h1,#success .success-wrap>p,#success .success-code,#success .success-card,#success .success-wrap>button{animation:none!important;opacity:1!important;transform:none!important}}

/* Resposta de toque sutil, sem afundar visualmente os botões. */
button{transition:filter .12s ease,box-shadow .12s ease,opacity .12s ease}
button:active{filter:brightness(.94);box-shadow:inset 0 1px 2px #0002;opacity:.98}

/* Quantidade e desconto antes de adicionar o produto. */
.product[data-produto]{cursor:pointer}
.promotion-name{color:#2e7d32!important}
.product .product-value{min-width:82px;padding:9px 7px;border-radius:7px;font-size:11px;font-weight:bold;white-space:nowrap}
.product .product-value.promotional-value{background:#2e7d32}
.cartbar .view-cart-button{display:flex;align-items:center;gap:7px;background:#f28c00;color:#fff}
.cart-button-icon{position:relative;display:inline-block;width:14px;height:10px;border:2px solid currentColor;border-top:0;border-radius:1px;color:#fff;transform:skew(-7deg);flex:0 0 auto}
.cart-button-icon:before{content:"";position:absolute;left:-5px;top:-4px;width:6px;height:5px;border-top:2px solid currentColor}
.cart-button-icon:after{content:"";position:absolute;left:1px;bottom:-5px;width:3px;height:3px;border-radius:50%;background:currentColor;box-shadow:8px 0 0 currentColor}
.item-total{align-self:center;display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap;color:#168841}
.item-total del{font-size:9px;font-weight:normal;color:#8a96a8}
#discounttotal{color:#d77b00}
#discount-modal{position:fixed;inset:0;z-index:30;display:flex;align-items:flex-end;justify-content:center;padding:16px;background:#0009}
.discount-box{position:relative;width:100%;max-width:410px;max-height:92vh;overflow-y:auto;padding:24px 18px 18px;border-radius:18px 18px 10px 10px;background:#fff;box-shadow:0 -12px 35px #0003;animation:discount-box-in .25s ease-out both}
.discount-box>small{color:#b26a00;font-size:9px;font-weight:bold;letter-spacing:.08em}
.discount-box h2{margin:7px 35px 6px 0;font-size:16px;line-height:1.25}
.discount-box p{margin:0 0 16px;color:#65758a;font-size:11px}
.discount-box p b{color:var(--ink)}
.discount-box label{display:block;margin:10px 0 6px;font-size:11px;font-weight:bold}
.discount-box select,.discount-box input{width:100%;height:44px;padding:0 12px;border:1px solid #d8e0ea;border-radius:7px;background:#fff;color:var(--ink);font-size:14px;outline:none}
.discount-box select:focus,.discount-box input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #075bd51a}
.discount-close{position:absolute;right:12px;top:8px;border:0;background:transparent;color:#718096;font-size:26px}
.product-quantity{display:flex;align-items:center;gap:8px}
.product-quantity input{flex:1;width:0;text-align:center;font-weight:bold}
.product-quantity button{width:44px;height:44px;border:1px solid #d8e0ea;border-radius:7px;background:#f4f7fb;color:var(--blue);font-size:22px;font-weight:bold}
.discount-preview{margin-top:10px;padding:11px;border-radius:7px;background:#ecfff1;color:#246238;font-size:11px;line-height:1.6}
.discount-preview strong{float:right;font-size:15px;color:#168841}
.discount-preview.invalid{background:#fff0f0;color:#b42318}
.discount-box .primary{margin-top:12px}
.discount-box .primary:disabled{background:#aeb8c7;opacity:.7}
.discount-box .secondary{margin-top:8px}
.discount-box .modal-cancel{display:block;width:100%}
@keyframes discount-box-in{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}

/* Busca e leitura nativa de código de barras. */
.product-search{display:flex;align-items:center;gap:8px;padding:5px 6px 5px 11px}
.product-search input{flex:1;width:auto;min-width:0;padding:7px 0;background:transparent}
.barcode-button{display:none;width:38px;height:38px;align-items:center;justify-content:center;flex:0 0 38px;border:0;border-radius:7px;background:var(--blue);color:#fff}
.barcode-button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.capacitor-native .barcode-button{display:flex}
.barcode-button.scanning svg{animation:barcode-pulse .8s ease-in-out infinite alternate}
.barcode-button:disabled{opacity:.65}
@keyframes barcode-pulse{from{transform:scale(.82)}to{transform:scale(1.08)}}

/* Respeita recortes e a barra inferior dos celulares. */
.capacitor-native .top,.capacitor-native .bar{height:calc(64px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
.capacitor-native nav{height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
.capacitor-native .cartbar{bottom:calc(56px + env(safe-area-inset-bottom))}

/* Configuracao da API disponivel antes e depois do login. */
#login-api-settings{position:absolute;right:18px;top:calc(18px + env(safe-area-inset-top));z-index:22;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #ffffff66;border-radius:50%;background:#ffffff1c;color:#fff;box-shadow:0 4px 14px #002b7455}
#login-api-settings svg,.api-settings-symbol svg,.more-menu-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#api-settings-modal,#more-menu-modal{position:fixed;inset:0;z-index:40;display:flex;align-items:flex-end;justify-content:center;padding:18px;padding-bottom:calc(18px + env(safe-area-inset-bottom));background:#061a3a99;backdrop-filter:blur(2px)}
.api-settings-box,.more-menu-box{position:relative;width:100%;max-width:410px;max-height:92vh;overflow-y:auto;padding:24px 18px 18px;border-radius:18px 18px 10px 10px;background:#fff;box-shadow:0 -12px 35px #0003;animation:discount-box-in .25s ease-out both}
.api-settings-close,.more-menu-close{position:absolute;right:12px;top:8px;width:38px;height:38px;border:0;background:transparent;color:#718096;font-size:27px}
.api-settings-symbol{width:44px;height:44px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;border-radius:12px;background:#e9f2ff;color:var(--blue)}
.api-settings-box>small{color:var(--blue);font-size:9px;font-weight:bold;letter-spacing:.1em}
.api-settings-box h2,.more-menu-box h2{margin:7px 42px 6px 0;font-size:19px}
.api-settings-box>p{margin:0 0 18px;color:#65758a;font-size:11px;line-height:1.45}
.api-settings-box label{display:block;margin:0 0 7px;font-size:11px;font-weight:bold}
.api-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 16px}
.api-mode-options label{display:flex;align-items:center;gap:7px;margin:0;padding:11px;border:1px solid #d8e0ea;border-radius:8px;background:#f8fbff;color:#31415a;font-size:12px;font-weight:normal;cursor:pointer}
.api-mode-options input{width:auto;height:auto;margin:0;accent-color:var(--blue)}
.api-settings-box input{width:100%;height:46px;padding:0 12px;border:1px solid #d8e0ea;border-radius:8px;background:#fff;color:var(--ink);font-size:14px;outline:none}
.api-settings-box input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #075bd51a}
.api-settings-example{margin:6px 0 0;color:#8794a6;font-size:9px}
.api-settings-status{min-height:37px;margin-top:12px;padding:0;font-size:11px;line-height:1.4}
.api-settings-status.testing,.api-settings-status.success,.api-settings-status.error{padding:10px;border-radius:7px}
.api-settings-status.testing{background:#eef5ff;color:#075bd5}
.api-settings-status.success{background:#eaf9ef;color:#187a3c}
.api-settings-status.error{background:#fff0f0;color:#b42318}
.api-settings-box .secondary,.api-settings-box .primary{margin:8px 0 0}
.api-settings-box button:disabled{opacity:.6}
.more-menu-box{padding-top:20px}
.more-menu-option{width:100%;display:flex;align-items:center;gap:12px;margin-top:18px;padding:13px 6px;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;text-align:left;color:var(--ink)}
.more-menu-option>span:nth-child(2){flex:1;min-width:0}
.more-menu-option b,.more-menu-option small{display:block}
.more-menu-option b{font-size:12px}
.more-menu-option small{margin-top:4px;color:#718096;font-size:9px;line-height:1.4}
.more-menu-option i{font-style:normal;overflow-wrap:anywhere}
.more-menu-option>strong{color:#718096;font-size:24px}
.more-menu-icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 42px;border-radius:10px;background:#e9f2ff;color:var(--blue)}
@media(min-width:700px){#api-settings-modal,#more-menu-modal{align-items:center}.api-settings-box,.more-menu-box{border-radius:16px}}

/* Opcao de salvar credenciais e entrar automaticamente. */
#save-login-option{display:flex;align-items:center;gap:9px;margin:10px 0 4px;color:#53657b;font-size:11px;cursor:pointer;user-select:none}
#save-login-option input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
#save-login-option span{position:relative;width:19px;height:19px;flex:0 0 19px;border:1px solid #bdc8d6;border-radius:5px;background:#fff;transition:background .15s ease,border-color .15s ease}
#save-login-option input:checked+span{border-color:var(--blue);background:var(--blue)}
#save-login-option input:checked+span:after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
#save-login-option input:focus-visible+span{box-shadow:0 0 0 3px #075bd52b}
#save-login-option b{display:block;font-size:11px;font-weight:normal}
#save-login-option small{display:block;margin-top:2px;color:#8491a3;font-size:9px;font-weight:normal}

/* Cores dos status na consulta de pre-vendas. */
.sale-row i.fechada,.sales i.fechada{background:#d8f6df;color:#168841}
.sale-row i.aberta,.sales i.aberta{background:#fff1bf;color:#8a6100}
.sale-row i.cancelada,.sales i.cancelada{background:#ffe0e0;color:#c62828}

/* Acoes de gravacao da pre-venda. */
.finish-finalize{margin-top:8px;border-color:#168841;background:#168841;color:#fff}
.finish-finalize:disabled{opacity:.65}

/* Selecao de cor/tamanho para produtos que controlam grade. */
#grade-modal{position:fixed;inset:0;z-index:35;display:flex;align-items:center;justify-content:center;padding:16px;background:#0009}
.grade-box{position:relative;width:100%;max-width:410px;max-height:90vh;overflow-y:auto;padding:24px 18px 18px;border-radius:16px;background:#fff;box-shadow:0 12px 35px #0003;animation:grade-box-in .2s ease-out both}
.grade-box h2{margin:7px 38px 5px 0;font-size:17px;line-height:1.3}
.grade-box>p{margin:0 0 14px;color:#65758a;font-size:11px}
.grade-close{position:absolute;right:12px;top:8px;width:38px;height:38px;border:0;background:transparent;color:#718096;font-size:27px}
.grade-options{display:flex;flex-direction:column;gap:8px}
.grade-option{width:100%;display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #dce3ec;border-radius:9px;background:#fff;color:var(--ink);text-align:left}
.grade-option>span{flex:1;min-width:0}
.grade-name{display:block;font-size:12px;line-height:1.3}
.grade-attributes{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}
.grade-attribute{display:inline-block;padding:4px 6px;border-radius:6px;background:#eef4fc;color:#405875;font-size:9px;line-height:1.2}
.grade-attribute b{display:inline;color:#243b57;font-size:9px}
.grade-stock{display:block;margin-top:7px;color:#168841;font-size:9px}
.grade-option strong{color:#b65f00;font-size:12px;white-space:nowrap}
.grade-option i{color:#8694a7;font-size:22px;font-style:normal}
.grade-box>.grade-cancel{display:block;width:100%;margin-top:8px}
@keyframes grade-box-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}