.modal-content{
    border-radius:20px;
}

.modal-header{
    text-align: center;
    border-radius:20px 20px 0 0;
    background-color: var(--maroon-dark) !important;
}

#otp{
    font-size:24px;
    letter-spacing:8px;
    font-weight:600;
}

#sendOtpBtn,
#verifyOtpBtn{
    padding:12px;
    font-weight:600;
}

.text-muted a{
    color: var(--maroon-dark) !important;
}

select.form-control {
    appearance: auto !important;
}

.form-control{
    border: 1px solid var(--line);
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0;
}

.form-control:focus {
    border-color: var(--line) !important;
    background-color: var(--blush);
}

.candidate-code{
    color: var(--maroon-dark);
}

.card{
    background-color: transparent;
}

.progress-bar{
    background-color: var(--maroon-dark);
}

.nav-link{
    color: var(--maroon-dark);
}

.nav-link:focus, .nav-link:hover {
    color: var(--maroon-dark);
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: var(--ivory);
    background-color: var(--maroon-dark);
}

.progress {
    background-color: var(--line);
}

ul.nav.nav-pills {
    align-items: center;
}

ul.nav-pills .nav-link {
    border-radius: 0;
}

ul.nav.nav-pills .nav-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 2px;
    background-color: #ccc;
}

ul.nav.nav-pills .nav-item {
    position: relative;
    padding: 0 30px;
}

/* ============================================================
   TEAM NAV DROPDOWN — desktop (hover-driven) + mobile (accordion)
   ============================================================ */

/* ---------- desktop dropdown ---------- */
.nav-dropdown{
  position:relative;
}

.nav-dropdown-trigger{
  background:none;
  border:none;
  padding:0;
  cursor:pointer;
  font-family:'Jost', sans-serif;
  font-size:14.5px;
  font-weight:600;
  color:var(--charcoal-soft);
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.nav-dropdown-trigger:hover{
  color:var(--maroon);
}

.nav-dropdown-chevron{
  transition:transform .15s ease;
  flex-shrink:0;
}
.nav-dropdown-trigger[aria-expanded="true"] .nav-dropdown-chevron{
  transform:rotate(180deg);
}

/* invisible hit-area wrapper — padding-top keeps the gap "inside" the
   hoverable box so moving down into the menu doesn't lose hover */
.nav-dropdown-menu{
  display:none;
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  z-index:1000;
  padding-top:14px;
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu{
  display:block;
}

/* the actual visible white card */
.nav-dropdown-menu-inner{
  min-width:200px;
  background:var(--ivory);
  border:1px solid var(--line);
  border-radius:4px;
  box-shadow:0 12px 28px rgba(42,33,29,0.14);
  padding:8px;
}

.nav-dropdown-link{
  display:block;
  padding:10px 12px;
  border-radius:2px;
  font-size:14px;
  font-weight:600;
  color:var(--charcoal);
}
.nav-dropdown-link:hover{
  background:var(--blush);
  color:var(--maroon-dark);
}


/* ---------- mobile accordion ---------- */
.mobile-accordion-trigger{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:none;
  border:none;
  padding:12px 4px;
  font-family:'Jost', sans-serif;
  font-size:15px;
  font-weight:600;
  color:var(--charcoal-soft);
  border-bottom:1px solid var(--line);
  cursor:pointer;
}
.mobile-accordion-trigger:hover{
  color:var(--maroon);
}

.mobile-accordion-chevron{
  transition:transform .15s ease;
}
.mobile-accordion-trigger[aria-expanded="true"] .mobile-accordion-chevron{
  transform:rotate(180deg);
}

.mobile-accordion-panel{
  display:none;
  flex-direction:column;
}
.mobile-accordion-panel.open{
  display:flex;
}
.mobile-accordion-panel a{
  padding:12px 4px 12px 18px;
  font-size:14px;
  color:var(--charcoal-soft);
  border-bottom:1px solid var(--line);
}
.mobile-accordion-panel a:hover{
  color:var(--maroon);
}

@media only screen and (max-width: 820px){
    ul.nav.nav-pills .nav-item {
        position: relative;
        padding: 0 9px;
    }

    ul.nav.nav-pills .nav-item:not(:last-child)::after {
        width: 18px;
        opacity: 0;
    }
}

@media only screen and (max-width: 767px){
    ul .nav-item:not(.show){
        display: none;
    }
}