/* Custom purple theme overrides for Bootstrap */
:root,
[data-bs-theme="light"] {
  /* Primary purple palette */
  --bs-primary: #c3c3dd; /* main light purple (requested) */
  --bs-secondary: #000;
  --bs-indigo: #b5b5d1;
  --bs-purple: #c3c3dd;
  --bs-pink: #d63384;
  --bs-info: #d0c9ec; /* lighter purple-toned info */

  /* Body text and link color tweaks */
  --bs-body-color: #2b0b3a;
  --bs-link-color: var(--bs-primary);
}

/* Make links use the purple primary */
a, a.nav-link {
  color: var(--bs-link-color);
}
a:hover, a:focus {
  color: #b5b5d1;
  text-decoration: none;
}

/* Buttons: ensure primary buttons look purple */
.btn.btn-primary {
  background-color: #2c328d;
  border-color: #2c328d;
  color: #fff;
  transition: background-color .15s ease, color .15s ease, box-shadow .12s ease;
}
.btn.btn-primary:hover {
  background-color: #b5b5d1;
  color: #2c328f;
  border-color: #b5b5d1;
  text-decoration: none;
}
.btn.btn-primary:focus, .btn.btn-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 .25rem rgba(44,50,141,0.25);
  color: #2c328f;
  background-color: #b5b5d1;
}
.btn.btn-secondary {
  background-color: var(--bs-secondary);
  border-color: var(--bs-secondary);
  color: #fff;
  transition: background-color .15s ease, color .15s ease, box-shadow .12s ease;
}
.btn.btn-secondary:hover {
  background-color: #b5b5d1;
  color: #2c328f;
  border-color: #b5b5d1;
}
.btn.btn-secondary:focus, .btn.btn-secondary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 .25rem rgba(44,50,141,0.25);
  color: #2c328f;
  background-color: #b5b5d1;
}

/* Provide a consistent focus ring for any button (keyboard users) */
.btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 .25rem rgba(44,50,141,0.25);
}

/* Contact buttons: equal width on desktop, full-width on small screens */
.contact-btn {
  min-width: 180px;
  width: 180px;
  display: inline-flex;
  align-items: center;
  justify-content: center; /* center icon + label */
  gap: 0.25rem;
  text-align: center;
  flex-direction: column; /* stack icon above label */
  padding: 0.75rem 0.5rem;
}
.contact-btn svg {
  flex-shrink: 0; /* prevent icon from stretching */
  display: block;
  margin: 0 auto 0.35rem auto;
}
/* Ensure label text centers and ms-2 spacing doesn't offset vertical layout */
.contact-btn span {
  display: block;
  width: 100%;
  text-align: center;
  margin-left: 0 !important;
  font-size: 1.02rem !important; /* slightly larger */
  font-weight: 700 !important;   /* bolder */
  text-transform: uppercase !important; /* uppercase */
  letter-spacing: 0.03em;
}
.contact-btn .ms-2 { margin-left: 0 !important; }
@media (max-width: 767.98px) {
  .contact-btn {
    width: 100% !important;
  }
}

/* Alerts: make "info" alerts fit the purple theme */
.alert.alert-info {
  background-color: rgba(195,195,221,0.08);
  color: var(--bs-body-color);
  border-color: rgba(195,195,221,0.16);
}

/* Navbar tweak for when navbar uses bg-primary */
.navbar.bg-primary, .navbar.bg-primary a {
  background-color: var(--bs-primary) !important;
  color: #2c328f !important;
}

/* Ensure logo uses the desktop size consistently on all screens */
.navbar-brand img {
  max-height: 44px;
  width: auto;
  height: auto;
}

