/* =====================================================================
   ECO SOCIAL — sistema de rastreamento
   Mesmos tokens do site institucional
   ===================================================================== */
:root{
  --abyss:#081e06; --forest:#0c330b; --moss:#5a6805;
  --oil:#ff6c08; --cream:#ffe6da; --water:#5ac9b4; --ink:#0a1a06;
  --cream-dim:rgba(255,230,218,.64);
  --cream-faint:rgba(255,230,218,.36);
  --line:rgba(255,230,218,.15);
  --line-soft:rgba(255,230,218,.08);
  --ok:#7bc47f; --warn:#ffc043; --err:#ff6b5e;
  --display:"Archivo","Satoshi",system-ui,sans-serif;
  --body:"Satoshi",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:14px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--abyss);color:var(--cream);
  font-family:var(--body);font-size:16px;line-height:1.55;letter-spacing:-.008em;
  -webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom);
}
img{max-width:100%;display:block}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--oil);outline-offset:2px;border-radius:4px}
h1,h2,h3{font-family:var(--display);font-weight:800;letter-spacing:-.015em;line-height:1.05;margin:0}
h1,h2,h3,.kpi .v,.vazio strong,.etapa-nome,.readout input,.result-main .val,
.result-grid .val,.chart div b,.quem,.numeros .v,.codigo .c{font-stretch:115%}
h1{font-size:clamp(1.6rem,3.4vw,2.3rem)}
h2{font-size:clamp(1.25rem,2.4vw,1.6rem)}
h3{font-size:1.05rem}
p{margin:0 0 1em}
.mono{font-variant-numeric:tabular-nums}

.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,32px)}
.mt{margin-top:1.5rem}.mt2{margin-top:2.5rem}
.row{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}
.spread{display:flex;gap:1rem;justify-content:space-between;align-items:center;flex-wrap:wrap}
.muted{color:var(--cream-dim)}
.faint{color:var(--cream-faint)}
.label{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-faint)}

/* -------------------------------------------------------------- marca */
.mark{display:inline-flex;align-items:center;gap:.3em;font-family:var(--body);letter-spacing:-.035em;line-height:1;font-size:1.2rem}
.mark .m-eco{font-weight:300}.mark .m-social{font-weight:900}
.mark svg{height:1.1em;width:auto;transform:translateY(-.05em)}

/* --------------------------------------------------------- cabeçalho */
.top{position:sticky;top:0;z-index:40;background:rgba(8,30,6,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.top-in{display:flex;align-items:center;gap:1rem;height:62px}
.top nav{display:flex;gap:1.2rem;margin-left:auto;font-size:.88rem;font-weight:500;color:var(--cream-dim)}
.top nav a.on,.top nav a:hover{color:var(--cream)}
.who{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:var(--cream-dim);margin-left:auto}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--oil);color:#2a0d00;display:grid;place-items:center;font-weight:900;font-size:.8rem;flex:none}

/* ------------------------------------------------------------ botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.75em 1.3em;border-radius:9px;border:1px solid transparent;font-weight:700;font-size:.88rem;cursor:pointer;transition:transform .18s,background .2s,border-color .2s,opacity .2s}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-primary{background:var(--oil);color:#2a0d00}
.btn-primary:not(:disabled):hover{transform:translateY(-1px)}
.btn-ghost{border-color:var(--line);color:var(--cream);background:transparent}
.btn-ghost:hover{border-color:var(--cream-faint);background:rgba(255,230,218,.06)}
.btn-lg{padding:1.1em 1.5em;font-size:1rem;width:100%}
.btn-sm{padding:.5em .9em;font-size:.8rem}

/* ------------------------------------------------------------ campos */
.f{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.95rem}
.f label{font-size:.66rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--cream-faint)}
.f input,.f select,.f textarea{background:rgba(255,230,218,.045);border:1px solid var(--line);border-radius:10px;padding:.8em .95em;font-size:.95rem;width:100%;transition:border-color .2s,background .2s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--oil);background:rgba(255,230,218,.075);outline:none}
.f select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%23ffe6da' stroke-opacity='.5' stroke-width='1.8' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .95em center}
.f select option{background:var(--forest);color:var(--cream)}
.f textarea{resize:vertical;min-height:80px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 .95rem}
@media(max-width:560px){.f2{grid-template-columns:1fr}}

