@import url("https://cdn-uicons.flaticon.com/4.0.0/uicons-solid-straight/css/uicons-solid-straight.css");

:root {
  /* Brand Colors from colours.png */
  --weweb-primary: #402d6b;
  --weweb-accent: #ff325d;
  --weweb-bg-light: #f1f4ff;
  --weweb-bg-white: #ffffff;
  --weweb-gray-light: #f9f9f9;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--weweb-bg-light);
  color: #333333;
}

/* Custom Nav styling to match brand */
.navbar.bg-primary {
  background-color: var(--weweb-primary) !important;
}

/* Custom App Header styling */
.app-header {
  background-color: var(--weweb-primary);
  color: #FFFFFF;
  padding: 0.85rem 1.5rem;
}

.app-header .brand-link {
  color: #FFFFFF;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
}

/* Custom Primary Buttons */
.btn-primary {
  background-color: var(--weweb-primary);
  border-color: var(--weweb-primary);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #2f2150 !important;
  border-color: #2f2150 !important;
}

/* Custom Accent/Danger Buttons */
.btn-danger {
  background-color: var(--weweb-accent);
  border-color: var(--weweb-accent);
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
  background-color: #e52850 !important;
  border-color: #e52850 !important;
}

/* Form Styles */
.card {
  border: none;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.active-client {
  background-color: #A5D6A7 !important;
}

.inactive-client {
  background-color: #EF9A9A !important;
}

/* Dashboard Card styling */
.dashboard-btn-card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  cursor: pointer;
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
}

.dashboard-btn-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px #0000001A;
}

.dashboard-stat-card {
  border-radius: 12px;
  border-left: 4px solid var(--weweb-primary);
  background-color: var(--weweb-bg-white);
  padding: 1.5rem;
}

.dashboard-stat-card.accent {
  border-left-color: var(--weweb-accent);
}

.stat-number {
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--weweb-primary);
}