/* Basic layout */
body { 
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; 
  background: #f4f6f9; 
}

/* wrapper */
.wrapper { min-height:100vh; display:flex; }

/* Sidebar */
.sidebar {
  width: 250px;
  background: #003366; /* TCS navy */
  color: #fff;
  min-height: 100vh;
  transition: width .25s ease;
  box-shadow: 2px 0 6px rgba(0,0,0,0.06);
}
.sidebar.collapsed { width: 70px; }
.sidebar .sidebar-header { 
  background: #002244; 
  color: #fff; 
  text-align: center; 
  padding: 15px 0;
}
.sidebar .components { margin-top: 10px; }
.sidebar a { 
  color: #cfd8dc; 
  display:block; 
  padding:12px 20px; 
  text-decoration:none; 
  border-radius: 6px;
  margin: 4px 10px;
  transition: background 0.3s, color 0.3s;
}
.sidebar a:hover, .sidebar a.active { 
  background: #0056b3; 
  color: #fff; 
}
.sidebar .toggle-btn { cursor:pointer; font-size: 1.2rem; }

/* when collapsed hide link text visually */
.sidebar.collapsed .components a { text-align: center; padding: 12px 0; }
.sidebar.collapsed .components a::after { content: ""; display:block; }
.sidebar.collapsed .components a { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* content area */
#content { 
  flex-grow: 1; 
  min-height: 100vh; 
  background: #f4f6f9; 
  padding: 20px;
}

/* cards & buttons */
.card { border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); }
.btn { border-radius: 6px; }

/* responsive */
@media (max-width: 768px) {
  .sidebar { position: fixed; z-index: 10; left:-260px; }
  .sidebar.show { left:0; }
  .sidebar.collapsed { left:-260px; }
}

/* Input, select, textarea borders */
input.form-control,
select.form-select,
textarea.form-control {
  border: 2px solid #ced4da;  /* subtle gray border */
  border-radius: 6px;          
  padding: 6px 10px;
  transition: border-color 0.3s, box-shadow 0.3s;
}

/* Focus state */
input.form-control:focus,
select.form-select:focus,
textarea.form-control:focus {
  border-color: #0d6efd;       /* Bootstrap primary blue */
  box-shadow: 0 0 5px rgba(13, 110, 253, 0.5);
  outline: none;
}

/* Navbar / header */
#content h4 {
  color: #003366;
  font-weight: 600;
}

/* Alerts spacing */
.alert { margin-top: 10px; }

/* Dropdown user menu */
.dropdown-menu {
  border-radius: 6px;
}

/* Add hover effect for buttons */
.btn-primary:hover {
  background-color: #004aad;
  border-color: #004aad;
}

/* Login page specific card */
.login-card {
  max-width: 420px;
  margin: auto;
  padding: 30px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Logo on top */
.login-card img.logo {
  display: block;
  margin: 0 auto 20px auto;
  height: 100px;
}