/* Overrides do MinhaAgenda — carregado APÓS o vireo.css. Usa tokens --ax-*. */

[x-cloak] { display: none !important; }

/* Respiro do conteúdo: padding generoso + largura máxima centralizada.
   Sobrepõe o padding condicional do Vireo para o conteúdo nunca ficar colado
   na sidebar nem na borda direita. */
.ax-main > .mh-page {
    padding-inline: clamp(18px, 2.5vw, 40px) !important;
    padding-block: clamp(18px, 2vw, 32px) !important;
    max-width: 1360px;
    width: 100%;
    margin-inline: auto;
}

/* Avatar com inicial (sidebar) */
.ax-sidebar__user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: var(--ax-accent-wash, #E8F4F0);
    color: var(--ax-accent, #1E856C);
    font-weight: 600;
    font-size: var(--ax-text-sm, .875rem);
}

/* Título do header */
.ax-header__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== Heatmap de hábitos (dashboard) ===== */
.mh-heatmap { display: flex; flex-wrap: wrap; gap: 3px; }
.mh-heatmap__cell { width: 14px; height: 14px; border-radius: 3px; background: var(--ax-surface-subtle); }
.mh-heatmap__cell--done { background: var(--ax-success-500, #198754); }
.mh-heatmap__cell--skip { background: var(--ax-warning-500, #ffc107); }
.mh-heatmap__cell--miss { background: var(--ax-danger-500, #dc3545); opacity: .55; }
.mh-heatmap__cell--pending { background: var(--ax-border-strong, #cbd5e1); }

/* Utilidades de layout usadas nas views (garantia caso não estejam no CSS compilado) */
.mh-grid { display: grid; gap: var(--ax-space-4, 1rem); }
.mh-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mh-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mh-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 768px) { .mh-grid--2, .mh-grid--3, .mh-grid--4 { grid-template-columns: 1fr; } }
.mh-flex { display: flex; }
.mh-flex--between { display: flex; align-items: center; justify-content: space-between; gap: var(--ax-space-3, .75rem); flex-wrap: wrap; }
.mh-gap-2 { gap: var(--ax-space-2, .5rem); }
.mh-mb-3 { margin-bottom: var(--ax-space-4, 1rem); }
.mh-muted { color: var(--ax-text-muted); }
.mh-right { text-align: right; }
.mh-inline-form { display: inline; }

/* ===== FullCalendar tematizado com tokens Vireo ===== */
.fc { --fc-border-color: var(--ax-border); --fc-page-bg-color: transparent; color: var(--ax-text); }
.fc .fc-toolbar-title { font-family: var(--ax-font-display); color: var(--ax-text-strong); font-size: var(--ax-text-lg); }
.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number { color: var(--ax-text-muted); text-decoration: none; }
.fc-theme-standard .fc-scrollgrid,
.fc-theme-standard td,
.fc-theme-standard th { border-color: var(--ax-border); }
.fc .fc-day-today { background: var(--ax-accent-wash) !important; }
.fc .fc-button {
    background: var(--ax-surface-subtle); border: 1px solid var(--ax-border);
    color: var(--ax-text); text-transform: none; box-shadow: none;
}
.fc .fc-button:hover { background: var(--ax-fill-hover); }
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background: var(--ax-accent); border-color: var(--ax-accent); color: var(--ax-on-accent);
}
.fc-event { border: none; padding: 1px 4px; font-size: var(--ax-text-xs); }

/* ===== Shim para páginas do Identity (RCL usa classes Bootstrap) no visual Vireo ===== */
.ax-authbox h1 { font-family: var(--ax-font-display); font-size: var(--ax-text-2xl); font-weight: 600; color: var(--ax-text-strong); margin: 0 0 var(--ax-space-1); }
.ax-authbox h2, .ax-authbox h3 { font-size: var(--ax-text-base); color: var(--ax-text-muted); font-weight: 600; margin: var(--ax-space-4) 0 var(--ax-space-2); }
.ax-authbox hr { border: none; border-top: 1px solid var(--ax-border); margin: var(--ax-space-4) 0; }
.ax-authbox label { display: inline-block; color: var(--ax-text); font-size: var(--ax-text-sm); margin-bottom: var(--ax-space-1); }

.form-control {
    display: block; width: 100%; padding: .6rem .8rem;
    border: 1px solid var(--ax-border); border-radius: var(--ax-radius-md, 10px);
    background: var(--ax-surface-solid, #fff); color: var(--ax-text); font-size: var(--ax-text-sm);
}
.form-control:focus { outline: none; border-color: var(--ax-accent); box-shadow: 0 0 0 3px var(--ax-accent-wash); }
.form-floating { position: relative; margin-bottom: var(--ax-space-3); }
.form-floating > label { color: var(--ax-text-subtle); }

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    padding: .6rem 1.1rem; border-radius: var(--ax-radius-pill, 999px);
    font-weight: 600; font-size: var(--ax-text-sm); border: 1px solid transparent;
    cursor: pointer; text-decoration: none; line-height: 1;
}
.btn-primary { background: var(--ax-accent); color: var(--ax-on-accent); }
.btn-primary:hover { background: var(--ax-accent-hover); }
.btn-lg { padding: .7rem 1.2rem; font-size: var(--ax-text-base); }
.btn-outline-primary { background: transparent; border-color: var(--ax-border); color: var(--ax-text); }
.w-100 { width: 100%; }
.text-danger, .field-validation-error, .validation-summary-errors { color: var(--ax-danger-500); font-size: var(--ax-text-sm); }
.form-check { display: flex; align-items: center; gap: .5rem; margin: var(--ax-space-2) 0; }
.form-check-input { width: 1rem; height: 1rem; accent-color: var(--ax-accent); }
.ax-authbox a { color: var(--ax-accent); }

/* ===== Tabelas: filtro + ordenação por clique (wwwroot/js/site.js) ===== */
.ax-tablebar { display: flex; justify-content: flex-end; margin-bottom: var(--ax-space-2, .5rem); }
.ax-tablebar__filter { max-width: 280px; }
.ax-tablebar__empty { color: var(--ax-text-muted); font-size: var(--ax-text-sm); padding: var(--ax-space-3, .75rem) 0; }
th.ax-sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.ax-sortable:hover { color: var(--ax-text-strong); }
.ax-sort-arrow { opacity: .45; font-size: .82em; margin-left: .35em; }
th.ax-sorted-asc .ax-sort-arrow, th.ax-sorted-desc .ax-sort-arrow { opacity: 1; color: var(--ax-accent); }
