/* assets/css/style.css */

:root {

    --primary-color: #1e3a8a; /* Kurumsal Lacivert */

    --secondary-color: #3b82f6; /* Canlı Mavi */

    --sidebar-bg: #0f172a; /* Koyu Sidebar Arka Planı */

    --bg-color: #f3f4f6;

    --text-color: #1f2937;

    --white: #ffffff;

    --error: #ef4444;

    --success: #10b981;

    --border-radius: 8px;

    --sidebar-width: 260px;

}



* {

    box-sizing: border-box;

}



body {

    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

    background-color: var(--bg-color);

    color: var(--text-color);

    margin: 0;

    padding: 0;

    min-height: 100vh;

}



/* SIDEBAR & ANA YAPI */

.main-wrapper {

    display: flex;

    min-height: 100vh;

}



.sidebar {

    width: var(--sidebar-width);

    background-color: var(--sidebar-bg);

    color: var(--white);

    position: fixed;

    height: 100vh;

    left: 0;

    top: 0;

    display: flex;

    flex-direction: column;

    z-index: 1000;

}



.sidebar-logo {

    padding: 20px;

    background: #020617;

    text-align: center;

    border-bottom: 1px solid #1e293b;

}



.sidebar-logo h2 {

    color: var(--white);

    margin: 0;

    font-size: 1.2rem;

    text-align: center;

}



.sidebar-nav {

    padding: 20px 0;

    flex-grow: 1;

}



.sidebar-nav a {

    display: block;

    padding: 12px 25px;

    color: #cbd5e1;

    text-decoration: none;

    transition: 0.3s;

    font-size: 0.95rem;

}



.sidebar-nav a:hover {

    background: #1e293b;

    color: var(--white);

    border-left: 4px solid var(--secondary-color);

}



.nav-group {

    padding: 15px 25px 5px;

    font-size: 0.75rem;

    color: #64748b;

    text-transform: uppercase;

    letter-spacing: 1px;

}



.user-info-side {

    padding: 15px 25px;

    margin-bottom: 10px;

    background: #1e293b;

}



/* İÇERİK ALANI */

.main-content {

    margin-left: var(--sidebar-width);

    flex-grow: 1;

    padding: 30px;

    width: calc(100% - var(--sidebar-width));

}



.container {

    background: var(--white);

    padding: 2rem;

    border-radius: var(--border-radius);

    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);

    width: 100%;

    max-width: 1100px; /* Sidebar olduğu için genişliği artırdık */

    margin: 0 auto;

}



/* Grid Sistem */

.grid-3 {

    display: grid;

    grid-template-columns: 1fr 1fr 1fr;

    gap: 20px;

}



/* Başlıklar */

h2, h3 {

    color: var(--primary-color);

    margin-top: 0;

}



/* Input ve Buton Tasarımları */

input[type="text"],

input[type="email"],

input[type="password"],

input[type="number"],

input[type="date"],

select,

textarea {

    width: 100%;

    padding: 10px;

    margin: 8px 0;

    border: 1px solid #d1d5db;

    border-radius: var(--border-radius);

    font-size: 0.9rem;

}



button, .btn {

    display: inline-block;

    padding: 10px 20px;

    background-color: var(--primary-color);

    color: white;

    border: none;

    border-radius: var(--border-radius);

    cursor: pointer;

    font-weight: bold;

    text-decoration: none;

    text-align: center;

    transition: background 0.3s ease;

}



button:hover, .btn:hover {

    background-color: var(--secondary-color);

}



/* Tablo Tasarımları */

table {

    width: 100%;

    background: white;

    border-collapse: collapse;

    margin: 20px 0;

    border-radius: var(--border-radius);

    overflow: hidden;

    box-shadow: 0 2px 4px rgba(0,0,0,0.05);

}



th, td {

    padding: 15px;

    text-align: left;

    border-bottom: 1px solid #eee;

}



th {

    background-color: var(--primary-color);

    color: white;

}



tr:hover {

    background-color: #f9fafb;

}



/* Mesaj Kutuları */

.alert {

    padding: 15px;

    border-radius: 4px;

    margin-bottom: 20px;

    text-align: center;

    font-weight: 500;

}

.alert-success { background: #d1fae5; color: #065f46; border-left: 5px solid var(--success); }

.alert-error { background: #fee2e2; color: #991b1b; border-left: 5px solid var(--error); }



/* Özlük Dosyası Ekstraları */

.content-box {

    background: #fff;

    padding: 20px;

    border-radius: var(--border-radius);

    border: 1px solid #e5e7eb;

    margin-bottom: 20px;

}



.tab-nav {

    display: flex;

    gap: 10px;

    margin-bottom: 20px;

}



.tab-link {

    padding: 10px 15px;

    background: #e5e7eb;

    color: var(--text-color);

    text-decoration: none;

    border-radius: var(--border-radius);

    font-size: 0.9rem;

    font-weight: bold;

}



.tab-link.active {

    background: var(--primary-color);

    color: #fff;

}



/* Alt Bilgi */

footer {

    padding: 20px;

    text-align: center;

    color: #64748b;

    font-size: 0.85rem;

}