:root {
  color-scheme: light;
  --primary: #75a9b3;
  --primary-dark: #4e8e9a;
  --primary-light: #e8f4f6;
  --accent: #ba9c7d;
  --accent-dark: #9a7e62;
  --bg: #FAF7F2;
  --surface: #FFFFFF;
  --border: #dce8ea;
  --text: #1A2B35;
  --text-sec: #6B7F8A;
  --success: #2E9E6A;
  --danger: #D94F4F;
  --warning: #D97706;
  --r: 14px;
  --shadow: 0 2px 12px rgba(26,43,53,0.13);
  --shadow-md: 0 4px 20px rgba(26,43,53,0.11);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif; background-color: var(--bg); background-image: radial-gradient(ellipse at 20% 50%, rgba(186,156,125,0.09) 0%, transparent 60%), radial-gradient(ellipse at 80% 20%, rgba(117,169,179,0.07) 0%, transparent 50%), linear-gradient(rgba(250,247,242,0.93), rgba(250,247,242,0.93)), url('moara-bg.jpg'); background-size: auto, auto, auto, cover; background-position: center, center, center, top center; background-repeat: no-repeat, no-repeat, no-repeat, no-repeat; color: var(--text); min-height: 100vh; -webkit-tap-highlight-color: transparent; }

