:root {
  --ui-readable-muted: #dfe7f5;
  --ui-focus-ring: rgba(243, 229, 171, 0.9);
}

.text-muted,
.text-secondary,
.form-text {
  color: var(--ui-readable-muted) !important;
}

.form-control::placeholder,
textarea::placeholder {
  color: #dfe7f5 !important;
  opacity: 1;
}

.form-control:focus,
.form-select:focus,
input:not([type="checkbox"]):not([type="radio"]):focus,
textarea:focus,
select:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: 0 0 0 0.2rem var(--ui-focus-ring) !important;
}

.form-control:disabled,
.form-select:disabled,
input:disabled,
textarea:disabled,
select:disabled {
  color: #dfe7f5 !important;
  opacity: 0.78;
  -webkit-text-fill-color: #dfe7f5;
}

.navbar-toggler {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid rgba(243, 229, 171, 0.8) !important;
  color: #fff !important;
  background-color: rgba(255, 255, 255, 0.08);
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.navbar-toggler:focus-visible,
#sidebarToggle:focus-visible,
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--ui-focus-ring) !important;
  outline-offset: 3px;
}

button.navbar-toggler[aria-expanded="true"],
button.navbar-toggler:hover {
  background-color: rgba(212, 175, 55, 0.2);
}

.transaction-main .text-muted,
.transaction-side .text-muted,
.purchase-history-card .text-muted {
  color: #4c5c72 !important;
}