:root{--bg:#f7f6f2;--surface:#f9f8f5;--surface2:#fbfbf9;--offset:#f3f0ec;--border:#d4d1ca;--div:#dcd9d5;--text:#28251d;--muted:#7a7974;--inv:#f9f8f4;--primary:#01696f;--ph:#0c4e54;--phigh:#cedcd8;--ok:#437a22;--warn:#964219;--err:#a13544;--r:.5rem;--rl:.75rem;--rxl:1rem;--rf:9999px;--font:system-ui,-apple-system,'Segoe UI',sans-serif}
[data-theme=dark]{--bg:#171614;--surface:#1c1b19;--surface2:#201f1d;--offset:#1d1c1a;--border:#393836;--div:#262523;--text:#cdccca;--muted:#97958f;--inv:#2b2a28;--primary:#4f98a3;--ph:#227f8b;--phigh:#313b3b;--ok:#6daa45;--warn:#bb653b;--err:#dd6974}
*{box-sizing:border-box;margin:0;padding:0}
html,body,#root{height:100%;font-family:var(--font);background:var(--bg);color:var(--text);font-size:16px}
button,input,select,textarea{font:inherit;color:var(--text)}
button{cursor:pointer;border:none;background:none}
.btn{padding:.75rem 1.1rem;border-radius:var(--r);font-weight:700;font-size:.875rem;border:1px solid transparent;transition:opacity .15s}
.btn:hover{opacity:.85}.btn-primary{background:var(--primary);color:var(--inv)}
.btn:disabled{cursor:not-allowed;opacity:.58}
.btn-secondary{background:var(--offset);border-color:var(--border)}
.btn-danger{background:color-mix(in srgb,var(--err) 14%,transparent);border-color:color-mix(in srgb,var(--err) 30%,transparent);color:var(--err)}
.btn-sm{padding:.5rem .8rem;font-size:.8rem}
.badge{display:inline-flex;align-items:center;padding:.3rem .6rem;border-radius:var(--rf);font-size:.75rem;font-weight:800}
.b-blue{background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--primary)}
.b-ok{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.b-warn{background:color-mix(in srgb,var(--warn) 14%,transparent);color:var(--warn)}
.b-err{background:color-mix(in srgb,var(--err) 14%,transparent);color:var(--err)}
.card{background:var(--surface2);border:1px solid color-mix(in srgb,var(--text) 10%,transparent);border-radius:var(--rxl);padding:1.25rem}
.field{display:grid;gap:.3rem}
.field label{font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.field input,.field select,.field textarea{background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:.7rem .85rem;width:100%}
.field input[type=password]{letter-spacing:.1em}
.field textarea{min-height:80px;resize:vertical}
.shell{display:grid;grid-template-rows:auto 1fr;height:100dvh}
.header{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.25rem;border-bottom:1px solid var(--border);background:var(--surface);gap:1rem;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:.75rem}
.logo-icon{width:32px;height:32px;color:var(--primary)}
.logo strong{font-size:1.1rem;display:block}.logo span{font-size:.8rem;color:var(--muted)}
.nav{display:flex;gap:.5rem;flex-wrap:wrap}
.nav button{padding:.6rem .9rem;border-radius:var(--rf);border:1px solid var(--border);font-size:.85rem;font-weight:700;background:var(--surface2)}
.nav button.active{background:var(--phigh);color:var(--primary)}
.main{overflow:auto;padding:1.25rem}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.stack{display:flex;flex-direction:column;gap:.75rem}
.row{display:flex;gap:.75rem;flex-wrap:wrap;align-items:flex-start}
.row-center{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.grow{flex:1 1 auto}
.muted{color:var(--muted)}.tiny{font-size:.8rem}
.sep{border:none;border-top:1px solid var(--div);margin:.5rem 0}
table{width:100%;border-collapse:collapse;font-size:.875rem}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:.6rem .75rem;border-bottom:1px solid var(--div);text-align:left}
td{padding:.7rem .75rem;border-bottom:1px solid var(--div);vertical-align:middle}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);display:grid;place-items:center;padding:1rem;z-index:200}
.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--rxl);padding:1.25rem;width:min(720px,100%);max-height:90vh;overflow:auto;box-shadow:0 16px 48px rgba(0,0,0,.18)}
.line-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:.85rem 1rem;display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.line-item-info{flex:1;min-width:120px}
.line-inputs{display:flex;gap:.6rem;align-items:flex-end;flex-wrap:wrap}
.line-input{display:grid;gap:.25rem}
.line-input span{font-size:.75rem;color:var(--muted);font-weight:700;text-transform:uppercase}
.line-input input{width:90px;padding:.55rem .7rem;border:1px solid var(--border);border-radius:var(--r);background:var(--bg)}
.alert-box{background:var(--offset);border:1px solid var(--border);border-radius:1rem;padding:.82rem .95rem}
.total-row{background:var(--phigh);border:1px solid color-mix(in srgb,var(--primary) 50%,transparent);border-radius:var(--rl);padding:.85rem 1rem;display:flex;justify-content:space-between;align-items:center}
.warn-box{background:color-mix(in srgb,var(--err) 10%,transparent);border:1px solid color-mix(in srgb,var(--err) 30%,transparent);border-radius:1rem;padding:.82rem .95rem}
.login-wrap{display:grid;place-items:center;min-height:100dvh;padding:1rem;background:linear-gradient(180deg,#fff6f2 0%,#fff 45%,#f4f7fb 100%)}
.login-box{width:min(420px,100%);background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border:1px solid rgba(0,0,0,.06);border-radius:1.5rem;padding:1.2rem 1.1rem 1.15rem;box-shadow:0 12px 24px rgba(0,0,0,.12)}
.chip{background:var(--offset);border:1px solid var(--border);border-radius:var(--rl);padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.sync-status{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.connection-pill{display:inline-flex;align-items:center;padding:.3rem .6rem;border-radius:var(--rf);font-size:.75rem;font-weight:800;color:#fff}
.connection-pill.is-online{background:#15803d}.connection-pill.is-offline{background:#b45309}
.offline-readiness{display:grid;gap:.2rem;padding:.7rem .8rem;border:1px solid var(--border);border-left:4px solid var(--warn);border-radius:var(--rl);background:var(--offset);font-size:.8rem}
.offline-readiness.is-ready{border-left-color:var(--ok)}
.offline-readiness span{color:var(--muted);font-size:.75rem}
.data-stale-notice{border-left:4px solid var(--warn)}
.update-ready-notice{border-left:4px solid var(--primary);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.sync-issues{margin:.65rem 0}.sync-issues summary{cursor:pointer;font-weight:800}.sync-issues p{margin:.65rem 0}.sync-issues ul{margin-left:1.2rem;display:grid;gap:.35rem}
.offline-ready-badge{white-space:nowrap}
.sync-last-update{white-space:nowrap}

.login-box{width:min(420px,100%);background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.08);border-radius:1.35rem;padding:1.4rem 1.25rem;box-shadow:0 18px 40px rgba(0,0,0,.16)}
.login-hero{display:flex;flex-direction:column;align-items:center;gap:.85rem;margin-bottom:1.1rem}
.login-hero img{width:120px;height:120px;object-fit:contain;border-radius:1.15rem;box-shadow:0 8px 22px rgba(0,0,0,.18);background:#fff;padding:.45rem}
.login-title{font-size:1.45rem;font-weight:900;line-height:1.05;text-align:center;color:#7f1d1d}
.login-sub{font-size:.88rem;color:var(--muted);text-align:center;max-width:32ch;line-height:1.3}
.login-box .field label{font-size:.82rem;font-weight:700;color:#444}
.login-box input,.login-box select{padding:.95rem .95rem;font-size:1rem;border-radius:1rem}
.login-box .btn{padding:.82rem .95rem;border-radius:1rem;font-size:1rem;font-weight:800}
.login-box .tiny-muted{display:none}.login-box hr{display:none}.login-box small{display:none}
.login-wrap{padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));background:linear-gradient(180deg,#fffaf7 0%,#f7fafc 100%)}
.login-box.login-box-simple{width:min(390px,100%);display:grid;gap:1.35rem;padding:1.75rem 1.5rem;background:var(--surface2);border:1px solid color-mix(in srgb,var(--text) 9%,transparent);border-radius:1.35rem;box-shadow:0 18px 45px rgba(15,23,42,.12);backdrop-filter:none}
.login-brand{display:flex;justify-content:center;padding:.1rem 0 .15rem}
.login-brand .logo{gap:.8rem}
.login-brand .logo-icon{width:42px;height:42px}
.login-brand .logo strong{font-size:1.3rem}
.login-brand .logo span{font-size:.78rem}
.login-heading{display:grid;gap:.35rem;text-align:center}
.login-heading h1{font-size:1.35rem;line-height:1.15}
.login-heading p{color:var(--muted);font-size:.92rem}
.login-form{gap:1rem}
.login-box-simple .field{gap:.4rem}
.login-box-simple .field label{font-size:.76rem;color:var(--muted)}
.login-box-simple .field input{min-height:52px;padding:.85rem .95rem;background:var(--bg);border-radius:.85rem}
.login-submit{width:100%;min-height:52px;margin-top:.15rem}
.login-message{padding:.72rem .8rem;border-radius:.75rem;background:color-mix(in srgb,var(--err) 9%,transparent);border:1px solid color-mix(in srgb,var(--err) 28%,transparent);color:var(--err);font-size:.84rem;line-height:1.4}
.account-switch-card{display:grid;gap:.35rem;padding-top:1rem;border-top:1px solid var(--div);text-align:center}
.account-switch-card strong{font-size:.9rem}
.account-switch-card p{color:var(--muted);font-size:.8rem}
.login-link-button,.login-update-link{justify-self:center;padding:.45rem;color:var(--primary);font-size:.86rem;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.login-link-button:disabled{opacity:.55;cursor:not-allowed}
.login-update-link{font-size:.78rem;color:var(--muted)}
.vendor-screen .header{backdrop-filter:blur(8px)}
.vendor-screen .card,.vendor-screen .alert-box,.vendor-screen .warn-box{border-radius:1.05rem}
.vendor-screen .nav button{padding:.9rem 1.1rem;border-radius:.9rem}
.vendor-screen .btn{border-radius:.9rem}
.vendor-screen .field label{font-size:.8rem;font-weight:700}
.order-inner-nav{display:none}
.seller-primary-nav button{display:flex;align-items:center;gap:.45rem}
.seller-nav-icon{display:grid;place-items:center;width:1.35rem;height:1.35rem;border-radius:.42rem;background:color-mix(in srgb,var(--primary) 11%,transparent);color:var(--primary);font-size:.78rem;font-weight:900}
.seller-primary-nav button.active .seller-nav-icon{background:var(--primary);color:var(--inv)}
.seller-header-actions{justify-content:flex-end}
.sync-status-compact{width:auto;justify-content:flex-end}
.sync-status-compact .sync-compact-button{padding:.45rem .65rem}
.seller-send-pending-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border:1px solid color-mix(in srgb,var(--warn) 52%,var(--border));border-left:5px solid var(--warn);border-radius:1rem;background:color-mix(in srgb,var(--warn) 9%,var(--surface2))}
.seller-send-pending-copy{display:grid;gap:.2rem}.seller-send-pending-copy strong{font-size:.95rem}.seller-send-pending-copy span{font-size:.78rem;color:var(--muted)}
.seller-send-pending-button{white-space:nowrap}

.seller-home{max-width:1080px;margin:0 auto}
.seller-welcome{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.35rem 1.5rem;border-radius:1.15rem;background:linear-gradient(135deg,var(--primary),var(--ph));color:var(--inv);box-shadow:0 12px 30px color-mix(in srgb,var(--primary) 22%,transparent)}
.seller-welcome h1{font-size:1.65rem;line-height:1.1;margin:.2rem 0}
.seller-welcome p{opacity:.86;font-size:.9rem}
.seller-eyebrow{font-size:.72rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.seller-today-summary{display:grid;text-align:right;gap:.15rem;min-width:max-content}
.seller-today-summary strong{font-size:1.3rem}
.seller-today-summary span{font-size:.78rem;opacity:.82}
.seller-quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.seller-action-card{display:flex;align-items:center;gap:.8rem;min-width:0;padding:1rem;text-align:left;background:var(--surface2);border:1px solid var(--border);border-radius:1rem;box-shadow:0 5px 14px rgba(15,23,42,.05);transition:transform .15s,border-color .15s}
.seller-action-card:hover{transform:translateY(-2px);border-color:var(--primary)}
.seller-action-primary{background:color-mix(in srgb,var(--primary) 9%,var(--surface2));border-color:color-mix(in srgb,var(--primary) 40%,var(--border))}
.seller-action-icon{display:grid;place-items:center;flex:0 0 2.6rem;width:2.6rem;height:2.6rem;border-radius:.8rem;background:var(--phigh);color:var(--primary);font-size:1.2rem;font-weight:900}
.seller-action-primary .seller-action-icon{background:var(--primary);color:var(--inv)}
.seller-action-copy{display:grid;gap:.16rem;min-width:0;flex:1}
.seller-action-copy strong{font-size:.98rem}.seller-action-copy small{font-size:.75rem;color:var(--muted);line-height:1.25}
.seller-action-arrow{color:var(--muted);font-size:1.45rem}
.seller-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.seller-overview-card{display:grid;gap:.15rem;padding:1rem 1.1rem;background:var(--surface2);border:1px solid color-mix(in srgb,var(--text) 9%,transparent);border-radius:1rem}
.seller-overview-card>span{font-size:.75rem;color:var(--muted);font-weight:750}.seller-overview-card>strong{font-size:1.45rem}.seller-overview-card>small{font-size:.74rem;color:var(--muted)}
.seller-overview-card.needs-attention{border-left:4px solid var(--warn)}
.seller-secondary-action{display:flex;justify-content:flex-end}
.seller-section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.seller-section-heading p{font-size:.76rem;color:var(--muted);margin-top:.15rem}
.seller-recent-order{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.85rem;width:100%;padding:.75rem .8rem;border:1px solid var(--div);border-radius:.8rem;text-align:left;background:var(--surface)}
.seller-recent-order:hover{border-color:var(--primary)}
.seller-recent-number{font-weight:850;color:var(--primary)}
.seller-recent-client{display:grid;gap:.1rem;min-width:0}.seller-recent-client strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seller-recent-client small{font-size:.72rem;color:var(--muted)}
.seller-recent-total{white-space:nowrap}
.seller-empty-state{padding:1rem;text-align:center;color:var(--muted);font-size:.85rem}
.seller-client-card{border-left:4px solid var(--primary);box-shadow:0 5px 14px rgba(15,23,42,.04)}
.seller-client-heading{align-items:flex-start}
.seller-client-location{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.seller-client-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.seller-client-actions .btn{width:100%}
.seller-client-details{margin-top:.25rem;padding-top:.75rem;border-top:1px solid var(--div)}
.seller-client-detail-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:.5rem}
.seller-client-detail-grid>div{display:grid;gap:.12rem;min-width:0;padding:.55rem .65rem;background:var(--offset);border-radius:.65rem}
.seller-client-detail-grid strong{overflow-wrap:anywhere}
.seller-order-form{gap:1rem}
.seller-order-title{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding-bottom:.8rem;border-bottom:1px solid var(--div)}
.seller-order-title h1{font-size:1.35rem;line-height:1.15}.seller-order-title p{font-size:.78rem;color:var(--muted);margin-top:.18rem}
.order-step-heading{display:flex;align-items:center;gap:.65rem;margin-top:.25rem}
.order-step-heading>span{display:grid;place-items:center;flex:0 0 1.75rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--primary);color:var(--inv);font-size:.78rem;font-weight:900}
.order-step-heading>div{display:grid;gap:.05rem}.order-step-heading strong{font-size:.9rem}.order-step-heading small{font-size:.72rem;color:var(--muted)}



.quick-card{background:#fff;border:1px solid var(--border);border-radius:1.2rem;padding:1rem}

.import-order-modal,.import-review-content,.import-item-card,.import-item-card .field{min-width:0}
.import-order-modal{overflow-x:hidden}
.import-review-content{width:100%}
.import-read-summary{border-left:4px solid var(--ok)}
.import-success{border-left:4px solid var(--ok);margin:.15rem 0}
.import-item-card{display:flex;flex-direction:column;gap:.75rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--rxl);padding:1rem;border-left:4px solid var(--primary);overflow:hidden}
.import-item-card input,.import-item-card select,.import-item-card textarea{min-width:0;max-width:100%}
.import-fields-grid,.import-header-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.import-item-footer,.import-review-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}
.import-item-footer>span{flex:1 1 280px;min-width:0;overflow-wrap:anywhere}
.import-item-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.import-apply-button{width:100%;min-height:48px}

.client-confirmation-card{display:grid;gap:.8rem;background:color-mix(in srgb,var(--phigh) 58%,var(--surface));border:1px solid color-mix(in srgb,var(--primary) 42%,var(--border));border-left:4px solid var(--primary);border-radius:var(--rxl);padding:1rem;min-width:0}
.client-confirmation-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;flex-wrap:wrap}
.client-confirmation-heading strong{display:block;font-size:1.05rem;overflow-wrap:anywhere}
.client-confirmation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.client-confirmation-grid>div{display:grid;gap:.18rem;min-width:0;background:color-mix(in srgb,var(--surface) 76%,transparent);border:1px solid color-mix(in srgb,var(--border) 75%,transparent);border-radius:var(--r);padding:.65rem .75rem}
.client-confirmation-grid span{font-size:.7rem;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.035em}
.client-confirmation-grid strong{font-size:.86rem;line-height:1.35;overflow-wrap:anywhere}
.client-confirmation-address{grid-column:1/-1}
.client-confirmation-check{display:flex;align-items:flex-start;gap:.65rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:.75rem;font-size:.86rem;font-weight:750;line-height:1.35;cursor:pointer}
.client-confirmation-check input{width:auto;flex:0 0 auto;margin-top:.12rem}

.product-list-header{justify-content:space-between;margin-bottom:.75rem}
.product-transition-note{border-left:4px solid var(--primary);margin-bottom:.75rem}
.product-save-notice{border-left:4px solid var(--ok)}
.product-search{width:100%;padding:.7rem .85rem;border:1px solid var(--border);border-radius:var(--r);background:var(--bg);margin-bottom:.75rem}
.product-table-wrap{overflow-x:auto}
.product-table{min-width:980px}
.product-name-cell strong{display:block}
.product-actions{text-align:right;white-space:nowrap}
.product-form-modal{width:min(1040px,100%);max-height:96dvh;overflow-x:hidden}
.product-form,.product-form-section,.product-form-section .field{min-width:0}
.product-form-section{display:grid;gap:.9rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--rxl);padding:1rem}
.product-section-heading{display:grid;gap:.2rem;padding-bottom:.7rem;border-bottom:1px solid var(--div)}
.product-section-heading strong{font-size:1rem}
.product-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.product-form-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.product-form-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.product-span-2{grid-column:1/-1}
.product-field-help{line-height:1.35;text-transform:none;letter-spacing:normal}
.product-presentation-summary{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;background:var(--phigh);border:1px solid color-mix(in srgb,var(--primary) 35%,transparent);border-radius:var(--rl);padding:.8rem .9rem}
.product-barcode-list{display:grid;gap:.7rem}
.product-barcode-row{display:grid;grid-template-columns:minmax(125px,.65fr) minmax(210px,1.4fr) auto auto;gap:.7rem;align-items:end;background:var(--offset);border:1px solid var(--border);border-radius:var(--rl);padding:.75rem}
.product-primary-barcode{display:flex;align-items:center;gap:.4rem;min-height:42px;font-size:.82rem;font-weight:700;white-space:nowrap}
.product-primary-barcode input{width:auto}
.product-add-barcode{justify-self:start}
.product-preview-card{display:grid;grid-template-columns:140px minmax(0,1fr);gap:1rem;align-items:center;border:1px solid var(--border);border-radius:var(--rxl);padding:1rem;background:var(--surface)}
.product-preview-image,.product-preview-placeholder{width:140px;height:140px;border-radius:var(--rl);border:1px solid var(--border);background:var(--offset)}
.product-preview-image{display:block;object-fit:contain}
.product-preview-placeholder{display:grid;place-items:center;color:var(--muted);font-size:.8rem;font-weight:700}
.product-preview-copy{min-width:0}
.product-preview-title{display:block;font-size:1.15rem;overflow-wrap:anywhere}
.product-readiness-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.product-ready{border-left:4px solid var(--ok)}
.product-form-errors{scroll-margin-top:1rem}
.product-form-errors ul{margin:.5rem 0 0 1.15rem;display:grid;gap:.25rem}
.product-form-actions{position:sticky;bottom:-1.25rem;z-index:5;display:flex;justify-content:flex-end;gap:.75rem;margin:0 -1.25rem -1.25rem;padding:1rem 1.25rem;background:color-mix(in srgb,var(--surface) 96%,transparent);border-top:1px solid var(--border);backdrop-filter:blur(8px)}

.catalog-org-panel{max-width:1180px;margin:0 auto;min-width:0}
.catalog-org-panel .muted,.catalog-org-panel .tiny,.catalog-org-panel .field label{color:var(--text)}
.catalog-org-hero{border-left:4px solid var(--primary)}
.catalog-org-hero h2{margin:0 0 .25rem}
.catalog-org-hero-row,.catalog-org-pair-heading{justify-content:space-between;align-items:flex-start}
.catalog-org-safety{border-left:4px solid var(--warn)}
.catalog-org-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.catalog-org-summary-card{display:flex;align-items:center;gap:.75rem;min-width:0}
.catalog-org-summary-card .badge{font-size:1rem;min-width:2.5rem;justify-content:center}
.catalog-org-toolbar{display:grid;grid-template-columns:minmax(260px,2fr) minmax(190px,.75fr);gap:.75rem;align-items:end}
.catalog-org-search{min-width:0}
.catalog-org-pair{display:grid;gap:1rem;min-width:0;border-left:4px solid var(--ok)}
.catalog-org-pair-review{border-left-color:var(--warn)}
.catalog-org-variant-title{font-size:1.05rem;overflow-wrap:anywhere}
.catalog-org-factor{display:grid;text-align:right;gap:.15rem}
.catalog-org-skus{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:.75rem;align-items:stretch}
.catalog-org-sku{display:grid;align-content:start;gap:.35rem;background:var(--offset);border:1px solid var(--border);border-radius:var(--rl);padding:.85rem;min-width:0}
.catalog-org-sku-heading{justify-content:space-between}
.catalog-org-product-name{font-weight:800;line-height:1.35;overflow-wrap:anywhere}
.catalog-org-equation{display:grid;place-items:center;color:var(--primary);font-size:1.05rem;font-weight:900;padding:.4rem}
.catalog-org-price-comparison{display:flex;align-items:center;gap:.75rem 1.25rem;flex-wrap:wrap;background:var(--phigh);border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));border-radius:var(--rl);padding:.75rem .85rem}
.catalog-org-issues{border-left:4px solid var(--warn)}
.catalog-org-issues ul{margin:.45rem 0 0 1.1rem;display:grid;gap:.2rem}
.catalog-org-standalone{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.catalog-org-load-more{align-self:center;min-width:min(280px,100%)}

.user-directory-toolbar{justify-content:space-between;gap:1rem;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--rxl);padding:1rem}
.user-directory-toolbar>div{display:grid;gap:.18rem}
.user-row-actions{gap:.4rem;flex-wrap:wrap}
.user-access-form{min-width:0}
.user-role-fieldset{border:1px solid var(--border);border-radius:var(--rl);padding:.85rem 1rem;min-width:0}
.user-role-fieldset legend{font-size:.78rem;font-weight:850;padding:0 .35rem;color:var(--text)}
.user-role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
.user-role-option,.user-active-option{display:flex;align-items:center;gap:.55rem;padding:.7rem .75rem;border:1px solid var(--border);border-radius:var(--r);background:var(--offset);font-size:.84rem;font-weight:750;cursor:pointer}
.user-role-option input,.user-active-option input{width:auto;flex:0 0 auto}
.user-active-option{background:var(--surface)}
.user-form-actions{justify-content:flex-end;gap:.65rem;padding-top:.2rem}

.admin-header{position:sticky;top:0;z-index:45;box-shadow:0 1px 0 color-mix(in srgb,var(--text) 5%,transparent)}
.admin-primary-nav{flex:1;justify-content:center}
.vendor-screen .admin-primary-nav button{padding:.65rem .8rem;border-color:transparent;background:transparent}
.vendor-screen .admin-primary-nav button:hover{background:var(--offset)}
.vendor-screen .admin-primary-nav button.active{background:var(--phigh)}
.vendor-screen .admin-primary-nav .admin-nav-primary{background:color-mix(in srgb,var(--primary) 10%,transparent);border-color:color-mix(in srgb,var(--primary) 28%,transparent);color:var(--primary)}
.vendor-screen .admin-primary-nav .admin-nav-primary.active{background:var(--primary);color:var(--inv)}
.admin-header-actions{justify-content:flex-end;flex-wrap:nowrap}
.admin-tools-menu{position:relative}
.admin-tools-menu summary{list-style:none;white-space:nowrap}
.admin-tools-menu summary::-webkit-details-marker{display:none}
.admin-tools-popover{position:absolute;right:0;top:calc(100% + .5rem);z-index:80;display:grid;gap:.25rem;width:240px;padding:.45rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--rl);box-shadow:0 14px 36px rgba(15,23,42,.2)}
.admin-tool-button{width:100%;padding:.7rem .75rem;border-radius:.55rem;text-align:left;font-size:.82rem;font-weight:750}
.admin-tool-button:hover{background:var(--offset)}
.admin-tool-danger{color:var(--err)}
.admin-register-nav{padding:.35rem;overflow-x:auto;flex-wrap:nowrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--rl)}
.admin-register-nav button{white-space:nowrap}

.admin-home{max-width:1180px;margin:0 auto;gap:1rem}
.admin-welcome{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.35rem 1.5rem;border-radius:1.15rem;background:linear-gradient(135deg,var(--primary),var(--ph));color:var(--inv);box-shadow:0 12px 30px color-mix(in srgb,var(--primary) 20%,transparent)}
.admin-welcome h1{font-size:1.6rem;line-height:1.1;margin:.2rem 0}
.admin-welcome p{font-size:.88rem;opacity:.86}
.admin-eyebrow{font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.admin-today-summary{display:grid;gap:.14rem;min-width:max-content;text-align:right}
.admin-today-summary strong{font-size:1.25rem}.admin-today-summary span{font-size:.76rem;opacity:.82}
.admin-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.admin-action-card{display:flex;align-items:center;gap:.7rem;min-width:0;padding:.9rem;text-align:left;background:var(--surface2);border:1px solid var(--border);border-radius:.95rem;box-shadow:0 4px 12px rgba(15,23,42,.04);transition:transform .15s,border-color .15s}
.admin-action-card:hover{transform:translateY(-2px);border-color:var(--primary)}
.admin-action-primary{background:color-mix(in srgb,var(--primary) 9%,var(--surface2));border-color:color-mix(in srgb,var(--primary) 38%,var(--border))}
.admin-action-icon{display:grid;place-items:center;flex:0 0 2.35rem;width:2.35rem;height:2.35rem;border-radius:.72rem;background:var(--phigh);color:var(--primary);font-size:1rem;font-weight:900}
.admin-action-primary .admin-action-icon{background:var(--primary);color:var(--inv)}
.admin-action-copy{display:grid;gap:.12rem;min-width:0;flex:1}.admin-action-copy strong{font-size:.9rem}.admin-action-copy small{font-size:.7rem;color:var(--muted);line-height:1.25}
.admin-action-arrow{color:var(--muted);font-size:1.25rem}
.admin-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.admin-overview-card{display:grid;gap:.12rem;padding:.9rem 1rem;background:var(--surface2);border:1px solid color-mix(in srgb,var(--text) 9%,transparent);border-radius:.9rem}
.admin-overview-card>span{font-size:.72rem;color:var(--muted);font-weight:750}.admin-overview-card>strong{font-size:1.35rem}.admin-overview-card>small{font-size:.7rem;color:var(--muted)}
.admin-overview-card.needs-attention{border-left:4px solid var(--warn)}
.admin-home-columns{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1rem;align-items:start}
.admin-section-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}.admin-section-heading p{font-size:.72rem;color:var(--muted);margin-top:.12rem}
.admin-attention-list,.admin-recent-list{display:grid;gap:.55rem}
.admin-attention-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.65rem;align-items:start;padding:.7rem .75rem;background:var(--offset);border-radius:.72rem}
.admin-attention-dot{width:.55rem;height:.55rem;margin-top:.28rem;border-radius:50%;background:var(--warn)}
.admin-attention-item div{display:grid;gap:.12rem}.admin-attention-item strong{font-size:.82rem}.admin-attention-item small{font-size:.7rem;color:var(--muted);line-height:1.3}
.admin-recent-order{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.7rem;width:100%;padding:.68rem .72rem;border:1px solid var(--div);border-radius:.72rem;text-align:left;background:var(--surface)}
.admin-recent-order:hover{border-color:var(--primary)}
.admin-recent-number{font-weight:850;color:var(--primary)}
.admin-recent-client{display:grid;gap:.08rem;min-width:0}.admin-recent-client strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}.admin-recent-client small{font-size:.68rem;color:var(--muted)}
.admin-recent-total{font-size:.8rem;white-space:nowrap}
.admin-empty-state{padding:1rem;text-align:center;color:var(--muted);font-size:.8rem;background:var(--offset);border-radius:.72rem}

