﻿/* ==========================================================================
   2. TEKNO SÖRF BİLİŞİM - COMPONENTS CSS (BİLEŞENLER)
   Dosya Yolu: ~/adosya/css/teknosorf-components.css
   Konsept: Dark Mode Overrides & Neon UI
   ========================================================================== */

:root {
    --ts-bg-input: #14281d; /* Input/Form Zemini */
}

/* --- BAŞLIKLAR --- */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--ts-text-white) !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px;
}

/* --- BOOTSTRAP RENK EZME --- */
.text-dark {
    color: var(--ts-text-white) !important;
}

.text-muted {
    color: var(--ts-text-muted) !important;
}

.bg-white, .bg-light, .bg-body {
    background-color: var(--ts-bg-card) !important;
}

.border {
    border-color: var(--ts-border) !important;
}

/* --- KARTLAR (KUTULAR) --- */
.card {
    background-color: var(--ts-bg-card) !important;
    border: 1px solid var(--ts-border) !important;
    border-radius: var(--ts-radius) !important;
    box-shadow: var(--ts-shadow) !important;
    margin-bottom: 25px !important;
    overflow: hidden;
}

    .card:hover {
        border-color: var(--ts-border-light) !important;
        transform: translateY(-3px);
    }

.card-header {
    background-color: rgba(0,0,0,0.25) !important;
    border-bottom: 1px solid var(--ts-border) !important;
    color: var(--ts-neon) !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    padding: 1.2rem 1.5rem !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
    /* Kart başlıklarını neon yap */
    .card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5 {
        color: var(--ts-neon) !important;
        margin: 0 !important;
    }

    .card-header i {
        color: var(--ts-neon) !important;
    }

.card-body {
    color: var(--ts-text-body) !important;
    padding: 1.5rem !important;
}

.card-footer {
    background-color: rgba(0,0,0,0.15) !important;
    border-top: 1px solid var(--ts-border) !important;
    padding: 1rem !important;
    color: var(--ts-text-muted) !important;
}

/* --- FORMLAR VE INPUTLAR (EN ÖNEMLİ KISIM) --- */
.form-control, .form-select, textarea, input[type="text"], input[type="password"], input[type="email"], input[type="date"], input[type="file"] {
    background-color: var(--ts-bg-input) !important;
    border: 1px solid var(--ts-border) !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 12px 15px !important;
    transition: all 0.3s ease !important;
}

    /* Input Focus (Neon Parlama) */
    .form-control:focus, .form-select:focus {
        border-color: var(--ts-neon) !important;
        box-shadow: 0 0 10px rgba(140, 198, 63, 0.25) !important;
        background-color: #183023 !important;
        color: #fff !important;
    }

    /* Placeholder Rengi */
    .form-control::placeholder {
        color: rgba(255,255,255,0.3) !important;
    }

/* Form Etiketleri */
label, .form-label {
    color: var(--ts-text-white) !important;
    font-weight: 600 !important;
    margin-bottom: 8px !important;
    font-size: 0.95rem !important;
}

/* Dosya Yükleme Butonu */
input[type="file"]::file-selector-button {
    background-color: var(--ts-border) !important;
    color: var(--ts-neon) !important;
    border: none !important;
    padding: 6px 12px;
    border-radius: 4px;
    margin-right: 15px;
    cursor: pointer;
}

/* Switch & Checkbox */
.form-check-input {
    background-color: var(--ts-bg-input) !important;
    border-color: var(--ts-border) !important;
}

    .form-check-input:checked {
        background-color: var(--ts-neon) !important;
        border-color: var(--ts-neon) !important;
    }

/* --- BUTONLAR --- */
.btn {
    border-radius: 50px !important;
    padding: 10px 24px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border: none !important;
    transition: transform 0.2s !important;
}

    .btn:hover {
        transform: translateY(-2px) !important;
    }

/* Ana Buton (Neon) */
.btn-primary, .btn-success {
    background: linear-gradient(135deg, var(--ts-neon), var(--ts-neon-hover)) !important;
    color: #000 !important; /* Neon üstüne siyah yazı */
    box-shadow: 0 4px 15px rgba(140, 198, 63, 0.4) !important;
}

    .btn-primary:hover, .btn-success:hover {
        background: #fff !important;
        color: var(--ts-neon) !important;
    }

/* Düzenle Butonu (Sarı) */
.btn-warning {
    background: rgba(255, 193, 7, 0.1) !important;
    border: 1px solid #ffca2c !important;
    color: #ffca2c !important;
}

    .btn-warning:hover {
        background: #ffca2c !important;
        color: #000 !important;
    }

/* Sil Butonu (Kırmızı) */
.btn-danger {
    background: rgba(220, 53, 69, 0.1) !important;
    border: 1px solid #ff6b6b !important;
    color: #ff6b6b !important;
}

    .btn-danger:hover {
        background: #ff6b6b !important;
        color: #fff !important;
    }

/* İkincil Butonlar */
.btn-light, .btn-secondary, .btn-outline-secondary {
    background: transparent !important;
    border: 1px solid var(--ts-text-muted) !important;
    color: var(--ts-text-muted) !important;
}

    .btn-light:hover, .btn-secondary:hover {
        border-color: #fff !important;
        color: #fff !important;
    }

/* --- TABLOLAR --- */
.table-responsive {
    border: 1px solid var(--ts-border) !important;
    border-radius: var(--ts-radius) !important;
    background-color: var(--ts-bg-card);
}

.table {
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--ts-text-body) !important;
    margin-bottom: 0 !important;
    border-color: var(--ts-border) !important;
}

    .table thead th {
        background-color: rgba(0,0,0,0.4) !important;
        color: var(--ts-neon) !important;
        font-weight: 700 !important;
        text-transform: uppercase;
        border-bottom: 2px solid var(--ts-border) !important;
        padding: 15px !important;
    }

    .table tbody td {
        border-bottom: 1px solid var(--ts-border) !important;
        color: #fff !important;
        padding: 15px !important;
        vertical-align: middle !important;
    }

