body {
      background: rgba(255, 255, 255, 0.525); /* semi-transparent white background */
    }
    .portal-box {
      max-width: 1000px;
      margin: 40px auto;
      padding: 30px;
      background: rgba(245, 4, 4, 0);
      border-radius: 15px;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0);
      text-align: center;
    }
    .portal-btn {
      background-color: #ff4f8b;
      color: white;
      border: none;
      padding: 30px 20px;
      font-size: 1.1rem;
      border-radius: 15px;
      width: 100%;
      transition: 0.2s;
    }
    .portal-btn:hover {
      background-color: #e13e75;
    }
    .dropdown-content {
      display: none;
      margin-top: 10px;
      background: #fff;
      border-radius: 10px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      padding: 10px;
    }
    .dropdown-content a {
      display: block;
      padding: 8px 12px;
      text-decoration: none;
      color: #333;
      border-radius: 8px;
    }
    .dropdown-content a:hover {
      background: #f1f1f1;
    }

    /* Modal styling */
.modal-content {
  background-color: #4B1E2F !important; /* dark maroon */
  color: #fff;
  border-radius: 1rem;
}

/* Modal header border */
.modal-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* Yellow option buttons */
.btn-option {
  background-color: #FFD54F; /* warm yellow */
  color: #4B1E2F;            /* maroon text */
  font-weight: bold;
  border-radius: 0.75rem;
  padding: 0.75rem;
  transition: all 0.2s ease-in-out;
}

.btn-option:hover {
  background-color: #FFC107; /* darker yellow on hover */
  color: #fff;
}

/* Cancel button */
.btn-cancel {
  background-color: #6c757d;
  color: #fff;
  border-radius: 0.75rem;
  padding: 0.75rem;
}