@media(max-width:720px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .vendor-screen .header{display:grid;grid-template-columns:minmax(0,1fr) auto;padding:calc(.72rem + env(safe-area-inset-top,0px)) max(.85rem,env(safe-area-inset-right,0px)) .72rem max(.85rem,env(safe-area-inset-left,0px));gap:.65rem;position:relative;z-index:30;backdrop-filter:none}
  .vendor-screen .header>.logo{min-width:0}.vendor-screen .header>.logo div{min-width:0}.vendor-screen .header>.logo span{display:block;max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .seller-header-actions{flex-wrap:nowrap;gap:.45rem}.seller-header-actions>.btn{padding:.5rem .65rem}
  .sync-status-compact .sync-compact-button{display:none}.sync-status-compact.has-pending .sync-compact-button{display:inline-flex}.sync-status-compact.has-pending .badge.b-warn{display:none}.sync-status-compact{gap:.3rem}.sync-status-compact .connection-pill{font-size:.68rem;padding:.28rem .48rem}.sync-status-compact .badge{font-size:.67rem;padding:.28rem .45rem}
  .seller-primary-nav{position:fixed;left:0;right:0;bottom:0;z-index:100;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.2rem;padding:.5rem max(.5rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(.5rem,env(safe-area-inset-left));background:color-mix(in srgb,var(--surface) 96%,transparent);border-top:1px solid var(--border);box-shadow:0 -8px 24px rgba(15,23,42,.1);backdrop-filter:blur(12px)}
  .vendor-screen .seller-primary-nav button{flex:1 0 68px;display:grid;justify-items:center;gap:.18rem;padding:.42rem .3rem;border:0;border-radius:.7rem;background:transparent;font-size:.66rem;white-space:nowrap}
  .vendor-screen .seller-primary-nav button.active{background:var(--phigh)}
  .seller-nav-icon{width:1.55rem;height:1.55rem;font-size:.72rem}
  .vendor-screen .main{padding:.85rem .85rem calc(5.6rem + env(safe-area-inset-bottom))}
  .seller-welcome{padding:1.15rem;align-items:flex-start}.seller-welcome h1{font-size:1.35rem}.seller-today-summary strong{font-size:1.05rem}
  .seller-quick-actions{grid-template-columns:1fr}.seller-action-card{min-height:72px}
  .seller-send-pending-card{align-items:stretch;flex-direction:column}.seller-send-pending-button{width:100%;min-height:48px}
  .seller-overview-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.seller-overview-card{padding:.8rem .7rem}.seller-overview-card>strong{font-size:1.2rem}.seller-overview-card>small{font-size:.67rem}
  .seller-secondary-action .btn{width:100%}
  .seller-recent-order{grid-template-columns:auto minmax(0,1fr) auto}.seller-recent-order>.badge{display:none}.seller-recent-total{grid-column:3;grid-row:1}
  .seller-client-card{padding:1rem}.seller-client-actions{grid-template-columns:1fr 1fr}.seller-client-detail-grid{grid-template-columns:1fr}
  .seller-history table,.seller-history tbody,.seller-history tr,.seller-history td{display:block;width:100%}
  .seller-history thead{display:none}
  .seller-history tr{padding:.85rem;border-bottom:1px solid var(--div)}
  .seller-history tr:last-child{border-bottom:0}
  .seller-history td{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:0;padding:.32rem 0;text-align:right}
  .seller-history td::before{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);text-align:left}
  .seller-history td:nth-child(1)::before{content:'Selecionar'}.seller-history td:nth-child(2)::before{content:'Pedido'}.seller-history td:nth-child(3)::before{content:'Cliente'}.seller-history td:nth-child(4)::before{content:'Pagamento'}.seller-history td:nth-child(5)::before{content:'Status'}.seller-history td:nth-child(6)::before{content:'Envio'}.seller-history td:nth-child(7)::before{content:'WhatsApp'}.seller-history td:nth-child(8)::before{content:'Total'}
  .seller-history td:nth-child(3){align-items:flex-start}.seller-history td:nth-child(9){display:block;padding-top:.75rem}.seller-history td:nth-child(9)::before{content:''}
  .seller-history td:nth-child(9) .row-center{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:.45rem}.seller-history td:nth-child(9) .btn{width:100%}.seller-history td:nth-child(9) .btn-primary{grid-column:1/-1}
  .import-fields-grid,.import-header-grid{grid-template-columns:1fr}
  .import-order-modal-bg{padding:0;place-items:stretch}
  .import-order-modal{width:100%!important;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:1rem}
  .import-order-modal>.modal-header{position:sticky;top:-1rem;z-index:5;background:var(--surface);padding:.9rem 0 .7rem;border-bottom:1px solid var(--border)}
  .import-item-card{padding:.85rem}
  .import-item-footer,.import-review-toolbar{align-items:stretch;flex-direction:column}
  .import-item-footer>span{flex-basis:auto}
  .import-item-actions{display:grid;grid-template-columns:1fr;width:100%}
  .import-item-actions .btn,.import-review-toolbar .btn{width:100%}
  .client-confirmation-grid{grid-template-columns:1fr}
  .client-confirmation-address{grid-column:auto}
  .client-confirmation-heading .badge{width:100%;justify-content:center}
  .line-inputs{width:100%}
  .client-table-wrap{overflow:visible!important}
  .client-table,.client-table tbody,.client-table tr,.client-table td{display:block;width:100%}
  .client-table thead{display:none}
  .client-table tr{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:.75rem;margin-bottom:.75rem}
  .client-table td{border:0;padding:.3rem 0}
  .client-table td[data-label]{display:flex;align-items:center;justify-content:space-between;gap:1rem}
  .client-table td[data-label]::before{content:attr(data-label);font-size:.72rem;font-weight:800;text-transform:uppercase;color:var(--muted)}
  .client-name-cell{padding-bottom:.6rem!important;border-bottom:1px solid var(--div)!important;margin-bottom:.25rem}
  .client-actions{padding-top:.65rem!important}
  .client-actions .row-center{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .client-actions .btn{width:100%}
  .product-list-header{align-items:stretch;flex-direction:column}
  .product-list-header .btn{width:100%}
  .product-table-wrap{overflow:visible}
  .product-table{min-width:0}
  .product-table,.product-table tbody,.product-table tr,.product-table td{display:block;width:100%}
  .product-table thead{display:none}
  .product-table tr{background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:.75rem;margin-bottom:.75rem}
  .product-table td{border:0;padding:.36rem 0}
  .product-table td[data-label]{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;text-align:right}
  .product-table td[data-label]::before{content:attr(data-label);font-size:.72rem;font-weight:800;text-transform:uppercase;color:var(--muted);text-align:left}
  .product-table .product-name-cell{display:block;text-align:left;padding-bottom:.65rem;border-bottom:1px solid var(--div);margin-bottom:.25rem}
  .product-table .product-name-cell::before{display:block;margin-bottom:.2rem}
  .product-table .product-actions{padding-top:.65rem}
  .product-table .product-actions .btn{width:100%}
  .product-form-modal-bg{padding:0;place-items:stretch}
  .product-form-modal{width:100%!important;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:1rem}
  .product-form-modal>.modal-header{position:sticky;top:-1rem;z-index:7;background:var(--surface);padding:.9rem 0 .7rem;border-bottom:1px solid var(--border)}
  .product-form-grid,.product-form-grid-3,.product-form-grid-4{grid-template-columns:1fr}
  .product-span-2{grid-column:auto}
  .product-barcode-row{grid-template-columns:1fr}
  .product-primary-barcode{min-height:auto}
  .product-barcode-row .btn{width:100%}
  .product-preview-card{grid-template-columns:1fr}
  .product-preview-image,.product-preview-placeholder{width:100%;height:min(240px,55vw)}
  .product-readiness-grid{grid-template-columns:1fr}
  .product-form-actions{bottom:-1rem;margin:0 -1rem -1rem;padding:.8rem 1rem;display:grid;grid-template-columns:1fr 1fr}
  .product-form-actions .btn{width:100%}
  .catalog-org-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-org-toolbar{grid-template-columns:1fr}
  .catalog-org-pair-heading{display:grid;grid-template-columns:1fr}
  .catalog-org-factor{text-align:left;background:var(--offset);border-radius:var(--r);padding:.65rem .75rem}
  .catalog-org-skus{grid-template-columns:1fr}
  .catalog-org-equation{min-height:34px}
  .catalog-org-standalone{grid-template-columns:1fr}
  .user-directory-toolbar{align-items:stretch;display:grid}.user-directory-toolbar .btn{width:100%}
  .user-role-grid{grid-template-columns:1fr 1fr}
  .user-form-actions{display:grid;grid-template-columns:1fr 1fr}.user-form-actions .btn{width:100%}
  .vendor-screen .admin-header{grid-template-columns:minmax(0,1fr) auto}
  .admin-header-actions{grid-column:2;grid-row:1;gap:.4rem}.admin-header-actions>.btn{padding:.5rem .65rem}
  .admin-header-actions .sync-status-compact{width:auto}
  .admin-primary-nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:.1rem;scrollbar-width:none}
  .admin-primary-nav::-webkit-scrollbar{display:none}
  .vendor-screen .admin-primary-nav button{flex:0 0 auto;padding:.55rem .7rem;white-space:nowrap;font-size:.74rem}
  .admin-tools-popover{position:fixed;right:.75rem;top:4.2rem;width:min(260px,calc(100vw - 1.5rem))}
  .admin-register-nav{margin:0 -.1rem}
  .admin-welcome{padding:1.1rem;align-items:flex-start}.admin-welcome h1{font-size:1.3rem}.admin-today-summary strong{font-size:1rem}
  .admin-quick-actions{grid-template-columns:1fr 1fr}.admin-action-card{min-height:68px}
  .admin-overview-grid{grid-template-columns:1fr 1fr;gap:.55rem}.admin-overview-card{padding:.78rem .72rem}.admin-overview-card>strong{font-size:1.18rem}
  .admin-home-columns{grid-template-columns:1fr}
  .admin-recent-order{grid-template-columns:auto minmax(0,1fr) auto}.admin-recent-order>.badge{display:none}.admin-recent-total{grid-column:3;grid-row:1}
  .sync-status{width:100%}
  .sync-status .btn{flex:1 1 140px}
  .offline-ready-badge{display:none}
  .sync-last-update{flex-basis:100%}
}

@media(max-width:420px){
  .login-wrap{place-items:center;padding:.8rem}
  .login-box.login-box-simple{padding:1.4rem 1.1rem;gap:1.1rem;border-radius:1.15rem}
  .login-brand .logo-icon{width:38px;height:38px}
  .login-brand .logo strong{font-size:1.2rem}
  .login-heading h1{font-size:1.22rem}
  .catalog-org-summary-card{justify-content:space-between}
  .admin-welcome{display:grid}.admin-today-summary{text-align:left}
  .admin-quick-actions{grid-template-columns:1fr}
}
