.membersform {font-size: 0.9em;}
.membersform p {
	line-height:1.3em;
}
.membersform a {
	text-decoration: none;
	color: #490e0c;
}
.membersform img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
.membersform a:hover {
	color: inherit; /* keep hover styling neutral; previously had a highlight color */
}
.membersform input, .billingform input {
	font-size: 0.9em;
	max-width: 100%;
    border-width: thin;
    border-radius: 4px;
	border-color: lightgray;
}
.pushdown input.button {
	margin-bottom:20px;
}

.tableform{
	padding:0px 4px 0px 4px;
	margin:0;
}
.tableform .paypal input{
	vertical-align: middle;
}
.tableform .cancel input {
	vertical-align: middle;
}
.tableform .pushdown {
	position: relative;
	top: 16px;
}
.tableform .cancel td {
	vertical-align: middle;
}
.membersform textarea {
	font-family: Arial;
	max-width: 100%;
	border-radius:5px;
}
.tableform td {
	vertical-align: top;
}
.membershipreport td {
	vertical-align: top;
	line-height: 1.2em;
	padding: 6px;
	background-color: #fff9f0;
}
.membershipreport p {
	line-height: 1.2em;
}
.membersform .error1 {
    padding:0px;
	font-size: 10px;
	font-style: italic;
	color: #FF0000;
	margin-top: -5px;
	margin-bottom: -5px;
	line-height: 1.0em;
        font-weight: 700;
}
.membersform .error, .billingform .error {
    padding:0px;
	font-size: 10px;
	font-style: italic;
	color: #FF0000;
	margin-top: 0px;
	margin-bottom: 0px;
        font-weight: 700;
}
/* JS-inserted inline errors should visually match server-side PHP errors.
   Use the same sizing, color and weight so messages are indistinguishable. */
.membersform .oet-js-error, .billingform .oet-js-error, .oet-js-error {
	padding: 0px;
	font-size: 10px;
	font-style: italic;
	color: #FF0000;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: 700;
	display: block; /* ensure it behaves like the server-side <p class="error"> */
	line-height: 1.0em;
}

/* Visible replacement for the native select - list of options with price */
.item-options-display {
  margin-top: 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background: #fff;
  box-sizing: border-box;
  padding: 8px 12px;
}
.item-options-display ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.item-option {
  padding: 6px 0;
  white-space: normal;
  line-height: 1.35;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #f0f0f0;
}
.item-option:last-child {
  border-bottom: none;
}
.item-option.item-total {
  border-top: 2px solid #ccc;
  font-weight: bold;
  margin-top: 8px;
  padding-top: 8px;
  font-size: 1.1em;
}
.item-option span.oet_price { font-weight: 600; margin-left: 8px; }
/* .membersform .style1 removed: formerly used for inline red styling; no references found */
form.paypal input.submit, .membersform input.button, .vmembersform input.button, .pushdown input.button {
	padding:8px;
	font-size:1.1em;
border-radius: 5px;
}
.vmembersform input[type="submit"].button, .vmembersform input.button, .membersform input.button, .membersform input[type="submit"].button, form.paypal input.submit {
	background: #490e0a;
	color:#ffffff;
}
.vmembersform input[type="submit"].button:hover, .vmembersform input.button:hover,.membersform input[type="submit"].button:hover, .membersform input.button:hover, form.paypal input.submit:hover {
	background: #d86b4c;
}
.paypal div .donate{
	font-size:0.9em;
}
.paypal div select{
	font-size:0.9em;
       max-width: 500px;
       width: 100%;
}
form .paypal .payamt select{
	width: 100%!important;
}
.membersform  .checkbox.nri {
    margin-top: 0px;
	margin-bottom: 10px;
}
.membersform  .checkbox.nri .form-group {
    margin-bottom: 0px;
    padding-right: 20px;
    padding-left:20px;
}
.membersform  .checkbox.nri input[type=checkbox] {
    width: 24px;
    height:24px;
    position: relative;
    top: 2px;
    margin-bottom: 5px;
    margin-right: 5px;
    accent-color: #490e0a;
}
.membersform  .check-inline.nri input[type=checkbox] {
    width: 24px;
    height:24px;
    position: relative;
    top: 2px;
    accent-color: #490e0a;
}
.membersform  .check-inline.nri p.first {
    margin-bottom: 0px;
    font-weight: 700;
}
.membersform  .check-inline.nri p.next-to {
    margin-top: 0px;
    padding-left:20px;
}
.membersform .mtype-group {
    list-style-type: none;
	margin-bottom: 10px;
}
.membersform .mtype-group .mtype-list{
    margin-top: 0; 
	margin-bottom: 6px;
}
.membersform .form-inline label{
    display: inline-block;
}
.vmembersform .sbmtmf-items input[type="submit"].button, .vmembersform .sbmtmf-items input.button {
    margin: 5px 18px;
}
div.row.ppform {margin:10px 0;}
@media (min-width: 480px) {/* min-width: 768px */
  .ings {
    display: inline-block;
  }
}
.inline-button {
	display: inline-block;
}
.membersform .form-group.subgroup {
	margin-bottom: 0px;
}
@media (max-width: 650px) {
	.membersform select {
		font-size: 1.0em;
		min-width: 100%;
	}
}
div#smart-membership-container select#item-options {
    /* This element is being removed, so its styles are no longer needed. */
}

