@import url('css/menu.css');

/* === GENEL STİL === */
body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    min-height: 100vh;
}

#container {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin-top: 20px;
    padding-bottom: 40px;
}

#menu {
    background-color: #333;
    color: #fff;
    padding: 15px;
    width: 250px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
}

#menu a {
    display: block;
    color: #fff;
    text-decoration: none;
    margin: 10px 0;
    padding: 10px;
    font-weight: bold;
    background-color: #444;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}
#menu a:hover {
    background-color: #666;
}

/* === ALACAKLAR & VERECEKLER === */
#alacaklar-page #content,
#verilecekler-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 1200px;
    margin-left: 270px;
    margin-top: 40px;
    overflow-x: auto;
}

#alacaklar-page table,
#verilecekler-page table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    table-layout: auto;
}

#alacaklar-page th, #verilecekler-page th,
#alacaklar-page td, #verilecekler-page td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

#alacaklar-page th, #verilecekler-page th {
    background-color: #f2f2f2;
    font-weight: bold;
    white-space: nowrap;
}

#alacaklar-page tr:hover, #verilecekler-page tr:hover {
    background-color: #f9f9f9;
}

#alacaklar-page td:first-child,
#verilecekler-page td:first-child {
    font-weight: bold;
}

#alacaklar-page .pagination,
#verilecekler-page .pagination {
    display: flex;
    justify-content: center;
    margin: 30px 0;
}

#alacaklar-page .pagination a,
#verilecekler-page .pagination a {
    background-color: #2196F3;
    color: white;
    padding: 8px 16px;
    margin: 0 5px;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.3s;
}

#alacaklar-page .pagination a.active,
#verilecekler-page .pagination a.active {
    background-color: #4CAF50;
    font-weight: bold;
}

#verilecekler-page td.action-buttons, 
#alacaklar-page td.action-buttons {
    justify-content: center !important;
}

#verilecekler-page .record-summary.action-buttons {
    justify-content: center;
}

/* === DETAY SAYFASI === */
#alacak-detay-page #container {
    margin-left: 270px;
    display: flex;
    justify-content: center;
}

#alacak-detay-page #content {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    max-width: 1000px;
    width: 100%;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    padding: 0;
    margin: 40px auto;
}

#alacak-detay-page h2 {
    margin: 0;
    padding: 12px 20px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ddd;
    font-size: 20px;
    color: #333;
    text-align: center;
}

#alacak-detay-page .detail-row {
    display: grid;
    grid-template-columns: 180px 1fr;
    padding: 10px 20px;
}
#alacak-detay-page .detail-row:nth-child(odd) { background-color: #f9f9f9; }
#alacak-detay-page .detail-row:nth-child(even) { background-color: #ffffff; }
#alacak-detay-page .detail-row__label {
    font-weight: bold;
    color: #444;
    text-transform: uppercase;
}
#alacak-detay-page .detail-row__value {
    color: #555;
}

/* === EKLE SAYFASI === */
#alacak-ekle-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 600px;
    margin-left: 270px;
    margin-top: 40px;
}

#alacak-ekle-page form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#alacak-ekle-page input,
#alacak-ekle-page button {
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 14px;
}

#alacak-ekle-page input:focus {
    outline: none;
    border-color: #28a745;
}

#alacak-ekle-page .alert {
    background-color: #28a745;
    color: white;
    padding: 12px;
    border-radius: 6px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 20px;
}

/* === DÜZENLE SAYFASI === */
#alacak-duzenle-page #container {
    margin-left: 270px;
    display: flex;
    justify-content: center;
}

#alacak-duzenle-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 600px;
    margin: 40px auto;
}

#alacak-duzenle-page form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#alacak-duzenle-page input,
#alacak-duzenle-page button {
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 14px;
}

#alacak-duzenle-page input:focus {
    outline: none;
    border-color: #28a745;
}

