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

    --mekanjet-font-weight-regular: 400;
    --mekanjet-font-weight-medium: 500;
    --mekanjet-font-weight-semibold: 600;
    --mekanjet-font-weight-bold: 700;
}

/*
|--------------------------------------------------------------------------
| Mekanjet Tipografi Sistemi
|--------------------------------------------------------------------------
| Harici font dosyası kullanmaz. Cihazın kendi modern arayüz fontunu seçer:
| Apple cihazlarda San Francisco, Android'de Roboto, Windows'ta Segoe UI.
|--------------------------------------------------------------------------
*/

html,
body,
button,
input,
textarea,
select,
option {
    font-family: var(--mekanjet-font-family) !important;
}

html {
    font-size: 16px;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    color: #172033;
    font-size: 15px;
    font-weight: var(--mekanjet-font-weight-regular);
    line-height: 1.5;
    letter-spacing: 0;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

p,
li,
dd,
dt,
label,
small,
span {
    line-height: 1.45;
}

h1,
h2,
h3,
h4,
h5,
h6,
[class*="title"],
[class*="heading"] {
    font-family: var(--mekanjet-font-family) !important;
    font-weight: var(--mekanjet-font-weight-bold) !important;
    line-height: 1.24;
    letter-spacing: -0.015em;
}

strong,
b {
    font-weight: var(--mekanjet-font-weight-bold);
}

button,
.btn,
.button,
[class*="-button"],
[class*="_button"],
input[type="button"],
input[type="submit"],
input[type="reset"] {
    font-weight: var(--mekanjet-font-weight-semibold) !important;
    letter-spacing: 0;
}

input,
textarea,
select {
    font-size: 16px;
    font-weight: var(--mekanjet-font-weight-regular);
    line-height: 1.4;
    letter-spacing: 0;
}

input::placeholder,
textarea::placeholder {
    color: #94a3b8;
    font-weight: var(--mekanjet-font-weight-regular);
    opacity: 1;
}

/*
|--------------------------------------------------------------------------
| Üst Menü ve Yan Menü
|--------------------------------------------------------------------------
*/

.account-summary-name,
.account-menu-link,
.account-menu-link-text,
.notification-popover-head strong,
.notification-popover-link {
    font-weight: var(--mekanjet-font-weight-semibold) !important;
    letter-spacing: 0;
}

.account-summary-username,
.drawer-footer-text {
    font-weight: var(--mekanjet-font-weight-regular) !important;
    letter-spacing: 0;
}

.account-menu-count,
.top-notification-badge {
    font-weight: var(--mekanjet-font-weight-bold) !important;
}

/*
|--------------------------------------------------------------------------
| Akış ve Profil Yazıları
|--------------------------------------------------------------------------
*/

.post-author-name,
.post-username,
.profile-name,
.profile-username,
.story-username,
.comment-author,
[class*="author-name"],
[class*="profile-name"],
[class*="username"] {
    font-weight: var(--mekanjet-font-weight-semibold) !important;
    letter-spacing: 0;
}

.post-caption,
.post-description,
.post-content,
.profile-bio,
.comment-text,
[class*="caption"],
[class*="description"],
[class*="bio"] {
    font-weight: var(--mekanjet-font-weight-regular) !important;
    line-height: 1.5;
    letter-spacing: 0;
}

/*
|--------------------------------------------------------------------------
| Sayaçlar ve İstatistikler
|--------------------------------------------------------------------------
*/

.stat-value,
.stat-count,
.like-count,
.comment-count,
.follow-count,
[class*="count"],
[class*="stat-value"] {
    font-weight: var(--mekanjet-font-weight-semibold) !important;
    letter-spacing: -0.005em;
}

/*
|--------------------------------------------------------------------------
| Mobil Okunabilirlik
|--------------------------------------------------------------------------
*/

@media (max-width: 768px) {
    body {
        font-size: 15px;
        line-height: 1.48;
    }

    h1 {
        font-size: clamp(24px, 7vw, 32px);
    }

    h2 {
        font-size: clamp(20px, 5.8vw, 27px);
    }

    h3 {
        font-size: clamp(17px, 4.8vw, 22px);
    }

    button,
    .btn,
    .button,
    [class*="-button"],
    [class*="_button"] {
        font-size: 14px;
    }
}