/* LOGIN */
#login-screen { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100vh; padding:24px; background: radial-gradient(ellipse at 18% 88%, rgba(186,156,125,0.45) 0%, transparent 52%), radial-gradient(ellipse at 82% 12%, rgba(117,169,179,0.38) 0%, transparent 52%), linear-gradient(155deg, #0d1e27 0%, #162f39 45%, #2e1c10 100%); }
.login-card { background:#fff; border-radius:24px; padding:36px 28px; width:100%; max-width:380px; box-shadow:0 20px 60px rgba(0,0,0,0.32); border-top:4px solid var(--accent); }
.login-logo { text-align:center; margin-bottom:32px; }
.login-logo img { height:54px; width:auto; display:block; margin:0 auto 14px; filter:brightness(0) invert(0); }
.login-logo p { color:var(--text-sec); font-size:13px; font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:300; letter-spacing:.5px; margin-top:4px; }

/* FORMS */
.fg { margin-bottom:16px; }
.fg label { display:block; font-size:11px; font-weight:700; color:var(--text-sec); margin-bottom:6px; text-transform:uppercase; letter-spacing:.6px; }
.fg input, .fg select, .fg textarea { width:100%; padding:13px 15px; border:1.5px solid var(--border); border-radius:12px; font-size:16px; color:var(--text); background:#fff; -webkit-appearance:none; appearance:none; transition:border-color .2s, box-shadow .2s; }
/* Checkbox dentro de .fg herdava o appearance:none da regra acima, que APAGA o
   tique nativo — a caixa virava um círculo vazio e não dava para saber se
   estava marcada (o accent-color também deixa de valer sem aparência nativa).
   Aqui a aparência nativa é devolvida. Vale para todos: se um checkbox novo
   entrar num .fg, já nasce certo. */
.fg input[type="checkbox"] {
  width:19px; height:19px; padding:0; border:none; border-radius:0;
  -webkit-appearance:checkbox; appearance:auto;
  accent-color:var(--primary); flex-shrink:0; cursor:pointer;
}
.fg input:focus, .fg select:focus, .fg textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(117,169,179,0.18); background:#fff; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.toggle-argila { display:flex; background:var(--bg); border-radius:12px; padding:3px; }
.toggle-argila .topt { flex:1; padding:10px; border:none; background:transparent; border-radius:9px; font-size:14px; font-weight:600; color:var(--text-sec); cursor:pointer; transition:all .18s; -webkit-tap-highlight-color:transparent; }
.toggle-argila .topt.active { background:#fff; color:var(--primary); box-shadow:0 1px 5px rgba(0,0,0,0.11); }

/* BUTTONS */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:13px 20px; border:none; border-radius:12px; font-size:15px; font-weight:600; cursor:pointer; transition:all .18s; -webkit-tap-highlight-color:transparent; letter-spacing:-.1px; }
.btn:active { transform:scale(.96); }
.btn-full { width:100%; display:flex; }
.btn-sm { padding:8px 14px; font-size:13px; border-radius:9px; }
.btn-primary { background:var(--primary); color:#fff; box-shadow:0 2px 10px rgba(117,169,179,0.32); }
.btn-primary:hover { background:var(--primary-dark); box-shadow:0 4px 16px rgba(117,169,179,0.42); }
.btn-secondary { background:var(--bg); color:var(--text-sec); border:1.5px solid var(--border); box-shadow:none; }
.btn-secondary:hover { background:var(--border); }
.btn-success { background:var(--success); color:#fff; box-shadow:0 2px 10px rgba(46,158,106,0.3); }
.btn-success:hover { background:#258a5c; }
.btn-danger { background:var(--danger); color:#fff; box-shadow:0 2px 10px rgba(217,79,79,0.3); }
.btn-danger:hover { background:#bf3c3c; }
.btn-icon { padding:8px 10px; border-radius:10px; background:var(--bg); color:var(--text-sec); border:1.5px solid var(--border); }
.btn-icon:hover { background:var(--border); }

/* ─── BOTÃO HERO: NOVA VENDA (Início) ─── */
.btn-nova-venda { position:relative; display:inline-flex; align-items:center; gap:9px; padding:11px 18px 11px 13px; border:none; border-radius:30px; background:linear-gradient(135deg,#4e8e9a 0%,#75a9b3 30%,#BA9C7D 72%,#d0b89a 100%); color:#fff; font-family:'DM Sans',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:.3px; cursor:pointer; overflow:hidden; -webkit-tap-highlight-color:transparent; transition:transform .18s, box-shadow .25s; box-shadow:0 5px 18px rgba(78,142,154,0.45), 0 2px 6px rgba(186,156,125,0.32), inset 0 1px 0 rgba(255,255,255,0.22); }
.btn-nova-venda:hover { box-shadow:0 7px 24px rgba(78,142,154,0.55), 0 3px 10px rgba(186,156,125,0.42), inset 0 1px 0 rgba(255,255,255,0.26); }
.btn-nova-venda:active { transform:scale(.96); }
.btn-nova-venda-shine { position:absolute; top:0; left:-100%; width:55%; height:100%; background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.32) 50%, transparent 100%); animation:btnNVShine 3.6s ease-in-out infinite; pointer-events:none; }
@keyframes btnNVShine { 0%, 55% { left:-100%; } 100% { left:200%; } }
.btn-nova-venda-iconwrap { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,0.22); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16); }
.btn-nova-venda-iconwrap svg { width:13px; height:13px; }
.btn-nova-venda-label { position:relative; z-index:1; line-height:1; }
.btn-nova-venda-plus { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; width:17px; height:17px; border-radius:50%; background:rgba(255,255,255,0.92); color:#4e8e9a; font-size:13px; font-weight:800; line-height:1; margin-left:2px; box-shadow:0 1px 4px rgba(0,0,0,0.10); }

/* ─── BOTÃO INTELIGENTE: RELATÓRIO DE PRODUÇÃO ─── */
.btn-relatorio-ai { position:relative; display:inline-flex; align-items:center; gap:9px; padding:8px 14px 8px 11px; border:none; border-radius:24px; background:linear-gradient(135deg,#4D8A9B 0%,#75a9b3 38%,#9C6F8C 100%); color:#fff; font-family:'DM Sans',sans-serif; font-size:12px; font-weight:700; letter-spacing:.2px; cursor:pointer; overflow:hidden; -webkit-tap-highlight-color:transparent; transition:transform .18s, box-shadow .25s; box-shadow:0 4px 14px rgba(77,138,155,0.40), 0 2px 5px rgba(156,111,140,0.26), inset 0 1px 0 rgba(255,255,255,0.20); }
.btn-relatorio-ai:hover { box-shadow:0 6px 20px rgba(77,138,155,0.50), 0 3px 8px rgba(156,111,140,0.34), inset 0 1px 0 rgba(255,255,255,0.24); }
.btn-relatorio-ai:active { transform:scale(.96); }
.btn-relatorio-ai-star { position:absolute; pointer-events:none; color:rgba(255,255,255,0.85); animation:starTwinkle 2.6s ease-in-out infinite; }
.btn-relatorio-ai-star.s1 { top:4px; right:8px; font-size:9px; animation-delay:0s; }
.btn-relatorio-ai-star.s2 { bottom:5px; right:32px; font-size:6px; animation-delay:1.0s; opacity:.6; }
.btn-relatorio-ai-star.s3 { top:7px; right:54px; font-size:5px; animation-delay:1.8s; opacity:.5; }
@keyframes starTwinkle { 0%, 100% { opacity:.3; transform:scale(.7); } 50% { opacity:1; transform:scale(1.15); } }
.btn-relatorio-ai-iconwrap { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:rgba(255,255,255,0.22); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16); }
.btn-relatorio-ai-iconwrap svg { width:12px; height:12px; }
.btn-relatorio-ai-text { position:relative; z-index:1; display:flex; flex-direction:column; align-items:flex-start; line-height:1.05; }
.btn-relatorio-ai-title { font-size:12px; font-weight:700; }
.btn-relatorio-ai-sub { font-size:8px; font-weight:600; letter-spacing:1.4px; text-transform:uppercase; opacity:.82; margin-top:2px; display:inline-flex; align-items:center; gap:3px; }
.btn-relatorio-ai-sub::before { content:'✦'; font-size:7px; opacity:.85; }

/* APP SHELL */
#app { display:none; flex-direction:column; height:100vh; }
.app-header { background:#fff; padding:12px 16px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:100; }
.app-header-brand { display:flex; align-items:center; }
.app-header-logo { height:30px; width:auto; display:block; transform:scale(1.4); transform-origin:left center; }
.hdr-right { display:flex; align-items:center; gap:8px; }
.badge-role { font-size:11px; padding:4px 10px; border-radius:20px; font-weight:700; letter-spacing:.2px; }
.badge-admin { background:var(--primary-light); color:var(--primary-dark); }
.badge-viewer { background:#E8F5EE; color:#1E7A4A; }

/* BOTTOM NAV */
.bottom-nav { --nav-x:0px; background:rgba(255,255,255,.72); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); display:flex; position:fixed; bottom:calc(12px + env(safe-area-inset-bottom)); left:12px; right:12px; z-index:100; padding:5px 4px; border-radius:22px; box-shadow:0 8px 32px rgba(26,43,53,.16), 0 2px 8px rgba(26,43,53,.09); transform:translateX(var(--nav-x)); transition:transform .3s cubic-bezier(.4,0,.2,1); }
.bottom-nav.nav-oculta { transform:translateX(var(--nav-x)) translateY(calc(100% + 20px)); }
.nav-item { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:5px 2px; cursor:pointer; border:none; background:none; color:var(--text-sec); gap:2px; transition:background .2s; border-radius:16px; min-height:44px; -webkit-tap-highlight-color:transparent; }
.nav-item .ni { display:flex; align-items:center; justify-content:center; transition:transform .2s; }
.nav-item .ni svg { width:21px; height:21px; flex-shrink:0; stroke:var(--text-sec); transition:stroke .22s; }
.nav-item > span:not(.ni) { font-size:0; font-weight:700; overflow:hidden; max-height:0; transition:font-size .2s, max-height .2s; white-space:nowrap; font-family:'DM Sans',sans-serif; }
.nav-item.active { background:var(--primary-light); color:var(--primary-dark); }
.nav-item.active .ni svg { stroke:var(--primary-dark); }
.nav-item.active > span:not(.ni) { font-size:9px; max-height:12px; }
.nav-item:active .ni { transform:scale(.9); }

/* CONTENT */
.app-content { flex:1; overflow-y:auto; padding:16px 14px calc(96px + env(safe-area-inset-bottom)); }
.tab-pane { display:none; }
.tab-pane.active { display:block; }

/* CARDS */
.card { background:#fff; border-radius:var(--r); box-shadow:var(--shadow); padding:16px; margin-bottom:12px; }
.card-title { font-size:11px; font-weight:700; color:var(--text-sec); text-transform:uppercase; letter-spacing:.6px; margin-bottom:8px; }
.stat-val { font-size:22px; font-weight:800; letter-spacing:-.5px; }
.stat-val.green { color:var(--success); }
.stat-val.red { color:var(--danger); }
.stat-val.orange { color:var(--warning); }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; }

/* SECTION HEADER */
.sec-hdr { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.sec-title { font-family:'Cormorant Garamond',serif; font-size:27px; font-weight:300; font-style:italic; letter-spacing:-.2px; color:var(--text); position:relative; line-height:1.1; padding-bottom:6px; }
.sec-title::after { content:''; position:absolute; left:0; bottom:0; width:24px; height:2px; background:linear-gradient(90deg, var(--primary), var(--accent)); border-radius:2px; }

/* SEARCH */
.search-wrap { margin-bottom:12px; position:relative; }
.search-input { width:100%; padding:11px 14px 11px 40px; border:1.5px solid var(--border); border-radius:14px; font-size:15px; background:#fff; transition:border-color .2s, box-shadow .2s; box-shadow:0 1px 4px rgba(26,43,53,0.05); }
.search-input:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(117,169,179,0.15); }
.search-wrap::before { content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%236B7F8A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E"); position:absolute; left:13px; top:50%; transform:translateY(-50%); display:block; line-height:0; pointer-events:none; }

/* FILTER TABS */
.ftabs { display:flex; gap:7px; overflow-x:auto; margin-bottom:12px; padding-bottom:2px; scrollbar-width:none; }
.ftabs::-webkit-scrollbar { display:none; }
.ftab { padding:7px 16px; border-radius:20px; font-size:13px; font-weight:600; border:none; cursor:pointer; white-space:nowrap; background:#fff; color:var(--text-sec); transition:all .15s; box-shadow:var(--shadow); }
.ftab.active { background:var(--primary); color:#fff; box-shadow:0 2px 10px rgba(117,169,179,0.32); }

/* PAINEL DE FILTROS */
.btn-filtros-prod { display:flex;align-items:center;gap:5px;padding:10px 14px;border-radius:14px;background:#fff;border:1.5px solid var(--border);font-size:13px;font-weight:600;color:var(--text-sec);cursor:pointer;box-shadow:var(--shadow);-webkit-tap-highlight-color:transparent;white-space:nowrap;transition:all .2s;flex-shrink:0; }
.btn-filtros-prod.ativo { border-color:var(--primary);color:var(--primary);background:rgba(117,169,179,0.07); }
.filtros-badge { background:var(--primary);color:#fff;border-radius:10px;font-size:10px;font-weight:700;padding:1px 6px;margin-left:2px;line-height:1.4; }
.painel-filtros { background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:14px 15px 10px;margin-bottom:12px;box-shadow:var(--shadow); }
.filtro-secao-label { font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--text-sec);margin-bottom:8px; }
.filtro-chips { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px; }
.fchip { display:inline-flex;align-items:center;padding:5px 13px;border-radius:16px;font-size:12px;font-weight:600;border:1.5px solid var(--border);background:#fff;color:var(--text-sec);cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:all .15s;box-shadow:0 1px 3px rgba(26,43,53,0.06); }
.fchip:active { transform:scale(.95); }
.fchip.ativo { background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 8px rgba(117,169,179,0.32); }
.fchip.ativo-argila-flocos { background:rgba(117,169,179,0.15);color:var(--primary);border-color:var(--primary); }
.fchip.ativo-argila-fendi { background:rgba(186,156,125,0.15);color:var(--accent-dark);border-color:var(--accent); }
.filtro-limpar { display:flex;justify-content:flex-end;border-top:1px solid var(--border);padding-top:10px;margin-top:2px; }
.filtro-limpar button { background:none;border:none;font-size:12px;font-weight:600;color:var(--danger);cursor:pointer;padding:4px 0;-webkit-tap-highlight-color:transparent; }


/* RELATÓRIOS PILLS */
.rel-pills { display:flex; gap:7px; margin-bottom:16px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.rel-pills::-webkit-scrollbar { display:none; }
.rel-pill { display:inline-flex; align-items:center; padding:8px 16px; border-radius:20px; font-size:13px; font-weight:600; border:1.5px solid var(--border); cursor:pointer; background:#fff; color:var(--text-sec); white-space:nowrap; transition:all .18s; -webkit-tap-highlight-color:transparent; box-shadow:0 1px 4px rgba(26,43,53,0.05); }
.rel-pill.active { background:var(--primary-dark); color:#fff; border-color:var(--primary-dark); box-shadow:0 3px 14px rgba(78,142,154,0.35); }
.rel-pill:active { transform:scale(.96); }

/* FINANCEIRO — CONTROLE SEGMENTADO */
/* grid-auto-flow:column distribui as colunas pelo NÚMERO de botões. Antes era
   repeat(3,1fr) fixo, então um seletor de 2 opções deixava a 3ª coluna vazia. */
.fin-segs { display:grid; grid-auto-flow:column; grid-auto-columns:1fr; background:var(--bg); border-radius:16px; padding:4px; gap:3px; margin-bottom:16px; border:1.5px solid var(--border); }
/* Com 2 opções sobra largura: ícone e rótulo lado a lado ficam mais
   equilibrados do que empilhados, e o texto pode crescer um pouco. */
.fin-segs.duas .fin-seg { flex-direction:row; gap:7px; font-size:12.5px; padding:11px 4px; }
.fin-segs.duas .fin-seg svg { width:17px; height:17px; }
.fin-seg { display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px 4px 9px; border:none; border-radius:12px; cursor:pointer; background:transparent; color:var(--text-sec); font-size:10.5px; font-weight:600; transition:all .22s; line-height:1; letter-spacing:.1px; -webkit-tap-highlight-color:transparent; }
.fin-seg svg { width:19px; height:19px; transition:stroke .22s; }
.fin-seg.active { background:#fff; color:var(--primary-dark); box-shadow:0 2px 10px rgba(26,43,53,0.1); }
.fin-seg:active { transform:scale(.94); }

/* LIST ITEMS */
.li { background:#fff; border-radius:var(--r); box-shadow:var(--shadow); padding:14px 15px; margin-bottom:9px; display:flex; align-items:flex-start; gap:10px; transition:box-shadow .15s; }
.li:active { box-shadow:var(--shadow-md); }
.li-main { flex:1; min-width:0; }
.li-title { font-weight:700; font-size:15px; letter-spacing:-.1px; }
.li-sub { font-size:12px; color:var(--text-sec); margin-top:3px; }
.li-actions { display:flex; gap:5px; align-items:center; flex-shrink:0; }

/* PRODUCT GRID */
.prod-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:12px; }
.prod-card { background:#fff; border-radius:var(--r); box-shadow:var(--shadow); border:1px solid rgba(220,232,234,0.6); overflow:hidden; cursor:pointer; transition:box-shadow .18s, transform .18s; }
.prod-card:active { transform:scale(.98); box-shadow:var(--shadow-md); }
.prod-img { width:100%; aspect-ratio:1; object-fit:cover; background:var(--bg); display:block; }
.prod-img-ph { width:100%; aspect-ratio:1; background:var(--bg); display:flex; align-items:center; justify-content:center; }
.prod-img-ph::after { content:'M'; font-family:'Cormorant Garamond',serif; font-size:52px; font-weight:300; font-style:italic; color:var(--primary); opacity:.35; }
.prod-info { padding:11px 10px 10px; }
.prod-name { font-size:13.5px; font-weight:600; line-height:1.3; margin-bottom:3px; letter-spacing:-.2px; }
.prod-price { font-size:14px; font-weight:800; color:var(--primary-dark); letter-spacing:-.3px; }
.prod-sub { font-size:11px; color:var(--text-sec); margin-bottom:5px; letter-spacing:.1px; }

/* BADGES */
.badge { display:inline-flex; align-items:center; padding:3px 8px; border-radius:20px; font-size:11px; font-weight:700; }
.badge-unico { background:#F0E8FF; color:#6B21A8; }
.badge-out { background:#FEE8E8; color:#B91C1C; }
.badge-ok { background:#E6F7EE; color:#166534; }
.badge-warn { background:#FEF3CD; color:#92400E; }

/* MODALS */
.modal-overlay { position:fixed; inset:0; background:rgba(15,30,40,.55); backdrop-filter:blur(2px); z-index:200; display:flex; align-items:flex-end; justify-content:center; }
.modal-overlay.hidden { display:none; }
.modal { background:#fff; border-radius:24px 24px 0 0; width:100%; max-width:600px; max-height:var(--modal-max-h,92vh); overflow-y:auto; padding:20px 18px calc(20px + env(safe-area-inset-bottom)); }
.modal-handle { width:40px; height:4px; background:var(--border); border-radius:2px; margin:0 auto 16px; }
.modal-title { font-size:20px; font-weight:700; margin-bottom:18px; letter-spacing:-.3px; color:var(--text); }
.modal-footer { display:flex; gap:10px; margin-top:18px; }
.modal-footer .btn { flex:1; }

/* AJUSTES — accordion (cards colapsáveis) */
.acc-item { background:var(--bg); border:1.5px solid var(--border); border-radius:14px; overflow:hidden; margin-bottom:10px; }
.acc-hdr { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 15px; background:none; border:none; cursor:pointer; font-size:14px; font-weight:700; color:var(--text); text-align:left; -webkit-tap-highlight-color:transparent; }
.acc-hdr-left { display:flex; align-items:center; gap:8px; }
.acc-hdr-left svg { color:var(--primary); flex-shrink:0; }
.acc-chevron { color:var(--text-sec); transition:transform .2s; flex-shrink:0; }
.acc-item.open .acc-chevron { transform:rotate(180deg); }
.acc-body { display:none; padding:0 15px 15px; }
.acc-item.open .acc-body { display:block; }
.ajuste-sec-desc { font-size:11.5px; color:var(--text-sec); line-height:1.5; margin:2px 0 12px; }
.ajuste-taxas-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.ajuste-taxa-item { display:flex; align-items:center; gap:8px; background:#fff; border:1.5px solid var(--border); border-radius:11px; padding:7px 10px; }
.ajuste-taxa-item label { font-size:13px; font-weight:700; color:var(--text-sec); min-width:34px; margin:0; }
.ajuste-taxa-item input { flex:1; width:100%; border:none; background:transparent; font-size:15px; font-weight:600; color:var(--text); text-align:right; padding:0; -moz-appearance:textfield; }
.ajuste-taxa-item input::-webkit-outer-spin-button,.ajuste-taxa-item input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.ajuste-taxa-item .pct { font-size:13px; color:var(--text-sec); font-weight:600; }
.aj-label { display:block; font-size:12px; font-weight:700; color:var(--text-sec); margin-bottom:6px; }
.aj-textarea { width:100%; border:1.5px solid var(--border); border-radius:11px; background:#fff; padding:10px 12px; font-size:13px; line-height:1.5; color:var(--text); resize:vertical; font-family:inherit; }
.aj-ph { font-size:11px; color:var(--text-sec); margin-top:5px; }
.aj-ph b { color:var(--primary-dark); font-weight:700; }
.aj-chips { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:9px; }
.aj-chip { display:inline-flex; align-items:center; gap:6px; background:#fff; border:1.5px solid var(--border); border-radius:20px; padding:5px 6px 5px 12px; font-size:13px; font-weight:600; color:var(--text); }
.aj-chip button { width:18px; height:18px; border:none; border-radius:50%; background:var(--bg); color:var(--text-sec); font-size:13px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent; }
.aj-chip button:hover { background:var(--danger); color:#fff; }
.aj-vazio { font-size:12px; color:var(--text-sec); font-style:italic; }
.aj-addrow { display:flex; gap:8px; }
.aj-input { flex:1; border:1.5px solid var(--border); border-radius:11px; background:#fff; padding:9px 12px; font-size:14px; color:var(--text); }

/* RODAPÉ DO APP (aba Início) */
.app-rodape { text-align:center; padding:30px 16px 16px; margin-top:8px; }
.app-rodape-orn { display:flex; align-items:center; justify-content:center; gap:10px; color:var(--accent); font-size:11px; margin-bottom:12px; opacity:.65; }
.app-rodape-orn span { height:1px; width:46px; }
.app-rodape-orn span:first-child { background:linear-gradient(90deg,transparent,var(--accent)); }
.app-rodape-orn span:last-child { background:linear-gradient(90deg,var(--accent),transparent); }
.app-rodape-frase { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:14.5px; line-height:1.6; color:var(--primary); }
.app-rodape-frase strong { font-weight:500; font-style:normal; }
.app-rodape-versao { margin-top:9px; font-size:10.5px; letter-spacing:1.2px; color:var(--text-sec); font-weight:600; }

/* QUEIMA STATUS */
.queima-badge { display:inline-flex; align-items:center; padding:3px 9px; border-radius:10px; font-size:11px; font-weight:700; }
.queima-badge.pendente { background:#FEF3CD; color:#92400E; }
.queima-badge.concluida { background:#E6F7EE; color:#166534; }

/* SOCIA TOGGLE */
.socia-toggle { display:flex; background:var(--bg); border-radius:12px; padding:3px; gap:3px; }
.socia-btn { flex:1; padding:11px; border:none; border-radius:9px; font-size:15px; font-weight:600; cursor:pointer; background:transparent; color:var(--text-sec); transition:all .15s; }
.socia-btn.active { background:#fff; color:var(--primary); box-shadow:0 1px 4px rgba(0,0,0,.12); }

/* PHOTO UPLOAD */
.photo-area { width:100%; aspect-ratio:1; border:2px dashed var(--border); border-radius:var(--r); display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; gap:8px; color:var(--text-sec); font-size:14px; overflow:hidden; position:relative; margin-bottom:14px; background:var(--bg); transition:border-color .2s; }
.photo-area:hover { border-color:var(--primary); }
.photo-area img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.photo-ov { position:absolute; inset:0; background:rgba(0,0,0,.4); display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; font-weight:600; opacity:0; transition:opacity .2s; }
.photo-area:hover .photo-ov { opacity:1; }

/* FOTOS EXTRA */
.fotos-extra-wrap { display:flex; gap:8px; flex-wrap:wrap; }
.foto-extra-thumb { position:relative; flex-shrink:0; }
.foto-extra-thumb img { width:72px; height:72px; object-fit:cover; border-radius:9px; display:block; }
.foto-extra-rm { position:absolute; top:-6px; right:-6px; width:22px; height:22px; border-radius:50%; background:var(--danger); color:#fff; border:2px solid #fff; font-size:12px; font-weight:800; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; }
.foto-extra-ed { position:absolute; bottom:4px; right:4px; width:24px; height:24px; border-radius:7px; background:rgba(15,30,40,.72); color:#fff; border:none; padding:0; cursor:pointer; display:flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent; }
.foto-extra-ed.esq { right:auto; left:4px; background:rgba(186,156,125,.92); }

/* EDITOR DE FOTO (enquadrar / zoom / girar) */
#modal-crop { z-index:260; }
.foto-principal-ed { position:absolute; bottom:9px; right:9px; z-index:2; display:inline-flex; align-items:center; gap:5px; padding:8px 13px; border-radius:20px; background:rgba(15,30,40,.74); color:#fff; border:none; font-size:12px; font-weight:700; letter-spacing:-.1px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.foto-principal-ed.esq { right:auto; left:9px; background:rgba(186,156,125,.94); }
.crop-stage { position:relative; width:100%; aspect-ratio:1; background:#16242c; border-radius:var(--r); overflow:hidden; touch-action:none; cursor:grab; user-select:none; -webkit-user-select:none; -webkit-tap-highlight-color:transparent; }
.crop-stage:active { cursor:grabbing; }
.crop-stage img { position:absolute; left:50%; top:50%; max-width:none; pointer-events:none; -webkit-user-drag:none; transform-origin:center center; will-change:transform; }
.crop-guides { position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.20); }
.crop-guides i { position:absolute; background:rgba(255,255,255,.20); }
.crop-guides i.v { top:0; bottom:0; width:1px; }
.crop-guides i.h { left:0; right:0; height:1px; }
.crop-hint { font-size:12px; color:var(--text-sec); text-align:center; margin:-8px 0 12px; line-height:1.45; }
.crop-zoom { display:flex; align-items:center; gap:11px; margin:14px 0 12px; }
.crop-zoom svg { color:var(--text-sec); flex-shrink:0; }
.crop-range { flex:1; -webkit-appearance:none; appearance:none; height:5px; border-radius:3px; background:var(--border); outline:none; }
.crop-range::-webkit-slider-thumb { -webkit-appearance:none; width:26px; height:26px; border-radius:50%; background:var(--primary); border:3px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.24); cursor:pointer; }
.crop-range::-moz-range-thumb { width:22px; height:22px; border-radius:50%; background:var(--primary); border:3px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.24); cursor:pointer; }
.crop-tools { display:flex; gap:8px; }
.crop-tools .btn { flex:1; }

/* PARCELAS */
.parc-item { display:flex; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid var(--border); }
.parc-num { width:28px; height:28px; border-radius:50%; background:var(--bg); border:1.5px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; flex-shrink:0; color:var(--text-sec); }
.parc-num.pago { background:var(--success); color:#fff; border-color:var(--success); }
/* Âmbar = ainda vai cair. Não é atraso: parcela de cartão sempre chega, só não
   chegou ainda. Vermelho fica reservado para dinheiro em risco de verdade
   (Pagamento Pendente), para a cor não perder o significado. */
.parc-num.aguarda { background:var(--warning); color:#fff; border-color:var(--warning); }
.parc-info { flex:1; }
.parc-val { font-weight:800; font-size:14px; }
.parc-data { font-size:12px; color:var(--text-sec); }

/* CART */
.cart-item { display:flex; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--border); }
.qty-ctrl { display:flex; align-items:center; gap:8px; }
.qty-btn { width:30px; height:30px; border-radius:50%; border:1.5px solid var(--border); background:#fff; font-size:17px; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--primary-dark); font-weight:700; transition:all .15s; }
.qty-btn:active { background:var(--primary-light); }
.qty-n { font-size:14px; font-weight:800; min-width:20px; text-align:center; }

/* GRADE DE PRODUTOS (nova venda / troca) */
.pv-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pv-card { border:1.5px solid var(--border); border-radius:13px; overflow:hidden; background:#faf7f4; display:flex; flex-direction:column; }
.pv-card.in-cart { border-color:var(--primary); box-shadow:0 0 0 2px rgba(117,169,179,0.18); }
.pv-foto-wrap { position:relative; }
.pv-foto { width:100%; aspect-ratio:1; object-fit:cover; display:block; }
.pv-foto-ph { width:100%; aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#eef4f5,#e3eef0); }
.pv-foto-ph span { font-family:'Cormorant Garamond',serif; font-size:42px; font-weight:300; font-style:italic; color:#75a9b3; opacity:.45; }
.pv-add-btn { position:absolute; bottom:7px; right:7px; width:26px; height:26px; border-radius:50%; background:var(--primary); border:none; color:#fff; font-size:19px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.22); -webkit-tap-highlight-color:transparent; transition:transform .12s; }
.pv-add-btn:active { transform:scale(.88); }
.pv-badge { position:absolute; top:7px; right:7px; min-width:22px; height:22px; border-radius:11px; background:var(--primary); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; padding:0 5px; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.22); border:2px solid #fff; -webkit-tap-highlight-color:transparent; }
.pv-body { padding:7px 9px 9px; display:flex; flex-direction:column; gap:2px; }
.pv-nome { font-size:13px; font-weight:600; line-height:1.2; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.pv-tam { font-size:10px; font-weight:700; padding:1px 6px; border-radius:20px; background:var(--primary-light); color:var(--primary-dark); border:1px solid #cfe6ea; flex-shrink:0; }
.pv-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; border:1px solid rgba(0,0,0,.12); }
.pv-meta { display:flex; align-items:center; gap:4px; font-size:11px; color:var(--text-sec); flex-wrap:wrap; }

/* DIVIDER */
hr.div { border:none; border-top:1px solid var(--border); margin:12px 0; }

/* EMPTY STATE */
.empty { text-align:center; padding:52px 20px; color:var(--text-sec); }
.empty .ei { font-size:48px; margin-bottom:12px; opacity:.6; }
.empty p { font-size:14px; }

/* TOAST */
#toast { position:fixed; bottom:calc(90px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%) translateY(16px); background:var(--text); color:#fff; padding:12px 20px; border-radius:12px; font-size:14px; font-weight:600; opacity:0; transition:all .3s cubic-bezier(.34,1.56,.64,1); z-index:400; white-space:nowrap; max-width:calc(100vw - 32px); text-align:center; box-shadow:var(--shadow-md); }
#toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
#toast.ok { background:var(--success); }
#toast.err { background:var(--danger); }

/* LOADING */
.loading { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:48px; color:var(--text-sec); gap:14px; font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:300; font-size:14px; }
.spinner { width:64px; height:1.5px; background:var(--border); border-radius:2px; position:relative; overflow:hidden; }
.spinner::after { content:''; position:absolute; inset:0; background:var(--primary); transform:scaleX(0); transform-origin:left; animation:spin 1.8s ease-in-out infinite; }
@keyframes spin { 0%{transform:scaleX(0);opacity:1} 65%{transform:scaleX(1);opacity:1} 85%{transform:scaleX(1);opacity:0} 100%{transform:scaleX(0);opacity:0} }

@media(min-width:600px) {
  .app-content { max-width:600px; left:50%; margin:0 auto; }
  .bottom-nav { left:50%; right:auto; --nav-x:-50%; width:calc(600px - 24px); }
}