/* 1.65.0: o calendário de período do Hub (web/calendario.js). Tokens do Hub com reserva em todo var(), claro e escuro,
   alvos de 44 px, foco visível. Computador: painel de vidro junto do botão que chamou (dois meses lado a lado quando
   cabe). Celular e app: folha de baixo com a área segura, que sobe com a mola e fecha puxando (web/folha.js). */

.cal-gatilho{display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:100%;padding:0 14px;border:.5px solid var(--sep,rgba(58,42,30,.14));border-radius:var(--r-ctl,12px);background:var(--surface,#fff);color:var(--label,#3A2A1E);font:inherit;font-weight:600;font-size:calc(15px * var(--dt,1));cursor:pointer;text-align:left}
.cal-gatilho span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit;color:inherit}
.cal-gatilho .cal-icone{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--label2,#6B5A4C)}
@media (hover:hover){.cal-gatilho:hover{background:var(--surface2,#F7F4F1)}}
.cal-gatilho:focus-visible{outline:var(--foco-largura,3px) solid var(--foco-cor,#2F7CF6);outline-offset:2px}
/* os dois input type=date de um par ligado somem: o botão fica no lugar */
[data-calendario-ligado] input[type="date"],[data-calendario-ligado] label:has(> input[type="date"]){display:none!important}
.cal-par-gatilho{display:inline-flex}
/* com o calendário ligado, o botão Aplicar do par some: o período aplica no segundo toque */
[data-calendario-ligado] .cal-aplicar-auto{display:none!important}

.cal-fundo{position:fixed;inset:0;z-index:1500;background:transparent}
.cal-fundo.centro,.cal-fundo.folha{background:var(--vidro-veu,rgba(58,42,30,.22));display:flex;align-items:center;justify-content:center}
.cal-painel{position:fixed;width:auto;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);overflow:auto;padding:6px 20px 12px;border-radius:var(--r-sheet,20px);color:var(--label,#3A2A1E);
  background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(var(--glass-blur,24px)) saturate(180%);backdrop-filter:blur(var(--glass-blur,24px)) saturate(180%);
  border:.5px solid var(--glass-border,rgba(255,255,255,.88));box-shadow:0 18px 46px rgba(40,25,12,.24)}
body.dark .cal-painel{background:rgba(34,32,30,.97)} /* quase sólido: os números do relatório atrás não atrapalham a leitura dos dias */
.cal-fundo.centro .cal-painel{position:relative}
.cal-alca{display:none}
.cal-topo{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:6px}
.cal-topo h2{margin:0;font-size:calc(18px * var(--dt,1));font-weight:700;letter-spacing:-.01em}
.cal-x,.cal-seta{width:44px;height:44px;flex:none;display:grid;place-items:center;border:0;border-radius:50%;background:var(--fill,rgba(90,65,45,.08));color:var(--label2,#6B5A4C);cursor:pointer}
.cal-x svg,.cal-seta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cal-seta:disabled{opacity:.35;cursor:default}
.cal-dica{margin:4px 0 8px;font-size:calc(13.5px * var(--dt,1));color:var(--label2,#6B5A4C);line-height:1.35;min-height:2.7em}
.cal-nav{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cal-titulo-mes{font-weight:700;font-size:calc(15px * var(--dt,1));text-align:center}
.cal-meses{display:flex;gap:18px;margin-top:6px}
.cal-mes-nome{display:none;text-align:center;font-weight:700;font-size:calc(14px * var(--dt,1));margin:2px 0 4px}
.cal-meses.dois .cal-mes-nome{display:block}
.cal-mes table{border-collapse:separate;border-spacing:0 3px}
.cal-mes th{font-size:var(--f-caption1,max(11px, calc(12px * var(--dt,1))));font-weight:600;color:var(--label2,#6B5A4C);height:24px;text-align:center}
.cal-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cal-mes td{padding:0;text-align:center}
.cal-dia{position:relative;width:44px;height:44px;border:0;border-radius:0;background:transparent;color:var(--label,#3A2A1E);font:inherit;font-size:calc(15px * var(--dt,1));font-variant-numeric:tabular-nums;cursor:pointer;z-index:0}
/* a faixa do período: um trilho contínuo, com as pontas redondas no início e no fim */
.cal-dia.faixa{background:color-mix(in srgb,var(--sys-blue,#0088FF) 16%,transparent)}
.cal-dia.faixa.provisorio{background:color-mix(in srgb,var(--sys-blue,#0088FF) 9%,transparent)}
.cal-dia.inicio{border-top-left-radius:22px;border-bottom-left-radius:22px}
.cal-dia.fim{border-top-right-radius:22px;border-bottom-right-radius:22px}
/* 1.72.0: o dia escolhido é um círculo azul cheio com o número em branco: o azul do sistema dava 3,5:1; o tom de fundo
   cheio (--on-blue) passa de 6:1 no claro e no escuro */
.cal-dia.inicio::after,.cal-dia.fim::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--on-blue,#0062B8);z-index:-1}
.cal-dia.inicio,.cal-dia.fim{color:#fff;font-weight:700}
.cal-dia.hoje:not(.inicio):not(.fim)::before{content:"";position:absolute;inset:4px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--label2,#6B5A4C)}
.cal-dia:disabled{color:var(--label4,#B4A798);cursor:default}
body.dark .cal-dia:disabled{color:#5f5750}
@media (hover:hover){.cal-dia:not(:disabled):not(.inicio):not(.fim):hover{background:var(--fill2,rgba(90,65,45,.12));border-radius:22px}}
.cal-dia:focus-visible{outline:var(--foco-largura,3px) solid var(--foco-cor,#2F7CF6);outline-offset:-2px;border-radius:22px}
.cal-rodape{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:8px;border-top:.5px solid var(--sep,rgba(58,42,30,.14))}
.cal-escolha{font-weight:600;font-size:calc(14px * var(--dt,1))}
.cal-limpar{min-height:44px;min-width:44px;padding:0 12px;border:0;border-radius:var(--r-pill,999px);background:transparent;color:var(--ink-blue,#0066CC);font:inherit;font-weight:600;cursor:pointer}
.cal-limpar:disabled{color:var(--label4,#B4A798);cursor:default}
.cal-painel button:focus-visible{outline:var(--foco-largura,3px) solid var(--foco-cor,#2F7CF6);outline-offset:2px}

/* celular e app: folha de baixo */
.cal-fundo.folha{align-items:flex-end}
/* 1.72.0 (auditoria de design 1720): as alturas das folhas do sistema (web/folha.css): nunca passa da faixa da barra de
   status, e "Limpar" fica acima do indicador de início (no app, as peças nativas somem com a folha: web/folha.js) */
.cal-fundo.folha .cal-painel{position:relative;left:auto!important;top:auto!important;width:100%;max-width:100%;max-height:var(--folha-grande,92vh);border-radius:var(--r-sheet,20px) var(--r-sheet,20px) 0 0;padding:6px 16px var(--folha-base,calc(14px + env(safe-area-inset-bottom,0px)))}
@media (min-width:641px){.cal-fundo.folha .cal-painel{padding-left:20px;padding-right:20px}} /* 1.72.0: margem de 20 pt no iPad */
.cal-fundo.folha .cal-alca{display:block;width:36px;height:5px;margin:4px auto 0;border-radius:3px;background:var(--fill3,rgba(90,65,45,.16))}
.cal-fundo.folha .cal-mes{flex:1}
.cal-fundo.folha .cal-mes table{width:100%}
.cal-fundo.folha .cal-dia{width:100%;min-width:44px}
@media (prefers-reduced-transparency:reduce){.cal-painel{background:var(--surface,#fff);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (forced-colors:active){.cal-dia.inicio,.cal-dia.fim,.cal-dia.faixa{outline:2px solid Highlight}}