.dashboard-main-wrapper {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.dashboard-main-wrapper .mp_wrapper:has(#mepr_account_form,.mepr-newpassword-form, #mepr-stripe-payment-form) {
  color: var(--text-color) !important;
  background-color: var(--white-color) !important;
  border-radius: var(--rad) !important;
  padding: 2.25rem !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid var(--border-color) !important;
  margin-bottom: 1.5rem !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
.dashboard-main-wrapper .mp_wrapper .mp_wrapper {
	all: unset !important;
	display: block !important;
}
.mepr-stripe-elements{
	margin-bottom: 32px;
}
/* Segmented Button Tabbed Account Navigation Bar Styling */
.dashboard-main-wrapper .mp_tab_wrapper {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 1.5rem !important;
}

.dashboard-main-wrapper #mepr-account-nav ul {
  display: flex !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  padding: 0.5rem !important;
  margin: 0 !important;
  gap: 0.5rem !important;
  border-bottom: none !important;
  background-color: var(--white-color) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--rad) !important;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

.dashboard-main-wrapper #mepr-account-nav li {
  margin: 0 !important;
  padding: 0 !important;
}

.dashboard-main-wrapper #mepr-account-nav a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.625rem 1.25rem !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  color: var(--text-gray) !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  border-radius: var(--rad) !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}

.dashboard-main-wrapper #mepr-account-nav a:hover {
  color: var(--text-color) !important;
  background-color: var(--light-gary) !important;
  border-color: var(--border-color) !important;
}

.dashboard-main-wrapper #mepr-account-nav li.mepr-active-nav-tab a {
  color: #ffffff !important;
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

/* Welcome Header formatting */
.dashboard-main-wrapper #mepr-account-welcome-message {
  padding-bottom: 1rem !important;
  margin-bottom: 1.5rem !important;
  border-bottom: 1px solid var(--border-color) !important;
}

.dashboard-main-wrapper #mepr-account-welcome-message p {
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  color: var(--text-color) !important;
  letter-spacing: -0.02em !important;
}

/* Success Updated Notification Box */
.dashboard-main-wrapper .mepr_updated {
  background-color: rgba(0, 130, 55, 0.08) !important;
  color: var(--secondary-color) !important;
  border: 1px solid rgba(0, 130, 55, 0.18) !important;
  border-left: 4px solid var(--secondary-color) !important;
  padding: 1rem 1.25rem !important;
  border-radius: var(--rad) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  margin-bottom: 1.5rem !important;
  box-sizing: border-box !important;
}

/* Validation Error Notification Box */
.dashboard-main-wrapper .mepr_error {
  background-color: rgba(223, 21, 21, 0.08) !important;
  color: var(--primary-color) !important;
  border: 1px solid rgba(223, 21, 21, 0.18) !important;
  border-left: 4px solid var(--primary-color) !important;
  padding: 1rem 1.25rem !important;
  border-radius: var(--rad) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  margin-bottom: 1.5rem !important;
  box-sizing: border-box !important;
}

/* MemberPress Form Grid Layout Alignment */
.dashboard-main-wrapper .mepr-account-form {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 1.5rem !important;
  margin-top: 1rem !important;
}

.dashboard-main-wrapper .mp-form-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.45rem !important;
  margin-bottom: 0 !important;
}

/* Grid Column Spans for full width and sections */
.dashboard-main-wrapper .mepr_first_name { grid-column: span 6 !important; }
.dashboard-main-wrapper .mepr_last_name { grid-column: span 6 !important; }
.dashboard-main-wrapper .mepr_email { grid-column: span 12 !important; }

/* 3 Column layouts for Address Row & Details Row */
.dashboard-main-wrapper .mepr_mepr-address-one { grid-column: span 4 !important; }
.dashboard-main-wrapper .mepr_mepr-address-two { grid-column: span 4 !important; }
.dashboard-main-wrapper .mepr_mepr-address-city { grid-column: span 4 !important; }

