:root {
  --brand: #7c5cff;
  --brand-2: #5cf0d1;
  --sb-width: 280px;
}
/* Background & basics */
body {
  background: radial-gradient(1200px 600px at 10% -10%, rgba(124,92,255,.12), transparent 60%),
              radial-gradient(1200px 600px at 110% 110%, rgba(92,240,209,.08), transparent 60%),
              #0b0d14;
}
.auth-card { width: min(440px, 92vw); }
.brand-text {
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.btn-brand { background: linear-gradient(90deg, var(--brand), var(--brand-2)); border: none; }
.btn-brand:hover { filter: brightness(1.08); }
a { text-decoration: none; }

/* Form colors */
.form-control, .form-select {
  background-color: #10131b !important;
  border-color: #1b2332 !important;
  color: #e6e9ef !important;
}
.form-control:focus {
  box-shadow: 0 0 0 .25rem rgba(124,92,255,.25);
  border-color: var(--brand);
}

/* Cards */
.card{
  background-color:#0f1320;
  border:1px solid #1b2332;
  border-radius:1rem;
}

/* Divider */
.divider { display:flex; align-items:center; text-transform:uppercase; letter-spacing:.16em; font-size:.8rem; }
.divider::before, .divider::after { content:""; height:1px; flex:1; background:#232b3d; }
.divider span { margin:0 .75rem; color:#7f8aa3; }
.maintenance-emoji { font-size:3rem; line-height:1; }

/* App layout */
.app { min-height: 100vh; display: grid; grid-template-rows: auto 1fr; }
@media (min-width: 992px) {
  .with-sidebar { display:grid; grid-template-columns: var(--sb-width) 1fr; gap:0; }
  .sidebar { position: sticky; top: 0; height: calc(100vh - 56px); overflow-y:auto; border-right:1px solid #1b2332; }
}
.sidebar .nav-link { border-radius:.75rem; padding:.625rem .75rem; color:#c9d1e8; }
.sidebar .nav-link.active, .sidebar .nav-link:hover { background: rgba(124,92,255,.12); color:#fff; }
.sidebar-footer { margin-top:auto; border-top:1px solid #1b2332; padding-top:.75rem; }

/* Avatar */
.avatar { width:28px; height:28px; border-radius:9999px; object-fit:cover; }

/* Status badges (UI only) */
.badge-open { background: #3b82f6 !important; }
.badge-progress { background: #f59e0b !important; }
.badge-wait-parts { background: #ef4444 !important; }
.badge-wait-approve { background: #a855f7 !important; }
.badge-ready { background: #10b981 !important; }
.badge-closed { background: #64748b !important; }

/* Submenu styling for sidebar tickets group */
.sidebar-subnav .nav-link {
  font-size: 0.875rem;
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
  padding-left: 1.25rem;      /* extra indent */
  border-radius: 0.5rem;
  background: transparent;
}

/* Hover state */
.sidebar-subnav .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.03);
}

/* Active submenu item */
.sidebar-subnav .nav-link.active {
  background-color: var(--bs-success);
  color: #fff;
}

/* Remove the “full pill” look if your global nav-link styles set big radiuses */
.sidebar-subnav .nav-link {
  margin-right: 0;
  margin-left: 0;
}

.password-strength {
  display: flex;
  gap: 6px;
}

.password-strength .strength-bar {
  flex: 1;
  height: 6px;
  background: #2b2b2b; /* inactive */
  border-radius: 3px;
  transition: background 0.3s;
}

/* Weak */
.strength-1 #bar1 {
  background: #dc3545 !important; /* red */
}

/* Medium */
.strength-2 #bar1,
.strength-2 #bar2 {
  background: #fd7e14 !important; /* orange */
}

/* Strong */
.strength-3 #bar1,
.strength-3 #bar2,
.strength-3 #bar3 {
  background: #28a745 !important; /* green */
}