/* ==========================================================================
   Inter Typography System — global design tokens & component overrides
   ========================================================================== */

:root {
    --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --heading-font: var(--font-sans);
    --body-font: var(--font-sans);

    /* Type scale */
    --text-page-title: 1.5rem;       /* 24px */
    --text-section-title: 1.125rem; /* 18px */
    --text-card-title: 1rem;         /* 16px */
    --text-body: 0.9375rem;          /* 15px */
    --text-nav: 0.875rem;            /* 14px */
    --text-sidebar: 0.8125rem;       /* 13px */
    --text-label: 0.8125rem;         /* 13px */
    --text-input: 0.875rem;          /* 14px */
    --text-button: 0.875rem;         /* 14px */
    --text-table-header: 0.8125rem;  /* 13px */
    --text-table-row: 0.8125rem;     /* 13px */
    --text-dropdown: 0.75rem;        /* 12px */
    --text-secondary: 0.75rem;       /* 12px */
    --text-meta: 0.6875rem;          /* 11px */

    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;

    --leading-tight: 1.35;
    --leading-normal: 1.5;
    --leading-relaxed: 1.6;
}

/* Base ------------------------------------------------------------------- */

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body,
body.ltr,
body.rtl {
    font-family: var(--font-sans) !important;
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
    line-height: var(--leading-relaxed);
}

/* Utility classes -------------------------------------------------------- */

