:root { --fundo:#f1f5f2; --papel:#fff; --tinta:#16302a; --suave:#5b6b64; --marca:#14382e; --folha:#2c7a57; --destaque:#ffc93c; --linha:#dde5e0; --ok:#2e7d4f; --alerta:#b7791f; --ruim:#b3261e; --airbnb:#e0565b; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--fundo); color:var(--tinta); }
[hidden] { display:none !important; }
h1,h2,h3 { margin:0; }

.login { min-height:100dvh; display:grid; place-content:center; justify-items:center; gap:.4rem; padding:2rem; text-align:center; }
.login p { color:var(--suave); margin:0 0 1rem; }
.login form { display:grid; gap:.7rem; width:min(300px,80vw); }
input, select, textarea { font:inherit; padding:.75em .9em; border:1px solid var(--linha); border-radius:12px; background:#fff; width:100%; color:var(--tinta); }
input:focus, select:focus, textarea:focus { outline:2px solid var(--marca); border-color:transparent; }
.erro { color:var(--ruim); font-size:.9rem; min-height:1.2em; margin:0; }

.b { font:600 .95rem inherit; font-family:inherit; padding:.7em 1.1em; border-radius:12px; border:1px solid var(--linha); background:#fff; color:var(--tinta); cursor:pointer; }
.b-cheio { background:var(--marca); color:#fff; border-color:var(--marca); }
.b-ok { background:var(--ok); color:#fff; border-color:var(--ok); }
.b-ruim { color:var(--ruim); }
.b-ico { background:none; border:0; color:#fff; font-size:1.5rem; padding:.2em .4em; cursor:pointer; }
.linha-b { display:flex; gap:.5rem; flex-wrap:wrap; }
.linha-b .b { flex:1; }

.barra { position:sticky; top:0; z-index:5; background:var(--marca); color:#fff; padding:calc(.8rem + env(safe-area-inset-top)) 1rem .8rem; display:flex; justify-content:space-between; align-items:center; }
.barra h1 { font-size:1.2rem; }
#conteudo { padding:1rem 1rem 7rem; max-width:720px; margin:0 auto; }
.abas { position:fixed; bottom:0; left:0; right:0; display:grid; grid-template-columns:repeat(4,1fr); background:var(--papel); border-top:1px solid var(--linha); padding-bottom:env(safe-area-inset-bottom); z-index:5; }
.abas button { background:none; border:0; padding:.55rem 0 .5rem; font:500 .72rem inherit; font-family:inherit; color:var(--suave); display:grid; gap:.1rem; cursor:pointer; }
.abas button span { font-size:1.25rem; filter:grayscale(1); opacity:.6; }
.abas button.ativa { color:var(--marca); font-weight:700; }
.abas button.ativa span { filter:none; opacity:1; }
.fab { position:fixed; right:1rem; bottom:calc(4.6rem + env(safe-area-inset-bottom)); width:56px; height:56px; border-radius:18px; border:0; background:var(--destaque); color:var(--tinta); font-size:2rem; line-height:1; box-shadow:0 6px 16px rgba(0,0,0,.25); z-index:6; cursor:pointer; }

.cartoes { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin-bottom:1.2rem; }
.kpi { background:var(--papel); border:1px solid var(--linha); border-radius:16px; padding:.9rem 1rem; }
.kpi b { font-size:1.6rem; display:block; }
.kpi span { font-size:.8rem; color:var(--suave); }
.kpi.alerta { border-color:var(--alerta); background:#fdf3dd; }
h2.sec { font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:var(--suave); margin:1.3rem 0 .5rem; }
.vazio { color:var(--suave); font-size:.9rem; padding:.6rem 0; }

.item { background:var(--papel); border:1px solid var(--linha); border-left:5px solid var(--suave); border-radius:14px; padding:.75rem .9rem; margin-bottom:.55rem; display:grid; gap:.15rem; cursor:pointer; }
.item.pendente { border-left-color:var(--alerta); } .item.confirmada { border-left-color:var(--ok); }
.item.cancelada { border-left-color:#bbb; opacity:.6; } .item.bloqueio { border-left-color:var(--tinta); }
.item.externo { border-left-color:var(--airbnb); cursor:default; }
.item .l1 { display:flex; justify-content:space-between; gap:.5rem; font-weight:600; }
.item .l2 { font-size:.85rem; color:var(--suave); display:flex; justify-content:space-between; gap:.5rem; }
.selo { font-size:.7rem; font-weight:700; padding:.15em .6em; border-radius:999px; text-transform:uppercase; white-space:nowrap; align-self:center; }
.selo.pendente { background:#fdf3dd; color:var(--alerta); } .selo.confirmada { background:#e2f1e7; color:var(--ok); }
.selo.cancelada { background:#eee; color:#777; } .selo.bloqueio { background:#dde3e2; color:var(--tinta); } .selo.externo { background:#fbe4e5; color:var(--airbnb); }

.filtros { display:flex; gap:.4rem; overflow-x:auto; margin-bottom:.8rem; padding-bottom:.2rem; }
.filtros button { flex:none; border:1px solid var(--linha); background:#fff; border-radius:999px; padding:.4em .9em; font:500 .85rem inherit; font-family:inherit; cursor:pointer; }
.filtros button.ativa { background:var(--marca); color:#fff; border-color:var(--marca); }

.cal-nav span::first-letter { text-transform:uppercase; }
.cal-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom:.6rem; font-weight:700; }
.cal-nav button { width:38px; height:38px; border-radius:50%; border:1px solid var(--linha); background:#fff; font-size:1.2rem; cursor:pointer; }
.cal-rolo { overflow-x:auto; background:var(--papel); border:1px solid var(--linha); border-radius:14px; }
table.mapa { border-collapse:collapse; font-size:.78rem; }
table.mapa th, table.mapa td { border:1px solid var(--linha); text-align:center; min-width:34px; height:40px; padding:0; }
table.mapa th:first-child, table.mapa td:first-child { position:sticky; left:0; background:var(--papel); min-width:74px; padding:0 .5rem; text-align:left; font-weight:600; z-index:1; }
table.mapa th { font-weight:500; color:var(--suave); height:34px; }
table.mapa th.fds { color:var(--folha); font-weight:700; } table.mapa th.hoje { background:var(--marca); color:#fff; }
td.c-confirmada { background:#9fd0b0; } td.c-pendente { background:#f4d58a; } td.c-bloqueio { background:#9aa7a5; } td.c-externo { background:#f0a3a6; }
td.c-livre { cursor:pointer; } td[data-id] { cursor:pointer; }
.legenda { display:flex; gap:.9rem; flex-wrap:wrap; font-size:.78rem; color:var(--suave); margin-top:.7rem; }
.legenda i { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:.3rem; vertical-align:-1px; }

.apto { background:var(--papel); border:1px solid var(--linha); border-radius:16px; padding:1rem; margin-bottom:.9rem; display:grid; gap:.7rem; }
.apto h3 { font-size:1.1rem; }
.apto label, .form label { display:grid; gap:.25rem; font-size:.8rem; font-weight:600; color:var(--suave); }
.apto small { color:var(--suave); font-size:.78rem; } .apto small.ruim { color:var(--ruim); }
.copiar { display:flex; gap:.4rem; } .copiar input { font-size:.75rem; }
.dica { background:#dcefe5; border-radius:12px; padding:.8rem 1rem; font-size:.85rem; line-height:1.45; margin-bottom:1rem; }

.folha { border:0; padding:0; width:100%; max-width:560px; margin:auto auto 0; border-radius:20px 20px 0 0; background:var(--papel); color:var(--tinta); max-height:92dvh; }
.folha::backdrop { background:rgba(22,40,44,.55); }
#folha-corpo { padding:1.2rem 1.1rem calc(1.4rem + env(safe-area-inset-bottom)); display:grid; gap:.8rem; }
#folha-corpo h2 { font-size:1.2rem; }
.form { display:grid; gap:.7rem; } .duas { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.dados { display:grid; grid-template-columns:auto 1fr; gap:.3rem .9rem; font-size:.95rem; margin:0; }
.dados dt { color:var(--suave); } .dados dd { margin:0; font-weight:500; }

.aviso { position:fixed; left:50%; bottom:5.5rem; transform:translateX(-50%); background:var(--tinta); color:#fff; padding:.7em 1.2em; border-radius:999px; font-size:.9rem; z-index:50; max-width:90vw; text-align:center; }
