/* ============================================================
   ferias-acs.css — só o que é específico da tela de férias
   ============================================================ */

.fa-layout {
    display: grid;
    grid-template-columns: 330px minmax(0, 1fr);
    gap: var(--t-space-4);
    align-items: start;
}

@media (max-width: 900px) {
    .fa-layout { grid-template-columns: minmax(0, 1fr); }
}

/* Lista de ACS */
.fa-lista {
    display: flex;
    flex-direction: column;
    gap: var(--t-space-1);
    max-height: 460px;
    overflow-y: auto;
}

.fa-acs {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: var(--t-space-3);
    text-align: left;
    font: inherit;
    background: var(--t-surface);
    border: 1px solid var(--t-border);
    border-radius: var(--t-radius-md);
    cursor: pointer;
    transition: border-color var(--t-transition), background var(--t-transition);
}

.fa-acs:hover { border-color: var(--t-border-strong); background: var(--t-surface-soft); }

.fa-acs.is-active {
    border-color: var(--t-primary);
    background: var(--t-primary-soft);
}

.fa-acs__nome {
    font-size: var(--t-fs-sm);
    font-weight: 600;
    color: var(--t-text);
}

.fa-acs__unidade {
    font-size: var(--t-fs-xs);
    color: var(--t-muted);
}

.fa-acs.is-active .fa-acs__unidade { color: var(--t-primary-dark); }

/* Cartão do ACS selecionado */
.fa-selecionado {
    padding: var(--t-space-3) var(--t-space-4);
    border: 1px solid var(--t-border);
    border-radius: var(--t-radius-md);
    background: var(--t-surface-soft);
}

.fa-selecionado strong { display: block; font-size: var(--t-fs-md); color: var(--t-text); }
.fa-selecionado span { font-size: var(--t-fs-xs); color: var(--t-muted); }

/* Legenda */
.fa-legenda {
    display: flex;
    flex-wrap: wrap;
    gap: var(--t-space-4);
    margin: var(--t-space-4) 0;
    font-size: var(--t-fs-xs);
    color: var(--t-muted);
}

.fa-legenda span { display: inline-flex; align-items: center; gap: 6px; }

.fa-legenda i {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid var(--t-border-strong);
}

.fa-legenda .fa-cor-normal { background: var(--t-surface); }
.fa-legenda .fa-cor-ferias { background: var(--t-warn-soft); border-color: var(--t-warn); }

/* Grade de meses */
.fa-meses {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--t-space-2);
}

.fa-mes {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: var(--t-space-3);
    font: inherit;
    text-align: left;
    background: var(--t-surface);
    border: 1px solid var(--t-border);
    border-radius: var(--t-radius-md);
    cursor: pointer;
    transition: border-color var(--t-transition), background var(--t-transition);
}

.fa-mes:hover { border-color: var(--t-border-strong); }

.fa-mes.is-ferias {
    background: var(--t-warn-soft);
    border-color: var(--t-warn);
}

.fa-mes__nome {
    font-size: var(--t-fs-md);
    font-weight: 600;
    color: var(--t-text);
}

.fa-mes__status {
    font-size: var(--t-fs-xs);
    color: var(--t-muted);
}

.fa-mes.is-ferias .fa-mes__status { color: var(--t-warn); font-weight: 600; }

/* Resumo */
.fa-resumo__ano {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--t-space-2);
    padding: var(--t-space-2) 0;
    border-bottom: 1px solid var(--t-border);
}

.fa-resumo__ano:last-child { border-bottom: 0; }

.fa-resumo__meses {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}