/* ============================================================
   Sistema Rodo Wall — Módulo Checklist — Execução Diário + Home
   (design fiel ao protótipo original)
   ============================================================ */

/* ---------- Topo da execução ---------- */
.cl-exec-topo{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; flex-wrap:wrap;
  padding:16px 20px; margin-bottom:16px;
  border-radius:var(--clradius);
  background:var(--clcard); border:1px solid var(--clborder);
  border-left:4px solid var(--claccent);
}
.cl-exec-info{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; color:var(--cltx2); }
.cl-exec-info strong{ color:var(--cltx); font-family:var(--clfd); font-size:16px; letter-spacing:.5px; }
.cl-exec-badge{
  font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px;
  background:var(--claccent-dim); color:var(--claccent);
  padding:4px 11px; border-radius:7px; letter-spacing:1px;
}
.cl-exec-badge.cl-badge-sec{ background:var(--clcard-h); color:var(--cltx2); border:1px solid var(--clborder); }
.cl-exec-km{ color:var(--cltx2); font-size:13px; }
.cl-exec-timer{
  display:flex; align-items:center; gap:8px;
  font-family:var(--clfd); font-weight:700; font-size:26px; color:var(--claccent);
}

/* ---------- Perguntas ---------- */
.cl-q{
  border:1px solid var(--clborder); border-radius:10px;
  padding:16px; margin-bottom:12px;
  background:var(--clcard-h); transition:all .2s;
}
.cl-q-alerta{ border-color:var(--clred); background:var(--clred-dim); }
.cl-q-texto{ font-size:14px; margin-bottom:12px; color:var(--cltx); line-height:1.45; }
.cl-q-btns{ display:flex; gap:12px; margin-bottom:12px; }
.cl-ans{
  flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
  padding:11px; border-radius:9px;
  border:1px solid var(--clborder-b); background:var(--clcard);
  color:var(--cltx2); font-weight:600; font-size:14px; cursor:pointer;
  transition:all .15s;
}
.cl-ans:hover{ border-color:var(--claccent); color:var(--claccent); }
.cl-ans-sim-on{ background:var(--clgreen-dim); border-color:var(--clgreen); color:var(--clgreen); }
.cl-ans-nao-on{ background:var(--clred-dim); border-color:var(--clred); color:var(--clred); }
.cl-q-obs{
  width:100%; padding:10px 12px; border-radius:9px;
  border:1px solid var(--clborder-b); background:var(--clcard);
  color:var(--cltx); font-size:13px;
}
.cl-q-obs-req{ border-color:var(--clred); }

/* ---------- Foto ---------- */
.cl-foto-preview{
  display:block; max-width:100%; max-height:300px;
  border-radius:10px; border:1px solid var(--clborder); margin-bottom:12px;
}

/* ---------- Assinatura ---------- */
.cl-sig-wrap{ position:relative; margin-bottom:12px; }
.cl-sig-canvas{
  width:100%; height:190px; touch-action:none;
  background:var(--clcard-h);
  border:1.5px dashed var(--clborder-b); border-radius:10px; cursor:crosshair;
}
.cl-sig-placeholder{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:8px;
  color:var(--cltx3); font-size:14px; pointer-events:none;
}

/* ---------- Home do motorista (cards grandes como no protótipo) ---------- */
.cl-home-hero{ text-align:center; padding:44px 0 28px; }
.cl-home-titulo{ font-family:var(--clfd); font-weight:700; font-size:32px; letter-spacing:.5px; }
.cl-home-sub{ color:var(--cltx2); font-size:14px; margin-top:8px; }
.cl-home-cards{ display:grid; grid-template-columns:1fr 1fr; gap:20px; max-width:700px; margin:0 auto; }
.cl-home-card{
  position:relative; overflow:hidden; text-align:left;
  padding:26px;
  background:var(--clcard);
  border:1px solid var(--clborder);
  border-radius:16px; cursor:pointer;
  transition:all .25s cubic-bezier(.4,0,.2,1);
}
.cl-home-card:hover{
  border-color:var(--claccent); transform:translateY(-4px);
  box-shadow:0 12px 34px var(--claccent-glow);
  background:var(--clcard-h);
}
.cl-home-card-ic{
  width:58px; height:58px; border-radius:16px;
  display:flex; align-items:center; justify-content:center; color:#fff;
  background:linear-gradient(135deg,#60a5fa,#2563eb);
  box-shadow:0 8px 22px var(--claccent-glow);
  margin-bottom:16px;
}
.cl-home-card:last-child .cl-home-card-ic{
  background:linear-gradient(135deg,#38bdf8,#0ea5e9);
}
.cl-home-card-nome{ font-family:var(--clfd); font-weight:700; font-size:20px; letter-spacing:.3px; margin-bottom:6px; color:var(--cltx); }
.cl-home-card-desc{ color:var(--cltx2); font-size:13px; margin-bottom:16px; }
.cl-home-card-seta{
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--clcard-h); border:1px solid var(--clborder);
  color:var(--cltx2); transition:all .22s;
}
.cl-home-card:hover .cl-home-card-seta{ background:var(--claccent); border-color:var(--claccent); color:#fff; }

@media (max-width:860px){
  .cl-home-cards{ grid-template-columns:1fr; }
  .cl-exec-timer{ font-size:20px; }
  .cl-home-titulo{ font-size:25px; }
}