/* Agendamento de Vistorias – Gastardeli (mesma família visual do app de campo) */
:root{
  --azul:#3446A8; --azul-2:#5565C8; --azul-claro:#E8EAF6; --azul-texto:#2A3890;
  --laranja:#F2A65A; --laranja-suave:#FDF1E4; --laranja-texto:#8A410A;
  --fundo:#F3F4F8; --cartao:#FFFFFF; --texto:#15172E; --suave:#4A4D68;
  --borda:#C9CCDA; --linha:#E3E5EE;
  --ok:#1E7A4C; --ok-suave:#E3F3EA; --erro:#B4441A; --erro-suave:#FBE9E2; --cinza-suave:#ECEDF2;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root{
    --azul:#6F80E8; --azul-2:#8B99F0; --azul-claro:#2A2E58; --azul-texto:#C9CEFF;
    --laranja-suave:#3A2A1C; --laranja-texto:#F5C08A;
    --fundo:#11132B; --cartao:#1B1E3D; --texto:#ECEDF6; --suave:#B5B8D0;
    --borda:#3A3E66; --linha:#2A2E52;
    --ok:#4FC28A; --ok-suave:#173A2A; --erro:#F08A63; --erro-suave:#3D2219; --cinza-suave:#262A4A;
    color-scheme: dark;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0;background:var(--fundo);color:var(--texto);font:16px/1.45 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--azul)}
h1,h2,h3{line-height:1.2;margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--laranja);outline-offset:2px}
[hidden]{display:none!important}

/* ---- botões ---- */
button{cursor:pointer;border:0;border-radius:12px;padding:12px 18px;font-weight:600;background:var(--azul);color:#fff}
button:disabled{opacity:.5;cursor:default}
button.sec{background:var(--azul-claro);color:var(--azul-texto)}
button.fantasma{background:transparent;color:var(--azul);padding:8px 10px}
button.perigo{background:var(--erro-suave);color:var(--erro)}
button.laranja{background:var(--laranja);color:#3B1E03}
button.peq{padding:7px 12px;font-size:14px;border-radius:9px}
.largo{width:100%}

/* ---- formulários ---- */
label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--suave)}
input,select,textarea{background:var(--cartao);border:1.5px solid var(--borda);border-radius:10px;padding:11px 12px;font-weight:400;color:var(--texto);width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--azul);outline:none}
textarea{min-height:110px;resize:vertical}
.dica{font-size:13px;font-weight:400;color:var(--suave)}
.erro-campo{color:var(--erro);font-size:14px;font-weight:600}
.check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;color:var(--texto)}
.check input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--azul)}

