:root {
  --pw-blue: #4B72A6;
  --pw-slate: #4F6273;
  --pw-grayblue: #DFE9F2;
  --pw-gold: #A68A56;
  --pw-black: #0D0D0D;
  --bs-primary: var(--pw-blue);
  --bs-secondary: var(--pw-slate);
  --bs-light: var(--pw-grayblue);
  --bs-warning: var(--pw-gold);
  --bs-dark: var(--pw-black);
  --text-primary: var(--pw-slate);
}
.text-primary {
  color: var(--pw-blue) !important;
}
.text-gold {
  color: var(--pw-gold) !important;
}
.bg-pw-grayblue {
  background-color: var(--pw-grayblue) !important;
}
.pw-secretword {
  background-color: var(--pw-grayblue) !important;
  border-radius: 1rem;
  padding: .35em 0.9em;
  display: inline-block;
  margin-bottom: .75rem;
}

span.edit-group-bn {
	margin-top: 20px;
	/*The change*/
	display:inline-block; /*or display:block;*/
}

body {
	background: var(--pw-grayblue);
	color: var(--pw-black);
	font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
}
.btn-primary, .bg-primary {
	background-color: var(--pw-blue) !important;
	border-color: var(--pw-blue) !important;
}
.btn-primary, .btn-primary:visited {
	color: #fff !important;
}
.btn-primary:hover, .bg-primary:hover {
	background-color: var(--pw-gold) !important;
	border-color: var(--pw-gold) !important;
	color: #fff !important;
}
a, .nav-link, .navbar-brand {
	color: var(--pw-blue) !important;
}
a:hover, .nav-link:hover, .navbar-brand:hover {
	color: var(--pw-gold) !important;
}
.card {
	border-radius: 1rem;
	box-shadow: 0 2px 12px rgba(75, 114, 166, 0.08);
}
.btn-outline-danger,
.btn-outline-danger:focus,
.btn-outline-danger:active,
.btn-outline-danger:visited {
	background-color: transparent !important;
	border-color: #dc3545 !important; /* Bootstrap's danger color */
	color: #dc3545 !important;
	box-shadow: none !important;
}
.btn-outline-danger:hover {
	background-color: #dc3545 !important;
	color: #fff !important;
}
.narrow-page {
	max-width: 480px;
	margin: 3rem auto 0 auto;
	padding: 2rem 1.5rem;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 2px 16px rgba(75, 114, 166, 0.09);
	flex-direction: column;
	align-items: center;
}
/* Subtle hover: very light background + shadow for both buttons */
.stripe-btn, .paypal-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	padding-top: .75rem;
	padding-bottom: .75rem;
}
.stripe-btn:hover, .stripe-btn:focus,
.paypal-btn:hover, .paypal-btn:focus {
	background-color: #f7fafd !important;
	box-shadow: 0 2px 12px rgba(30,130,200,0.09);
	color: inherit !important;
	border-color: inherit !important;
}
.stripe-btn .bi, .paypal-btn .bi {
	font-size: 1.35em;
	margin-right: .6em;
	vertical-align: middle;
	line-height: 1;
}
/* Subtle hover styling for outline action buttons */
.upgrade-btn, .edit-profile-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	transition: background 0.15s, box-shadow 0.15s;
}
.upgrade-btn:hover, .upgrade-btn:focus,
.edit-profile-btn:hover, .edit-profile-btn:focus {
	background-color: #f7fafd !important;
	box-shadow: 0 2px 12px rgba(30,130,200,0.09);
	color: inherit !important;
	border-color: inherit !important;
	text-decoration: none;
}
.upgrade-btn .bi, .edit-profile-btn .bi {
	font-size: 1.2em;
	margin-right: .5em;
	vertical-align: middle;
	line-height: 1;
}
@media (max-width: 600px) {
  .pw-unauth-box {
	padding-left: 18px !important;
	padding-right: 18px !important;
  }
  .pw-unauth-box h1,
  .pw-unauth-box .pw-logo-text {
	font-size: 2rem !important;
	font-weight: 700;
  }
  .pw-unauth-box .lead {
	font-size: 1.08rem !important;
  }
  .container, .container-fluid, .row {
	padding-left: 8px !important;
	padding-right: 8px !important;
  }
  .card {
	margin-left: 0 !important;
	margin-right: 0 !important;
  }
  body {
	padding-left: 0 !important;
	padding-right: 0 !important;
  }
}
.pw-unauth-box {
  padding-left: 32px;
  padding-right: 32px;
}