.text-page-title {
    font-size: var(--text-page-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

.text-section-title {
    font-size: var(--text-section-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

.text-card-title {
    font-size: var(--text-card-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

.text-body {
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
    line-height: var(--leading-relaxed);
}

.text-nav {
    font-size: var(--text-nav);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.text-sidebar {
    font-size: var(--text-sidebar);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.text-label {
    font-size: var(--text-label);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.text-input {
    font-size: var(--text-input);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

.text-button {
    font-size: var(--text-button);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.text-table-header {
    font-size: var(--text-table-header);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-normal);
}

.text-table-row {
    font-size: var(--text-table-row);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

.text-dropdown {
    font-size: var(--text-dropdown);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.text-secondary,
.text-meta {
    font-size: var(--text-secondary);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

.text-meta {
    font-size: var(--text-meta);
}

/* Headings --------------------------------------------------------------- */

h1, .h1, .page-title {
    font-family: var(--font-sans);
    font-size: var(--text-page-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

h2, .h2, .section-title {
    font-family: var(--font-sans);
    font-size: var(--text-section-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6,
.card-title,
.card-header-title {
    font-family: var(--font-sans);
    font-size: var(--text-card-title);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-tight);
}

/* Navigation ------------------------------------------------------------- */

.navbar,
.navbar-nav,
.nav-link,
.header-nav,
.top-nav,
.top-nav-bg,
.breadcrumb,
.breadcrumb-item,
.breadcrumb-wrapper {
    font-family: var(--font-sans);
    font-size: var(--text-nav);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

/* Sidebar ---------------------------------------------------------------- */

.sidebar,
.sidebar-menu,
.sidebar-submenu,
.sidenav,
.sidenav__menu,
.sidenav__link,
.sidebar-menu-list,
.sidebar-submenu-list,
.sidebar-menu-list__link,
.sidebar-submenu-list__link,
.menu-title,
.menu-badge {
    font-family: var(--font-sans);
    font-size: var(--text-sidebar);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

/* Cards ------------------------------------------------------------------ */

.card,
.card-body,
.card-text,
.custom--card,
.dashboard-card {
    font-family: var(--font-sans);
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
}

.card-header,
.card-header h5,
.card-header h6 {
    font-size: var(--text-card-title);
    font-weight: var(--weight-semibold);
}

/* Forms ------------------------------------------------------------------ */

label,
.form-label,
.form--label,
.col-form-label,
.font-weight-bold label {
    font-family: var(--font-sans);
    font-size: var(--text-label);
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.form-control,
.form-select,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.input-group-text,
.custom-select,
.account-form input,
.account-form textarea,
.account-form select {
    font-family: var(--font-sans) !important;
    font-size: var(--text-input) !important;
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    font-family: var(--font-sans);
    font-size: var(--text-input);
    font-weight: var(--weight-regular);
}

/* Buttons ---------------------------------------------------------------- */

.btn,
button,
input[type="submit"],
input[type="button"],
.btn--base,
.btn--primary,
.btn--secondary,
.btn--danger,
.btn--success,
.btn--warning,
.btn--info,
.cmn-btn,
.cmn-btn2 {
    font-family: var(--font-sans) !important;
    font-size: var(--text-button) !important;
    font-weight: var(--weight-medium) !important;
    line-height: var(--leading-normal);
}

/* Tables ----------------------------------------------------------------- */

table,
.table,
.table-responsive {
    font-family: var(--font-sans);
}

.table thead th,
.table th,
table thead th,
.custom--table thead th,
.dataTables_wrapper thead th {
    font-size: var(--text-table-header);
    font-weight: var(--weight-semibold);
    line-height: var(--leading-normal);
}

.table tbody td,
.table td,
table tbody td,
.custom--table tbody td,
.dataTables_wrapper tbody td {
    font-size: var(--text-table-row);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

/* Dropdowns — Select2 / Tom Select --------------------------------------- */

.select2-container,
.select2-container--default,
.select2-selection,
.select2-selection__rendered,
.select2-results__option,
.select2-search__field,
.ts-wrapper,
.ts-control,
.ts-dropdown,
.ts-dropdown .option,
.dropdown-menu,
.dropdown-item {
    font-family: var(--font-sans) !important;
    font-size: var(--text-dropdown) !important;
    font-weight: var(--weight-medium);
    line-height: var(--leading-normal);
}

.select2-results__option {
    font-weight: var(--weight-medium);
}

/* Modals ----------------------------------------------------------------- */

.modal,
.modal-title,
.modal-body,
.modal-footer,
.modal-header {
    font-family: var(--font-sans);
}

.modal-title {
    font-size: var(--text-section-title);
    font-weight: var(--weight-semibold);
}

.modal-body {
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
}

/* Alerts & notifications ------------------------------------------------- */

.alert,
.toast,
.toast-body,
.notify,
.notification,
.notify__message,
.badge,
.notify-badge {
    font-family: var(--font-sans);
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

/* Pagination ------------------------------------------------------------- */

.pagination,
.page-link,
.page-item {
    font-family: var(--font-sans);
    font-size: var(--text-nav);
    font-weight: var(--weight-medium);
}

/* Footer ----------------------------------------------------------------- */

.footer,
.footer-area,
.footer__desc,
.footer__copyright,
.copyright {
    font-family: var(--font-sans);
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
}

/* Search ----------------------------------------------------------------- */

.search-form input,
.search-box input,
.header-search input,
input[type="search"] {
    font-family: var(--font-sans) !important;
    font-size: var(--text-input) !important;
    font-weight: var(--weight-regular);
}

/* Secondary / metadata text ---------------------------------------------- */

small,
.text-muted,
.text--small,
.text--secondary,
.service-id,
.service-price,
.service-category,
.helper-text,
.form-text,
.text-gray,
.meta-text,
.list-group-item small {
    font-family: var(--font-sans);
    font-size: var(--text-secondary);
    font-weight: var(--weight-regular);
    line-height: var(--leading-normal);
}

/* Admin panel ------------------------------------------------------------ */

.page-wrapper,
.body-wrapper,
.bodywrapper__inner,
.panel,
.widget,
.widget-title,
.list-group-item {
    font-family: var(--font-sans);
}

.widget-title,
.card-title {
    font-size: var(--text-card-title);
    font-weight: var(--weight-semibold);
}

/* User panel / dashboard ------------------------------------------------- */

.dashboard-area,
.account,
.account-inner,
.account-form,
.account-form2,
.user-profile,
.profile-area {
    font-family: var(--font-sans);
    font-size: var(--text-body);
}

/* Checkout / payment / invoices ------------------------------------------ */

.payment-area,
.deposit-area,
.invoice,
.invoice-table,
.checkout-area {
    font-family: var(--font-sans);
    font-size: var(--text-body);
}

/* Reports ---------------------------------------------------------------- */

.report-area,
.report-table {
    font-family: var(--font-sans);
}

/* Verification code inputs ----------------------------------------------- */

.verification-code input,
.verification-text {
    font-family: var(--font-sans) !important;
    font-variant-numeric: tabular-nums;
}

/* Error pages ------------------------------------------------------------ */

.error-wrap,
.error-wrap__title,
.error-wrap__desc,
.error__text {
    font-family: var(--font-sans);
}

.error-wrap__title {
    font-size: var(--text-section-title);
    font-weight: var(--weight-semibold);
}

.error-wrap__desc {
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
}

/* Icon fonts — preserve -------------------------------------------------- */

.fa,
.fas,
.far,
.fab,
.la,
.las,
.lab,
.lar,
.line-awesome,
[class^="fa-"],
[class*=" fa-"] {
    font-family: "Font Awesome 5 Free", "Line Awesome Free" !important;
}

/* Responsive adjustments ------------------------------------------------- */

@media (max-width: 991.98px) {
    :root {
        --text-page-title: 1.375rem;
        --text-section-title: 1.0625rem;
    }
}

@media (max-width: 575.98px) {
    :root {
        --text-page-title: 1.25rem;
        --text-body: 0.875rem;
        --text-nav: 0.8125rem;
    }

    .table thead th,
    .table tbody td {
        font-size: var(--text-meta);
    }
}