/* === BUTONLAR === */
.btn {
    background-color: #28a745;
    color: white;
    font-weight: bold;
    padding: 10px 20px;
    text-decoration: none;
    border: none;
    border-radius: 5px;
    display: inline-block;
    transition: background-color 0.3s, transform 0.2s;
    cursor: pointer;
    font-size: 14px;
}
.btn:hover {
    background-color: #218838;
    transform: scale(1.03);
}
.btn.danger { background-color: #dc3545; }
.btn.danger:hover { background-color: #c82333; }
.btn.kur-detay { background-color: #17a2b8; }
.btn.kur-detay:hover { background-color: #138496; }

/* === RENKLER === */
.red-bold { color: red; font-weight: bold; }
.green-bold { color: green; font-weight: bold; }

/* === BUTON GRUPLARI === */
.action-buttons {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}
.record-summary.action-buttons { margin-top: 20px; }

/* === MOBİL === */
@media (max-width: 768px) {
    #container { flex-direction: column; }
    #menu {
        width: 100%;
        height: auto;
        position: relative;
    }
    #alacaklar-page #content,
    #verilecekler-page #content,
    #alacak-detay-page #content,
    #alacak-ekle-page #content,
    #alacak-duzenle-page #content {
        margin-left: 0;
        margin-top: 20px;
    }
    .btn {
        width: 100%;
        text-align: center;
    }
    .action-buttons {
        flex-wrap: wrap;
        gap: 4px;
    }
}

/* === ARŞİV SAYFASI - İZOLE === */
#arsiv-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 1200px;
    margin-left: 270px;
    margin-top: 40px;
    overflow-x: auto;
}

#arsiv-page table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

#arsiv-page th, #arsiv-page td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
    white-space: nowrap;
}

#arsiv-page th {
    background-color: #f2f2f2;
    font-weight: bold;
}

#arsiv-page tr:hover {
    background-color: #f9f9f9;
}

#arsiv-page td:first-child {
    font-weight: bold;
}

#arsiv-page .green-bold {
    color: green;
    font-weight: bold;
}
#arsiv-page .red-bold {
    color: red;
    font-weight: bold;
}

#arsiv-page .btn.small {
    padding: 6px 14px;
    font-size: 13px;
}

#arsiv-page .search-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

#arsiv-page .search-bar input,
#arsiv-page .search-bar select {
    padding: 8px;
    font-size: 14px;
    border-radius: 5px;
    border: 1px solid #ccc;
}

/* === VERİLECEK EKLE STİLİ === */
#verilecek-ekle-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 600px;
    margin-left: 270px;
    margin-top: 40px;
}

#verilecek-ekle-page form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#verilecek-ekle-page input,
#verilecek-ekle-page button {
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 14px;
}

#verilecek-ekle-page input:focus {
    outline: none;
    border-color: #28a745;
}

#verilecek-ekle-page .alert {
    background-color: #28a745;
    color: white;
    padding: 12px;
    border-radius: 6px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 20px;
}

/* === INDEX (ANASAYFA) === */
#index-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 1200px;
    margin-left: 270px;
    margin-top: 40px;
    overflow-x: auto;
}

#index-page table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

#index-page th, #index-page td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
    white-space: nowrap;
}

#index-page th {
    background-color: #f2f2f2;
    font-weight: bold;
}

#index-page tr:hover {
    background-color: #f9f9f9;
}

#index-page td:first-child {
    font-weight: bold;
}

#index-page .summary {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}
#index-page .summary .card {
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    padding: 20px;
    flex: 1 1 250px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0 0 8px rgba(0,0,0,0.05);
}
#index-page .summary .card h3 {
    margin-top: 0;
    color: #333;
}
#index-page .summary .card p {
    font-size: 18px;
    font-weight: bold;
    color: #444;
}
#index-page .announcements {
    margin-top: 40px;
}
#index-page .announcements h3 {
    margin-bottom: 10px;
}
#index-page .announcements a {
    color: #28a745;
    font-weight: bold;
    text-decoration: none;
}

#index-page .summary {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 30px 0;
    justify-content: center;
}

#index-page .card {
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    text-align: center;
    font-size: 16px;
    color: #fff; /* Yazılar beyaz */
    font-weight: bold;
}

#index-page .card:nth-child(1) { background-color: #4CAF50; color: #FFF !important; font-weight:bold; }  /* Yeşil */
#index-page .card:nth-child(2) { background-color: #2196F3; color: #FFF;  }  /* Mavi */
#index-page .card:nth-child(3) { background-color: #FF9800; color: #FFF;  }  /* Turuncu */
#index-page .card:nth-child(4) {
    background-color: #9C27B0;  /* Mor */
	color: #FFF; 
    flex-basis: 100%;           /* ALT SATIRA GEÇİR */
}

#index-page .card h3,
#index-page .card p {
    color: #fff !important;
    font-weight: bold;
}

/* === VERİLECEK DETAY SAYFASI === */
#verilecek-detay-page #container {
    margin-left: 270px;
    display: flex;
    justify-content: center;
}

#verilecek-detay-page #content {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    max-width: 1000px;
    width: 100%;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    padding: 0;
    margin: 40px auto;
}

