:root {
    --gold: #c9a84c;
    --navy: #1a2a4a;
    --red: #d9534f;
    --green: #5cb85c;
    --white: #fff;
    /* light variants for hover states */   
    --gold-light: rgba(201,168,76,0.1);
    --navy-light: rgba(26,42,74,0.1);
    --red-light: rgba(217,83,79,0.1);
    --green-light: rgba(92,184,92,0.1);
    --white-light: rgba(255,255,255,0.1);
}

.text-gold {
    color: #D4AF37;
    font-weight: 600;
}

.spacer {
  height: 20px; /* vertical space */
  width: 100%;  /* full width */
}


.list-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-bottom: 1px solid #e5e7eb;
    cursor: pointer;
}

.list-row:hover {
    background: #f9fafb;
}

.list-row:last-child {
    border-bottom: none;
}


hr {
    border: none;
    height: 2px;
    background: linear-gradient(to right, #063970, #6c757d);
    margin: 20px 0;
    border-radius: 2px;
}

.list-group-item {
    padding: 0.75rem 1rem;
    border: none;
}

.list-group-item:hover {
    background-color: #f8f9fa;
}

.list-group-item .badge {
    font-size: 0.8rem;
}



/* TOOLTIP STYLING */
.tooltip-container {
  position: relative;
  display: inline-block;
}

.tooltip-text {
  visibility: hidden;
  width: max-content;
  max-width: 220px;
  background-color: rgba(60, 60, 60, 0.9);
  color: #fff;
  text-align: center;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  position: absolute;
  z-index: 100;
  bottom: 140%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 0.2s ease, bottom 0.2s ease;
  pointer-events: none;
}

.tooltip-text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(60, 60, 60, 0.9) transparent transparent transparent;
}

.tooltip-container:hover .tooltip-text {
  visibility: visible;
  opacity: 1;
  bottom: 160%;
}
.balance {
    color: var(--red);
}

.total-paid {
    color: var(--green);
}
.text-navy {
    color:var(--navy);
}

/* Card section labels */
.card-label {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--navy);
    padding-left: 8px;
    border-left: 3px solid var(--gold);
}

.card-label-total-due {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--navy);
    padding-left: 8px;
    border-left: 3px solid var(--gold);
}

.card-label-payment-status {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--navy);
    padding-left: 8px;
    border-left: 3px solid var(--red);
}

.card-label-lease-remaining {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--navy);
    padding-left: 8px;
    border-left: 3px solid var(--navy);
}

/* Payment tabs – Willimano gold & navy */
#paymentTabs .nav-link { color: var(--gold) !important; border-radius: 0; border: none; border-bottom: 3px solid transparent; background: transparent; }
#paymentTabs .nav-link:hover { color: var(--gold); background: rgba(201,168,76,.07); border-bottom: 3px solid var(--gold); }
#paymentTabs .nav-link.active { color: #fff; background: #1a2a4a; border-bottom: 3px solid var(--gold); }
#paymentTabs .nav-link.active .bi { color: var(--gold) !important; }