/* Selector de mes (App\Helpers\Vista::selectorMeses): pestañas de año + rejilla de meses */
.ap-meses { margin: 28px 0; padding: 20px; background: var(--ap-superficie); border: 1px solid var(--ap-borde); border-radius: 12px; box-shadow: var(--ap-sombra); }
.ap-meses-cab { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.ap-meses-cab h2 { margin: 0; font-size: 20px; }
.ap-meses-cab p { margin: 2px 0 0; color: var(--ap-texto-2); font-size: 14px; }
.ap-meses-icono { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: var(--ap-acento-suave); color: var(--ap-acento); }
.ap-meses-icono svg { width: 22px; height: 22px; }
.ap-meses-anyos { position: relative; display: flex; gap: 6px; overflow-x: auto; padding: 2px 2px 10px; margin-bottom: 8px; scrollbar-width: thin; scroll-snap-type: x proximity; }
.ap-meses-anyos button {
    flex: none; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; line-height: 1.1;
    padding: 7px 14px; border: 1px solid var(--ap-borde); border-radius: 999px; background: var(--ap-superficie);
    color: var(--ap-texto-2); font-weight: 700; font-size: 14px; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .15s;
}
.ap-meses-anyos button small { font-size: 10px; font-weight: 500; opacity: .75; }
.ap-meses-anyos button:hover { border-color: var(--ap-acento); color: var(--ap-acento); transform: translateY(-1px); }
.ap-meses-anyos button[aria-selected=true] { background: var(--ap-acento); border-color: var(--ap-acento); color: #fff; box-shadow: 0 4px 12px rgba(42, 120, 214, .3); }
.ap-meses-anyo { font-size: 15px !important; margin: 14px 0 8px; color: var(--ap-texto-2) !important; }
.ap-meses-js .ap-meses-anyo { display: none; }
.ap-meses-js .ap-meses-panel[hidden] { display: none; }
.ap-meses-rejilla { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.ap-mes {
    display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 58px; padding: 6px 4px;
    border: 1px solid var(--ap-borde); border-radius: 10px; background: var(--ap-superficie-2); text-decoration: none !important;
    transition: transform .15s, box-shadow .15s, border-color .15s, background .15s;
}
a.ap-mes span { font-size: 16px; font-weight: 700; color: var(--ap-acento); }
a.ap-mes small { font-size: 11px; color: var(--ap-texto-3); }
a.ap-mes:hover, a.ap-mes:focus-visible { transform: translateY(-2px); border-color: var(--ap-acento); background: var(--ap-acento-suave); box-shadow: var(--ap-sombra-alta); }
a.ap-mes[aria-current=page] { background: var(--ap-acento); border-color: var(--ap-acento); }
a.ap-mes[aria-current=page] span, a.ap-mes[aria-current=page] small { color: #fff; }
.ap-mes-vacio { color: var(--ap-texto-3); opacity: .45; border-style: dashed; font-size: 14px; cursor: default; }
.ap-meses-entra .ap-meses-rejilla li { animation: ap-mes-entra .35s both; }
@keyframes ap-mes-entra { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) {
    .ap-meses { padding: 16px; }
    .ap-meses-rejilla { grid-template-columns: repeat(4, 1fr); }
    a.ap-mes small { display: none; }
}
@media (prefers-reduced-motion: reduce) { .ap-meses-entra .ap-meses-rejilla li { animation: none; } .ap-mes, .ap-meses-anyos button { transition: none; } }
