/* Menu a tendina personalizzato (customizable select, Chromium 135+).
   File statico servito così com'è: il compilatore CSS del progetto non
   supporta ancora il selettore ::picker(select) e lo riscrive in modo
   non valido. Safari e Firefox ignorano queste regole e mantengono il
   menu nativo del sistema. */
@supports selector(select::picker(select)) {
  .form-select {
    appearance: base-select;
    border-radius: 14px;
  }
  .form-select::picker-icon { display: none; }
  /* appearance base-select va dichiarato anche sul picker, non solo sul select */
  .form-select::picker(select) {
    appearance: base-select;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 14px;
    background: var(--ink-3);
    padding: 6px;
    box-shadow: 0 24px 48px -12px rgba(5,3,20,0.8);
  }
  .form-select option {
    background: transparent;
    color: var(--text-2);
    padding: 11px 14px;
    border-radius: 9px;
    font-size: 15px;
    cursor: pointer;
    transition: background-color 0.15s var(--ease), color 0.15s var(--ease);
  }
  .form-select option:hover, .form-select option:focus {
    background: rgba(124,111,247,0.14);
    color: #fff;
  }
  .form-select option:checked {
    background: rgba(124,111,247,0.16);
    color: var(--lilac);
  }
  .form-select option:disabled { color: rgba(238,237,246,0.35); }
  /* segnaposto "Seleziona un servizio" più attenuato quando è chiuso */
  .form-select:has(option[value=""]:checked) { color: rgba(238,237,246,0.4); }
  .form-select:has(option[value=""]:checked) option { color: var(--text-2); }
}