.table-hover tbody tr:hover td {
    background-color: rgba(140, 198, 63, 0.08) !important;
    color: #fff !important;
}

/* DataTables Sayfalama */
.dataTables_wrapper {
    color: var(--ts-text-muted) !important;
}

.dataTables_length select {
    color: #fff !important;
    background-color: var(--ts-bg-input) !important;
}

.dataTables_filter input {
    color: #fff !important;
    background-color: var(--ts-bg-input) !important;
}

.page-item .page-link {
    background-color: var(--ts-bg-input) !important;
    border-color: var(--ts-border) !important;
    color: var(--ts-text-white) !important;
}

.page-item.active .page-link {
    background-color: var(--ts-neon) !important;
    border-color: var(--ts-neon) !important;
    color: #000 !important;
    font-weight: bold;
}

.page-item.disabled .page-link {
    background-color: transparent !important;
    color: rgba(255,255,255,0.2) !important;
}

/* --- DİĞER (Dropdown, Modal, Alert) --- */
.dropdown-menu {
    background-color: var(--ts-bg-card) !important;
    border: 1px solid var(--ts-border) !important;
    box-shadow: var(--ts-shadow) !important;
}

.dropdown-item {
    color: var(--ts-text-white) !important;
}

    .dropdown-item:hover {
        background-color: var(--ts-neon) !important;
        color: #000 !important;
    }

.modal-content {
    background-color: var(--ts-bg-card) !important;
    border: 1px solid var(--ts-border) !important;
    color: #fff !important;
}

.modal-header, .modal-footer {
    border-color: var(--ts-border) !important;
}

.btn-close {
    filter: invert(1);
}

.alert-info {
    background-color: rgba(140, 198, 63, 0.15) !important;
    border-color: var(--ts-neon) !important;
    color: var(--ts-neon) !important;
}

/* CKEditor Fix */
.cke_top, .cke_bottom {
    background: var(--ts-bg-card) !important;
    border-color: var(--ts-border) !important;
}

.cke_chrome {
    border-color: var(--ts-border) !important;
}

.cke_contents {
    filter: invert(0) !important;
}
