/* ============================================================
   PAINEL DA DRA. — calendário e listas de gestão.
   Separado de screens.css porque é uma tela só, grande, e que a
   família nunca vê.
   ============================================================ */

/* ------------------------------------------------------------
   barra de navegação do calendário
   ------------------------------------------------------------ */
.ag-barra{display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; margin-bottom:16px}
.ag-titulo{font-family:var(--f-tit); font-size:1.15rem; margin:0; text-transform:capitalize}

.ag-legenda{display:flex; gap:16px; flex-wrap:wrap; align-items:center; margin-top:14px;
  font-size:.78rem; font-weight:700; color:var(--tinta-2)}
.ag-legenda span{display:flex; align-items:center; gap:6px}
.ag-legenda .cor{width:14px; height:14px; border-radius:5px; background:var(--anil); display:inline-block}

/* ------------------------------------------------------------
   grade de semana e dia

   A rolagem horizontal fica presa aqui dentro: o corpo da página
   nunca rola de lado, nem no celular.
   ------------------------------------------------------------ */
.ag-rolagem{overflow-x:auto; overflow-y:visible; border-radius:var(--r-md);
  border:1px solid var(--borda); background:var(--papel); box-shadow:var(--sm-1);
  -webkit-overflow-scrolling:touch}

.ag-grade{display:grid; grid-template-columns:56px repeat(var(--colunas), minmax(120px, 1fr));
  min-width:max-content; position:relative}
.ag-grade.ag-dia{grid-template-columns:56px 1fr; min-width:0}

.ag-canto{position:sticky; top:0; left:0; z-index:5; background:var(--papel);
  border-bottom:2px solid var(--borda)}
.ag-cab{position:sticky; top:0; z-index:4; background:var(--papel); text-align:center;
  padding:8px 4px; border-bottom:2px solid var(--borda); border-left:1px solid var(--borda)}
.ag-cab small{display:block; font-size:.68rem; font-weight:800; color:var(--tinta-3);
  text-transform:uppercase; letter-spacing:.06em}
.ag-cab b{font-family:var(--f-tit); font-size:1.25rem}
.ag-cab.hoje{background:color-mix(in srgb, var(--anil) 12%, var(--papel))}
.ag-cab.hoje b{color:var(--anil)}

.ag-eixo{position:relative; border-right:1px solid var(--borda)}
.ag-eixo span{position:absolute; right:6px; transform:translateY(-50%); font-size:.68rem;
  font-weight:800; color:var(--tinta-3); white-space:nowrap}

.ag-col{position:relative; border-left:1px solid var(--borda); touch-action:none}
.ag-col.hoje{background:color-mix(in srgb, var(--anil) 4%, transparent)}
.ag-linha{position:absolute; left:0; right:0; height:1px; background:var(--borda); pointer-events:none}

/* faixa em que a família pode marcar — o resto do dia é encaixe */
.ag-slot{position:absolute; left:2px; right:2px; border-radius:6px; pointer-events:none;
  background:color-mix(in srgb, var(--menta) 9%, transparent)}

