/* Calendário de tarefas (#/calendario) — Mês / Semana, tarefas no dia do prazo com a cor do status,
   barras início → prazo, "Sem data" na lateral e reuniões do Google sobrepostas (opcional). */

.cal-topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.cal-nav { display: inline-flex; }
.cal-titulo { font-size: calc(19px * var(--fs, 1)); font-weight: 500; flex: 1 1 auto; min-width: 180px; }
.cal-filtros { margin-bottom: 10px; }
.cal-op { align-items: center; font-size: calc(14px * var(--fs, 1)); padding: 7px 12px 7px 10px; border: 1px solid var(--linha); border-radius: var(--r-pilula); background: var(--superficie); }
.cal-op input { margin: 0; width: 16px; height: 16px; accent-color: var(--tinta); }
.cal-legenda { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 14px; font-size: calc(12px * var(--fs, 1)); color: var(--tinta-2); }
.cal-legenda__item { display: inline-flex; align-items: center; gap: 6px; }
.cal-legenda__item i { width: 9px; height: 9px; border-radius: 3px; background: var(--st); }
.cal-legenda__item[data-status="a-fazer"] i { background: transparent; box-shadow: inset 0 0 0 1.5px var(--st-a-fazer); }
.cal-legenda__atrasada i { background: transparent; box-shadow: inset 0 0 0 2px var(--erro); }

.cal { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 18px; align-items: start; }
.cal-area { min-width: 0; }

/* ---- Grade ---- */
.cal-mes { background: var(--superficie); border: 1px solid var(--linha-suave); border-radius: var(--r-card); box-shadow: var(--sombra); overflow: hidden; }
.cal-cab { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-bottom: 1px solid var(--linha); }
.cal-cab span { padding: 9px 0; text-align: center; font-family: var(--dados); font-size: calc(10.5px * var(--fs, 1)); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-2); }
.cal-sem { position: relative; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); min-height: 128px; border-top: 1px solid var(--linha-suave); }
.cal-sem:first-of-type, .cal-cab + .cal-sem { border-top: 0; }
.cal-mes--semana .cal-sem { min-height: 62vh; }
.cal-dia { grid-row: 1 / -1; border-left: 1px solid var(--linha-suave); transition: background-color var(--t-rapido); }
.cal-dia:first-child { border-left: 0; }
.cal-dia.fds { background: color-mix(in srgb, var(--tinta) 2%, transparent); }
.cal-dia.fora { background: color-mix(in srgb, var(--tinta) 4%, transparent); }
.cal-dia.hoje { background: color-mix(in srgb, var(--amarelo) 9%, transparent); }
.cal-dia.alvo { background: color-mix(in srgb, var(--amarelo) 24%, transparent); box-shadow: inset 0 0 0 2px var(--amarelo); }

.cal-dia__num {
  grid-row: 1; justify-self: stretch; display: flex; align-items: center; justify-content: center; gap: 6px; position: relative; z-index: 1;
  border: 0; background: transparent; cursor: pointer; padding: 6px 4px 4px; color: var(--tinta); font: 600 calc(12px * var(--fs, 1)) var(--texto);
}
.cal-dia__num b { min-width: 26px; height: 26px; padding: 0 7px; border-radius: 13px; display: inline-grid; place-items: center; font-weight: 600; transition: background-color var(--t-rapido); }
.cal-dia__num span { font-family: var(--dados); font-size: calc(10.5px * var(--fs, 1)); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-2); font-weight: 500; }
.cal-mes--semana .cal-dia__num b { font: 500 calc(20px * var(--fs, 1)) var(--display); height: 38px; min-width: 38px; border-radius: 19px; }
.cal-dia__num:hover b { background: var(--linha-suave); }
.cal-dia__mais { position: absolute; right: 6px; top: 8px; opacity: 0; color: var(--tinta-2); display: inline-grid; transition: opacity var(--t-rapido); }
.cal-dia__mais .ico { width: 15px; height: 15px; }
.cal-dia__num:hover .cal-dia__mais, .cal-dia__num:focus-visible .cal-dia__mais { opacity: 1; }
.cal-dia.fora + .cal-dia__num { color: var(--tinta-2); }
.cal-dia.hoje + .cal-dia__num b { background: var(--tinta); color: var(--fundo); }

.cal-dia__lista { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 2px; padding: 2px 4px 8px; min-width: 0; }

