﻿/*Set Ar ial as the site-wide default and force inheritance */
html, body, div, span, p, input, select, textarea, button, strong, label, label * {
    font-family: Arial, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.fa, .fas, .far, .fal, .fab {
    /* use requested order for regular elements */
    font-family: Arial, FontAwesome, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Ensure pseudo elements use FontAwesome first so icon glyphs render when FA is available */
.fa:before, .fas:before, .far:before, .fal:before, .fab:before {
    font-family: FontAwesome, Arial, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
    display: inline-block;
    vertical-align: middle;
}

/* Fallback for specific FontAwesome icons when icon font is not available.
   This provides a Unicode envelope as an alternative for `.fa-envelope`. */
.fa-envelope:before,
.fas.fa-envelope:before,
.far.fa-envelope:before,
.fal.fa-envelope:before,
.fab.fa-envelope:before {
    /* envelope (✉) - unicode fallback when icon font is not available */
    content: "\2709";
    /* prefer system symbol/emoji fonts for the Unicode glyph, then fall back to system sans */
    font-family: "Segoe UI Symbol", "Segoe UI Emoji", "Apple Color Emoji", "Arial Unicode MS", Arial, Helvetica, sans-serif !important;
}

/* Explicit override for h1/h2 under any div if needed */
div h1, div h2, div h3 {
    font-family: Arial, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .title {
    font-family: Arial, Glyphicons Halflings, FontAwesome, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Ensure plan-name and its link use Arial; place this at the end of Global.css */
.plan-idname .plan-name,
.plan-idname .plan-name a,
.plan-name, .plan-name a {
    font-family: Arial, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: medium !important;
}

/* Ensure table-striped cells use Arial (place at end of file; Global.css must load after base.css) */
.table-striped tbody tr td,
.table-striped tbody tr th {
    /* ensure readable text in striped tables; icon fonts kept after the base font */
    font-family: Arial, 'Glyphicons Halflings', FontAwesome, Helvetica, sans-serif !important;
}

    /* Restore Font Awesome inside table cells so icons still render */
.table-striped tbody tr td .fa,
.table-striped tbody tr td .fa:before,
.table-striped tbody tr td .fas,
.table-striped tbody tr td .far,
.table-striped tbody tr td .fal,
.table-striped tbody tr td .fab,
.table-striped tbody tr td .fas:before,
.table-striped tbody tr td .far:before,
.table-striped tbody tr td .fal:before,
.table-striped tbody tr td .fab:before {
        font-family: Arial, FontAwesome, Helvetica, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Fallback for Bootstrap glyphicon classes when Glyphicons are not available.
   This maps common glyphicon names used in JS to simple Unicode characters so
   the UI still shows an appropriate icon without requiring the glyphicon font. */
.glyphicon {
    display: inline-block;
    /* prefer icon fonts so glyph classes render correctly; fall back to system fonts */
    font-family: 'Glyphicons Halflings', FontAwesome, Arial, Helvetica, sans-serif !important;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    /* increase default fallback icon size so glyphicon-based icons are more visible */
    font-size: 18px !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    .glyphicon:before {
        /* ensure pseudo element is used for the icon character */
        speak: none;
        display: inline-block;
        vertical-align: middle;
    }

    /* common mappings */
    .glyphicon.glyphicon-remove:before {
        /* multiplication sign as close icon */
        content: "\00D7"; /* × */
        font-size: 18px !important;
    }

    .glyphicon.glyphicon-chevron-left:before {
        /* left-pointing angle bracket */
        content: "\276E"; /* ❮ */
        font-size: 18px !important;
    }

    .glyphicon.glyphicon-refresh:before {
        /* clockwise open circle arrow */
        content: "\21BB"; /* ↻ */
        font-size: 18px !important;
        font-family: "Segoe UI Symbol", "Segoe UI Emoji", "Arial Unicode MS", Arial, Helvetica, sans-serif !important;
    }

    .glyphicon.glyphicon-arrow-down:before {
        /* down-pointing triangle as fallback */
        content: "\25BC"; /* ▼ */
        font-size: 18px !important;
        font-family: "Segoe UI Symbol", "Segoe UI Emoji", "Arial Unicode MS", Arial, Helvetica, sans-serif !important;
    }

    .glyphicon.glyphicon-star-empty:before {
        /* empty star fallback */
        content: "\2606"; /* ☆ */
        font-size: 18px !important;
        font-family: "Segoe UI Symbol", "Segoe UI Emoji", "Arial Unicode MS", Arial, Helvetica, sans-serif !important;
    }

    /* left and right arrows fallback */
    .glyphicon.glyphicon-arrow-left:before {
        /* black left-pointing triangle */
        content: "\25C0"; /* ◀ */
        font-size: 18px !important;
    }

    .glyphicon.glyphicon-arrow-right:before {
        /* black right-pointing triangle */
        content: "\25B6"; /* ▶ */
        font-size: 18px !important;
    }

    .glyphicon.glyphicon-chevron-down:before {
        /* small down-pointing triangle as chevron-down fallback */
        content: "\25BE"; /* ▾ */
        font-size: 18px !important;
    }

    /* user and power/off fallbacks */
    .glyphicon.glyphicon-user:before {
        /* bust in silhouette */
        content: "\01F464"; /* 👤 */
        font-size: 18px !important;
        font-family: "Segoe UI Symbol", "Segoe UI Emoji", "Arial Unicode MS", Arial, Helvetica, sans-serif !important;
    }

    /* Prefer Font Awesome power icon when available for consistent rendering */
    .glyphicon.glyphicon-off:before {
        content: "\f011"; /* FontAwesome power-off */
        font-family: FontAwesome, Arial, Helvetica, sans-serif !important;
    }

    /* If Font Awesome is available, prefer it for glyphicon spans by mapping */
    .glyphicon.glyphicon-remove:before,
    .glyphicon.glyphicon-chevron-left:before,
    .glyphicon.glyphicon-refresh:before {
        font-family: FontAwesome, Arial, Helvetica, sans-serif !important;
    }

/* elFinder icon fallbacks when icon fonts are not loaded */
.elfinder-perms, .elfinder-navbar-icon, .elfinder-navbar-arrow {
    display: inline-block;
    font-family: Arial, FontAwesome, Helvetica, sans-serif !important;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    font-size: 14px !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    .elfinder-perms:before {
        /* lock icon fallback (🔒) */
        content: "\01F512"; /* 🔒 */
        display: inline-block;
        vertical-align: middle;
        font-size: 14px !important;
    }

    .elfinder-perms.color-blue:before,
    .elfinder-perms.ui-state-active:before {
        color: #0093D0 !important;
    }

    .elfinder-navbar-icon:before {
        /* folder icon fallback (📁) */
        content: "\01F4C1"; /* 📁 */
        display: inline-block;
        vertical-align: middle;
        font-size: 14px !important;
    }

    .elfinder-navbar-arrow:before {
        /* small right-pointing triangle fallback */
        content: "\25B6"; /* ▶ */
        display: inline-block;
        vertical-align: middle;
        font-size: 12px !important;
    }

    /* Prefer FontAwesome if available to render these elfinder icons */
    .elfinder-perms:before, .elfinder-navbar-icon:before, .elfinder-navbar-arrow:before {
        font-family: FontAwesome, Arial, Helvetica, sans-serif !important;
    }
