/**
 * Material Symbols - Local Font (Variable Version)
 * MyTidyHome
 * 
 * Variable Font supports:
 * - FILL: 0 (outline) to 1 (filled)
 * - GRAD: -25 to 200 (grade/weight)
 * - opsz: 20 to 48 (optical size)
 * - wght: 100 to 700 (weight)
 * 
 * ============================================
 * USED ICONS IN APPLICATION
 * ============================================
 * 
 * Navigation & Actions:
 * - arrow_back        : Zurück-Button
 * - add               : Hinzufügen-Button
 * - edit              : Bearbeiten-Button
 * - delete            : Löschen-Button
 * - expand_more       : Dropdown/Filter Toggle
 * - drag_handle       : Drag & Drop Handle
 * 
 * User Interface:
 * - person            : Benutzer-Profil
 * - language          : Sprachauswahl
 * 
 * Modules (Home/Features/Landing):
 * - list_alt          : Einkaufsliste
 * - meeting_room      : Räume
 * - settings          : Geräte/Einstellungen
 * - shelves           : Stauräume
 * - inventory_2        : Dinge
 * - apparel           : Kleidung
 * - handyman          : Wartung
 * - cleaning           : Putzplan
 * - potted_plant      : Pflanzen
 * - storefront        : Geschäfte
 * 
 * Empty States:
 * - inventory_2        : Dinge (leer)
 * - meeting_room      : Räume (leer)
 * - storefront        : Geschäfte (leer)
 */

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 100 700;
  src: url('../assets/fonts/MaterialSymbolsRounded-VariableFont_FILL,GRAD,opsz,wght.ttf') format('truetype-variations');
  font-display: swap; /* Improves loading performance */
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  vertical-align: middle;
}

/* Icon size variants */
.material-icons--small {
  font-size: 18px;
}

.material-icons--medium {
  font-size: 24px;
}

.material-icons--large {
  font-size: 36px;
}

.material-icons--extra-large {
  font-size: 48px;
}

/* Icon in buttons */
.btn .material-icons {
  font-size: 20px;
  vertical-align: middle;
}

.btn--icon .material-icons {
  font-size: 24px;
}

/* Icon in module tiles */
.module-tile__icon .material-icons {
  font-size: 48px;
  color: var(--color-primary);
}

/* Icon in empty states */
[class$="-empty__icon"] .material-icons {
  font-size: 64px;
  color: var(--color-text-secondary);
  opacity: 0.5;
}

/* Icon in item actions */
[class$="-item__action"] .material-icons {
  font-size: 20px;
}

/* Icon in header */
.header__profile-icon .material-icons,
.header__language-icon .material-icons {
  font-size: 24px;
}

/* Icon in language switcher and filter toggles */
.language-switcher__icon .material-icons,
.things-filters-toggle__icon .material-icons {
  font-size: 20px;
  transition: transform 0.3s ease;
}

.things-filters-toggle[aria-expanded="true"] .things-filters-toggle__icon .material-icons {
  transform: rotate(180deg);
}

.language-switcher__button[aria-expanded="true"] .language-switcher__icon .material-icons {
  transform: rotate(180deg);
}