﻿/* =========================================================
   TMV2 - 03 BASE.CSS
   ---------------------------------------------------------
   TR:
   Bu dosya sitenin temel stilini oluşturur.
   HTML etiketleri, yazılar, linkler ve genel davranışlar burada tanımlanır.

   EN:
   This file defines the base styling of the site.
   It controls HTML elements, typography, links, and global behavior.

   KURAL / RULE:
   - Component yazılmaz
   - Sadece temel (base) stil yazılır
   - Reset + typography + global yapı
========================================================= */


/* =========================================================
   RESET
   ---------------------------------------------------------
   TR: Tarayıcı varsayılanlarını sıfırlar
   EN: Resets browser default styles
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}


/* =========================================================
   HTML
========================================================= */

html {
    scroll-behavior: smooth;
}


/* =========================================================
   BODY
   ---------------------------------------------------------
   TR:
   Tüm sitenin ana fontu, arka planı ve metin rengi burada belirlenir.

   EN:
   Defines global font, background, and text color.
========================================================= */

body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--tmv2-font-main);
    font-size: var(--tmv2-font-base);
    line-height: var(--tmv2-leading-normal);
    background: var(--body-bg);
    color: var(--body-text);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}


/* =========================================================
   MEDIA
   ---------------------------------------------------------
   TR: Görseller taşmasın
   EN: Prevent media overflow
========================================================= */

img,
svg,
video {
    max-width: 100%;
    display: block;
}


/* =========================================================
   LINK
========================================================= */

a {
    color: var(--link-color);
    text-decoration: none;
    transition: color var(--tmv2-transition-fast);
}

    a:hover {
        color: var(--link-hover);
    }


/* =========================================================
   TYPOGRAPHY - HEADINGS
   ---------------------------------------------------------
   TR:
   Tüm başlıklar burada kontrol edilir.

   EN:
   All headings are controlled here.
========================================================= */

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 var(--tmv2-space-4);
    font-family: var(--tmv2-font-heading);
    font-weight: var(--tmv2-weight-bold);
    color: var(--text-heading);
    line-height: var(--tmv2-leading-tight);
}


/* =========================================================
   HEADING SCALE
========================================================= */

h1 {
    font-size: var(--tmv2-font-5xl);
}

h2 {
    font-size: var(--tmv2-font-4xl);
}

h3 {
    font-size: var(--tmv2-font-3xl);
}

h4 {
    font-size: var(--tmv2-font-2xl);
}

h5 {
    font-size: var(--tmv2-font-xl);
}

h6 {
    font-size: var(--tmv2-font-lg);
}


/* =========================================================
   PARAGRAPH
========================================================= */

p {
    margin: 0 0 var(--tmv2-space-4);
    color: var(--text-body);
}


/* =========================================================
   LIST
========================================================= */

ul,
ol {
    margin: 0 0 var(--tmv2-space-4);
    padding-left: var(--tmv2-space-6);
}

li {
    margin-bottom: var(--tmv2-space-2);
}


/* =========================================================
   BLOCKQUOTE
========================================================= */

blockquote {
    margin: var(--tmv2-space-6) 0;
    padding: var(--tmv2-space-4) var(--tmv2-space-6);
    border-left: 4px solid var(--tmv2-color-primary);
    background: var(--tmv2-bg-surface-2);
    font-style: italic;
    color: var(--text-soft);
}


/* =========================================================
   CODE
========================================================= */

code,
pre {
    font-family: var(--tmv2-font-mono);
    background: var(--tmv2-bg-surface-2);
    border-radius: var(--tmv2-radius-md);
}

code {
    padding: 2px 6px;
}

pre {
    padding: var(--tmv2-space-4);
    overflow-x: auto;
}


/* =========================================================
   HR
========================================================= */

hr {
    border: none;
    border-top: 1px solid var(--tmv2-border);
    margin: var(--tmv2-space-8) 0;
}


/* =========================================================
   SELECTION
========================================================= */

::selection {
    background: rgba(var(--tmv2-color-primary-rgb), .2);
    color: var(--text-heading);
}


/* =========================================================
   SCROLLBAR (MODERN)
========================================================= */

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--tmv2-bg-surface);
}

::-webkit-scrollbar-thumb {
    background: var(--tmv2-border-strong);
    border-radius: var(--tmv2-radius-pill);
}

    ::-webkit-scrollbar-thumb:hover {
        background: var(--tmv2-color-primary);
    }


/* =========================================================
   TEXT UTILITIES
   ---------------------------------------------------------
   TR:
   Hızlı kullanım için yardımcı text sınıfları

   EN:
   Utility classes for quick text styling
========================================================= */

.tmv2-text {
    font-size: var(--tmv2-font-base);
}

.tmv2-text-lg {
    font-size: var(--tmv2-font-lg);
}

.tmv2-text-sm {
    font-size: var(--tmv2-font-sm);
}

.tmv2-text-muted {
    color: var(--text-muted);
}

.tmv2-text-soft {
    color: var(--text-soft);
}

.tmv2-text-primary {
    color: var(--text-primary);
}

.tmv2-text-danger {
    color: var(--text-danger);
}

.tmv2-text-success {
    color: var(--text-success);
}

.tmv2-text-center {
    text-align: center;
}

.tmv2-text-right {
    text-align: right;
}

.tmv2-fw-bold {
    font-weight: var(--tmv2-weight-bold);
}

.tmv2-fw-semibold {
    font-weight: var(--tmv2-weight-semibold);
}


/* =========================================================
   TITLE UTILITIES
========================================================= */

.tmv2-title {
    font-size: var(--tmv2-font-4xl);
    font-weight: var(--tmv2-weight-extrabold);
    color: var(--text-heading);
}

.tmv2-subtitle {
    font-size: var(--tmv2-font-xl);
    color: var(--text-soft);
}


/* =========================================================
   LEAD TEXT
========================================================= */

.tmv2-lead {
    font-size: var(--tmv2-font-lg);
    line-height: var(--tmv2-leading-relaxed);
    color: var(--text-soft);
}