.dashboard-main-wrapper .mepr_mepr-address-country { grid-column: span 4 !important; }
.dashboard-main-wrapper .mepr_mepr-address-state { grid-column: span 4 !important; }
.dashboard-main-wrapper .mepr_mepr-address-zip { grid-column: span 4 !important; }

/* Hide default spacer to maintain symmetry spacing */
.dashboard-main-wrapper .mepr_spacer {
  display: none !important;
}

/* Overriding form fields to replace default gray style sheets */
.dashboard-main-wrapper .mp_wrapper textarea,
.dashboard-main-wrapper .mp_wrapper select,
.dashboard-main-wrapper .mp_wrapper input[type=text],
.dashboard-main-wrapper .mp_wrapper input[type=email],
.dashboard-main-wrapper .mp_wrapper input[type=password] {
  width: 100% !important;
  background-color: var(--light-gary) !important;
  border: 1.5px solid var(--border-color) !important;
  border-radius: var(--rad) !important;
  padding: 0.75rem 1rem !important;
  font-size: 0.95rem !important;
  color: var(--text-color) !important;
  outline: none !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
	outline-offset: -1px !important;
}

.dashboard-main-wrapper .mp_wrapper textarea:hover,
.dashboard-main-wrapper .mp_wrapper select:hover,
.dashboard-main-wrapper .mp_wrapper input[type=text]:hover,
.dashboard-main-wrapper .mp_wrapper input[type=email]:hover,
.dashboard-main-wrapper .mp_wrapper input[type=password]:hover {
  background-color: var(--box-hover-color) !important;
  border-color: #cbd5e1 !important;
}

.dashboard-main-wrapper .mp_wrapper textarea:focus,
.dashboard-main-wrapper .mp_wrapper select:focus,
.dashboard-main-wrapper .mp_wrapper input[type=text]:focus,
.dashboard-main-wrapper .mp_wrapper input[type=email]:focus,
.dashboard-main-wrapper .mp_wrapper input[type=password]:focus {
	background-color: var(--white-color) !important;
	border-color: var(--primary-color) !important;
	box-shadow: none !important;
	color: var(--text-color) !important;
	outline: 2px solid var(--text-color) !important;
	outline-offset: -1px;
}

/* Custom invalid input overrides (Hides default red backing) */
.dashboard-main-wrapper .mepr-form input.invalid,
.dashboard-main-wrapper .mepr-form select.invalid,
.dashboard-main-wrapper .mepr-form textarea.invalid {
	border-color: var(--primary-color) !important;
	background-color: rgba(223, 21, 21, 0.04) !important;
	box-shadow: none !important;
	color: var(--text-color) !important;
	outline: 2px solid var(--primary-color) !important;
	outline-offset: -1px;
}

/* Custom Dropdown Overrides */
.dashboard-main-wrapper select.mepr-form-input,
.dashboard-main-wrapper select.mepr-select-field {
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%234F4E57'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 1rem center !important;
  background-size: 1.25rem !important;
  padding-right: 2.5rem !important;
}

/* Active Floating labels logic overrides */
.dashboard-main-wrapper .mp_wrapper .mp-form-row.mp-address-group label.placeholder-text.active,
.dashboard-main-wrapper .mp_wrapper .mp-form-row .mp-form-row-group label.placeholder-text.active,
.dashboard-main-wrapper #mepr_loginform .mp-form-label label.placeholder-text.active {
  transform: translate(0, -20px) !important;
  padding: 0 5px !important;
  background: var(--white-color) !important;
  color: var(--primary-color) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.dashboard-main-wrapper .cc-error {
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  color: var(--primary-color) !important;
  background-color: rgba(223, 21, 21, 0.08) !important;
  padding: 0.15rem 0.5rem !important;
  border-radius: var(--rad) !important;
  border: 1px solid rgba(223, 21, 21, 0.15) !important;
}

/* ==========================================================
 * NEW PASSWORD RESET WORKSPACE CSS (NEW!)
 * ========================================================== */
.dashboard-main-wrapper .mepr_new_password,
.dashboard-main-wrapper .mepr_confirm_password {
  margin-bottom: 1.25rem !important;
}