#verilecek-detay-page h2 {
    margin: 0;
    padding: 12px 20px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ddd;
    font-size: 20px;
    color: #333;
    text-align: center;
}

#verilecek-detay-page .detail-row {
    display: grid;
    grid-template-columns: 180px 1fr;
    padding: 10px 20px;
}
#verilecek-detay-page .detail-row:nth-child(odd)  { background-color: #f9f9f9; }
#verilecek-detay-page .detail-row:nth-child(even) { background-color: #ffffff; }

#verilecek-detay-page .detail-row__label {
    font-weight: bold;
    color: #444;
    text-transform: uppercase;
}
#verilecek-detay-page .detail-row__value {
    color: #555;
}

/* === VERECEK DÜZENLE SAYFASI === */
#verilecek-duzenle-page #container {
    margin-left: 270px;
    display: flex;
    justify-content: center;
}

#verilecek-duzenle-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 600px;
    margin: 40px auto;
}

#verilecek-duzenle-page form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#verilecek-duzenle-page input,
#verilecek-duzenle-page button {
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 14px;
}

#verilecek-duzenle-page input:focus {
    outline: none;
    border-color: #28a745;
}

#verilecek-duzenle-page button {
    background-color: #28a745;
    color: white;
    font-weight: bold;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
}

#verilecek-duzenle-page button:hover {
    background-color: #218838;
}

/* === VERİLECEKLER SAYFASINA ÖZGÜ BUTON HİZALAMA === */
#verilecekler-page .action-buttons {
    justify-content: flex-start;  /* global .action-buttons override */
}

/* arsiv.php sayfa bazlı pagination stili */
#arsiv-page .pagination {
    text-align: center;
    margin: 20px 0;
}
#arsiv-page .pagination a {
    display: inline-block;
    padding: 6px 12px;
    margin: 0 2px;
    text-decoration: none;
    background-color: #337ab7;    /* mavi */
    color: #fff;
    border: 1px solid #286090;
    border-radius: 4px;
}
#arsiv-page .pagination a.active {
    background-color: #5cb85c;    /* yeşil */
    border-color: #4cae4c;
    color: #fff;
}
#arsiv-page .pagination a:hover {
    background-color: #286090;
    border-color: #204d74;
}

/* === KULLANICI YÖNETİMİ - İZOLE STİL === */
#user-page #content {
    flex: 1;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);
    max-width: 1000px;
    margin-left: 270px;
    margin-top: 40px;
}

#user-page h2 {
    font-size: 24px;
    color: #333;
    margin-bottom: 20px;
    text-align: center;
    font-weight: bold;
}

#user-page h3 {
    font-size: 18px;
    margin-top: 40px;
    color: #444;
    font-weight: bold;
}

#user-page .form-container {
    background-color: #fafafa;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 30px;
    box-shadow: 0 0 6px rgba(0,0,0,0.05);
}

#user-page .form-group {
    margin-bottom: 15px;
}

#user-page .form-group label {
    display: block;
    font-weight: bold;
    margin-bottom: 6px;
    color: #333;
}

#user-page .form-group input {
    width: 100%;
    padding: 10px;
    font-size: 14px;
    border-radius: 6px;
    border: 1px solid #ccc;
    transition: border-color 0.3s;
}

#user-page .form-group input:focus {
    outline: none;
    border-color: #28a745;
}

#user-page .alert {
    background-color: #007bff;
    color: white;
    padding: 12px;
    border-radius: 6px;
    margin-bottom: 20px;
    text-align: center;
    font-weight: bold;
}

#user-page table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    background-color: #fff;
}

#user-page th, #user-page td {
    border: 1px solid #ddd;
    padding: 12px;
    text-align: left;
}

#user-page th {
    background-color: #f2f2f2;
    font-weight: bold;
    color: #333;
}

#user-page tr:hover {
    background-color: #f9f9f9;
}

#user-page .actions a {
    margin-right: 10px;
    padding: 6px 12px;
    border-radius: 5px;
    background-color: #28a745;
    color: white;
    font-weight: bold;
    text-decoration: none;
    font-size: 13px;
    transition: background-color 0.2s;
}

#user-page .actions a:hover {
    background-color: #218838;
}

#user-page .actions a.danger {
    background-color: #dc3545;
}
#user-page .actions a.danger:hover {
    background-color: #c82333;
}

/* === UYARI KUTUSU === */
#index-page .uyari-kutusu {
    background-color: #fff3e0;
    color: #bf360c;
    border-left: 6px solid #ff6f00;
    padding: 18px 24px;
    margin-bottom: 40px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 16px;
    text-align: center;
}