i,em{
    font-style: italic;
}
/* Document Icons */
:root {
    --pdf-color: #801309;
    --doc-color: #182b4d;
    --ppt-color: #bb4023;
    --xls-color: #113724;

    --icon-font-family: "Font Awesome 7 Free";
    --pdf-icon: "\f1c1";
    --doc-icon: "\f1c2";
    --ppt-icon: "\f1c4";
    --xls-icon: "\f1c3";
}

/* =======================================
   1. ONLY reset normal text links
   (Do NOT affect Bootstrap .btn links)
======================================= */

a[href$=".pdf"]:not(.btn),
a[href*=".pdf?"]:not(.btn),
a[href$=".doc"]:not(.btn),
a[href*=".doc?"]:not(.btn),
a[href$=".docx"]:not(.btn),
a[href*=".docx?"]:not(.btn),
a[href$=".ppt"]:not(.btn),
a[href*=".ppt?"]:not(.btn),
a[href$=".pptx"]:not(.btn),
a[href*=".pptx?"]:not(.btn),
a[href$=".xls"]:not(.btn),
a[href*=".xls?"]:not(.btn),
a[href$=".xlsx"]:not(.btn),
a[href*=".xlsx?"]:not(.btn) {
    box-shadow: none;
}

/* =======================================
   2. Add icons to ALL matching links
   (including buttons)
======================================= */

/* Base icon styling */
a[href$=".pdf"]::after,
a[href*=".pdf?"]::after,
a[href$=".doc"]::after,
a[href*=".doc?"]::after,
a[href$=".docx"]::after,
a[href*=".docx?"]::after,
a[href$=".ppt"]::after,
a[href*=".ppt?"]::after,
a[href$=".pptx"]::after,
a[href*=".pptx?"]::after,
a[href$=".xls"]::after,
a[href*=".xls?"]::after,
a[href$=".xlsx"]::after,
a[href*=".xlsx?"]::after {
    font-family: var(--icon-font-family);
    font-weight: 900;
    display: inline-block;
    margin-left: 0.5rem;
}

/* =======================================
   3. File-Type Specific Styling
======================================= */

a[href$=".pdf"]::after,
a[href*=".pdf?"]::after {
    content: var(--pdf-icon);
    color: var(--pdf-color);
}

a[href$=".doc"]::after,
a[href*=".doc?"]::after,
a[href$=".docx"]::after,
a[href*=".docx?"]::after {
    content: var(--doc-icon);
    color: var(--doc-color);
}

a[href$=".ppt"]::after,
a[href*=".ppt?"]::after,
a[href$=".pptx"]::after,
a[href*=".pptx?"]::after {
    content: var(--ppt-icon);
    color: var(--ppt-color);
}

a[href$=".xls"]::after,
a[href*=".xls?"]::after,
a[href$=".xlsx"]::after,
a[href*=".xlsx?"]::after {
    content: var(--xls-icon);
    color: var(--xls-color);
}

/* =======================================
   4. Optional: Better alignment inside Bootstrap buttons
======================================= */

a.btn[href$=".pdf"]::after,
a.btn[href$=".doc"]::after,
a.btn[href$=".docx"]::after,
a.btn[href$=".ppt"]::after,
a.btn[href$=".pptx"]::after,
a.btn[href$=".xls"]::after,
a.btn[href$=".xlsx"]::after {
    font-size: 0.9em;
}