.dashboard-main-wrapper .mepr-newpassword-form label {
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  color: var(--text-gray) !important;
  margin-bottom: 0.45rem !important;
  display: block !important;
}

.dashboard-main-wrapper .mp-hide-pw {
  position: relative !important;
  display: block !important;
}

.dashboard-main-wrapper .mp-hide-pw input {
  padding-right: 3.25rem !important;
}

.dashboard-main-wrapper .mp-hide-pw button.mp-hide-pw {
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  height: 100% !important;
  width: 3rem !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--text-gray) !important;
  transition: color 0.2s ease !important;
  box-shadow: none !important;
  border-radius: 0 var(--rad) var(--rad) 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.dashboard-main-wrapper .mp-hide-pw button.mp-hide-pw:hover {
  color: var(--primary-color) !important;
}

.dashboard-main-wrapper .mp-hide-pw button.mp-hide-pw .dashicons {
  display: inline-block !important;
  font-size: 20px !important;
  width: 20px !important;
  height: 20px !important;
}

.dashboard-main-wrapper .mepr-newpassword-form {
  color: var(--text-gray) !important;
  font-size: 0.9rem !important;
}

.dashboard-main-wrapper .mepr-newpassword-form input[type="submit"],
.dashboard-main-wrapper input.mepr-submit {
  background-color: var(--primary-color) !important;
  color: var(--white-color) !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  padding: 0.8rem 1.75rem !important;
  border-radius: var(--rad) !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.dashboard-main-wrapper .mepr-newpassword-form input[type="submit"][value="Update Password"]{
	margin-right: 8px;
}
.dashboard-main-wrapper .mepr-newpassword-form input[type="submit"]:hover,
.dashboard-main-wrapper input.mepr-submit:hover {
  filter: brightness(1.1) !important;
}

.dashboard-main-wrapper .mepr-newpassword-form a {
  color: var(--text-gray) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.8rem 1.5rem !important;
  border-radius: var(--rad) !important;
  background-color: var(--light-gary) !important;
  border: 1px solid var(--border-color) !important;
  margin-left: 0.5rem !important;
}

.dashboard-main-wrapper .mepr-newpassword-form a:hover {
  color: var(--primary-color) !important;
  background-color: var(--white-color) !important;
  border-color: var(--primary-color) !important;
}

/* ==========================================================
 * ACTION FOOTER (Change Password & Save Profile Side-by-Side)
 * ========================================================== */
.dashboard-main-wrapper .mp_form_footer {
  grid-column: span 12 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 1.5rem !important;
  margin-top: 1rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid var(--border-color) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.dashboard-main-wrapper .mepr-account-change-password a {
  color: var(--text-gray) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.8rem 1.5rem !important;
  border-radius: var(--rad) !important;
  background-color: var(--light-gary) !important;
  border: 1px solid var(--border-color) !important;
}

.dashboard-main-wrapper .mepr-account-change-password a:hover {
  color: var(--primary-color) !important;
  background-color: var(--white-color) !important;
  border-color: var(--primary-color) !important;
}

.dashboard-main-wrapper .mp_submit {
  display: flex !important;
  align-items: center !important;
  gap: 1rem !important;
}

.dashboard-main-wrapper input.mepr-submit.mepr-share-button {
  background-color: var(--primary-color) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  padding: 0.8rem 1.75rem !important;
  border-radius: var(--rad) !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.dashboard-main-wrapper input.mepr-submit.mepr-share-button:hover {
  filter: brightness(1.1) !important;
}

.dashboard-main-wrapper .mepr-loading-gif {
  height: 24px !important;
  width: 24px !important;
}

.dashboard-main-wrapper .mepr-form-has-errors {
  font-weight: 700 !important;
  color: var(--primary-color) !important;
  font-size: 0.85rem !important;
  padding: 0.6rem 1rem !important;
  border-radius: var(--rad) !important;
  background-color: rgba(223, 21, 21, 0.08) !important;
  border-left: 4px solid var(--primary-color) !important;
	margin-top: 10px !important;
}

/* ==========================================================
 * COHESIVE TABLE STYLING RULES (Subscriptions & Payments)
 * ========================================================== */
.dashboard-main-wrapper .mepr-account-table {
  width: 100% !important;
  border-collapse: collapse !important;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.9rem !important;
  border: none !important;
}

.dashboard-main-wrapper .mepr-account-table thead {
  background-color: var(--light-gary) !important;
  border-bottom: 0px solid var(--border-color) !important;
}
.mp_wrapper table.mepr-account-table{
	background-color: var(--white-color);
}
.mp_wrapper table.mepr-account-table thead tr{
	border-bottom: 0px;
}
.dashboard-main-wrapper .mepr-account-table th {
  padding: 1rem 1.25rem !important;
  font-weight: 700 !important;
  color: var(--text-gray) !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border: none !important;
}

.dashboard-main-wrapper .mepr-account-table tbody tr {
  border-bottom: 1px solid var(--border-color) !important;
  transition: background-color 0.15s ease !important;
}

.dashboard-main-wrapper .mepr-account-table tbody tr:hover {
  background-color: var(--box-hover-color) !important;
}

.dashboard-main-wrapper .mepr-account-table td {
  padding: 1.25rem !important;
  vertical-align: middle !important;
  color: var(--text-color) !important;
  border: none !important;
}

.dashboard-main-wrapper .mepr-account-product {
  font-weight: 700 !important;
  color: var(--text-color) !important;
  font-size: 1rem !important;
}
.dashboard-main-wrapper .mepr-account-product:not(:last-child){
	margin-bottom: 3px;
}

.dashboard-main-wrapper .mepr-account-subscr-id,
.dashboard-main-wrapper .mepr-account-table td[data-label="Invoice"] span{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 0.75rem !important;
  color: var(--text-gray) !important;
  background-color: var(--light-gary) !important;
  padding: 0.2rem 0.5rem !important;
  display: inline-block !important;
  border-radius: var(--rad) !important;
  border: 1px solid var(--border-color) !important;
}

.dashboard-main-wrapper .mepr-account-auto-rebill {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: var(--text-gray) !important;
}

.dashboard-main-wrapper .mepr-account-terms {
  font-size: 0.9rem !important;
  color: var(--text-color) !important;
  font-weight: 500 !important;
}

.dashboard-main-wrapper .mepr-account-rebill {
  font-size: 0.75rem !important;
  color: var(--text-gray) !important;
  margin-top: 0.15rem !important;
}

/* Shared badge framework for active rows and status complete values */
.dashboard-main-wrapper .mepr-active,
.dashboard-main-wrapper .mepr-account-table td[data-label="Status"] span{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  background-color: rgba(0, 130, 55, 0.08) !important;
  color: var(--secondary-color) !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  padding: 0.25rem 0.6rem !important;
  border-radius: var(--rad) !important;
  border: 1px solid rgba(0, 130, 55, 0.18) !important;
}

.dashboard-main-wrapper .mepr-active::before,
.dashboard-main-wrapper .mepr-account-table td[data-label="Status"] span::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  background-color: var(--secondary-color) !important;
  border-radius: 50% !important;
}

.dashboard-main-wrapper .mepr-account-created-at {
  font-weight: 500 !important;
}


.dashboard-main-wrapper .mepr-account-row-action {
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 14px !important;
    border-radius: var(--rad) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    border: 1px solid transparent !important;
}

/* Distinct Color Mappings for each state button */

/* UPDATE: Professional Secondary Blue Button */
.dashboard-main-wrapper .mepr-account-update {
    background-color: #EBF5FF !important;
    color: #1E40AF !important;
    border: 1px solid #BFDBFE !important;
}
.dashboard-main-wrapper .mepr-account-update:hover {
    background-color: #DBEAFE !important;
    border-color: #93C5FD !important;
}

/* RESUME: Solid Secondary Green Button */
.dashboard-main-wrapper .mepr-account-resume {
    background-color: #EBF7EE !important;
    color: var(--secondary-color) !important;
    border: 1px solid #C2E7CD !important;
}
.dashboard-main-wrapper .mepr-account-resume:hover {
    background-color: #D1EAD7 !important;
    border-color: #A3D8B4 !important;
}

/* PAUSE: Warning/Attention Amber Button */
.dashboard-main-wrapper .mepr-account-suspend {
    background-color: #FFFBEB !important;
    color: #B45309 !important;
    border: 1px solid #FDE68A !important;
}
.dashboard-main-wrapper .mepr-account-suspend:hover {
    background-color: #FEF3C7 !important;
    border-color: #FCD34D !important;
}

/* CANCEL: High-Contrast Brand Primary Red Button */
.dashboard-main-wrapper .mepr-account-cancel {
    background-color: #FFF5F5 !important;
    color: var(--primary-color) !important;
    border: 1px solid #FEB2B2 !important;
}
.dashboard-main-wrapper .mepr-account-cancel:hover {
    background-color: #FED7D7 !important;
    border-color: #FEB2B2 !important;
}

/* Styled confirmation popup boxes (MagnificPopup targets) */
.dashboard-main-wrapper .mepr-white-popup {
    background-color: var(--white-color) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--rad) !important;
    padding: 12px 16px !important;
    margin-top: 8px !important;
    font-size: 13px !important;
    color: var(--text-color) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

.dashboard-main-wrapper .mepr-white-popup.mfp-hide {
    display: none !important; /* Managed dynamically by MagnificPopup/JS */
}

.dashboard-main-wrapper .mepr-white-popup .mepr-resume-sub-text,
.dashboard-main-wrapper .mepr-white-popup .mepr-cancel-sub-text {
    font-weight: 500 !important;
    margin-bottom: 8px !important;
    color: var(--text-color) !important;
}

.dashboard-main-wrapper .mepr-cancel-sub-buttons {
    display: flex !important;
    gap: 8px !important;
    margin-top: 8px !important;
}

.dashboard-main-wrapper .mepr-white-popup button.mepr-btn {
    padding: 6px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: var(--rad) !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

/* Style Yes as standard primary accent button */
.dashboard-main-wrapper .mepr-white-popup button.mepr-confirm-yes {
    background-color: var(--primary-color) !important;
    color: var(--white-color) !important;
    border: none !important;
    margin-right: 0 !important;
}

/* Positive override action button color for positive states like Resume */
.dashboard-main-wrapper #mepr-resume-sub-2 button.mepr-confirm-yes {
    background-color: var(--secondary-color) !important;
}

.dashboard-main-wrapper .mepr-white-popup button.mepr-confirm-yes:hover {
    opacity: 0.9 !important;
}

.dashboard-main-wrapper .mepr-white-popup button.mepr-confirm-no {
    background-color: var(--white-color) !important;
    color: var(--text-gray) !important;
    border: 1px solid var(--border-color) !important;
}

.dashboard-main-wrapper .mepr-white-popup button.mepr-confirm-no:hover {
    background-color: var(--box-hover-color) !important;
}


/* Ensure yes and no layout align side-by-side in confirmation modes */
.mepr-white-popup button.mepr-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: var(--rad) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    min-width: 100px !important;
    height: 38px !important;
    box-sizing: border-box !important;
    border: 1px solid transparent !important;
}

/* Confirmation Accent Styles */
.mepr-white-popup button.mepr-confirm-yes {
    background-color: var(--secondary-color) !important; /* Positive Green for Resume actions */
    color: var(--white-color) !important;
    margin-right: 8px !important;
    border: none !important;
}

/* Red overlay override style specifically for the Cancellation popup */
[id*="cancel"] button.mepr-confirm-yes {
    background-color: var(--primary-color) !important;
}

.mepr-white-popup button.mepr-confirm-yes:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px);
}

