:root{--brand-black:#000;--brand-red:#d1111b}
.navbar-brand .brand-img{height:32px;width:32px;object-fit:contain}
.navbar-brand .brand-logo{width:32px;height:32px;border-radius:50%;display:inline-block;background:radial-gradient(circle at 30% 30%, var(--brand-red), var(--brand-black));}
.bg-logo{display:inline-block;background-image:url('assets/logo.png');background-size:contain;background-position:center;background-repeat:no-repeat}
.btn-danger{background-color:var(--brand-red);border-color:var(--brand-red)}
.card-header.bg-dark{background-color:#111!important}
body{background:
  linear-gradient(180deg,rgba(255,255,255,.9),rgba(247,247,247,.9)),
  url('/assets/app-bg.jpg') center/cover fixed no-repeat;
}
.app-layout{display:flex;min-height:calc(100vh - 56px)}
.sidebar{width:220px;padding:12px;color:#fff}
.sidebar{overflow-y:auto}
.sidebar.collapsed{width:0;padding:0;overflow:hidden}
.sidebar .sidebar-section{margin-top:12px;margin-bottom:6px;font-size:.85rem;color:#bbb;text-transform:uppercase}
.sidebar-sublist.collapsed{display:none}
.sidebar-link{display:block;padding:8px 10px;color:#ddd;text-decoration:none;border-radius:6px}
.icon-btn{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0}
.icon-btn .icon{font-size:16px;line-height:1}

/* Responsive layout */
@media (max-width: 992px){
  .app-layout{min-height:calc(100vh - 56px)}
  .sidebar{position:fixed;top:56px;left:0;height:calc(100vh - 56px);z-index:1040;background:#0f0f0f;box-shadow:0 10px 25px rgba(0,0,0,.3);transform:translateX(-240px);transition:transform .2s ease}
  .sidebar.collapsed{transform:translateX(-240px)}
  .sidebar:not(.collapsed){transform:translateX(0)}
  .content-area{padding:12px}
}

.sidebar-overlay{display:none}
@media (max-width: 992px){
  .sidebar-overlay{position:fixed;top:56px;left:0;right:0;bottom:0;background:rgba(0,0,0,.35);z-index:1030}
  .sidebar:not(.collapsed) + .sidebar-overlay{display:block}
}

/* Tables: horizontal scroll on small screens */
@media (max-width: 768px){
  .card table, .content-area table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
.sidebar-link:hover{background:#1a1a1a;color:#fff}
.sidebar-link.active{background:var(--brand-red);color:#fff}
.content-area{flex:1;padding:16px}

/* --- Glassmorphism Login Styles --- */
.login-hero {
  min-height: calc(100vh - 56px);
  background: linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.35)), url('/assets/login-bg.jpg') center/cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.glass-card {
  width: 380px;
  max-width: 90vw;
  padding: 40px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
  color: #fff;
}
.glass-card h2 {
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.glass-card .form-label {
  font-size: 0.9rem;
  margin-bottom: 0.4rem;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
}
.glass-card .form-control {
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 8px;
  padding: 10px 15px;
  height: auto;
  font-size: 0.95rem;
  color: #333;
}
.glass-card .form-control:focus {
  box-shadow: 0 0 0 4px rgba(255,255,255,0.2);
  background: #fff;
}
.glass-card .btn-signin {
  background: #0f172a;
  color: white;
  border: none;
  padding: 12px;
  border-radius: 8px;
  font-weight: 600;
  letter-spacing: 0.5px;
  transition: all 0.2s;
}
.glass-card .btn-signin:hover {
  background: #000;
  transform: translateY(-1px);
}
.glass-card a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  transition: color 0.2s;
}
.glass-card a:hover {
  color: #fff;
}
.glass-card .form-check-input {
  background-color: rgba(255,255,255,0.8);
  border: none;
}
.glass-card .form-check-input:checked {
  background-color: #0f172a;
  border-color: #0f172a;
}