/* Tarefa (chip) */
.cal-t {
  display: flex; align-items: center; gap: 6px; width: 100%; min-width: 0; padding: 3px 7px 3px 6px; border: 0; border-radius: 7px; cursor: grab; text-align: left;
  background: color-mix(in srgb, var(--st) 14%, var(--superficie)); color: var(--tinta); font: 500 calc(12.5px * var(--fs, 1)) / 1.3 var(--texto);
  transition: background-color var(--t-rapido), opacity var(--t-rapido); touch-action: none;
}
.cal-t:hover { background: color-mix(in srgb, var(--st) 26%, var(--superficie)); }
.cal-t[data-status="a-fazer"] { background: transparent; box-shadow: inset 0 0 0 1px var(--linha); }
.cal-t[data-status="a-fazer"]:hover { background: var(--linha-suave); }
.cal-t__ponto { width: 8px; height: 8px; flex: none; border-radius: 3px; background: var(--st); }
.cal-t[data-status="a-fazer"] .cal-t__ponto { background: transparent; box-shadow: inset 0 0 0 1.5px var(--st-a-fazer); }
.cal-t__titulo { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.cal-t__titulo .mono { color: var(--tinta-2); font-size: calc(10.5px * var(--fs, 1)); }
.cal-t.feita { opacity: .68; } /* esmaecida, mas ainda com contraste de texto */
.cal-t.feita .cal-t__titulo { text-decoration: line-through; }
.cal-t.atrasada { box-shadow: inset 0 0 0 1.5px var(--erro); }
.cal-t.arrastando, .cal-barra.arrastando { opacity: .3; }
.cal-t__meta { display: none; }
.cal-mes--semana .cal-t, .cal-semdata .cal-t { flex-wrap: wrap; padding: 6px 8px; row-gap: 2px; }
.cal-mes--semana .cal-t__titulo, .cal-semdata .cal-t__titulo { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cal-mes--semana .cal-t__meta, .cal-semdata .cal-t__meta { display: flex; flex-wrap: wrap; gap: 2px 8px; width: 100%; padding-left: 14px; font-size: calc(11.5px * var(--fs, 1)); color: var(--tinta-2); }

/* Barra início → prazo */
.cal-barra {
  position: relative; z-index: 2; margin: 1px 3px; padding: 3px 9px; border: 0; border-radius: 7px; cursor: grab; text-align: left; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; touch-action: none;
  background: color-mix(in srgb, var(--st) 30%, var(--superficie)); box-shadow: inset 3px 0 0 var(--st); color: var(--tinta); font: 600 calc(12px * var(--fs, 1)) var(--texto);
}
.cal-barra:hover { background: color-mix(in srgb, var(--st) 42%, var(--superficie)); }
.cal-barra[data-status="a-fazer"] { background: var(--superficie-2); }
.cal-barra.corta-ini { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; box-shadow: none; }
.cal-barra.corta-fim { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: 0; }
.cal-barra.feita { opacity: .68; text-decoration: line-through; }
.cal-barra.atrasada { box-shadow: inset 3px 0 0 var(--st), inset 0 0 0 1.5px var(--erro); }

/* Reuniões do Google (sobreposição, só leitura) */
.cal-g {
  display: flex; align-items: center; gap: 5px; min-width: 0; padding: 2px 6px; border-radius: 6px; text-decoration: none; color: var(--tinta-2);
  font: 500 calc(11.5px * var(--fs, 1)) var(--texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: 1px dashed var(--linha);
}
.cal-g:hover { color: var(--tinta); border-color: var(--tinta-3); }
.cal-g i { width: 7px; height: 7px; border-radius: 50%; background: var(--c); flex: none; }
.cal-g .mono { font-size: calc(10.5px * var(--fs, 1)); }
.cal-g--mais { border: 0; padding-left: 8px; background: transparent; cursor: pointer; text-align: left; }
.cal-mais { border: 0; background: transparent; text-align: left; padding: 2px 7px; cursor: pointer; font: 600 calc(11.5px * var(--fs, 1)) var(--texto); color: var(--tinta-2); border-radius: 6px; }
.cal-mais:hover { background: var(--linha-suave); color: var(--tinta); }

/* Fantasma do arrasto */
.cal-fantasma { position: fixed; left: 0; top: 0; z-index: 1000; pointer-events: none; box-shadow: var(--sombra-alta) !important; opacity: .95; cursor: grabbing; }

/* ---- Sem data ---- */
.cal-semdata { position: sticky; top: 12px; display: grid; gap: 8px; padding: 14px; border-radius: var(--r-card); border: 1px dashed var(--linha); background: var(--superficie); max-height: calc(100vh - 40px); overflow: hidden; grid-template-rows: auto auto minmax(0, 1fr); transition: background-color var(--t-rapido), border-color var(--t-rapido); }
.cal-semdata.alvo { border-color: var(--amarelo); background: color-mix(in srgb, var(--amarelo) 10%, var(--superficie)); }
.cal-semdata__topo { display: flex; align-items: center; justify-content: space-between; }
.cal-semdata__topo .mono { font-size: calc(13px * var(--fs, 1)); }
.cal-semdata__dica { font-size: calc(12px * var(--fs, 1)); line-height: 1.4; }
.cal-semdata__lista { display: flex; flex-direction: column; gap: 4px; overflow-y: auto; min-height: 60px; padding-right: 2px; }
.cal-semdata__vazio { font-size: calc(13px * var(--fs, 1)); padding: 10px 0; }

.cal-form { display: grid; gap: 14px; margin-top: 12px; }
.cal-form__linha { display: grid; grid-template-columns: 1.4fr 1fr; gap: 10px; }

@media (max-width: 1100px) {
  .cal { grid-template-columns: minmax(0, 1fr); }
  .cal-semdata { position: static; max-height: 320px; }
}
@media (max-width: 700px) {
  .cal-sem { min-height: 96px; }
  .cal-t__titulo .mono, .cal-g .mono { display: none; }
  .cal-t { padding: 2px 4px; font-size: calc(11px * var(--fs, 1)); }
  .cal-dia__lista { padding: 2px 1px 6px; }
}