/* File: style.css */

/* Gaya untuk tombol ganti tema di halaman login */
.theme-switcher {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1050;
}

#theme-toggle-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}


.sidebar {
  background-color: #3a3f4b;
  min-height: 100vh; 
}

.content {
  background-color: #465062; /* biar beda warna */
  padding: 20px;
}
.offcanvas-body a:hover, 
.offcanvas-body button:hover {
  background-color: #44729b !important; /* sedikit lebih terang */
}
.table td, .table th {
    white-space: nowrap;
}

/* Tombol Clock In */
.btn-clockin {
  background: linear-gradient(45deg, #28a745, #5cd85c);
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  border-radius: 10px;
  padding: 12px;
  transition: 0.3s ease-in-out;
}
.btn-clockin:hover {
  background: linear-gradient(45deg, #218838, #4caf50);
  transform: scale(1.05);
  box-shadow: 0 0 12px rgba(40, 167, 69, 0.7);
}

/* Tombol Clock Out */
.btn-clockout {
  background: linear-gradient(45deg, #dc3545, #ff6b6b);
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  border-radius: 10px;
  padding: 12px;
  transition: 0.3s ease-in-out;
}
.btn-clockout:hover {
  background: linear-gradient(45deg, #c82333, #ff4d4d);
  transform: scale(1.05);
  box-shadow: 0 0 12px rgba(220, 53, 69, 0.7);
}