/* The .select-preview element is also being removed via JS changes. */
div#smart-membership-container .select-preview {
    /* This element is being removed, so its styles are no longer needed. */
}
/* Hide the native select used for compatibility with PayPal JS.
The visible options list (#item-options-display) is used by users. */
#item-options { 
	display: none !important; 
}

@media (max-width: 650px) {
    div#smart-membership-container .select-preview { font-size: 0.95em; }
}
#waverContainer {/*display:none;*/
    position: absolute;
    left: 0px;
    right: 0px;
    width: 70%;
    background-color: white;
    margin: 0px auto;
    border: 3px solid maroon;
    top: 10%;
    padding:20px;
    height: 70%;
    overflow: auto;
    overflow-x: hidden;
	max-height: 600px;
	z-index: 10002 !important;
}
@media (max-width: 767px) {
	/* On small screens make the waiver modal fixed and centered in viewport to avoid page jump */
	#waverContainer {
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		top: 8vh;
		width: 88%;
		padding: 8px;
		max-height: 84vh;
		overflow: auto;
		z-index: 10002 !important;
	}
}

/* Backdrop used by modals */
.modal-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/* force semi-transparent backdrop even if other libraries (Bootstrap) set a solid color */
	background: rgba(0,0,0,0.45) !important;
	background-color: rgba(0,0,0,0.45) !important;
	/* Ensure backdrop is behind our modals */
	z-index: 9000 !important;
	pointer-events: auto;
}

/* Base modal helper styles to ensure consistent look */
.oet-modal {
	box-shadow: 0 6px 18px rgba(0,0,0,0.35);
	background-clip: padding-box;
}

#rrModalContainer {
		display: none;
		position: absolute;
		left: 0;
		right: 30%;
		width: 60%;
		background-color: white;
		margin: 0 auto;
		border: 3px solid maroon;
		top: 28%;
		padding: 18px;
		height: auto;
		max-height: 60%;
		overflow: auto;
		z-index: 10001 !important;
}
@media (max-width: 767px) {
	/* On small screens, make modal fixed and centered in viewport so it appears over the current section
	   without forcing page scroll. Use viewport-relative max-height to keep it usable. */
	#rrModalContainer {
	  position: fixed;
	  left: 50%;
	  transform: translateX(-50%);
	  top: 10px;
	  width: 85%;
  	  max-height: 80vh; /* keep modal within viewport */
  	  overflow: auto;
  	  z-index: 10001 !important;
	}
}

.wcClose button#puRRCancel { margin-left: 12px; }

.membersform button, .membersform input[type="button"].button{
	background: #490e0a;
	color:#ffffff;
	padding:8px;
	font-size:1.1em;
        border-radius: 5px;
}
.membersform button:hover, .membersform input[type="button"].button:hover{
	background: #d86b4c;
}
.membersform ul.mtype-group {padding:0;}
.membersform ul.mtype-group li {padding:15px;}
.membersform ul.mtype-group a {color:#fff;background: #490e0a;padding:15px;border-radius: 5px; border:none;}
.membersform ul.mtype-group a:hover {color:#fff;background: #d86c4d;}
.membersform ul.mtype-group li p {line-height:1.5em;}
div.payment-section {border: 1px solid;}
@media (min-width:1200px){div.payment-section {width: 750px;}}
@media (max-width:1199px){div.payment-section {width: 100%;}}
div#smart-membership-cancel.cancel  input.button, div#smart-membership-container #billingButton input.button{width: 100%;}
/*@media (min-width:1200px){div#smart-membership-cancel.cancel  input.button, div#smart-membership-container #billingButton input.button{width: 750px;}}
@media (max-width:1199px){div#smart-membership-cancel.cancel  input.button, div#smart-membership-container #billingButton input.button{width: 100%;}}
*/
div#smart-membership-cancel.cancel  input.button, div#smart-membership-container  #billingButton input.button{
	font-size: 1.5em;padding: 16px;border-radius:4px;color:#fff;background: #490e0a;border-radius: 5px; border:none;
	}
div#smart-membership-cancel.cancel  input.button:hover, div#smart-membership-container  #billingButton input.button:hover{
	background:#d86c4d
	}
div#smart-membership-cancel.cancel .pushdown, div#smart-membership-container  #billingButton.pushdown{
	margin-top:1.2em;
	}
div#smart-membership-cancel.cancel, div#smart-membership-container  .billingContainer {
	padding-left:0;padding-right:0;
	}
div#smart-membership-container  .billingContainer .billingInfo{
	padding-left:15px;padding-right:15px;
	}

div.thankyou{background-color: #EADFDF;}