/* =============================================================
   Agenda das autoridades (app/Visoes/parciais/agenda/calendario.php), no painel e no site: barra, filtro das agendas
   e as visões Mês (grade), Semana (horários) e Lista; a janela do compromisso no site (#ag-detalhe).
   Cada compromisso usa a cor da agenda em --ag-cor.
   ============================================================= */
.ag { --ag-linha: #e1e7ee; --ag-suave: #5b6876; --ag-primaria: var(--cs-primaria, #26547c); --ag-hora-alt: 48px; }

/* Barra: Hoje, setas, título e a forma de ver */
.ag-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-bottom: .9rem; }
.ag-nav { display: flex; align-items: center; gap: .3rem; min-width: 0; }
.ag-hoje { margin-right: .35rem; padding: .38rem .95rem; border: 1px solid #c9d3de; border-radius: 999px; background: #fff; color: #23303d; font-weight: 600; text-decoration: none; }
.ag-hoje:hover { background: #f1f4f8; color: #23303d; }
.ag-seta { display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; color: #3b4754; text-decoration: none; }
.ag-seta:hover { background: #e9eef4; color: #1d2733; }
.ag-titulo { margin: 0 0 0 .35rem; font-size: 1.35rem; font-weight: 600; color: #1d2733; }
.ag-visoes { display: inline-flex; border: 1px solid #c9d3de; border-radius: 999px; overflow: hidden; background: #fff; }
.ag-visao { padding: .38rem .95rem; color: #3b4754; font-size: .9rem; font-weight: 600; text-decoration: none; }
.ag-visao + .ag-visao { border-left: 1px solid #c9d3de; }
.ag-visao:hover { background: #f1f4f8; color: #1d2733; }
.ag-visao.ativo { background: color-mix(in srgb, var(--ag-primaria) 14%, #fff); color: var(--ag-primaria); }
.ag-hoje:focus-visible, .ag-seta:focus-visible, .ag-visao:focus-visible, .ag-filtro:focus-visible, .ag-novo:focus-visible, .ag-mais:focus-visible { outline: 3px solid var(--ag-primaria); outline-offset: 2px; }

/* Agendas (gabinete: prefeito(a), vice e chefe de gabinete) */
.ag-filtros { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.ag-filtro { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .8rem; border: 1px solid #d5dde6; border-radius: 999px; background: #fff; color: #2c3946; font-size: .88rem; text-decoration: none; }
.ag-filtro small { color: var(--ag-suave); }
.ag-filtro:hover { background: #f1f4f8; color: #1d2733; }
.ag-filtro.ativo { border-color: var(--ag-cor, var(--ag-primaria)); background: color-mix(in srgb, var(--ag-cor, var(--ag-primaria)) 12%, #fff); font-weight: 700; }
.ag-ponto { display: inline-block; flex: none; width: .65rem; height: .65rem; border-radius: 50%; background: var(--ag-cor, var(--ag-primaria)); }

/* Compromisso na grade (mês, semana e dia inteiro) */
.ag-evento { display: flex; align-items: baseline; gap: .3rem; width: 100%; min-width: 0; padding: .12rem .4rem; border: 0; border-radius: 6px;
    background: color-mix(in srgb, var(--ag-cor) 15%, #fff); color: #1d2733; font-size: .78rem; line-height: 1.35; text-align: left; text-decoration: none;
    white-space: nowrap; overflow: hidden; cursor: pointer; }
.ag-evento:hover { background: color-mix(in srgb, var(--ag-cor) 26%, #fff); color: #1d2733; }
.ag-evento:focus-visible { outline: 2px solid var(--ag-cor); outline-offset: 1px; }
.ag-evento-hora { flex: none; font-weight: 700; color: color-mix(in srgb, var(--ag-cor) 75%, #000); }
.ag-evento-titulo { overflow: hidden; text-overflow: ellipsis; }
.ag-evento.dia-inteiro { background: var(--ag-cor); color: #fff; }
.ag-evento.dia-inteiro:hover { background: color-mix(in srgb, var(--ag-cor) 85%, #000); color: #fff; }
.ag-evento.cancelado .ag-evento-titulo { text-decoration: line-through; opacity: .8; }
/* Interno (só no painel): listrado */
.ag-evento.interno { background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgba(255, 255, 255, .55) 6px 9px); }

/* Mês */
.ag-mes { width: 100%; table-layout: fixed; border-collapse: collapse; border: 1px solid var(--ag-linha); background: #fff; }
.ag-mes th { padding: .45rem; border-bottom: 1px solid var(--ag-linha); color: var(--ag-suave); font-size: .74rem; font-weight: 700; text-align: center; text-transform: uppercase; letter-spacing: .04em; }
.ag-mes th abbr { text-decoration: none; cursor: default; }
.ag-dia { height: 7.4rem; padding: .3rem .3rem .4rem; border: 1px solid var(--ag-linha); vertical-align: top; }
.ag-dia.fora { background: #f7f9fb; }
.ag-dia.fora .ag-dia-num { color: #8e9aa7; }
.ag-dia-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: .2rem; }
.ag-dia-num { display: inline-grid; place-items: center; min-width: 1.75rem; height: 1.75rem; border-radius: 50%; color: #2c3946; font-size: .85rem; font-weight: 600; }
.ag-dia.hoje .ag-dia-num { background: var(--ag-primaria); color: #fff; }
.ag-dia { overflow: hidden; }
.ag-dia-lista { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; margin: 0; padding: 0; list-style: none; }
.ag-dia-lista > li { min-width: 0; }
.ag-mais { display: inline-block; margin-top: 2px; padding: 0 .4rem; color: var(--ag-suave); font-size: .76rem; font-weight: 700; text-decoration: none; }
.ag-mais:hover { text-decoration: underline; }
/* No celular, a grade mostra pontos e a programação do mês vem logo abaixo */
.ag-mes-lista { margin-top: 1rem; }
@media (min-width: 768px) { .ag-mes-lista { display: none; } }
@media (max-width: 767.98px) {
    .ag-titulo { font-size: 1.1rem; }
    .ag-dia { height: 3.5rem; padding: .15rem; }
    .ag-dia-lista { display: flex; flex-wrap: wrap; gap: 3px; padding: 0 .2rem; }
    .ag-dia-lista .ag-evento { width: .5rem; height: .5rem; padding: 0; border-radius: 50%; background: var(--ag-cor); }
    .ag-dia-lista .ag-evento > :not(.visually-hidden) { display: none; }
    .ag-mais { display: none; }
}

/* Botão "+" de um dia (painel) */
.ag-novo { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ag-suave); opacity: 0; }
.ag-dia:hover .ag-novo, .ag-semana-dia:hover .ag-novo, .ag-novo:focus-visible { opacity: 1; }
.ag-novo:hover { background: #e9eef4; color: var(--ag-primaria); }
@media (hover: none) { .ag-novo { opacity: 1; } }

/* Semana */
.ag-semana { border: 1px solid var(--ag-linha); background: #fff; overflow-x: auto; }
.ag-semana-cabeca, .ag-semana-inteiro, .ag-semana-grade { display: grid; grid-template-columns: 3.4rem repeat(7, minmax(6.3rem, 1fr)); min-width: 48rem; }
.ag-semana-dia { position: relative; display: flex; flex-direction: column; align-items: center; padding: .4rem 0; border-left: 1px solid var(--ag-linha); }
.ag-semana-dia-nome { color: var(--ag-suave); font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.ag-semana-dia-num { display: inline-grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; font-size: 1.15rem; font-weight: 600; }
.ag-semana-dia.hoje .ag-semana-dia-num { background: var(--ag-primaria); color: #fff; }
.ag-semana-dia .ag-novo { position: absolute; top: .25rem; right: .25rem; }
.ag-semana-inteiro { border-top: 1px solid var(--ag-linha); border-bottom: 1px solid var(--ag-linha); }
.ag-semana-inteiro > div { display: grid; align-content: start; gap: 2px; min-height: 1.9rem; padding: 2px; border-left: 1px solid var(--ag-linha); }
.ag-semana-rotulo { align-self: center; padding: 0 .35rem; color: var(--ag-suave); font-size: .68rem; text-align: right; }
.ag-semana-horas span { display: block; height: var(--ag-hora-alt); padding: .1rem .35rem 0 0; color: var(--ag-suave); font-size: .7rem; text-align: right; }
.ag-semana-coluna { position: relative; height: calc(var(--ag-horas) * var(--ag-hora-alt)); border-left: 1px solid var(--ag-linha);
    background-image: repeating-linear-gradient(to bottom, var(--ag-linha) 0 1px, transparent 1px var(--ag-hora-alt)); }
.ag-semana-coluna.hoje { background-color: color-mix(in srgb, var(--ag-primaria) 4%, #fff); }
.ag-semana-coluna[data-ag-novo-coluna] { cursor: pointer; }
.ag-semana-evento { position: absolute; top: calc(var(--ini) * var(--ag-hora-alt) / 60); height: calc(var(--dur) * var(--ag-hora-alt) / 60 - 2px);
    left: calc(100% * var(--col) / var(--cols) + 2px); width: calc(100% / var(--cols) - 4px); }
.ag-semana-evento .ag-evento { flex-direction: column; align-items: flex-start; gap: 0; height: 100%; padding: .2rem .4rem; background: var(--ag-cor); color: #fff; white-space: normal; }
.ag-semana-evento .ag-evento:hover { background: color-mix(in srgb, var(--ag-cor) 85%, #000); color: #fff; }
.ag-semana-evento .ag-evento-hora { color: #fff; font-weight: 600; opacity: .92; }
.ag-semana-evento .ag-evento-titulo { font-weight: 600; }
.ag-agora { position: absolute; left: 0; right: 0; top: calc(var(--ini) * var(--ag-hora-alt) / 60); height: 2px; background: #d93025; pointer-events: none; }
.ag-agora::before { content: ''; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: #d93025; }

/* Lista (e programação do mês no celular) */
.ag-lista-dia { margin-bottom: 1.1rem; scroll-margin-top: 6rem; }
.ag-lista-data { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 .5rem; padding-bottom: .35rem; border-bottom: 1px solid var(--ag-linha);
    color: #1d2733; font-size: 1rem; font-weight: 700; }
.ag-hoje-selo { padding: .05rem .55rem; border-radius: 999px; background: var(--ag-primaria); color: #fff; font-size: .72rem; }
.ag-lista-itens { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.ag-item { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: .25rem 1rem; padding: .7rem .9rem; border: 1px solid var(--ag-linha);
    border-left: 4px solid var(--ag-cor); border-radius: 10px; background: #fff; scroll-margin-top: 6rem; }
.ag-item:target { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ag-cor) 35%, #fff); }
.ag-item-hora { color: #2c3946; font-size: .92rem; font-weight: 700; }
.ag-item-titulo { margin: 0; color: #1d2733; font-weight: 700; }
.ag-item.cancelado .ag-item-titulo { text-decoration: line-through; }
.ag-item-editar { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; text-decoration: underline; text-decoration-color: transparent; }
.ag-item-editar:hover, .ag-item-editar:focus-visible { text-decoration-color: currentColor; }
.ag-item-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: .2rem 0 0; color: var(--ag-suave); font-size: .85rem; }
.ag-item-local { margin-left: .5rem; }
.ag-item-local i { margin-right: .3rem; }
.ag-item-descricao { margin: .4rem 0 0; color: #3b4754; font-size: .9rem; }
.ag-selo { display: inline-block; margin-left: .4rem; padding: .05rem .5rem; border-radius: 999px; font-size: .7rem; font-weight: 700; vertical-align: middle; }
.ag-selo.cancelado { background: #fde8e8; color: #9f1c1c; }
.ag-selo.interno { background: #eceff3; color: #46515d; }
.ag-vazio { margin: 0; padding: 2rem 1rem; border: 1px dashed #cdd6e0; border-radius: 12px; background: #fff; color: var(--ag-suave); text-align: center; }
@media (max-width: 575.98px) { .ag-item { grid-template-columns: 1fr; } }

/* Janela do compromisso (site) */
.ag-detalhe .modal-header { align-items: flex-start; border-top: 6px solid var(--ag-cor, var(--cs-primaria, #26547c)); }
.ag-detalhe .ag-ponto { background: var(--ag-cor, var(--cs-primaria, #26547c)); }
.ag-detalhe-agenda { display: flex; align-items: center; gap: .45rem; margin: 0 0 .25rem; color: #46515d; font-size: .85rem; font-weight: 600; }
.ag-detalhe-dados li { display: flex; gap: .65rem; padding: .25rem 0; }
.ag-detalhe-dados i { width: 1.1rem; margin-top: .25rem; color: #5b6876; }
.ag-detalhe-descricao { color: #3b4754; white-space: pre-line; }
.ag-detalhe [data-ag-cancelado] { margin-left: 0; font-size: .8rem; }

/* Alto contraste (acessibilidade do site) */
html.a11y-contraste .ag-mes, html.a11y-contraste .ag-dia, html.a11y-contraste .ag-semana, html.a11y-contraste .ag-semana-coluna, html.a11y-contraste .ag-item,
html.a11y-contraste .ag-hoje, html.a11y-contraste .ag-visoes, html.a11y-contraste .ag-filtro, html.a11y-contraste .ag-vazio { background: #000 !important; color: #fff !important; border-color: #fff !important; }
html.a11y-contraste .ag-evento, html.a11y-contraste .ag-semana-evento .ag-evento { background: #000 !important; color: #ff0 !important; border: 1px solid #ff0; }
html.a11y-contraste .ag-titulo, html.a11y-contraste .ag-item-titulo, html.a11y-contraste .ag-lista-data, html.a11y-contraste .ag-item-hora { color: #fff !important; }
html.a11y-contraste .ag-visao.ativo, html.a11y-contraste .ag-filtro.ativo { background: #ff0 !important; color: #000 !important; }