body{
    background:#f5f7fa;
    font-family:'Segoe UI',sans-serif;
}

.navbar-ekeyin{
    background:#166534;
}

.sidebar{
    background:#14532D;
    min-height:100vh;
}

.sidebar a{
    color:#fff;
    text-decoration:none;
    display:block;
    padding:12px 18px;
    border-radius:8px;
    margin-bottom:5px;
    transition:.3s;
}

.sidebar a:hover{
    background:#16A34A;
}

.card-dashboard{
    border:none;
    border-radius:15px;
    box-shadow:0 4px 15px rgba(0,0,0,.08);
}

.btn-ekeyin{
    background:#16A34A;
    color:#fff;
}

.btn-ekeyin:hover{
    background:#15803D;
    color:#fff;
}

.text-ekeyin{
    color:#166534;
    font-weight:bold;
}

#scrollTop::-webkit-scrollbar{
    height:14px;
}

#scrollTop::-webkit-scrollbar-thumb{
    background:#198754;
    border-radius:10px;
}

#scrollTop::-webkit-scrollbar-track{
    background:#e9ecef;
}

/* =====================================================
   E-MISHKAT MOBILE RESPONSIVE PACK v1.0 (iPhone/Android)
   ===================================================== */

html, body{
    overflow-x:hidden;
    width:100%;
}

.container,
.container-fluid{
    max-width:100%;
    overflow-x:hidden;
}

/* Elak row Bootstrap buat ruang putih kiri kanan */
.row{
    margin-left:0 !important;
    margin-right:0 !important;
}

/* Semua card dashboard cantik di telefon */
.card-dashboard,
.card{
    border-radius:14px;
}

@media (max-width:768px){

    /* Sidebar mobile */
    .sidebar{
        min-height:auto;
    }

    /* Header sekolah */
    .navbar-ekeyin{
        padding:10px 12px;
    }

    .navbar-ekeyin h3,
    .navbar-ekeyin h4{
        font-size:20px;
    }

    /* Statistik dashboard */
    .stat-card,
    .card-dashboard{
        width:100%;
        margin-bottom:12px;
    }

    /* Search box */
    .search-box,
    .search-box input,
    input[type=text],
    input[type=date],
    input[type=email],
    input[type=number],
    select{
        width:100%;
    }

    /* Butang Modul Guru/Murid */
    .action-mobile .btn{
        width:100%;
        margin-bottom:8px;
        white-space:normal;
        font-size:14px;
        padding:10px;
    }

    /* Table responsive */
    .table-responsive{
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    .table{
        min-width:900px;
        font-size:13px;
    }

    .table th,
    .table td{
        white-space:nowrap;
        vertical-align:middle;
    }

    /* Card statistik jadi 2 kolum */
    .col-stat{
        width:50%;
        padding:6px;
    }

    /* Badge kecil di telefon */
    .badge{
        font-size:11px;
    }

    /* Elak butang terapung keluar skrin */
    .btn{
        max-width:100%;
    }
}