/* ======================================================================= */
/* TEMEL STİLLER (Base Styles) */
/* ======================================================================= */
body { font-family: Arial, sans-serif; margin: 20px; background-color: #f4f4f4; color: #333; }
.container { max-width: 1000px; margin: auto; background: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }

h2, h3 { border-bottom: 2px solid #eee; padding-bottom: 5px; color: #0056b3; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.4em; margin-top: 30px; }

/* Form ve Inputlar */
#yeniKayitFormu { display: none; border: 1px solid #ccc; padding: 20px; margin-top: 20px; border-radius: 5px; background-color: #f9f9f9; }
input[type="text"], input[type="date"], input[type="number"], textarea, select { width: 100%; padding: 10px; margin: 5px 0 15px 0; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px; font-size: 1em; }

/* Buton Stilleri */
#yeniKayitButon { font-size: 1.2em; padding: 10px 20px; background-color: #28a745; color: white; border: none; border-radius: 5px; cursor: pointer; }
#yeniKayitButon:hover { background-color: #218838; }
.buton-kaydet { padding: 12px 25px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 1.1em; margin-top: 10px; }
.buton-kaydet:hover { background-color: #0056b3; }
.buton-kucuk { padding: 5px 10px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 0.9em; }
.buton-kucuk:hover { background-color: #0056b3; }

/* Checkbox ve Personel Grupları */
.checkbox-group, .personel-checkbox-group {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 15px; border: 1px solid #ddd; border-radius: 4px; margin-bottom: 15px;
}
.personel-checkbox-group { height: 150px; overflow-y: auto; background-color: #fff; }
.checkbox-group label, .personel-checkbox-group label { display: flex; align-items: center; gap: 8px; font-size: 0.95em; }

/* İşlem Butonları */
.buton-islem { padding: 4px 8px; font-size: 0.9em; margin-right: 5px; cursor: pointer; border-radius: 4px; border: none; color: white; font-weight: bold; white-space: nowrap; }
.buton-duzenle { background-color: #ffc107; color: #333; }
.buton-sil { background-color: #dc3545; }

/* ======================================================================= */
/* TABLO GENEL VE OPTİMİZASYON STİLLERİ */
/* ======================================================================= */
table { width: 100%; border-collapse: collapse; margin-top: 20px; table-layout: auto; }
th, td { border: 1px solid #ddd; padding: 12px; text-align: left; vertical-align: top; }
th { background-color: #f2f2f2; font-weight: bold; }
tbody tr:nth-child(even) { background-color: #f9f9f9; }

/* Özet Tablosu Optimizasyonu */
#ozetListesiBody td:first-child { 
    border-bottom: 1px solid #ccc; 
    height: 3.5em; 
}

#ozetListesiBody td:nth-child(2) {
    width: 120px;
    max-width: 120px; 
    text-align: center;
    font-weight: bold;
}

/* Hafta Sonu Tarih Vurgulama Stili */
.weekend-date {
    background-color: #fffbe6 !important; /* Açık sarı */
    color: #b58100; /* Koyu sarı/kahve */
    font-weight: bold;
}

/* ======================================================================= */
/* RESPONSIVE OPTİMİZASYON (Mobil Uyum) */
/* ======================================================================= */

@media (max-width: 768px) { 
    .islem-sutununda {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
}

/* Mobil Global Font Küçültme ve Kaydırma (700px Altı) */
@media (max-width: 700px) {
    body { font-size: 15px; }
    .container { padding: 10px; }
    h2 { font-size: 1.6em; }
    h3 { font-size: 1.3em; }
    th, td { padding: 8px; }
    
    .table-responsive-wrapper {
        overflow-x: auto;
        width: 100%;
        margin-top: 10px;
    }
    .responsive-table {
        min-width: 600px; 
    }
    .responsive-table th, .responsive-table td { font-size: 0.9em; }
    
    /* DÜZELTME: ÖZET TABLOSU MOBİL SABİTLEME */
    #ozetListesiBody td {
        display: inline-block; /* Yan yana durmayı sağla */
        padding: 12px 10px;
        border: none;
        height: auto !important;
        white-space: normal;
        vertical-align: top;
    }

    #ozetListesiBody td:first-child {
        width: calc(100% - 130px); /* Kalan alanı kapla */
        float: left; /* Sola sabitle */
        text-align: left;
        border-bottom: 1px solid #ccc !important;
    }

    #ozetListesiBody td:nth-child(2) {
        width: 120px; /* Sabit genişlik */
        float: right; /* Sağa sabitle */
        text-align: right;
        font-weight: bold;
    }

    #ozetListesiBody tr {
        display: block;
        overflow: hidden; /* float temizleme */
        margin-bottom: 15px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
}


/* 600px Altında Tabloyu Kart Görünümüne Geçirme (Ana Kayıtlar) */
@media (max-width: 600px) {
    
    .checkbox-group, .personel-checkbox-group { grid-template-columns: 1fr; }
    
    .table-responsive-wrapper { overflow-x: visible; }
    table.responsive-table { border: none; margin-top: 0; min-width: 100%; } 
    table.responsive-table thead { display: none; } 
    
    table.responsive-table, table.responsive-table tbody, table.responsive-table tr, table.responsive-table td { display: block; width: 100%; box-sizing: border-box; }
    
    table.responsive-table tbody tr {
        margin-bottom: 15px;
        border: 1px solid #ccc;
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    }
    
    table.responsive-table td {
        border: none;
        border-bottom: 1px solid #eee; 
        position: relative;
        padding-left: 50% !important; 
        text-align: right;
        min-height: 40px;
    }

    table.responsive-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 10px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        color: #0056b3;
    }
    
    table.responsive-table td:last-child {
        text-align: center;
        border-bottom: none;
        padding-left: 10px !important;
    }
    table.responsive-table td:last-child::before {
        content: none;
    }

    /* Mobil kart görünümünde hafta sonu etiket rengini ayarla */
    table.responsive-table td.weekend-date::before {
        color: #b58100; /* Etiket rengi */
    }

}

/* ======================================================================= */
/* YAZDIRMA (PRINT) STİLLERİ */
/* ======================================================================= */
@media print {
    body { margin: 0; background-color: #fff; }
    .container { box-shadow: none; border: none; padding: 0; }
    .buton-grubu, #yeniKayitFormu, h2 { display: none; } 
    h3 { margin-top: 15px; font-size: 1.2em; padding-top: 10px; border-top: 1px solid #ccc; }
    table { margin-top: 5px; }
    td, th { padding: 6px; }

    /* İşlemler sütununu yazdırmadan gizle */
    .responsive-table th:last-child, .responsive-table td:last-child { display: none; }
    
    /* Özet tablosu optimizasyonu */
    #ozetListesiBody td:first-child { 
        height: 3.5em; 
        border-bottom: 1px solid #ccc !important;
    }
    #ozetListesiBody td:nth-child(2) {
        width: 100px;
        max-width: 100px;
        text-align: center;
    }
    
    /* Hafta sonu vurgusunu koru */
    .weekend-date {
        background-color: #f0f0f0 !important; /* Gri tonlama */
        color: #333 !important;
        font-weight: bold;
    }
}