.ag-agora{position:absolute; left:0; right:0; height:2px; background:var(--coral); z-index:3;
  pointer-events:none; box-shadow:0 0 0 1px #fff}
.ag-agora::before{content:''; position:absolute; left:-4px; top:-4px; width:10px; height:10px;
  border-radius:50%; background:var(--coral)}

/* ------------------------------------------------------------
   os três tipos de evento, deliberadamente distintos
   ------------------------------------------------------------ */
.ag-ev{position:absolute; border-radius:8px; padding:4px 7px; overflow:hidden; cursor:grab;
  border-left:4px solid var(--cor, var(--anil)); background:color-mix(in srgb, var(--cor, var(--anil)) 16%, #fff);
  color:var(--tinta); font-size:.76rem; line-height:1.25; z-index:2; touch-action:none;
  transition:box-shadow var(--t-rapido)}
.ag-ev b{display:block; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ag-ev small{display:block; color:var(--tinta-2); font-size:.68rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ag-ev.baixo{padding:1px 6px; display:flex; align-items:center}
.ag-ev:hover{box-shadow:var(--sm-1); z-index:6}
.ag-ev.arrastando{cursor:grabbing; opacity:.85; box-shadow:var(--sm-2); z-index:20}
.ag-ev.feita{opacity:.6}
.ag-ev.feita b{text-decoration:line-through}

.ag-ev.tipo-primeira,.ag-chip.tipo-primeira,.cor.tipo-primeira{--cor:var(--coral)}
.ag-ev.tipo-retorno,.ag-chip.tipo-retorno,.cor.tipo-retorno{--cor:var(--anil)}
.ag-ev.tipo-teste,.ag-chip.tipo-teste,.cor.tipo-teste{--cor:var(--lilas)}
.ag-ev.tipo-urgencia,.ag-chip.tipo-urgencia,.cor.tipo-urgencia{--cor:var(--sol)}
.cor.tipo-primeira,.cor.tipo-retorno,.cor.tipo-teste,.cor.tipo-urgencia{background:var(--cor)}

/* bloqueio: hachura, para não parecer consulta nem de longe */
.ag-ev.bloqueio,.cor.cor-bloqueio{
  --cor:var(--tinta-3);
  background:repeating-linear-gradient(45deg,
    color-mix(in srgb, var(--tinta-3) 18%, #fff) 0 6px,
    color-mix(in srgb, var(--tinta-3) 26%, #fff) 6px 12px);
  cursor:pointer}
.ag-ev.bloqueio b{color:var(--tinta-2)}

/* agenda pessoal do Google: cinza, tracejado, e não se arrasta */
.ag-ev.google,.cor.cor-google{
  --cor:var(--tinta-3);
  background:color-mix(in srgb, var(--tinta-3) 10%, #fff);
  border:1px dashed var(--tinta-3); border-left:4px dashed var(--tinta-3);
  cursor:default}
.ag-ev.google b{color:var(--tinta-2); font-weight:700}
.cor.cor-google{background:repeating-linear-gradient(45deg,#fff 0 3px,var(--borda) 3px 6px);
  border:1px dashed var(--tinta-3)}

/* faixa sendo pintada com o dedo ou o mouse */
.ag-selecao{position:absolute; left:2px; right:2px; z-index:10; pointer-events:none;
  border-radius:8px; border:2px dashed var(--anil);
  background:color-mix(in srgb, var(--anil) 14%, transparent);
  color:var(--anil-esc); font-size:.7rem; font-weight:800; padding:3px 6px}

/* ------------------------------------------------------------
   vista de mês
   ------------------------------------------------------------ */
.ag-mes{display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--borda);
  border:1px solid var(--borda); border-radius:var(--r-md); overflow:hidden; box-shadow:var(--sm-1)}
.ag-mes-cab{background:var(--papel-2); text-align:center; padding:8px 2px; font-size:.68rem;
  font-weight:900; color:var(--tinta-3); text-transform:uppercase; letter-spacing:.06em}
.ag-mes-dia{background:var(--papel); min-height:104px; padding:6px; cursor:pointer;
  display:flex; flex-direction:column; gap:3px; transition:var(--t-rapido)}
.ag-mes-dia:hover{background:var(--papel-2)}
.ag-mes-dia.fora{opacity:.45}
.ag-mes-dia.hoje{background:color-mix(in srgb, var(--anil) 10%, var(--papel))}
.ag-mes-dia .num{font-family:var(--f-tit); font-weight:800; font-size:.9rem}
.ag-mes-dia.hoje .num{color:var(--anil)}
.ag-chip{font-size:.66rem; font-weight:700; padding:2px 6px; border-radius:99px;
  background:color-mix(in srgb, var(--cor, var(--anil)) 18%, #fff);
  border-left:3px solid var(--cor, var(--anil));
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ag-chip.bloqueio{background:repeating-linear-gradient(45deg,#eef1fa 0 4px,#e2e7f5 4px 8px);
  border-left-color:var(--tinta-3)}
.ag-chip.google{background:#f4f6fc; border-left:3px dashed var(--tinta-3); color:var(--tinta-2)}
.ag-mais{font-size:.66rem; font-weight:800; color:var(--tinta-3)}

/* ------------------------------------------------------------
   encaixe e ficha em modal
   ------------------------------------------------------------ */
.ag-encaixe{border:2px solid var(--anil)}
.ag-busca-resultados{display:grid; gap:6px; margin:-6px 0 14px}
.ag-resultado{text-align:left; padding:8px 12px; border-radius:var(--r-xs); cursor:pointer;
  background:var(--papel-2); border:2px solid var(--borda); transition:var(--t-rapido)}
.ag-resultado:hover{border-color:var(--anil)}
.ag-resultado.on{border-color:var(--menta); background:color-mix(in srgb, var(--menta) 12%, var(--papel-2))}
.ag-resultado b{display:block; font-size:.9rem}
.ag-resultado small{color:var(--tinta-3); font-size:.76rem}
.ag-ficha .ficha{margin:0; box-shadow:none; border:none}

/* ------------------------------------------------------------
   listas: pacientes, clientes, retornos
   ------------------------------------------------------------ */
.dra-filtros{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:18px}
.dra-filtros input{flex:1; min-width:220px; padding:11px 16px; border-radius:var(--r-pill);
  border:2px solid var(--borda); background:var(--papel); font:inherit; font-size:.9rem}
.dra-filtros input:focus{outline:none; border-color:var(--anil)}

.pessoa{background:var(--papel); border:1px solid var(--borda); border-radius:var(--r-md);
  box-shadow:var(--sm-1); margin-bottom:12px; overflow:hidden}
/* o cartão não abre nem fecha: o cabeçalho é só cabeçalho */
.pessoa-cab{display:flex; align-items:center; gap:14px; width:100%; padding:14px 18px;
  background:var(--papel-2); border-bottom:1px solid var(--borda); text-align:left}
.pessoa-cab .info{flex:1; min-width:0}
.pessoa-cab .info b{display:block; font-family:var(--f-tit); font-size:1.05rem}
.pessoa-cab .info small{color:var(--tinta-3); font-size:.8rem;
  display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pessoa-cab .inicial{width:44px; height:44px; flex:none; border-radius:50%; display:grid;
  place-items:center; background:var(--anil); color:#fff; font-family:var(--f-tit);
  font-size:1.3rem; font-weight:800}
.pessoa-num{text-align:center; flex:none}
.pessoa-num b{display:block; font-family:var(--f-tit); font-size:1.3rem; color:var(--anil)}
.pessoa-num small{font-size:.66rem; color:var(--tinta-3); font-weight:700}
.pessoa-corpo{padding:14px 18px 18px}

.retorno{background:var(--papel); border:1px solid var(--borda); border-left:6px solid var(--menta);
  border-radius:var(--r-md); box-shadow:var(--sm-1); padding:16px 18px; margin-bottom:12px}
.retorno-medio{border-left-color:var(--sol)}
.retorno-grave{border-left-color:var(--coral)}
.retorno .atraso{text-align:right; flex:none}
.retorno .atraso b{display:block; font-family:var(--f-tit); font-size:1.05rem}
.retorno-grave .atraso b{color:var(--coral-esc)}
.retorno-medio .atraso b{color:var(--sol-esc)}
.retorno .atraso small{font-size:.66rem; color:var(--tinta-3); font-weight:700}

@media (max-width:640px){
  .ag-barra{justify-content:center}
  .ag-titulo{order:-1; width:100%; text-align:center}
  .ag-grade{grid-template-columns:44px repeat(var(--colunas), minmax(104px, 1fr))}
  .ag-mes-dia{min-height:76px; padding:4px}
  .ag-chip{font-size:.6rem}
}

@media print{
  .ag-barra,.ag-legenda,.dra-filtros{display:none}
  .ag-rolagem{overflow:visible; box-shadow:none}
}

/* ============================================================
   CONFIGURAÇÕES
   ============================================================ */
.cfg-abas{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px}
.cfg-caixa{background:var(--papel); border:1px solid var(--borda); border-radius:var(--r-md);
  box-shadow:var(--sm-1); padding:22px}
.cfg-caixa .campo{margin-bottom:14px}
.cfg-caixa textarea{resize:vertical; min-height:70px; font-family:inherit; line-height:1.5}

.cfg-rodape{display:flex; justify-content:space-between; align-items:center; gap:12px;
  flex-wrap:wrap; margin-top:18px; position:sticky; bottom:0; z-index:5;
  background:linear-gradient(to top, var(--papel-2) 62%, transparent);
  padding:14px 4px 6px}

.cfg-liga{display:flex; gap:12px; align-items:flex-start; padding:12px 14px; cursor:pointer;
  border:2px solid var(--borda); border-radius:var(--r-md); background:var(--papel-2); margin-bottom:12px}
.cfg-liga:hover{border-color:var(--anil)}
.cfg-liga:has(input:checked){border-color:var(--menta);
  background:color-mix(in srgb, var(--menta) 10%, var(--papel-2))}
.cfg-liga input{width:20px; height:20px; flex:none; margin-top:2px; accent-color:var(--anil)}
.cfg-liga b{display:block; font-size:.92rem}
.cfg-liga small{color:var(--tinta-3); font-size:.8rem}

.cfg-lista{display:grid; gap:12px; margin-bottom:14px}
.cfg-item{display:grid; gap:12px; align-items:end; padding:14px; border-radius:var(--r-md);
  background:var(--papel-2); border:1px solid var(--borda);
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr))}
.cfg-item .campo{margin:0}
.cfg-chave{grid-column:1/-1; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.72rem;
  font-weight:800; color:var(--tinta-3); background:var(--papel); padding:3px 9px;
  border-radius:99px; justify-self:start; border:1px solid var(--borda)}
.cfg-item-fase{grid-template-columns:1fr 1.6fr}
.cfg-item-tipo{grid-template-columns:70px 1.2fr 1.4fr 90px auto}

/* horários da grade */
.cfg-horarios{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px}
.cfg-hora{display:inline-flex; align-items:center; gap:4px; background:var(--papel-2);
  border:2px solid var(--borda); border-radius:var(--r-pill); padding:4px 6px 4px 12px}
.cfg-hora input{border:none; background:none; font:inherit; font-weight:800; width:78px}
.cfg-hora input:focus{outline:none}
.cfg-hora .x{border:none; background:none; cursor:pointer; color:var(--tinta-3);
  font-size:.9rem; padding:2px 6px; border-radius:50%}
.cfg-hora .x:hover{background:var(--coral); color:#fff}

/* pré-visualização */
.cfg-previa{margin-top:8px; padding:18px; border-radius:var(--r-md);
  background:linear-gradient(135deg, var(--ceu-1), var(--ceu-2));
  border:1px dashed var(--anil)}
.cfg-previa-msg{background:var(--papel); border-style:solid; border-color:var(--borda);
  font-size:.88rem; line-height:1.5}
.cfg-alerta{margin-top:10px; padding:8px 12px; border-radius:var(--r-xs); font-size:.82rem;
  font-weight:700; background:color-mix(in srgb, var(--sol) 22%, #fff); color:var(--sol-esc)}

.cfg-marcadores{display:flex; gap:6px; flex-wrap:wrap}
.cfg-marcadores span{font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.74rem;
  font-weight:700; background:var(--papel); border:1px solid var(--borda);
  border-radius:99px; padding:2px 9px; cursor:help}

/* formulários de cadastro */
.form-secao{margin-top:18px}
.form-acoes{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:20px}
.vinculo{display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:var(--r-md);
  background:var(--papel-2); border:1px solid var(--borda); margin-bottom:8px}
.vinculo .quem{flex:1; min-width:0}
.vinculo .quem b{display:block; font-size:.92rem}
.vinculo .quem small{color:var(--tinta-3); font-size:.78rem}
.vinculo .selo-principal{font-size:.66rem; font-weight:900; text-transform:uppercase;
  letter-spacing:.06em; color:var(--menta-esc); background:color-mix(in srgb, var(--menta) 18%, #fff);
  padding:3px 9px; border-radius:99px}

@media (max-width:640px){
  .cfg-caixa{padding:16px}
  .cfg-item,.cfg-item-fase,.cfg-item-tipo{grid-template-columns:1fr}
}

/* respostas dos questionários */
.selo-consulta{font-size:.68rem; font-weight:900; text-transform:uppercase; letter-spacing:.05em;
  padding:4px 10px; border-radius:99px; white-space:nowrap; flex:none;
  color:var(--menta-esc); background:color-mix(in srgb, var(--menta) 18%, #fff)}
.selo-consulta.sem{color:var(--sol-esc); background:color-mix(in srgb, var(--sol) 22%, #fff)}
.resposta.sem-consulta{border-left:5px solid var(--sol)}
