:root{
  /* Core palette (muted pink / purple / white) */
  --bg: #fbf7fb;                 /* soft white with a hint of pink */
  --panel: rgba(255,255,255,.72);
  --panel-strong: rgba(255,255,255,.88);
  --border: rgba(60, 16, 76, .10);

  --text: #2a1333;               /* deep plum */
  --text-dim: rgba(42, 19, 51, .70);

  --pink: #d9a3b7;               /* muted blush */
  --pink-strong: #c784a1;

  --purple: #8b6bb8;             /* muted lavender */
  --purple-strong: #6f4aa8;

  --shadow: 0 10px 28px rgba(42,19,51,.10);
  --ring: 0 0 0 .2rem rgba(139,107,184,.18);
}

body{
  background:
    radial-gradient(1200px 520px at 10% 0%, rgba(139,107,184,.18), transparent 60%),
    radial-gradient(900px 520px at 90% 10%, rgba(217,163,183,.22), transparent 58%),
    radial-gradient(700px 460px at 55% 95%, rgba(111,74,168,.12), transparent 55%),
    var(--bg);
  color: var(--text);
  min-height: 100vh;
}

/* Navbar */
.app-nav{
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}

.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-brand{
  color: var(--text) !important;
  opacity: .92;
}
.navbar-dark .navbar-nav .nav-link:hover{
  opacity: 1;
}
.navbar-dark .navbar-toggler{
  border-color: rgba(60, 16, 76, .15);
}
.navbar-dark .navbar-toggler-icon{
  filter: invert(14%) sepia(22%) saturate(1498%) hue-rotate(255deg) brightness(90%) contrast(90%);
}

/* Brand badge */
.brand-badge{
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(217,163,183,.95), rgba(139,107,184,.95));
  box-shadow: 0 0 0 1px rgba(60,16,76,.10), 0 10px 24px rgba(60,16,76,.12);
  color: #fff;
}
.brand-logo {
  max-height: 48px;      /* adjust to match your navbar height */
  width: auto;
  object-fit: contain;
  display: block;
}
.app-main{ min-height: calc(100vh - 72px); }

/* Cards */
.card.app-card{
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow);
  color: var(--text);
}

.text-dim{ color: var(--text-dim); }

/* Hero */
.app-hero{
  border-radius: 22px;
  padding: 26px;
  background:
    radial-gradient(900px 340px at 10% 0%, rgba(139,107,184,.18), transparent 60%),
    radial-gradient(800px 300px at 90% 30%, rgba(217,163,183,.22), transparent 60%),
    var(--panel-strong);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  color: var(--text);
}

/* Badges */
.badge-soft{
  background: rgba(139,107,184,.12) !important;
  border: 1px solid rgba(139,107,184,.20);
  color: var(--text) !important;
}

/* Buttons */
.btn-primary{
  --bs-btn-bg: var(--purple);
  --bs-btn-border-color: var(--purple);
  --bs-btn-hover-bg: var(--purple-strong);
  --bs-btn-hover-border-color: var(--purple-strong);
  --bs-btn-active-bg: var(--purple-strong);
  --bs-btn-active-border-color: var(--purple-strong);
  --bs-btn-color: #fff;
}

.btn-danger{
  /* Use muted pink as the “accent danger” to match the theme (still reads as accent) */
  --bs-btn-bg: var(--pink-strong);
  --bs-btn-border-color: var(--pink-strong);
  --bs-btn-hover-bg: var(--pink);
  --bs-btn-hover-border-color: var(--pink);
  --bs-btn-active-bg: var(--pink);
  --bs-btn-active-border-color: var(--pink);
  --bs-btn-color: #fff;
}

.btn-soft{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(60,16,76,.14);
  color: var(--text);
}
.btn-soft:hover{
  background: rgba(255,255,255,.92);
  border-color: rgba(60,16,76,.18);
  color: var(--text);
}

/* Forms */
.form-control, .form-select{
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(60,16,76,.14);
  color: var(--text);
}
.form-control::placeholder{ color: rgba(42,19,51,.45); }
.form-control:focus, .form-select:focus{
  background: rgba(255,255,255,.96);
  border-color: rgba(139,107,184,.45);
  color: var(--text);
  box-shadow: var(--ring);
}

/* Alerts (make them less neon) */
.alert{
  border-radius: 16px;
  border: 1px solid rgba(60,16,76,.10);
  box-shadow: 0 8px 20px rgba(42,19,51,.08);
}

/* Tables */
.table-darkish{
  --bs-table-bg: rgba(255,255,255,.70);
  --bs-table-border-color: rgba(60,16,76,.10);
  --bs-table-color: var(--text);
}
.table thead th{
  color: rgba(42,19,51,.80);
}

/* Footer */
.app-footer{
  border-top: 1px solid var(--border);
  background: rgba(255,255,255,.55);
  color: var(--text);
}

/* HR */
hr.hr-soft{ border-color: rgba(60,16,76,.12); }

/* Links */
a{ color: var(--purple-strong); }
a:hover{ color: var(--purple); }