/* 1. WARNA DEFAULT (JIKA GRUP TIDAK DIKENALI / CADANGAN) */
:root {
    --primary: #ffc107; /* Warna biru bawaan btn-info asli */
    
}

/* 2. DEFINISI WARNA UNTUK MASING-MASING DARI 5 GRUP */
[data-group="lembaga"] {
    --primary: #D32F2F; /* Merah */
}

[data-group="korcab"] {
    --primary: #3D550C; /* Hijau */
}

[data-group="guru"] {
    --primary: #003B73; /* Kuning/Emas #ffc107 */
}

[data-group="korcam"] {
    --primary: #6f42c1; /* Ungu */
}
[data-group="korwil"] {
    --primary: #17a2b8; /* Oranye */
}
[data-group="korpus"] {
    --primary: #fd7e14; /* Oranye */
}

[data-group="home"] {
    --primary: #EC6530; /* Oranye */
}

/* 3. TERAPKAN VARIABEL PADA CLASS YANG ANDA MAKSUD */
.panel > .panel-heading  {
    background-color: var(--primary) !important;
    
    border : 3px solid white;
    color: white;    
}

.icon {
    color: var(--primary) !important; /* Memastikan teks tetap putih dan terbaca jelas*/
}

.btn.btn-info,
.btn-info:hover,
.btn-info:focus,
.btn-info:active:focus {
   background-color: var(--primary) !important;
    border-color: var(--primary) !important; /* Agar border sewarna dengan background */
    color: #ffffff !important; /* Memastikan teks tetap putih dan terbaca jelas */
}

.tombol-info { /*bbrp tombol bootstrap panah back di panel header perlu di kasih nama kelas ini agar warna menyesuaikan*/
   background-color: var(--primary) !important;
    border-color: var(--primary) !important; /* Agar border sewarna dengan background */
    color: #ffffff !important; /* Memastikan teks tetap putih dan terbaca jelas */
}

body {
    background : #404040;
    color : black;
}

.navbar  {
    border-color : #404040; 
}

.container-fluid {
    background-color: #404040 ; 
    border-color : #404040; 
}


.proses-imtas {
    border-radius:4px; 
    border:5px solid lightgrey;
    padding : 4px;
    text-align : center;
    margin : 4px;
}

.angka{ /* angka di tahapan ebtaq*/
    margin:5px; 
    font-size : 50px; 
    height:80px;
}