/* ---- chips de escolha ---- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--cartao);border:1.5px solid var(--borda);color:var(--texto);border-radius:999px;padding:8px 14px;font-weight:500;font-size:15px}
.chip.on{background:var(--azul);border-color:var(--azul);color:#fff}

/* ---- avisos ---- */
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--texto);color:var(--fundo);padding:12px 18px;border-radius:12px;max-width:min(92vw,520px);z-index:50;transition:.2s;font-weight:500}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast.erro{background:var(--erro);color:#fff}
.aviso{background:var(--laranja-suave);color:var(--laranja-texto);border-radius:12px;padding:12px 14px;font-size:15px}
.aviso.ok{background:var(--ok-suave);color:var(--ok)}
.aviso.ruim{background:var(--erro-suave);color:var(--erro)}

/* =========================================================
   PÁGINA DO CLIENTE
   ========================================================= */
.cliente .topo{background:var(--azul);color:#fff;padding:18px 20px 22px}
.cliente .topo-in{max-width:560px;margin:0 auto;display:flex;align-items:center;gap:14px}
.cliente .topo img{width:52px;height:52px;border-radius:12px;background:#fff;object-fit:contain;padding:4px;flex:none}
.cliente .topo b{display:block;font-size:19px}
.cliente .topo span{font-size:14px;opacity:.85}
.cliente main{max-width:560px;margin:-10px auto 0;padding:0 16px 24px}
.passo{background:var(--cartao);border-radius:18px;padding:22px 18px;box-shadow:0 1px 2px rgba(20,24,70,.06)}
.passo h1{font-size:23px;margin-bottom:6px}
.passo > p.sub{color:var(--suave);margin:0 0 18px}
.progresso{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-size:13px;color:var(--suave);font-weight:600}
.progresso .barra{flex:1;height:6px;background:var(--azul-claro);border-radius:6px;overflow:hidden}
.progresso .barra i{display:block;height:100%;background:var(--laranja);border-radius:6px;transition:width .3s}
.pilha{display:flex;flex-direction:column;gap:14px}
.opcao{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;width:100%;background:var(--cartao);color:var(--texto);border:1.5px solid var(--borda);border-radius:14px;padding:14px 16px;font-weight:600;font-size:17px}
.opcao small{font-weight:400;font-size:14px;color:var(--suave)}
.opcao.on{border-color:var(--azul);background:var(--azul-claro);box-shadow:inset 0 0 0 1px var(--azul)}
.rodape-passo{display:flex;gap:10px;margin-top:22px}
.rodape-passo button{flex:1}
.rodape-passo .fantasma{flex:0 0 auto}

/* datas: o dia em destaque */
.dias{display:flex;flex-direction:column;gap:10px}
.dia{display:grid;grid-template-columns:62px 1fr;gap:12px;align-items:center;border:1.5px solid var(--linha);border-radius:14px;padding:10px 12px}
.dia .num{text-align:center;line-height:1}
.dia .num b{display:block;font-size:30px;font-weight:700;color:var(--azul-texto);letter-spacing:-.02em}
.dia .num span{font-size:12px;font-weight:600;color:var(--suave);text-transform:lowercase}
.dia .pers{display:flex;gap:8px;flex-wrap:wrap}
.per{flex:1;min-width:120px;display:flex;flex-direction:column;align-items:flex-start;gap:1px;background:var(--fundo);color:var(--texto);border:1.5px solid transparent;border-radius:11px;padding:9px 12px;font-weight:600}
.per small{font-weight:400;font-size:13px;color:var(--suave)}
.per.on{background:var(--azul);color:#fff;border-color:var(--azul)}
.per.on small{color:#E2E6FF}
.per.vazio{visibility:hidden}

.fotos{display:flex;gap:10px;flex-wrap:wrap}
.foto{position:relative;width:86px;height:86px;border-radius:12px;overflow:hidden;background:var(--fundo)}
.foto img{width:100%;height:100%;object-fit:cover}
.foto button{position:absolute;top:4px;right:4px;width:26px;height:26px;padding:0;border-radius:50%;background:rgba(0,0,0,.6);font-size:15px;line-height:26px}
.add-foto{width:86px;height:86px;border:1.5px dashed var(--borda);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:13px;color:var(--suave);cursor:pointer;text-align:center;font-weight:600}
.add-foto input{display:none}

.resumo{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:15px}
.resumo dt{color:var(--suave)}
.resumo dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.codigo{font-size:30px;font-weight:700;letter-spacing:.04em;color:var(--azul-texto);margin:6px 0 14px}
.rodape{text-align:center;padding:10px 0 30px;font-size:14px}
.rodape a{color:var(--suave)}
.carregando{padding:50px 0;text-align:center;color:var(--suave)}

/* =========================================================
   PAINEL
   ========================================================= */
.painel .barra-topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--azul);color:#fff}
body.painel::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--azul)}
.barra-in{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:14px;padding:10px 18px;flex-wrap:wrap}
.barra-in img{width:38px;height:38px;border-radius:9px;background:#fff;object-fit:contain;padding:3px}
.barra-in .marca{font-weight:700;font-size:17px;margin-right:auto}
.barra-in .marca small{display:block;font-weight:400;font-size:12px;opacity:.8}
.barra-in .quem{font-size:13px;opacity:.9;text-align:right}
.barra-in button{background:rgba(255,255,255,.16);color:#fff}
.abas{max-width:1280px;margin:0 auto;display:flex;gap:4px;padding:0 12px;overflow-x:auto}
.abas button{background:transparent;color:#DCE0FF;border-radius:10px 10px 0 0;padding:10px 16px;font-weight:600;white-space:nowrap}
.abas button.on{background:var(--fundo);color:var(--texto)}
.abas .n{display:inline-block;min-width:20px;padding:1px 6px;margin-left:6px;border-radius:999px;background:var(--laranja);color:#3B1E03;font-size:12px}
.conteudo{max-width:1280px;margin:0 auto;padding:18px}
.cartao{background:var(--cartao);border-radius:16px;padding:18px;margin-bottom:16px;box-shadow:0 1px 2px rgba(20,24,70,.06)}
.cartao h2{font-size:18px;margin-bottom:12px}
.cartao h3{font-size:15px;margin:18px 0 10px;color:var(--suave)}
.filtros{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:14px}
.filtros label{min-width:170px;flex:0 1 220px}
.filtros .busca{flex:1 1 220px}
.grade2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.grade3{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}

.tabela-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:13px;color:var(--suave);font-weight:600;padding:8px 10px;border-bottom:1.5px solid var(--linha);white-space:nowrap}
td{padding:10px;border-bottom:1px solid var(--linha);vertical-align:top}
tr.clicavel{cursor:pointer}
tr.clicavel:hover td{background:var(--fundo)}
tr.urgente td{background:var(--laranja-suave)}
tr.urgente:hover td{background:var(--laranja-suave)}
td .forte{font-weight:600}
td .fraco{color:var(--suave);font-size:13px}
.selo{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.selo.pendente{background:var(--laranja-suave);color:var(--laranja-texto)}
.selo.confirmado{background:var(--ok-suave);color:var(--ok)}
.selo.cancelado{background:var(--cinza-suave);color:var(--suave)}
.selo.alerta{background:var(--erro-suave);color:var(--erro)}
.selo.info{background:var(--azul-claro);color:var(--azul-texto)}
.vazio-msg{padding:30px 10px;text-align:center;color:var(--suave)}

/* condomínios: lista + detalhe */
.dividido{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start}
@media (max-width:860px){.dividido{grid-template-columns:1fr}}
.lista-condos{display:flex;flex-direction:column;gap:4px;max-height:75vh;overflow-y:auto}
.lista-condos button{display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;background:transparent;color:var(--texto);font-weight:500;padding:10px 12px;border-radius:10px}
.lista-condos button.on{background:var(--azul-claro);color:var(--azul-texto);font-weight:700}
.linha-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--linha);font-size:15px}
.linha-item:last-child{border-bottom:0}
.link-box{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--fundo);padding:10px 12px;border-radius:10px;font-size:14px;overflow-wrap:anywhere}
.link-box code{flex:1;min-width:200px}
.ocup{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.ocup div{background:var(--fundo);border-radius:10px;padding:8px 10px;font-size:13px}
.ocup b{display:block;font-size:14px}
.ocup .cheio{background:var(--laranja-suave)}
.ocup .zero{opacity:.55}

/* diálogo */
dialog{border:0;border-radius:18px;padding:0;width:min(860px,96vw);max-height:92vh;background:var(--cartao);color:var(--texto);box-shadow:0 20px 60px rgba(10,12,40,.35)}
dialog::backdrop{background:rgba(12,14,40,.5)}
.dlg-cab{position:sticky;top:0;background:var(--cartao);padding:18px 20px 12px;border-bottom:1px solid var(--linha);display:flex;gap:12px;align-items:flex-start;z-index:1}
.dlg-cab h2{font-size:20px}
.dlg-cab .x{margin-left:auto;background:var(--fundo);color:var(--texto);width:38px;height:38px;padding:0;border-radius:50%;font-size:20px;flex:none}
.dlg-corpo{padding:16px 20px;display:flex;flex-direction:column;gap:6px}
.dlg-corpo h3{font-size:14px;color:var(--suave);margin:14px 0 6px}
.dlg-rodape{position:sticky;bottom:0;background:var(--cartao);padding:12px 20px;border-top:1px solid var(--linha);display:flex;gap:10px;flex-wrap:wrap}
.dlg-rodape .esq{margin-right:auto}
.titulo-prev{background:var(--fundo);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600;overflow-wrap:anywhere}
.hist{font-size:13px;color:var(--suave);display:flex;flex-direction:column;gap:6px}
.hist b{color:var(--texto)}
.fotos-painel{display:flex;gap:10px;flex-wrap:wrap}
.fotos-painel a{display:block;width:110px;height:110px;border-radius:10px;overflow:hidden;background:var(--fundo)}
.fotos-painel img{width:100%;height:100%;object-fit:cover}

.login{max-width:380px;margin:9vh auto;padding:0 16px}
.login .cartao{padding:26px}
.login img{width:64px;height:64px;border-radius:14px;background:#fff;padding:4px;object-fit:contain;margin-bottom:12px}

@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}