.mepr-white-popup button.mepr-confirm-no {
    background-color: var(--white-color) !important;
    color: var(--text-gray) !important;
    border: 1px solid var(--border-color) !important;
}

.mepr-white-popup button.mepr-confirm-no:hover {
    background-color: var(--box-hover-color) !important;
    border-color: #ccc !important;
}

/* Premium styled close button positioning */
.mfp-close {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    color: #ffffff !important;
    font-size: 28px !important;
    opacity: 0.5 !important;
    transition: opacity 0.2s ease, color 0.2s ease !important;
    cursor: pointer !important;
    background: none !important;
    border: none !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    cursor: pointer;
}

.mfp-close:hover {
    opacity: 1 !important;
}

.mepr-resume-sub-text {
    margin-bottom: 20px;
    font-size: 18px;
}

.mepr-white-popup {
    border-radius: var(--rad);
}
/* ==========================================================
 * TABLE RESPONSIVE CARD CONSTRAINTS (For Mobile views)
 * ========================================================== */
@media (max-width: 768px) {
  .dashboard-main-wrapper .mepr-account-table, 
  .dashboard-main-wrapper .mepr-account-table thead, 
  .dashboard-main-wrapper .mepr-account-table tbody, 
  .dashboard-main-wrapper .mepr-account-table th, 
  .dashboard-main-wrapper .mepr-account-table td, 
  .dashboard-main-wrapper .mepr-account-table tr {
    display: block !important;
    width: 100% !important;
  }

  .dashboard-main-wrapper .mepr-account-table thead {
    display: none !important;
  }

  .dashboard-main-wrapper .mepr-account-table tbody tr {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--rad) !important;
    margin-bottom: 1rem !important;
    padding: 0.5rem 0 !important;
    background-color: var(--white-color) !important;
  }

  .dashboard-main-wrapper .mepr-account-table td {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 0.75rem 1.25rem !important;
    border-bottom: 1px dashed var(--border-color) !important;
    text-align: right !important;
  }

  .dashboard-main-wrapper .mepr-account-table td:last-child {
    border-bottom: none !important;
  }

  .dashboard-main-wrapper .mepr-account-table td::before {
    content: attr(data-label) !important;
    font-weight: 700 !important;
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    color: var(--text-gray) !important;
    letter-spacing: 0.04em !important;
    text-align: left !important;
    margin-right: 1rem !important;
  }
}

