/* ============================================================
   St. Mary Fonts
   Cairo for the application UI, Aref Ruqaa for church identity only.
   ============================================================ */

@font-face {
    font-family: "StMary Cairo";
    src: url("/fonts/Cairo-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "StMary Cairo";
    src: url("/fonts/Cairo-SemiBold.ttf") format("truetype");
    font-style: normal;
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "StMary Cairo";
    src: url("/fonts/Cairo-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "StMary Ruqaa";
    src: url("/fonts/ArefRuqaa-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "StMary Ruqaa";
    src: url("/fonts/ArefRuqaa-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

/* Main application typography */
html,
body {
    font-family: "StMary Cairo", Tahoma, "Segoe UI", Arial, sans-serif !important;
}

button,
input,
select,
textarea,
option,
label,
a,
p,
span,
small,
strong,
b,
h1,
h2,
h3,
h4,
h5,
h6,
table,
thead,
tbody,
tfoot,
tr,
th,
td,
li,
.btn,
.nav-link {
    font-family: "StMary Cairo", Tahoma, "Segoe UI", Arial, sans-serif !important;
}

/* Body text */
body,
p,
span,
small,
label,
input,
select,
textarea,
option,
td,
li {
    font-weight: 400;
}

/* Headings and actions */
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
th,
button,
.btn,
.nav-link {
    font-weight: 700;
}

/* Syncfusion text only. Icon font classes are deliberately excluded. */
.e-control,
.e-control-wrapper,
.e-input,
.e-input-group input,
.e-dropdownbase .e-list-item,
.e-grid .e-headertext,
.e-grid .e-rowcell,
.e-dialog .e-dlg-header,
.e-toolbar .e-tbar-btn-text,
.e-pager,
.e-pager .e-pagercontainer {
    font-family: "StMary Cairo", Tahoma, "Segoe UI", Arial, sans-serif !important;
}

.form-control,
.form-select,
.e-input-group input.e-input,
.e-dropdownbase .e-list-item {
    font-size: 16px !important;
}

.table thead th,
.e-grid .e-headercell,
.e-grid .e-headertext {
    font-size: 15px !important;
    font-weight: 700 !important;
}

.table tbody td,
.e-grid .e-rowcell {
    font-size: 15px !important;
    font-weight: 400 !important;
}

button,
.btn,
.e-btn {
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* Decorative identity is limited to the login church name and family name. */
.login-brand h1,
.login-brand p {
    font-family: "StMary Ruqaa", "Traditional Arabic", serif !important;
    font-weight: 700 !important;
}

.login-brand h1 {
    line-height: 1.45 !important;
}

.login-brand p {
    line-height: 1.4 !important;
}

/* Preserve code readability. */
code,
pre,
kbd,
samp {
    font-family: Consolas, "Courier New", monospace !important;
}

/* Never override third-party icon glyph fonts. */
.e-icons,
.e-btn-icon,
.e-input-group-icon,
.e-menu-icon,
.e-caret,
.e-dropdown-btn .e-icons,
.e-toolbar-item .e-icons {
    font-family: "e-icons" !important;
}

@media (max-width: 680px) {
    .form-control,
    .form-select,
    .e-input-group input.e-input {
        font-size: 16px !important;
    }

    .table tbody td,
    .e-grid .e-rowcell {
        font-size: 14px !important;
    }
}