/* Align brand and nav buttons visually on medium+ screens */
@media (min-width: 768px) {
  /* ensure nav list items center their content */
  .navbar-nav .nav-item {
    display: flex;
    align-items: center;
  }

  /* make the inline brand larger while keeping layout balanced */
  .navbar-brand.d-inline-flex {
    height: 56px; /* taller brand container */
    display: inline-flex;
    align-items: center;
    margin-right: 0.6rem;
  }
  .navbar-brand.d-inline-flex img {
    display: block;
    max-height: 44px; /* larger logo */
    width: auto;
  }
  /* keep small-screen brand the same size as desktop */
  .navbar-brand.d-md-none img {
    max-height: 44px;
    width: auto;
  }

  /* make buttons shorter while keeping balanced padding */
  .navbar-nav .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.18rem 0.6rem; /* slightly tighter */
    min-height: 34px; /* shorter buttons */
    line-height: 1;
    font-size: 0.95rem;
  }
  .navbar-nav .btn.btn-sm {
    padding: 0.12rem 0.45rem; /* slightly smaller horizontal padding for sm buttons */
    height: 34px;
    min-height: 34px;
    font-size: 0.9rem;
  }

  /* make sure utility padding (px-1 / px-2) doesn't unbalance layout */
  .navbar-nav .navbar-link {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

/* Dropdown menus: unified appearance and centered alignment */
.dropdown-menu {
  background-color: #f6f5fb !important; /* subtle solid tint to avoid transparency gaps */
  border: 1px solid rgba(44,50,141,0.12);
  box-shadow: 0 .25rem .5rem rgba(0,0,0,0.08);
  border-radius: 0.25rem;
  overflow: hidden; /* prevent text or children from escaping the box */
  background-clip: padding-box;
  box-sizing: border-box;
  padding: 0.25rem 0.5rem; /* consistent padding both axes */
  white-space: normal; /* allow wrapping */
  width: auto; /* size to available space */
  max-width: 28rem; /* keep dropdown readable on large screens */
  min-width: 12rem;
  text-align: center; /* center-justify item content by default */
}

/* Navbar-specific dropdown centering (desktop and mobile) - centers dropdown under parent */
.navbar .dropdown-menu {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  top: calc(100% + 0.25rem) !important;
  z-index: 1060 !important;
  min-width: 12rem !important;
  max-width: 28rem !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0.25rem 0.5rem !important; /* same padding used above */
}

/* Ensure dropdown items don't introduce white backgrounds, allow wrapping, and center text */
.dropdown-menu .dropdown-item, .dropdown-menu a.dropdown-item {
  display: block;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: break-word;
  background-color: transparent !important;
  color: #2b0b3a;
  margin: 0;
  padding: 0.75rem 1rem;
  text-align: center; /* center text for uniform appearance */
}
.dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus {
  background-color: rgba(44,50,141,0.06) !important;
  color: #2b0b3a;
}
/* Hide any pseudo-elements that might create extra backgrounds */
.dropdown-menu::before, .dropdown-menu::after {
  display: none !important;
}
/* Divider color consistent */
.dropdown-divider {
  border-color: rgba(44,50,141,0.08);
}  

/* Utility: adjust .text-black if used so headings can match theme */
.text-black {
  color: #2c328f !important;
} 

/* Mobile spacing and divider: ensure brand and toggler have breathing room and add subtle divider on small screens */
@media (max-width: 767.98px) {
  .navbar-brand {
    margin-bottom: 0.75rem;
  }
  .navbar-toggler {
    margin-top: 0.25rem;
  }
  /* allow dropdowns to overflow the collapse and position absolutely */
  .collapse.navbar-collapse {
    overflow: visible;
    position: relative;
  }
  /* center nav items on small screens when collapsed */
  .collapse.navbar-collapse .navbar-nav {
    align-items: center;
    flex-direction: column;
    gap: 0.5rem;
  }
  /* Ensure each nav-item centers its button/link and is the positioning context */
  .collapse.navbar-collapse .navbar-nav .nav-item {
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative;
  }
  .collapse.navbar-collapse .navbar-nav .nav-item > a.btn {
    display: inline-block;
  }
  /* Position dropdowns absolutely and center them horizontally under their parent */
  .collapse.navbar-collapse .dropdown-menu {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: calc(100% + 0.25rem) !important;
    width: calc(100% - 2rem) !important; /* wider on mobile to avoid clipping */
    min-width: 160px !important;
    max-width: calc(100% - 2rem) !important;
    margin: 0 !important;
    padding: 0.25rem 0.5rem !important; /* add horizontal padding */
    border: 1px solid rgba(44,50,141,0.12) !important;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,0.06) !important;
    background-color: #f6f5fb !important; /* subtle solid tint */
    border-radius: 0.25rem !important;
    overflow: hidden !important; /* prevent spills */
    background-clip: padding-box !important;
    text-align: center;
    z-index: 1060 !important;
    white-space: normal !important; /* allow wrapping */
  }
  .collapse.navbar-collapse .dropdown-menu .dropdown-item {
    text-align: center;
    border-radius: 0;
    padding: 0.75rem 1rem;
  }
  /* subtle divider above collapsed menu for visual separation */
  .collapse.navbar-collapse {
    border-top: 1px solid rgba(44,50,141,0.20);
    padding-top: 0.5rem;
    margin-top: 0.5rem;
  }
}