/* Screen Size Layout Adaptability */
@media (max-width: 860px) {
  .dashboard-main-wrapper .mepr_mepr-address-one, 
  .dashboard-main-wrapper .mepr_mepr-address-two, 
  .dashboard-main-wrapper .mepr_mepr-address-city {
    grid-column: span 6 !important;
  }
  .dashboard-main-wrapper .mepr_mepr-address-city {
    grid-column: span 12 !important;
  }
}

@media (max-width: 650px) {
  .dashboard-main-wrapper .mepr_first_name, 
  .dashboard-main-wrapper .mepr_last_name, 
  .dashboard-main-wrapper .mepr_mepr-address-one, 
  .dashboard-main-wrapper .mepr_mepr-address-two, 
  .dashboard-main-wrapper .mepr_mepr-address-city,
  .dashboard-main-wrapper .mepr_mepr-address-country, 
  .dashboard-main-wrapper .mepr_mepr-address-state, 
  .dashboard-main-wrapper .mepr_mepr-address-zip {
    grid-column: span 12 !important;
  }

  .dashboard-main-wrapper .mp_form_footer {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 1rem !important;
  }

  .dashboard-main-wrapper .mepr-account-change-password,
  .dashboard-main-wrapper .mepr-account-change-password a,
  .dashboard-main-wrapper .mp_submit,
  .dashboard-main-wrapper input.mepr-submit.mepr-share-button {
    width: 100% !important;
  }

  .dashboard-main-wrapper .mepr-account-change-password a,
  .dashboard-main-wrapper input.mepr-submit.mepr-share-button {
    justify-content: center !important;
    text-align: center !important;
  }

  .dashboard-main-wrapper .mp_submit {
    flex-direction: column-reverse !important;
  }
}