/* =========================================================
   TMV2 - 02 SEMANTIC.CSS
   ---------------------------------------------------------
   TR:
   Bu dosya, 01-variables.css içindeki genel değişkenleri
   anlamlı UI alanlarına bağlar.

   EN:
   This file maps global variables from 01-variables.css
   to semantic UI areas.

   ÖRNEK / EXAMPLE:
   --tmv2-color-primary      → genel marka rengi
   --btn-primary-bg          → buton arka planı
   --card-bg                 → kart arka planı
   --navbar-bg               → navbar arka planı

   KURAL / RULE:
   Component dosyalarında mümkün olduğunca semantic token
   kullanılmalıdır.
========================================================= */


:root {
    /* =====================================================
       BODY / PAGE ROOT
       -----------------------------------------------------
       TR:
       Sayfanın genel arka plan ve metin rengi.

       EN:
       Global page background and text color.
    ===================================================== */

    --body-bg: var(--tmv2-bg-body);
    --body-text: var(--tmv2-text-main);
    /* =====================================================
       LINK
       -----------------------------------------------------
       TR:
       Linklerin normal ve hover renkleri.

       EN:
       Default and hover colors for links.
    ===================================================== */

    --link-color: var(--tmv2-color-primary);
    --link-hover: var(--tmv2-color-primary-hover);
    /* =====================================================
       TEXT
       -----------------------------------------------------
       TR:
       Başlık, paragraf, açıklama ve pasif metin renkleri.

       EN:
       Text colors for headings, body text, descriptions,
       and muted content.
    ===================================================== */

    --text-heading: var(--tmv2-text-dark);
    --text-body: var(--tmv2-text-main);
    --text-soft: var(--tmv2-text-soft);
    --text-muted: var(--tmv2-text-muted);
    --text-inverse: var(--tmv2-text-inverse);
    --text-primary: var(--tmv2-color-primary);
    --text-success: var(--tmv2-color-success);
    --text-danger: var(--tmv2-color-danger);
    --text-warning: var(--tmv2-color-warning);
    --text-info: var(--tmv2-color-info);
    /* =====================================================
       NAVBAR
       -----------------------------------------------------
       TR:
       Public navbar ve üst menü yapıları için değişkenler.

       EN:
       Variables for public navbar and top navigation areas.
    ===================================================== */

    --navbar-height: var(--tmv2-navbar-height);
    --navbar-bg: var(--tmv2-navbar-bg);
    --navbar-text: var(--tmv2-navbar-text);
    --navbar-link: var(--tmv2-navbar-link);
    --navbar-link-hover: var(--tmv2-navbar-link-hover);
    --navbar-border: var(--tmv2-navbar-border);
    --navbar-blur: var(--tmv2-navbar-blur);
    --navbar-dropdown-bg: var(--tmv2-bg-surface);
    --navbar-dropdown-text: var(--tmv2-text-main);
    --navbar-dropdown-border: var(--tmv2-border);
    --navbar-dropdown-shadow: var(--tmv2-shadow-lg);
    /* =====================================================
       BUTTON
       -----------------------------------------------------
       TR:
       Butonların ana, outline, light ve dark varyasyonları.

       EN:
       Primary, outline, light, and dark button variants.
    ===================================================== */

    --btn-radius: var(--tmv2-btn-radius);
    --btn-padding-y: var(--tmv2-btn-padding-y);
    --btn-padding-x: var(--tmv2-btn-padding-x);
    --btn-font-size: var(--tmv2-btn-font-size);
    --btn-font-weight: var(--tmv2-btn-font-weight);
    --btn-primary-bg: var(--tmv2-color-primary);
    --btn-primary-hover: var(--tmv2-color-primary-hover);
    --btn-primary-text: var(--tmv2-text-inverse);
    --btn-primary-shadow: var(--tmv2-shadow-primary);
    --btn-outline-bg: transparent;
    --btn-outline-border: var(--tmv2-border-strong);
    --btn-outline-text: var(--tmv2-text-main);
    --btn-outline-hover-bg: var(--tmv2-color-primary);
    --btn-outline-hover-border: var(--tmv2-color-primary);
    --btn-outline-hover-text: var(--tmv2-text-inverse);
    --btn-light-bg: var(--tmv2-bg-surface);
    --btn-light-text: var(--tmv2-text-main);
    --btn-light-border: var(--tmv2-border);
    --btn-dark-bg: var(--tmv2-text-dark);
    --btn-dark-text: var(--tmv2-text-inverse);
    /* =====================================================
       CARD
       -----------------------------------------------------
       TR:
       Kartların arka plan, kenarlık, radius ve gölge sistemi.

       EN:
       Background, border, radius, and shadow system for cards.
    ===================================================== */

    --card-bg: var(--tmv2-bg-card);
    --card-bg-muted: var(--tmv2-bg-muted);
    --card-border: var(--tmv2-border);
    --card-border-strong: var(--tmv2-border-strong);
    --card-radius: var(--tmv2-radius-xl);
    --card-radius-lg: var(--tmv2-radius-2xl);
    --card-shadow: var(--tmv2-shadow-sm);
    --card-shadow-hover: var(--tmv2-shadow-md);
    --card-title: var(--tmv2-text-dark);
    --card-text: var(--tmv2-text-soft);
    /* =====================================================
       FORM
       -----------------------------------------------------
       TR:
       Input, select, textarea ve focus durumları.

       EN:
       Inputs, selects, textareas, and focus states.
    ===================================================== */

    --form-bg: var(--tmv2-input-bg);
    --form-text: var(--tmv2-input-text);
    --form-placeholder: var(--tmv2-text-muted);
    --form-border: var(--tmv2-input-border);
    --form-border-focus: var(--tmv2-input-border-focus);
    --form-radius: var(--tmv2-input-radius);
    --form-shadow-focus: var(--tmv2-input-shadow-focus);
    --form-label: var(--tmv2-text-dark);
    --form-help: var(--tmv2-text-muted);
    /* =====================================================
       SECTION
       -----------------------------------------------------
       TR:
       Sayfa bölümleri, başlık alanları ve açıklama metinleri.

       EN:
       Page sections, section headers, and description texts.
    ===================================================== */

    --section-bg: var(--tmv2-bg-body);
    --section-bg-surface: var(--tmv2-bg-surface);
    --section-title: var(--tmv2-text-dark);
    --section-text: var(--tmv2-text-soft);
    --section-border: var(--tmv2-border);
    /* =====================================================
       PAGE
       -----------------------------------------------------
       TR:
       İç sayfa başlığı, içerik alanı ve detay sayfası
       yapılarını besleyen değişkenler.

       EN:
       Variables for page headers, content areas, and detail pages.
    ===================================================== */

    --page-bg: var(--tmv2-bg-body);
    --page-title: var(--tmv2-text-dark);
    --page-desc: var(--tmv2-text-soft);
    --page-header-bg: var(--tmv2-bg-surface);
    --page-header-border: var(--tmv2-border);
    --page-content-bg: var(--tmv2-bg-body);
    --page-sidebar-bg: var(--tmv2-bg-surface);
    --page-sidebar-border: var(--tmv2-border);
    /* =====================================================
       FOOTER
       -----------------------------------------------------
       TR:
       Footer arka planı, başlıkları, linkleri ve alt çizgileri.

       EN:
       Footer background, titles, links, and borders.
    ===================================================== */

    --footer-bg: var(--tmv2-bg-surface);
    --footer-text: var(--tmv2-text-soft);
    --footer-title: var(--tmv2-text-dark);
    --footer-link: var(--tmv2-text-main);
    --footer-link-hover: var(--tmv2-color-primary);
    --footer-border: var(--tmv2-border);
    --footer-bottom-bg: var(--tmv2-bg-surface-2);
    /* =====================================================
       BADGE
       -----------------------------------------------------
       TR:
       Etiket, kategori ve küçük durum göstergeleri.

       EN:
       Badges, categories, and small status indicators.
    ===================================================== */

    --badge-bg: rgba(var(--tmv2-color-primary-rgb), .12);
    --badge-text: var(--tmv2-color-primary);
    --badge-border: rgba(var(--tmv2-color-primary-rgb), .18);
    --badge-success-bg: rgba(22, 163, 74, .12);
    --badge-success-text: var(--tmv2-color-success);
    --badge-danger-bg: rgba(220, 38, 38, .12);
    --badge-danger-text: var(--tmv2-color-danger);
    --badge-warning-bg: rgba(245, 158, 11, .14);
    --badge-warning-text: var(--tmv2-color-warning);
    --badge-info-bg: rgba(14, 165, 233, .12);
    --badge-info-text: var(--tmv2-color-info);
    /* =====================================================
       ALERT
       -----------------------------------------------------
       TR:
       Başarı, hata, uyarı ve bilgi kutuları.

       EN:
       Success, error, warning, and info alert boxes.
    ===================================================== */

    --alert-radius: var(--tmv2-radius-lg);
    --alert-border: var(--tmv2-border);
    --alert-shadow: var(--tmv2-shadow-xs);
    --alert-success-bg: rgba(22, 163, 74, .10);
    --alert-success-text: var(--tmv2-color-success);
    --alert-success-border: rgba(22, 163, 74, .22);
    --alert-danger-bg: rgba(220, 38, 38, .10);
    --alert-danger-text: var(--tmv2-color-danger);
    --alert-danger-border: rgba(220, 38, 38, .22);
    --alert-warning-bg: rgba(245, 158, 11, .12);
    --alert-warning-text: var(--tmv2-color-warning);
    --alert-warning-border: rgba(245, 158, 11, .24);
    --alert-info-bg: rgba(14, 165, 233, .10);
    --alert-info-text: var(--tmv2-color-info);
    --alert-info-border: rgba(14, 165, 233, .22);
    /* =====================================================
       TABLE
       -----------------------------------------------------
       TR:
       Tablo arka planı, çizgileri, başlık satırı ve hover durumu.

       EN:
       Table background, borders, header row, and hover state.
    ===================================================== */

    --table-bg: var(--tmv2-bg-surface);
    --table-text: var(--tmv2-text-main);
    --table-border: var(--tmv2-border);
    --table-head-bg: var(--tmv2-bg-surface-2);
    --table-head-text: var(--tmv2-text-dark);
    --table-row-hover: rgba(var(--tmv2-color-primary-rgb), .06);
    /* =====================================================
       BREADCRUMB
       -----------------------------------------------------
       TR:
       Sayfa yolu ve kategori yolu gösterimleri.

       EN:
       Breadcrumb and category path indicators.
    ===================================================== */

    --breadcrumb-bg: transparent;
    --breadcrumb-text: var(--tmv2-text-muted);
    --breadcrumb-link: var(--tmv2-color-primary);
    --breadcrumb-separator: var(--tmv2-text-muted);
    /* =====================================================
       PAGINATION
       -----------------------------------------------------
       TR:
       Sayfalama butonları.

       EN:
       Pagination buttons.
    ===================================================== */

    --pagination-bg: var(--tmv2-bg-surface);
    --pagination-text: var(--tmv2-text-main);
    --pagination-border: var(--tmv2-border);
    --pagination-hover-bg: rgba(var(--tmv2-color-primary-rgb), .10);
    --pagination-active-bg: var(--tmv2-color-primary);
    --pagination-active-text: var(--tmv2-text-inverse);
    /* =====================================================
       MODAL
       -----------------------------------------------------
       TR:
       Popup, dialog ve modal kutuları.

       EN:
       Popup, dialog, and modal boxes.
    ===================================================== */

    --modal-backdrop: rgba(15, 23, 42, .55);
    --modal-bg: var(--tmv2-bg-surface);
    --modal-text: var(--tmv2-text-main);
    --modal-border: var(--tmv2-border);
    --modal-radius: var(--tmv2-radius-2xl);
    --modal-shadow: var(--tmv2-shadow-xl);
    /* =====================================================
       DROPDOWN
       -----------------------------------------------------
       TR:
       Açılır menü ve alt menü sistemleri.

       EN:
       Dropdown and submenu systems.
    ===================================================== */

    --dropdown-bg: var(--tmv2-bg-surface);
    --dropdown-text: var(--tmv2-text-main);
    --dropdown-border: var(--tmv2-border);
    --dropdown-shadow: var(--tmv2-shadow-lg);
    --dropdown-radius: var(--tmv2-radius-xl);
    --dropdown-hover-bg: rgba(var(--tmv2-color-primary-rgb), .08);
    --dropdown-hover-text: var(--tmv2-color-primary);
    /* =====================================================
       LOADER / SKELETON
       -----------------------------------------------------
       TR:
       Yüklenme animasyonu ve iskelet ekranlar.

       EN:
       Loading animation and skeleton screens.
    ===================================================== */

    --loader-color: var(--tmv2-color-primary);
    --loader-bg: rgba(var(--tmv2-color-primary-rgb), .12);
    --skeleton-bg: var(--tmv2-bg-surface-2);
    --skeleton-highlight: var(--tmv2-bg-surface-3);
    /* =====================================================
       EMPTY STATE
       -----------------------------------------------------
       TR:
       Veri bulunamadı, içerik yok gibi boş ekranlar.

       EN:
       Empty screens such as no data or no content found.
    ===================================================== */

    --empty-bg: var(--tmv2-bg-surface);
    --empty-text: var(--tmv2-text-soft);
    --empty-title: var(--tmv2-text-dark);
    --empty-border: var(--tmv2-border);
    /* =====================================================
       ADMIN
       -----------------------------------------------------
       TR:
       Admin panel genel yüzey, sidebar ve topbar renkleri.

       EN:
       General admin panel surface, sidebar, and topbar colors.
    ===================================================== */

    --admin-bg: var(--tmv2-bg-body);
    --admin-surface: var(--tmv2-bg-surface);
    --admin-sidebar-bg: var(--tmv2-bg-surface);
    --admin-sidebar-border: var(--tmv2-border);
    --admin-topbar-bg: var(--tmv2-bg-surface);
    --admin-menu-link: var(--tmv2-text-soft);
    --admin-menu-link-hover: var(--tmv2-color-primary);
    --admin-menu-active-bg: rgba(var(--tmv2-color-primary-rgb), .12);
}