/* ------------------------------------------------------------ cartões */
.card{border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(165deg,rgba(255,230,218,.055),rgba(255,230,218,.012));padding:1.3rem}
.card + .card{margin-top:.85rem}
.grid{display:grid;gap:.85rem}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(165px,100%),1fr))}

.kpi{border:1px solid var(--line);border-radius:var(--r);padding:1.15rem}
.kpi .v{font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,3.4vw,2.1rem);line-height:1.05;display:block;letter-spacing:-.02em}
.kpi .k{font-size:.64rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-faint);margin-top:.45rem;line-height:1.4}
.kpi.agua .v{color:var(--water)}
.kpi.doacao .v{color:var(--oil)}

/* ------------------------------------------------------------ status */
.pill{display:inline-flex;align-items:center;gap:.45em;padding:.32em .75em;border-radius:100px;font-size:.7rem;font-weight:700;letter-spacing:.04em;border:1px solid currentColor;white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.s-agendada{color:#9aa7a0}
.s-coletada{color:var(--oil)}
.s-em_transito{color:var(--warn)}
.s-recebida{color:var(--water)}
.s-em_lote{color:var(--water)}
.s-enviada_destinacao{color:var(--water)}
.s-destinada{color:var(--ok)}
.s-cancelada{color:var(--err)}

/* --------------------------------------------------- linha do tempo */
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:9px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl li{position:relative;padding:0 0 1.5rem 2.4rem}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:"";position:absolute;left:3px;top:5px;width:14px;height:14px;border-radius:50%;background:var(--abyss);border:2px solid var(--line);z-index:1}
.tl li.done::before{border-color:var(--ok);background:var(--ok)}
.tl li.now::before{border-color:var(--oil);background:var(--oil);box-shadow:0 0 0 5px rgba(255,108,8,.18)}
.tl .quando{font-size:.75rem;color:var(--cream-faint);font-variant-numeric:tabular-nums}
.tl .oque{font-weight:700;margin:.1rem 0 .2rem}
.tl .obs{font-size:.88rem;color:var(--cream-dim)}
.tl img{margin-top:.7rem;border-radius:10px;max-width:230px;border:1px solid var(--line)}

/* ------------------------------------------------------------ tabela */
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th{text-align:left;font-size:.64rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-faint);padding:0 .8rem .7rem;border-bottom:1px solid var(--line)}
.tbl td{padding:.85rem .8rem;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.tbl tr:hover td{background:rgba(255,230,218,.03)}
.tbl .clic{cursor:pointer}
.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ------------------------------------------------------------ gráfico */
.chart{display:flex;align-items:flex-end;gap:.5rem;height:150px;padding-top:1rem}
.chart div{flex:1;background:linear-gradient(180deg,var(--oil),rgba(255,108,8,.25));border-radius:5px 5px 0 0;min-height:3px;position:relative;transition:opacity .2s}
.chart div:hover{opacity:.75}
.chart div span{position:absolute;bottom:-1.5rem;left:0;right:0;text-align:center;font-size:.62rem;color:var(--cream-faint)}
.chart div b{position:absolute;top:-1.4rem;left:0;right:0;text-align:center;font-size:.68rem;font-weight:700}
.chart-wrap{padding-bottom:1.8rem}

/* ---------------------------------------------------------- diversos */
.vazio{text-align:center;padding:3rem 1rem;color:var(--cream-faint)}
.vazio strong{display:block;color:var(--cream);font-family:var(--display);font-size:1.15rem;margin-bottom:.4rem}
.aviso{border:1px solid var(--warn);color:var(--warn);border-radius:10px;padding:.7rem 1rem;font-size:.85rem;display:flex;gap:.6rem;align-items:center}
.aviso.off{border-color:var(--err);color:var(--err)}
.erro{color:var(--err);font-size:.85rem;min-height:1.2em}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,140%);background:var(--cream);color:var(--ink);padding:.85em 1.3em;border-radius:10px;font-weight:700;font-size:.88rem;z-index:99;transition:transform .3s cubic-bezier(.2,.8,.3,1);box-shadow:0 14px 34px -10px rgba(0,0,0,.6);max-width:90vw}
.toast.on{transform:translate(-50%,0)}
.toast.err{background:var(--err);color:#fff}

.modal{position:fixed;inset:0;background:rgba(4,14,3,.8);backdrop-filter:blur(6px);z-index:60;display:none;padding:1rem;overflow-y:auto}
.modal.on{display:grid;place-items:start center}
.modal .box{background:var(--forest);border:1px solid var(--line);border-radius:16px;padding:1.6rem;width:min(680px,100%);margin:auto 0}

.load{display:inline-block;width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--oil);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================ APP DE CAMPO — mobile first ============ */
.campo{padding-bottom:5rem}
.campo .job{border:1px solid var(--line);border-radius:var(--r);padding:1.1rem;margin-bottom:.8rem;display:block}
.campo .job:active{background:rgba(255,230,218,.05)}
.campo .job h3{font-size:1rem;margin-bottom:.2rem}
.acoes{position:fixed;left:0;right:0;bottom:0;background:rgba(8,30,6,.96);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:.9rem clamp(16px,4vw,32px) calc(.9rem + env(safe-area-inset-bottom));z-index:50}
.foto-alvo{border:2px dashed var(--line);border-radius:var(--r);padding:2rem 1rem;text-align:center;color:var(--cream-faint);cursor:pointer}
.foto-alvo.tem{border-style:solid;padding:0;overflow:hidden}
.foto-alvo img{width:100%;height:200px;object-fit:cover}
.fila{font-size:.8rem;color:var(--warn)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* =====================================================================
   CADEIA DE CUSTÓDIA — origem → base → destinação
   ===================================================================== */
.cadeia{margin:.4rem 0 1.6rem}
.etapa{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:start;
  border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;background:rgba(255,230,218,.03)}
.etapa.pendente{opacity:.42;border-style:dashed}
.etapa-n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  font-weight:900;font-size:.8rem;background:var(--line);color:var(--cream);flex:none}
.etapa.feita:nth-of-type(1) .etapa-n{background:var(--oil);color:#2a0d00}
.etapa.feita .etapa-n{background:var(--water);color:#03231d}
.etapa-papel{font-size:.62rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--cream-faint);margin:0 0 .25rem}
.etapa-nome{font-family:var(--display);font-weight:600;font-size:1rem;margin:0;line-height:1.2}
.etapa-end{font-size:.84rem;color:var(--cream-dim);margin:.25rem 0 0}
.etapa-det{font-size:.8rem;color:var(--cream-faint);margin:.3rem 0 0}
.etapa-quando{font-size:.78rem;color:var(--cream-dim);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.etapa-liga{height:26px;margin-left:1.6rem;border-left:2px dashed var(--line);
  display:flex;align-items:center;padding-left:.9rem}
.etapa-liga.feita{border-left-color:var(--oil)}
.etapa-liga span{font-size:.7rem;color:var(--cream-faint);font-weight:700;letter-spacing:.06em}
@media(max-width:520px){
  .etapa{grid-template-columns:auto 1fr}
  .etapa-quando{grid-column:2;text-align:left;margin-top:.4rem}
}

/* mapa */
.mapa{height:280px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#0b1a08}
.leaflet-container{background:#0b1a08;font-family:var(--body)}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--forest);color:var(--cream);border-radius:9px}
.leaflet-popup-content{margin:.7rem .9rem;font-size:.85rem}
.leaflet-control-attribution{background:rgba(8,30,6,.8)!important;color:var(--cream-faint)!important;font-size:.62rem!important}
.leaflet-control-attribution a{color:var(--cream-dim)!important}
.leaflet-bar a{background:var(--forest)!important;color:var(--cream)!important;border-color:var(--line)!important}

/* =====================================================================
   CELULAR — três correções de verdade
   1. barra do topo quebrava com 3 links + avatar em tela estreita
   2. tabela de 7 colunas virava rolagem lateral às cegas
   3. modal ocupava a tela toda sem respiro
   ===================================================================== */
@media (max-width:700px){

  /* topo em duas linhas: marca e conta em cima, navegação embaixo */
  .top-in{height:auto;flex-wrap:wrap;padding-block:.7rem;gap:.6rem}
  .top nav{order:3;width:100%;margin:0;gap:1.2rem;overflow-x:auto;
    padding-top:.7rem;border-top:1px solid var(--line-soft);
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .top nav::-webkit-scrollbar{display:none}
  .top nav a{white-space:nowrap}
  .who{margin-left:auto}

  /* tabela vira lista de cartões: cada linha ganha rótulo próprio */
  .scroll-x{overflow:visible}
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl thead{display:none}
  .tbl tr{border:1px solid var(--line);border-radius:12px;padding:.4rem 1rem;margin-bottom:.75rem;
    background:rgba(255,230,218,.025)}
  .tbl tr:hover td{background:none}
  .tbl td{border:0;padding:.5rem 0;display:flex;justify-content:space-between;
    align-items:center;gap:1rem;text-align:right}
  .tbl td + td{border-top:1px solid var(--line-soft)}
  .tbl td::before{content:attr(data-r);flex:none;text-align:left;
    font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-faint)}
  .tbl td:empty{display:none}

  /* modal com respiro e rolagem própria */
  .modal{padding:.6rem}
  .modal .box{padding:1.2rem;border-radius:14px;max-height:94svh;overflow-y:auto}
  .mapa{height:220px}

  /* cartões de indicador em duas colunas, sem esmagar o número */
  .g4{grid-template-columns:1fr 1fr}
  .kpi{padding:.95rem}
  .kpi .v{font-size:1.45rem}

  .abas{gap:0}
  .abas button{padding:.7em .8em;font-size:.85rem}
}

@media (max-width:400px){
  .g4{grid-template-columns:1fr}
}

@media (max-width:700px){ .ver-mais{display:none} }

/* ---------------------------------------------- aviso de nova versão */
.barra-versao{
  position:fixed;left:50%;bottom:calc(5.4rem + env(safe-area-inset-bottom));
  transform:translate(-50%,150%);z-index:95;
  display:flex;align-items:center;gap:1rem;white-space:nowrap;
  background:var(--cream);color:var(--ink);padding:.6rem .7rem .6rem 1.2rem;
  border-radius:100px;font-weight:700;font-size:.87rem;
  box-shadow:0 14px 34px -10px rgba(0,0,0,.65);
  transition:transform .35s cubic-bezier(.2,.8,.3,1);max-width:94vw;
}
.barra-versao.on{transform:translate(-50%,0)}
.selo-versao{
  position:fixed;right:.7rem;bottom:calc(.4rem + env(safe-area-inset-bottom));
  z-index:10;font-size:.62rem;color:var(--cream-faint);pointer-events:none;
  font-variant-numeric:tabular-nums;
}

/* ============================ RESÍDUOS — itens e fotos =============== */
.item{border:1px solid var(--line);border-radius:12px;padding:1rem;margin-bottom:.8rem;
  background:rgba(255,230,218,.03)}
.item .f:last-child,.item .f2 .f{margin-bottom:0}
.item-n{width:24px;height:24px;border-radius:50%;background:var(--oil);color:#2a0d00;
  display:grid;place-items:center;font-weight:900;font-size:.78rem;flex:none}

.fotos{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.foto-tit{display:block;font-size:.66rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cream-faint);margin-bottom:.5rem}
.fotos .foto-alvo{padding:1.4rem .6rem;font-size:.8rem}
.fotos .foto-alvo.tem{padding:0}
.fotos .foto-alvo img{height:130px}
@media(max-width:420px){.fotos{grid-template-columns:1fr}}

/* comparativo antes/depois na tela do cliente */
.antes-depois{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:.8rem}
.antes-depois figure{margin:0}
.antes-depois figcaption{font-size:.64rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cream-faint);margin-bottom:.4rem}
.antes-depois img{width:100%;height:170px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
@media(max-width:560px){.antes-depois img{height:140px}}

/* classe do resíduo */
.cl{display:inline-block;padding:.15em .5em;border-radius:5px;font-size:.62rem;font-weight:700;
  letter-spacing:.06em;border:1px solid currentColor}
.cl-I{color:var(--err)}
.cl-IIA{color:var(--water)}
.cl-IIB{color:var(--warn)}

/* status novos */
.s-aberta{color:#9aa7a0}
.s-coletada{color:var(--oil)}
.s-recebida{color:var(--water)}
.s-destinada{color:var(--ok)}

/* ---------------------------------------- resumo por tipo (cliente) */
.tipo-linha{padding:.9rem 0;border-bottom:1px solid var(--line-soft)}
.tipo-linha:last-child{border-bottom:0;padding-bottom:0}
.tipo-linha:first-child{padding-top:0}
.tipo-cab{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;margin-bottom:.5rem;font-size:.94rem}
.barra{height:7px;border-radius:4px;background:rgba(255,230,218,.1);overflow:hidden}
.barra div{height:100%;background:linear-gradient(90deg,var(--oil),rgba(255,108,8,.5));border-radius:4px}
.tipo-meta{font-size:.8rem;color:var(--cream-faint);margin:.45rem 0 0}

.lista-itens{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;font-size:.88rem}
.lista-itens li{display:flex;gap:.55rem;align-items:center;color:var(--cream-dim)}
.lista-itens b{margin-left:auto;color:var(--cream)}

/* ===================== SINO E NOTIFICAÇÕES ========================== */
.sino{position:relative;background:none;border:0;color:var(--cream-dim);cursor:pointer;
  padding:.4rem;display:grid;place-items:center;border-radius:8px;transition:color .2s}
.sino:hover{color:var(--cream)}
.sino.urgente{color:var(--err);animation:pulsa 1.1s ease-in-out infinite}
@keyframes pulsa{0%,100%{opacity:1}50%{opacity:.42}}
.sino-n{position:absolute;top:0;right:0;min-width:16px;height:16px;padding:0 4px;
  border-radius:9px;background:var(--oil);color:#2a0d00;font-size:.62rem;font-weight:900;
  line-height:16px;text-align:center}
.sino.urgente .sino-n{background:var(--err);color:#fff}

.painel-notif{position:absolute;top:56px;right:clamp(16px,4vw,32px);width:min(340px,92vw);
  background:var(--forest);border:1px solid var(--line);border-radius:14px;z-index:60;
  box-shadow:0 18px 44px -14px rgba(0,0,0,.75);max-height:70svh;overflow-y:auto}
.notif-cab{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.9rem 1rem;border-bottom:1px solid var(--line-soft);font-size:.9rem}
.notif{display:block;padding:.85rem 1rem;border-bottom:1px solid var(--line-soft)}
.notif:last-child{border-bottom:0}
.notif:hover{background:rgba(255,230,218,.04)}
.notif.nova{border-left:3px solid var(--oil)}
.notif.urg{border-left-color:var(--err);background:rgba(255,107,94,.07)}
.notif-t{font-weight:700;font-size:.9rem;margin:0}
.notif.urg .notif-t{color:var(--err)}
.notif-m{font-size:.84rem;color:var(--cream-dim);margin:.2rem 0 0}
.notif-q{font-size:.72rem;color:var(--cream-faint);margin:.3rem 0 0}
.notif-vazio{padding:2rem 1rem;text-align:center;color:var(--cream-faint);font-size:.88rem}

/* ============================ CALENDÁRIO ============================ */
.cal-topo{display:flex;align-items:center;justify-content:center;gap:1.4rem;margin-bottom:1rem}
.cal-topo h2{text-transform:capitalize;min-width:11ch;text-align:center}
.cal-nav{background:none;border:1px solid var(--line);color:var(--cream);width:34px;height:34px;
  border-radius:9px;font-size:1.2rem;line-height:1;cursor:pointer;transition:border-color .2s}
.cal-nav:hover{border-color:var(--cream-faint)}

.cal-dias{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem;margin-bottom:.35rem}
.cal-dias span{text-align:center;font-size:.62rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--cream-faint);padding:.3rem 0}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem}
.cal-d{aspect-ratio:1;background:rgba(255,230,218,.035);border:1px solid var(--line-soft);
  border-radius:10px;color:var(--cream);cursor:pointer;padding:.4rem;display:flex;
  flex-direction:column;align-items:center;justify-content:flex-start;gap:.25rem;
  transition:border-color .2s,background .2s}
.cal-d:hover{border-color:var(--cream-faint)}
.cal-d.fora{opacity:.3}
.cal-d.hoje{border-color:var(--oil)}
.cal-d.sel{background:rgba(255,108,8,.14);border-color:var(--oil)}
.cal-d .n{font-family:var(--display);font-stretch:115%;font-weight:700;font-size:.9rem}
.cal-d .pts{display:flex;gap:2px;flex-wrap:wrap;justify-content:center}
.cal-d .mais{font-size:.58rem;color:var(--cream-faint)}
.cal-d i,.legenda i{width:6px;height:6px;border-radius:50%;display:inline-block}
.pt-solicitada{background:#ffc043}
.pt-aberta{background:var(--water)}
.pt-coletada{background:var(--oil)}
.pt-recebida{background:var(--water)}
.pt-destinada{background:var(--ok)}
.pt-urg{background:var(--err)}

.legenda{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font-size:.74rem;color:var(--cream-faint)}
.legenda span{display:flex;align-items:center;gap:.4rem}

/* urgência */
.card.urg,.pend.urg{border-color:rgba(255,107,94,.5);background:rgba(255,107,94,.06)}
.tag-urg{display:inline-block;background:var(--err);color:#fff;font-size:.6rem;font-weight:900;
  letter-spacing:.1em;padding:.2em .55em;border-radius:5px;vertical-align:middle}
.pend{border-left:3px solid var(--oil)}

.checa{display:flex;gap:.7rem;align-items:flex-start;padding:.9rem 0;font-size:.9rem;cursor:pointer}
.checa input{width:auto;margin-top:.25em;flex:none;accent-color:var(--oil)}

@media(max-width:560px){
  .cal-d{padding:.25rem}
  .cal-d .n{font-size:.78rem}
  .painel-notif{right:8px;left:8px;width:auto}
}

/* ------------------------------- aguardando confirmação (cliente) */
.card.aguardando{border-color:rgba(255,192,67,.45);background:rgba(255,192,67,.05)}
.aviso-espera{border:1px solid rgba(255,192,67,.4);background:rgba(255,192,67,.08);
  border-radius:10px;padding:.85rem 1rem;margin-bottom:1rem;font-size:.87rem;color:var(--cream-dim)}
.aviso-espera strong{display:block;color:var(--warn);font-weight:700;margin-bottom:.2rem}
.s-solicitada{color:var(--warn)}
.linha-espera td{background:rgba(255,192,67,.05)}

/* atalhos de horário */
.horarios{display:flex;flex-wrap:wrap;gap:.4rem;margin:-.4rem 0 1.1rem}
.h-atalho{background:rgba(255,230,218,.05);border:1px solid var(--line);color:var(--cream-dim);
  border-radius:7px;padding:.4em .7em;font-size:.8rem;font-weight:600;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s}
.h-atalho:hover{border-color:var(--cream-faint);color:var(--cream)}
.h-atalho.on{background:var(--oil);border-color:var(--oil);color:#2a0d00}

/* ------------------------------- reagendamento e recado */
.pedido-original{border:1px solid var(--line);border-left:3px solid var(--warn);
  border-radius:10px;padding:.85rem 1rem;background:rgba(255,192,67,.06)}
.pedido-original .label{display:block;margin-bottom:.25rem}
.pedido-original strong{font-family:var(--display);font-stretch:115%;font-size:1.05rem}
.remarcado{font-size:.82rem;color:var(--warn);margin:.3rem 0 0;font-weight:600}
.recado{font-size:.84rem;color:var(--cream-dim);margin:.3rem 0 0;
  border-left:2px solid var(--line);padding-left:.7rem;font-style:italic}
.aviso-remarcado{border:1px solid rgba(255,192,67,.4);background:rgba(255,192,67,.08);
  border-radius:10px;padding:.85rem 1rem;margin-bottom:1rem;font-size:.87rem;color:var(--cream-dim)}
.aviso-remarcado strong:first-child{display:block;color:var(--warn);font-weight:700;margin-bottom:.2rem}
.aviso-remarcado strong{color:var(--cream)}

/* --------------------------------- credencial recém-criada */
.credencial{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.credencial > div{padding:.85rem 1.1rem;border-bottom:1px solid var(--line-soft)}
.credencial > div:last-child{border-bottom:0}
.credencial .label{display:block;margin-bottom:.2rem}
.credencial strong{font-size:1rem;word-break:break-all}
.credencial .senha{font-family:var(--display);font-stretch:115%;font-size:1.4rem;
  letter-spacing:.06em;color:var(--oil)}