/* Custom background color for dark theme */
[data-bs-theme="dark"] {
  --bs-body-bg: #212529; /* Replace with your desired color */
}

/* Custom Button Styles */
:root {
  --btn-color: #000000;
  --btn-bg: #ffffff;
}

[data-bs-theme="dark"] {
  --btn-color: #000000;
  --btn-bg: #ffffff;
}

.btn-primary {
    /* padding: 10px 15px !important; */
    /* width: max-content !important; */
    /* border-radius: 10px !important; */
    color: var(--btn-color) !important;
    background-color: var(--btn-bg) !important;
    justify-content: center !important;
    align-items: center !important;
    display: inline-flex !important;
    cursor: pointer !important;
    border: none !important;
    /* margin: 0 auto !important; */
}

/* Custom outline primary button */
.btn-outline-primary {
    color: #fff !important;
    border: 1.5px solid #fff !important;
    background-color: transparent !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
    color: #000 !important;
    background-color: #fff !important;
    border-color: #fff !important;
}

/* Custom success button */
.btn-success {
    color: #000 !important;
    background-color: #fff !important;
    border: 1.5px solid #fff !important;
}
.btn-success:hover, .btn-success:focus, .btn-success:active {
    color: #000 !important;
    background-color: #e6e6e6 !important;
    border-color: #fff !important;
}

/* Ensure .btn-danger keeps Bootstrap defaults and is not affected by .btn changes */
.btn-danger {
    display: inline-block !important;
    /* margin: 0 !important; */
}

.btn:hover {
    opacity: 0.9;
    /* color: var(--btn-color) !important; */
    /* background-color: var(--btn-bg) !important; */
}

.btn:hover {
  color: var(--bs-btn-hover-color);
  text-decoration: none;
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
.btn-check + .btn:hover {
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border-color: var(--bs-btn-border-color);
}
.btn:focus-visible {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
  outline: 0;
  box-shadow: var(--bs-btn-focus-box-shadow);
}

.btn:focus:not(.btn-danger,.btn-secondary), .btn:active:not(.btn-danger,.btn-secondary) {
    color: var(--btn-color) !important;
    background-color: var(--btn-bg) !important;
    box-shadow: none !important;
}