﻿/* wwwroot/css/app.css */

/* Font Face Declarations */
@font-face {
    font-family: 'GE SS';
    src: url('../fonts/ge_ss_unique_light.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GE SS';
    src: url('../fonts/ge_ss_text_light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GE SS';
    src: url('../fonts/ge_ss_two_medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GE SS';
    src: url('../fonts/ge_ss_two_bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* CSS Variables */
:root {
    --font-family-primary: 'GE SS', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-size-base: 14px;
    --font-size-base-lg: 16px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL FONT APPLICATION - تطبيق الخط على كل العناصر
   ═══════════════════════════════════════════════════════════════════════════ */
html {
    font-size: var(--font-size-base);
    font-family: var(--font-family-primary);
    position: relative;
    min-height: 100%;
}

body {
    font-family: var(--font-family-primary);
    font-weight: 300;
    line-height: 1.6;
}

    /* تطبيق الخط على جميع العناصر */
    body *:not(i):not(.bi):not(.fa):not(.fas):not(.far):not(.fab):not([class*="icon"]) {
        font-family: var(--font-family-primary);
    }

/* العناصر الأساسية */
h1, h2, h3, h4, h5, h6,
p, span, div, a,
label, button,
input, select, textarea, option,
table, th, td, tr,
ul, ol, li,
header, footer, nav, main, section, article, aside,
.btn, .form-control, .form-select, .form-check-label,
.card, .card-header, .card-body, .card-footer, .card-title, .card-text,
.modal, .modal-header, .modal-body, .modal-footer, .modal-title,
.nav, .nav-link, .nav-item, .navbar,
.dropdown, .dropdown-menu, .dropdown-item,
.alert, .badge, .toast,
.table, .table th, .table td,
.pagination, .page-link,
.breadcrumb, .breadcrumb-item,
.list-group, .list-group-item,
.tab-content, .tab-pane,
.tooltip, .popover,
.app-footer, .app-header {
    font-family: var(--font-family-primary) !important;
}

/* استثناء الأيقونات */
i, .bi, .fa, .fas, .far, .fab,
[class*="bi-"], [class*="fa-"],
.material-icons, .icon {
    font-family: inherit;
}

@media (min-width: 768px) {
    html {
        font-size: var(--font-size-base-lg);
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   TYPOGRAPHY
   ═══════════════════════════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    line-height: 1.2;
}

h1 {
    font-size: 2.5rem;
    font-weight: 700;
}

h2 {
    font-size: 2rem;
    font-weight: 700;
}

h3 {
    font-size: 1.75rem;
    font-weight: 500;
}

h4 {
    font-size: 1.5rem;
    font-weight: 500;
}

h5 {
    font-size: 1.25rem;
    font-weight: 300;
}

h6 {
    font-size: 1rem;
    font-weight: 300;
}

p {
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 1rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   APP FOOTER SPECIFIC STYLES
   ═══════════════════════════════════════════════════════════════════════════ */
.app-footer {
    font-family: var(--font-family-primary) !important;
    font-weight: 300;
}

    .app-footer * {
        font-family: var(--font-family-primary) !important;
    }

    .app-footer strong {
        font-weight: 500;
    }

    .app-footer .text-muted {
        font-family: var(--font-family-primary) !important;
    }
