/* ── Rotter — Painel da Loja ──────────────────────────────
   Mesma identidade do app do entregador (dark + #ff5a31),
   mobile-first mas confortavel no PC do balcao. */

/* ── Reset + base ─────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;
  background:#0a0a0f;color:#e8e9ed;line-height:1.45;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  min-height:100vh;min-height:100dvh;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
a{color:inherit;text-decoration:none;}
.link{color:#ff5a31;font-weight:600;}
h1,h2,h3{line-height:1.2;font-weight:800;letter-spacing:-0.02em;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,select{font-family:inherit;font-size:16px;}
:focus-visible{outline:2px solid #ff5a31;outline-offset:2px;border-radius:6px;}
.muted{color:#888;font-weight:400;}
.small{font-size:13px;}
[hidden]{display:none !important;}

.tela{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;}

/* ── Login ─────────────────────────────────────────────── */
.login-wrap{
  flex:1;display:flex;flex-direction:column;justify-content:center;
  padding:40px 24px;max-width:420px;margin:0 auto;width:100%;
}
.logo-grande{font-size:32px;letter-spacing:-0.02em;margin-bottom:48px;text-align:center;}
.logo-grande b{color:#ff5a31;}
.login-wrap h1{font-size:32px;margin-bottom:8px;}
.login-wrap p{color:#b8bac3;margin-bottom:32px;}
.login-wrap label{display:block;font-size:14px;color:#b8bac3;margin-bottom:8px;font-weight:600;}
.login-wrap input{
  width:100%;padding:16px 18px;font-size:17px;
  background:#13131c;border:1.5px solid #2a2a3a;border-radius:12px;
  color:#fff;margin-bottom:16px;
  transition:border-color .15s;
}
.login-wrap input:focus{outline:none;border-color:#ff5a31;}
.login-wrap button{
  width:100%;padding:16px;font-size:16px;font-weight:700;
  background:#ff5a31;color:#fff;border-radius:12px;
  transition:transform .1s,background .15s;
}
.login-wrap button:active{transform:scale(.98);}
.login-wrap button:disabled{background:#3a3a45;color:#888;}
.login-wrap .small{margin-top:32px;text-align:center;}
#msg-login{margin-top:12px;font-size:14px;min-height:20px;}
.err{color:#ff5a31;}
.ok-msg{color:#4ade80;}

/* ── App bar ──────────────────────────────────────────── */
.appbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;background:#0d0d14;border-bottom:1px solid #1a1a24;
  position:sticky;top:0;z-index:40;
}
.appbar-loja{font-size:11px;color:#888;font-weight:600;letter-spacing:.04em;text-transform:uppercase;}
.appbar-nome{font-size:16px;font-weight:700;}
.appbar-acoes{display:flex;align-items:center;gap:10px;}
.chip-chuva{
  font-size:12px;font-weight:700;color:#7dd3fc;
  background:#0c2a3f;border:1px solid #155e89;border-radius:20px;
  padding:5px 12px;white-space:nowrap;
}
.btn-icon{
  width:40px;height:40px;border-radius:10px;
  background:#1a1a24;font-size:18px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
}
.btn-icon:active{background:#252535;}

/* ── Tabs ─────────────────────────────────────────────── */
.tabs{
  display:flex;gap:4px;padding:8px 12px;
  background:#0d0d14;border-bottom:1px solid #1a1a24;
  position:sticky;top:69px;z-index:39;
  overflow-x:auto;scrollbar-width:none;
}
.tabs::-webkit-scrollbar{display:none;}
.tab{
  padding:9px 14px;border-radius:10px;font-size:14px;font-weight:600;
  color:#b8bac3;white-space:nowrap;flex:0 0 auto;
  transition:background .15s,color .15s;
}
.tab:hover{background:#13131c;}
.tab.ativo{background:#1f1209;color:#ff5a31;}

.conteudo{flex:1;padding:16px;width:100%;max-width:1200px;margin:0 auto;}

/* ── Board de entregas ────────────────────────────────── */
.board{display:flex;flex-direction:column;gap:24px;}
.coluna h2{
  font-size:13px;text-transform:uppercase;letter-spacing:.06em;
  color:#888;font-weight:700;margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}
.cnt{
  background:#1a1a24;color:#b8bac3;border-radius:10px;
  font-size:11px;padding:2px 8px;font-weight:700;
}
.lista{display:flex;flex-direction:column;gap:10px;}

.card-entrega{
  background:#13131c;border:1px solid #1f1f2c;border-radius:14px;
  padding:14px 16px;
}
.card-entrega.pendente{border-left:3px solid #fbbf24;}
.card-entrega.andamento{border-left:3px solid #ff5a31;}
.ce-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.ce-cliente{font-weight:700;font-size:15px;}
.ce-pedido{font-size:12px;color:#888;font-weight:600;}
.ce-taxa{font-size:16px;font-weight:800;color:#4ade80;flex:0 0 auto;}
.ce-end{font-size:13px;color:#888;margin-top:2px;overflow:hidden;text-overflow:ellipsis;}
.ce-mb{
  font-size:13px;color:#fdba74;margin-top:6px;font-weight:600;
  display:flex;align-items:center;gap:6px;
}
.ce-mb .status-pill{
  font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;
  background:#1f1209;color:#ff5a31;border-radius:8px;padding:2px 7px;
}
.ce-mb .pill-liberada{background:#0f3a26;color:#4ade80;}

/* ── Codigo de entrega (cliente -> motoboy) ───────────── */
.ce-codigo{font-size:13px;color:#fbbf24;margin-top:6px;font-weight:600;}
.ce-codigo b{letter-spacing:.12em;font-size:14px;}

/* ── Pedido de liberacao sem codigo ───────────────────── */
.card-entrega.lib-pendente{
  border-color:#b45309;border-left-color:#fbbf24;
  box-shadow:0 0 0 1px rgba(251,191,36,.25),0 8px 24px -12px rgba(251,191,36,.35);
}
.ce-liberacao{
  display:flex;flex-direction:column;gap:8px;
  background:#2a1c06;border:1px solid #b45309;border-radius:10px;
  padding:10px 12px;margin-top:10px;font-size:13px;color:#fdba74;
}
.ce-liberacao .btn-liberar{
  background:#b45309;border-color:#d97706;color:#fff;width:100%;
}
.ce-liberacao .btn-liberar:hover{background:#d97706;}
.ce-liberacao .btn-liberar:disabled{opacity:.6;}
.ce-rodape{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:10px;gap:10px;
}
.ce-acoes{display:flex;gap:8px;align-items:center;}
.ce-tempo{font-size:12px;color:#888;}
.btn-mini{
  font-size:12px;font-weight:700;padding:7px 12px;border-radius:8px;
  background:#1a1a24;border:1px solid #2a2a3a;color:#b8bac3;
}
.btn-mini:active{transform:scale(.96);}
.btn-mini.perigo{background:#3a0f14;border-color:#7f1d1d;color:#fca5a5;}
.btn-mini.perigo:hover{background:#4d1319;}
a.btn-mini{display:inline-flex;align-items:center;}

.item-mini{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:10px 14px;background:#0f0f17;border-radius:10px;font-size:13px;
}
.item-mini-cliente{color:#b8bac3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.item-mini-extra{color:#666;font-size:12px;flex:0 0 auto;}
.item-mini-taxa{color:#4ade80;font-weight:700;flex:0 0 auto;}
.nota-canceladas{margin-top:10px;font-size:12px;color:#fca5a5;opacity:.8;}

.vazio{text-align:center;padding:32px 20px;background:#0f0f17;border-radius:14px;}
.vazio-emoji{font-size:40px;margin-bottom:10px;opacity:.5;}
.vazio p{color:#888;margin-bottom:4px;font-size:14px;}

/* ── Forms ────────────────────────────────────────────── */
.card-form{
  background:#13131c;border:1px solid #1f1f2c;border-radius:16px;
  padding:18px;margin-bottom:16px;max-width:680px;
}
.campos-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:14px;}
@media (min-width:560px){.campos-grid{grid-template-columns:1fr 1fr;}}
.campo label,.card-form > label{
  display:block;font-size:13px;color:#b8bac3;margin-bottom:6px;font-weight:600;
}
.campo input,.card-form input{
  width:100%;padding:12px 14px;font-size:15px;
  background:#0f0f17;border:1.5px solid #2a2a3a;border-radius:10px;
  color:#fff;transition:border-color .15s;
}
.campo input:focus,.card-form input:focus{outline:none;border-color:#ff5a31;}
#msg-nova,#msg-mb,#msg-config{margin-top:10px;font-size:14px;min-height:18px;}

/* ── Busca + mapa ─────────────────────────────────────── */
.busca-row{display:flex;gap:8px;margin-bottom:8px;}
.busca-row input{flex:1;}
.busca-row .btn{flex:0 0 auto;}
.busca-resultados{
  background:#0f0f17;border:1px solid #2a2a3a;border-radius:10px;
  margin-bottom:8px;overflow:hidden;
}
.busca-item{
  display:block;width:100%;text-align:left;
  padding:11px 14px;font-size:13px;color:#b8bac3;
  border-bottom:1px solid #1a1a24;
}
.busca-item:last-child{border-bottom:none;}
.busca-item:hover{background:#1a1a24;color:#fff;}
.busca-vazio{padding:11px 14px;font-size:13px;color:#888;}
#mapa{
  height:300px;border-radius:12px;border:1px solid #2a2a3a;
  margin-bottom:6px;background:#0f0f17;z-index:1;
}
@media (min-width:900px){#mapa{height:380px;}}
.mapa-dica{margin-bottom:12px;}
.coords{margin:10px 0 14px;}
.coords.tem{color:#4ade80;font-weight:600;}

/* ── Botoes ───────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:12px 16px;border-radius:10px;font-weight:700;font-size:14px;
  text-align:center;transition:transform .1s,background .15s;
}
.btn:active{transform:scale(.97);}
.btn:disabled{background:#3a3a45 !important;color:#888 !important;cursor:default;}
.btn-primario{background:#ff5a31;color:#fff;}
.btn-primario:hover{background:#ff6f4d;}
.btn-secundario{background:#1a1a24;color:#e8e9ed;border:1.5px solid #2a2a3a;}
.btn-grande{padding:16px;font-size:16px;width:100%;}

/* ── Motoboys ─────────────────────────────────────────── */
.card-mb{
  background:#13131c;border:1px solid #1f1f2c;border-radius:14px;
  padding:14px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px;
}
.card-mb.inativo{opacity:.55;}
.mb-info{flex:1;min-width:0;}
.mb-nome{font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.badge{
  font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;
  border-radius:8px;padding:2px 8px;
}
.badge.on{background:#0f3a26;color:#4ade80;}
.badge.off{background:#2a2a3a;color:#888;}
.mb-tel{font-size:13px;color:#888;margin-top:2px;}
.mb-visto{font-size:12px;color:#666;margin-top:2px;}
#lista-motoboys{max-width:680px;}

/* ── Resumo ───────────────────────────────────────────── */
.resumo-cards{display:grid;grid-template-columns:1fr;gap:12px;}
@media (min-width:560px){.resumo-cards{grid-template-columns:repeat(3,1fr);}}
.resumo-card{
  background:#13131c;border:1px solid #1f1f2c;border-radius:16px;
  padding:18px;display:flex;flex-direction:column;gap:4px;
}
.resumo-label{font-size:12px;color:#888;text-transform:uppercase;letter-spacing:.05em;font-weight:700;}
.resumo-num{font-size:34px;font-weight:800;letter-spacing:-0.02em;}
.resumo-num small{font-size:14px;color:#888;font-weight:600;}
.resumo-taxa{font-size:15px;color:#4ade80;font-weight:700;min-height:22px;}
.resumo-nota{margin:12px 2px 24px;}
.resumo-mb-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-bottom:12px;flex-wrap:wrap;
}
.resumo-mb h2{font-size:15px;}
.chips{display:flex;gap:6px;}
.chip{
  font-size:12px;font-weight:700;padding:6px 12px;border-radius:16px;
  background:#1a1a24;color:#b8bac3;border:1px solid #2a2a3a;
}
.chip.ativo{background:#1f1209;color:#ff5a31;border-color:#ff5a31;}
.lista-mini{display:flex;flex-direction:column;gap:6px;max-width:680px;}
.vazio-mini{font-size:13px;padding:14px;text-align:center;color:#888;background:#0f0f17;border-radius:10px;}

/* ── Config ───────────────────────────────────────────── */
.chuva-card{margin-bottom:16px;}
.chuva-row{display:flex;justify-content:space-between;align-items:center;gap:16px;}
.chuva-row b{font-size:16px;}
.chuva-row p{margin-top:4px;max-width:440px;}
.switch{
  width:54px;height:32px;border-radius:16px;background:#2a2a3a;
  position:relative;flex:0 0 auto;transition:background .2s;
}
.switch .knob{
  position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;
  background:#888;transition:left .2s,background .2s;
}
.switch[aria-checked="true"]{background:#155e89;}
.switch[aria-checked="true"] .knob{left:25px;background:#7dd3fc;}
.switch:disabled{opacity:.5;}

/* ── Toast ────────────────────────────────────────────── */
.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);
  background:#1a1a24;border:1px solid #2a2a3a;color:#fff;
  padding:12px 20px;border-radius:24px;font-size:14px;font-weight:600;
  box-shadow:0 12px 30px -8px rgba(0,0,0,0.6);
  z-index:200;max-width:calc(100vw - 32px);text-align:center;
  animation:slideToast .25s cubic-bezier(.2,.9,.3,1.2);
}
@keyframes slideToast{from{opacity:0;transform:translateX(-50%) translateY(20px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
.toast.sucesso{border-color:#16a34a;background:#0f3a26;color:#4ade80;}
.toast.erro{border-color:#7f1d1d;background:#3a0f14;color:#fca5a5;}

/* ── Live dot ─────────────────────────────────────────── */
.live-dot{
  display:inline-block;width:6px;height:6px;border-radius:50%;
  background:#4ade80;vertical-align:middle;
  animation:pulse 1.5s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(1.3);}}

/* ── Desktop: board vira 3 colunas ────────────────────── */
@media (min-width:900px){
  .board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start;}
  .conteudo{padding:24px;}
}
