/* ─── Estils interactius de controls compartits ───────────────────────────────
   Es carreguen DESPRÉS de tots els fitxers de component perquè els valors ctrl-* guanyin,
   seguint la cascada del monòlit v3 on aquestes regles eren a les línies 2248–2380
   (després de cada definició de component).
   ─────────────────────────────────────────────────────────────────────────── */

:is(
  .btn,
  .icon-btn,
  .today-btn,
  .filters-toggle,
  .chip,
  .day,
  .pill-action,
  .mini-select,
  .mini-year
) {
  box-shadow: var(--ctrl-shadow-rest);
}

:is(
  .btn,
  .icon-btn,
  .today-btn,
  .filters-toggle,
  .chip,
  .day,
  .mobile-menu-btn,
  .mini-select,
  .mini-year
):active {
  box-shadow: var(--ctrl-shadow-active);
  transform: scale(var(--ctrl-scale-active));
}

@media (hover: hover) and (pointer: fine) {
  :is(
    .btn,
    .icon-btn,
    .today-btn,
    .filters-toggle,
    .chip,
    .day,
    .mobile-menu-btn,
    .mini-select,
    .mini-year
  ):hover {
    box-shadow: var(--ctrl-shadow-hover);
    transform: scale(var(--ctrl-scale-hover));
  }

  /*
   * Després del :hover genèric de .chip: capa del segment actiu per sobre dels veïns
   * (filters.css posa z-index als segments; aquesta regla carrega després i el reforça).
   */
  .button-bar > :is(button, select, a):hover {
    position: relative;
    z-index: 9;
  }

  /* Botons grans (>100px): factor reduït perquè el creixement absolut sigui proporcionat */
  .btn:hover {
    transform: scale(1.04);
  }
}

:is(
  .btn,
  .icon-btn,
  .today-btn,
  .filters-toggle,
  .chip,
  .day,
  .mobile-menu-btn,
  .mini-select,
  .mini-year
) {
  transition: var(--ctrl-transition);
}