/* Warna utama: Kuning Keemasan */
:root {
    --gold-primary: #FFD700;
    --gold-dark: #C9A300;
    --gold-light: #FFF4C2;
    --text-dark: #4A3600;
    --border-color: #E1C16E;
    --row-light: #FFF8DC;
    --row-dark: #FFEB9B;
}

/* Styling Tabel */
table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    background-color: var(--gold-light);
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    overflow: hidden;
    margin-top: 20px;
}

/* Header Tabel */
thead {
    background-color: var(--gold-primary);
    color: var(--text-dark);
    font-weight: bold;
}

thead th {
    padding: 12px;
    border-bottom: 3px solid var(--gold-dark);
    text-align: center;
}

/* Body Tabel */
tbody tr {
    transition: background-color 0.3s ease-in-out;
}

/* Efek zebra strip */
tbody tr:nth-child(odd) {
    background-color: var(--row-light);
}

tbody tr:nth-child(even) {
    background-color: var(--row-dark);
}

/* Hover Effect */
tbody tr:hover {
    background-color: var(--gold-primary);
    color: var(--text-dark);
    font-weight: bold;
}

/* Styling untuk sel */
tbody td {
    padding: 10px;
    text-align: center;
    color: var(--text-dark);
}

/* Styling untuk angka */
tbody td:nth-child(3),
tbody td:nth-child(4) {
    font-weight: bold;
    color: var(--gold-dark);
}

/* Tanggal di tengah */
.tanggal-cell {
    font-weight: bold;
    background-color: var(--gold-primary);
    color: var(--text-dark);
    vertical-align: middle;
    text-align: center;
}

/* Responsive Table */
@media (max-width: 768px) {
    table {
        font-size: 14px;
    }
    tbody td {
        padding: 8px;
    }
}