/* Background Umum */
body {
    background: #ffe6f2 !important;
    font-family: "Poppins", sans-serif;
    color: #333;
}

/* ============================
    CARD CUTE PINK
   ============================ */

.card {
    background: #ffccdd !important;
    border-radius: 18px;
    border: 2px solid #ff99c8 !important;
    box-shadow: 0 0 20px rgba(255, 105, 180, 0.3);
}

/* Header Card */
.card-header {
    background: #ff99c8 !important;
    border-bottom: 3px solid #ff7ab8 !important;
    text-align: center;
    color: white !important;
    font-weight: bold;
    font-size: 28px;
    padding: 15px;
    letter-spacing: 1px;
    border-radius: 15px 15px 0 0 !important;
}

/* Footer Card */
.card-footer {
    background: #ff99c8 !important;
    border-top: 3px solid #ff7ab8 !important;
    height: 15px;
    border-radius: 0 0 15px 15px !important;
}

/* ============================
    TABLE STYLE PINK KAWAII
   ============================ */

table {
    border-color: #ff99c8 !important;
}

.table-responsive {
    border-radius: 15px;
    border: 2px solid #ff99c8 !important;
    overflow-x: auto;
}


/* Header tabel pink */
thead.bg-pink th,
table thead th {
    background: linear-gradient(135deg, #ff80bf, #ff4da6) !important;
    color: white !important;
    text-align: center;
    font-weight: 600;
    padding: 12px !important;
    border-bottom: 4px solid #ff99c8 !important;
    letter-spacing: 0.5px;
}


/* Hover baris */
table tbody tr:hover td {
    background: #ffd1ec !important;
    transition: all 0.3s ease;
}

/* ============================
    SCROLLBAR PINK
   ============================ */

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #ffd1ec;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #ff80bf;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #ff4da6;
}

/* ============================
    TABLE BORDER KONSISTEN
   ============================ */
table,
th,
td {
    border-color: #ff99c8 !important;
}

/* ============================
    RESPONSIVE FIX
   ============================ */
.table-responsive {
    border-radius: 15px;
    overflow: auto;
    border: 2px solid #ff99c8 !important;
}