:root{
  --red:#E30613; --red-d:#B8040F; --orange:#F7931E; --orange-l:#FFB347;
  --ink:#2A1714; --muted:#7A6560; --line:#F0E2DC; --bg:#FFF8F4; --card:#fff;
  --ok:#1E8E4E; --ok-bg:#E6F6EC; --warn:#B56A00; --warn-bg:#FFF2DC; --err:#C2121C; --err-bg:#FDE8E8;
  --grad:linear-gradient(120deg,var(--red) 0%,#EE4A17 55%,var(--orange) 100%);
  --r:14px; --sh:0 6px 22px rgba(150,40,20,.08);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:var(--red)}
h1{font-size:1.45rem;margin:.2em 0 .5em}
h2{font-size:1.15rem;margin:1.4em 0 .6em}
h3{font-size:1rem;margin:1em 0 .4em}
.muted{color:var(--muted)} .small{font-size:.85rem} .nowrap{white-space:nowrap}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* topo */
.topbar{background:var(--grad);color:#fff;box-shadow:0 2px 12px rgba(180,20,10,.25)}
.topbar-in{max-width:1180px;margin:0 auto;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.logo{height:40px;width:auto;display:block}
.pc-logo{display:flex;align-items:center;gap:9px;color:#fff;line-height:1}
.pc-ico{width:40px;height:40px;flex:0 0 auto;filter:drop-shadow(0 2px 4px rgba(120,0,0,.25))}
.pc-txt{font-size:1.5rem;font-weight:500;letter-spacing:-.6px}
.pc-txt b{font-weight:900;margin-left:2px}
body.terminal .pc-ico{width:48px;height:48px} body.terminal .pc-txt{font-size:1.8rem}
.brand-sub{font-weight:700;font-size:.95rem;opacity:.95;border-left:2px solid rgba(255,255,255,.5);padding-left:12px;text-transform:uppercase;letter-spacing:.06em}
.who{display:flex;gap:12px;align-items:center;font-size:.9rem}
.who a{color:#fff;font-weight:700;background:rgba(255,255,255,.18);padding:5px 12px;border-radius:999px;text-decoration:none}
.nav{max-width:1180px;margin:0 auto;padding:0 12px 8px;display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.nav a{color:#fff;text-decoration:none;font-weight:600;padding:6px 12px;border-radius:999px;font-size:.92rem}
.nav a.on,.nav a:hover{background:rgba(255,255,255,.22)}
.nav-sep{color:#fff;opacity:.85;font-size:.85rem;margin-left:10px;font-weight:700}

.wrap{max-width:1180px;margin:0 auto;padding:22px 18px 40px}
.wrap.narrow{max-width:480px}
.foot{text-align:center;color:var(--muted);font-size:.8rem;padding:10px 0 30px}

.card{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);padding:20px;margin-bottom:18px;border:1px solid var(--line)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.row>*{flex:1 1 160px}
.head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}

/* forms */
.form label{display:block;font-weight:600;font-size:.9rem;margin-bottom:12px}
input,select,textarea{width:100%;font:inherit;padding:11px 12px;border:1.5px solid #E8D5CD;border-radius:10px;background:#fff;color:var(--ink);margin-top:5px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(247,147,30,.2)}
input[type=checkbox]{width:auto;margin:0 6px 0 0;vertical-align:middle}
.check{font-weight:500!important;display:flex!important;align-items:center}
.hint{display:block;font-weight:400;color:var(--muted);font-size:.8rem;margin-top:3px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-weight:700;border:0;border-radius:10px;padding:10px 16px;cursor:pointer;text-decoration:none;background:#F4E6E0;color:var(--ink);white-space:nowrap}
.btn:hover{filter:brightness(.97)}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 4px 14px rgba(227,6,19,.28)}
.btn-danger{background:var(--err-bg);color:var(--err)}
.btn-sm{padding:6px 10px;font-size:.85rem;border-radius:8px}
.btn-block{width:100%;padding:14px;font-size:1.05rem}
.inline{display:inline}

.alert{padding:12px 14px;border-radius:10px;margin-bottom:14px;font-weight:600}
.alert-ok{background:var(--ok-bg);color:var(--ok)}
.alert-erro{background:var(--err-bg);color:var(--err)}
.alert-aviso{background:var(--warn-bg);color:var(--warn)}

.tag{display:inline-block;white-space:nowrap;padding:2px 9px;border-radius:999px;font-size:.78rem;font-weight:700;background:#F4E6E0;color:var(--ink);margin:1px 2px 1px 0}
.tag-ok{background:var(--ok-bg);color:var(--ok)} .tag-warn{background:var(--warn-bg);color:var(--warn)}
.tag-err{background:var(--err-bg);color:var(--err)} .tag-info{background:#FFF0E0;color:#B25400}

/* tabelas */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:#FFF4EE}
tr.fds td{background:#FFFBF8} tr.anulado td{color:#aaa;text-decoration:line-through}
td.num,th.num{text-align:right;white-space:nowrap}
.pos{color:var(--ok);font-weight:700} .neg{color:var(--err);font-weight:700}
.thumb{width:44px;height:44px;object-fit:cover;border-radius:8px;vertical-align:middle}
.copy{display:flex;gap:6px}.copy input{margin:0;font-size:.85rem}

.stat{display:flex;flex-direction:column;gap:2px}
.stat b{font-size:1.6rem}

/* ====== tela de login ====== */
body.login{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;
  background:linear-gradient(90deg,rgba(25,8,4,.15) 0%,rgba(25,8,4,.25) 45%,rgba(25,8,4,.4) 100%),url(login-bg.jpg) center/cover no-repeat fixed #2A1714}
body.login .topbar{background:linear-gradient(120deg,rgba(227,6,19,.92),rgba(238,74,23,.9) 55%,rgba(247,147,30,.88));backdrop-filter:blur(4px)}
body.login .wrap{flex:1;display:flex;align-items:center;justify-content:center;width:100%;max-width:none;padding:24px 16px}
body.login .card{width:100%;max-width:420px;margin:0;background:rgba(255,255,255,.96);box-shadow:0 24px 60px rgba(20,5,0,.45);border:0;padding:28px}
@media (min-width:1000px){ body.login .wrap{padding-left:24vw} }
@media (max-width:700px){
  body.login{background:linear-gradient(rgba(25,8,4,.45),rgba(25,8,4,.45)),url(login-bg-m.jpg) 72% center/cover no-repeat #2A1714}
}

/* ====== tela do funcionário ====== */
body.simples .wrap{padding-top:18px}
.hello{font-size:1.25rem;font-weight:800;margin:0 0 4px}
.tipos{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 16px}
.tipos label{margin:0;position:relative}
.tipos input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;margin:0;left:0;top:0}
.tipos span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:64px;border:2px solid #EAD6CE;border-radius:12px;font-weight:800;background:#fff;padding:8px;cursor:pointer}
.tipos input:checked+span{border-color:var(--red);background:#FFF0EC;color:var(--red);box-shadow:0 0 0 3px rgba(227,6,19,.12)}
.tipos input:disabled+span{opacity:.35;cursor:not-allowed}
.pin{font-size:1.6rem;letter-spacing:.5em;text-align:center}
.selfie-box{border:2px dashed #EAD6CE;border-radius:12px;padding:14px;text-align:center;margin-bottom:14px;background:#fff}
.selfie-box img{max-width:160px;border-radius:12px;display:block;margin:0 auto 8px}
.selfie-box .btn{width:100%}
.ok-big{text-align:center}
.ok-big .check-ico{width:84px;height:84px;border-radius:50%;background:var(--ok);color:#fff;font-size:48px;line-height:84px;margin:6px auto 12px}
.ok-big .hora{font-size:2.6rem;font-weight:900;letter-spacing:-1px}
.timer{font-size:.85rem;color:var(--muted);text-align:center;margin-top:8px}

/* ====== terminal (tablet/TV na loja) ====== */
body.terminal{background:var(--grad);min-height:100vh;color:#fff;overflow:hidden}
body.terminal .topbar{background:transparent;box-shadow:none}
.term{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - 70px);padding:10px 16px 20px;text-align:center}
.term-loja{font-size:clamp(1.2rem,3.2vw,2rem);font-weight:800;margin:0 0 4px}
.term-relogio{font-size:clamp(2.6rem,9vw,5.5rem);font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-2px;line-height:1}
.term-data{opacity:.9;margin-bottom:14px;font-weight:600}
.qr-box{background:#fff;border-radius:22px;padding:18px;box-shadow:0 18px 50px rgba(80,0,0,.35);position:relative}
#qr{width:min(62vh,78vw,460px);height:min(62vh,78vw,460px)}
#qr svg,#qr img{width:100%;height:100%;display:block}
.qr-bar{height:8px;border-radius:99px;background:#F3E3DC;margin-top:12px;overflow:hidden}
.qr-bar i{display:block;height:100%;background:var(--grad);width:100%;transition:width 1s linear}
.qr-cnt{color:var(--ink);font-weight:800;margin-top:8px;font-size:.95rem}
.term-inst{margin-top:14px;font-weight:700;font-size:1.05rem}
.term-ult{margin-top:14px;font-size:.92rem;opacity:.95;min-height:1.4em}
.term-off{background:rgba(0,0,0,.25);padding:6px 14px;border-radius:99px;font-weight:700;display:none;margin-top:10px}
@media (orientation:landscape) and (min-width:900px){
  .term{flex-direction:row;gap:56px}
  .term-info{text-align:left;max-width:420px}
}

/* impressão (espelho de ponto) */
.only-print{display:none}
@media print{
  .topbar,.foot,.no-print,.btn{display:none!important}
  .only-print{display:block}
  body{background:#fff;font-size:11px}
  .wrap{padding:0;max-width:none}
  .card{box-shadow:none;border:0;padding:0;margin:0 0 10px;page-break-inside:avoid}
  .func-bloco{page-break-after:always}
  th{background:#eee!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  th,td{padding:4px 5px}
  .assin{margin-top:40px;display:flex;gap:40px}
  .assin div{flex:1;border-top:1px solid #000;text-align:center;padding-top:4px}
}
@media (max-width:600px){
  .brand-sub{display:none}
  .pc-ico{width:34px;height:34px} .pc-txt{font-size:1.3rem}
  .wrap{padding:16px 12px 30px}
  .card{padding:16px}
}
