/* ═══════════════════════════════════════════════════════════════
   Material Icons — lokal eingebundene Schriftart (Filled-Variante)
   Bereitstellung portal-weit (Login, Admin, Module). Spiegelt das
   Setup des Vibanalysis-Moduls. Keine externe CDN — air-gap-fähig.

   Quelle: npm-Paket "material-icons" (Apache License 2.0, Google LLC)
   ═══════════════════════════════════════════════════════════════ */

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url('../fonts/material-icons.woff2') format('woff2'),
         url('../fonts/material-icons.woff') format('woff');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 18px;
    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;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    vertical-align: middle;
    user-select: none;
    /* Erbt die Textfarbe des umgebenden Elements */
    color: inherit;
}

/* Size variants used across the portal */
.material-icons.md-sm   { font-size: 14px; }
.material-icons.md-lg   { font-size: 22px; }
.material-icons.md-xl   { font-size: 28px; }
.material-icons.md-2xl  { font-size: 36px; }

/* Buttons: tighten the gap between icon and label */
.btn .material-icons {
    vertical-align: -3px;
    margin-right: 4px;
}
.btn.btn-icon .material-icons {
    margin-right: 0;
}

/* ── Container-aware sizing ─────────────────────────────────
   Some portal CSS classes (.admin-card-icon, .module-icon, …)
   set a font-size on the *container* expecting the legacy emoji
   to inherit it. Material Icons spans override font-size via
   their own rule, so we re-anchor the size for those wrappers. */
.admin-card-icon  .material-icons { font-size: 28px; color: var(--accent); }
.module-icon      .material-icons { font-size: 36px; color: var(--accent); }
.empty-icon       .material-icons { font-size: 48px; color: var(--text-muted); }
.mod-icon-cell    .material-icons { font-size: 24px; color: var(--accent); }
.module-icon-emoji              { /* fallback for legacy emoji icons */
    font-style: normal;
    font-variant-emoji: emoji;
}

/* Theme toggle: icons inside the slider should be small */
.theme-icon .material-icons { font-size: 14px; }

/* Help-modal nav items render a 13px label, keep icons proportional */
.help-nav-item .material-icons { font-size: 15px; vertical-align: -3px; margin-right: 4px; }