/**
 * VDMA Icons - Material Symbols Outlined
 * Diese Font-Definitionen ermöglichen die Verwendung der Material Symbols Icons in der gesamten Anwendung.
 * 
 * Verwendung: <span class="material-symbols-outlined">icon_name</span>
 * Beispiel:   <span class="material-symbols-outlined">home</span>
 */

/* Font-Face Definitionen für alle Gewichtungen */
@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-100-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-200-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-300-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-400-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-500-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-600-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(./material-symbols-outlined-latin-700-normal.woff2) format('woff2');
}

/* Icon-Basisklasse */
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: 100;
    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;
    -moz-osx-font-smoothing: grayscale;
}

/* Varianten für verschiedene Größen */
.material-symbols-outlined.md-18 { font-size: 18px; }
.material-symbols-outlined.md-24 { font-size: 24px; }
.material-symbols-outlined.md-36 { font-size: 36px; }
.material-symbols-outlined.md-48 { font-size: 48px; }

/* Varianten für verschiedene Gewichtungen */
.material-symbols-outlined.weight-100 { font-weight: 100; }
.material-symbols-outlined.weight-200 { font-weight: 200; }
.material-symbols-outlined.weight-300 { font-weight: 300; }
.material-symbols-outlined.weight-400 { font-weight: 400; }
.material-symbols-outlined.weight-500 { font-weight: 500; }
.material-symbols-outlined.weight-600 { font-weight: 600; }
.material-symbols-outlined.weight-700 { font-weight: 700; }

/* ============================================
   Material Symbols Icons als CSS-Klassen
   Verwendung in sitemap: icon="ms ms-home"
   ============================================ */
.ms {
    font-family: 'Material Symbols Outlined';
    font-weight: 100;
    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;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   Icons in der Navbar verstecken
   Icons werden nur in mnTile angezeigt
   ============================================ */
.art-nav .ms,
.navbar .ms,
#MPMenu .ms,
.art-hmenu .ms,
.menu .ms,
.mainMenu .ms {
    display: none !important;
}

/* Icons in mnTile explizit anzeigen */
.mnTile .ms,
.mnTileIcon.ms,
.tile .ms,
.indexTile .ms {
    display: inline-block !important;
}

/* Navigation & Menu Icons */
.ms-home::before { content: "home"; }
.ms-chevron-left::before {
    content: "chevron_left";
}
.ms-check-box-outline-blank::before {
    content: "check_box_outline_blank";
}
.ms-select-check-box::before {
    content: "select_check_box";
}
.ms-left-click::before {
    content: "left_click";
}
.ms-touch-app::before {
    content: "touch_app";
}
.ms-chevron-right::before {
    content: "chevron_right";
}
.ms-first-page::before {
    content: "first_page";
}
.ms-last-page::before {
    content: "last_page";
}
.ms-arrow-top-left::before {
    content: "arrow_top_left";
}
.ms-edit-square::before {
    content: "edit_square";
}
.ms-pdf::before {
    content: "picture_as_pdf";
}
.ms-settings::before { content: "settings"; }
.ms-dashboard::before {content: "dashboard_2";
}
.ms-search::before { content: "search"; }
.ms-notifications::before { content: "notifications"; }
.ms-logout::before { content: "logout"; }
.ms-login::before { content: "login"; }
.ms-lock_person::before { content: "lock_person"; }
.ms-settings-ccount-box::before {
    content: "settings_account_box";
}
.ms-help::before {
    content: "help";
}
.ms-track-changes::before {
    content: "track_changes";
}
.ms-cards-stack::before {
    content: "cards";
}
.ms-list::before {
    content: "list";
}
.ms-list-alt::before {
    content: "list_alt";
}
.ms-archive::before {
    content: "archive";
}
.ms-rule::before {
    content: "rule";
}
.ms-groups-3::before {
    content: "groups_3";
}
.ms-fact-check::before {
    content: "fact_check";
}
.ms-text-compare::before {
    content: "text_compare";
}
.ms-avg-time::before {
    content: "avg_time";
}
.ms-graph-5::before {
    content: "graph_5";
}
.ms-user-attributes::before {
    content: "user_attributes";
}
.ms-inbox-person::before {
    content: "inbox_text_person";
}
.ms-approval-delegation::before {
    content: "approval_delegation";
}

/* User & People Icons */
.ms-person::before { content: "person"; }
.ms-tune::before {
    content: "tune";
}