/*
 * WCBW registration popup — subscription.css (18 Oct 2026).
 * Part 1 = the old css/userSubscriptionDetectionAndProcesses.css as it was (modal, form, steps),
 * one change: the close button is a text "×" (the old background image pointed at a hard-coded
 * staging URL). Part 2 = the few new elements (poll notice, privacy line, password rules,
 * message colours, the hidden state of #wcbw-sub-modal).
 */

/* ===================== PART 1: the old stylesheet ===================== */
/* ----------------------------------- */
/* Start modal styles */


/* Prevent scrolling when the modal is active */
 body.no-scroll {
    overflow: hidden;
}  


/* Modal overlay for blocking user interaction */
.modal-overlay-full {
    position: fixed;
    top: 40%; /* Show the top 40% of the page */
    left: 0;
    width: 100%;
    height: 60%; /* Block the rest 60% */
    background-color: rgba(0, 0, 0, 0.7); /* Semi-transparent background */
    z-index: 1000;
}
.modal-overlay-full-mobile {
    position: fixed;
    top: 40%;
    left: 0;
    width: 100%;
    height: 60%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
}

/* Remove close button when max article count reached */
.modal-content.no-close .close {
    display: none;
}
.modal-content.no-close-mobile .close-mobile {
    display: none;
}

#close-modal-button{
    margin-top:1.3em;
    margin-bottom:1em;
    /* 18 Oct 2026: text × instead of the old staging-URL image */
    background-size: contain; /* Adjust the size to cover the button */
    background-position: center; /* Center the background image */
    background-repeat: no-repeat; /* Do not repeat the background image */
    background-color: #E0E0E0;
    width: calc(20px + (40 - 20) * ((100vw - 300px) / (1600 - 300)))!important;
    height: calc(20px + (40 - 20) * ((100vw - 300px) / (1600 - 300)))!important;
    border: 1px solid #aaa; /* Subtle border for the beveled look */
    border-radius: 4px; /* Rounded corners */
    box-shadow: inset 2px 2px 5px rgba(255, 255, 255, 0.8), inset -2px -2px 5px rgba(0, 0, 0, 0.2); /* Beveled effect */
    transition: box-shadow 0.1s ease, transform 0.1s ease; /* Smooth transition */
    padding:0.5em;
}

#close-modal-button:hover{
    background-color: var(--e-global-color-7620581);
}

/* Modal overlay */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
}
.modal-overlay-mobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
}

/* Modal content */
.modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffffff;
    padding:1em;
    z-index: 1001;
    border-radius: 8px;
    width: calc(260px + (600 - 260) * ((100vw - 300px) / (1600 - 300))) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    text-align: center;
    min-height:340px;
}

.modal-content-mobile {
    position: fixed !important;
    top: 37%;
    left: 50%!important;
    transform: translate(-50%, -50%) !important;
    background-color: #ffffff;
    margin:0.1em;
    padding: 1em;
    z-index: 1001;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    text-align: center;
    min-height: 340px;
    width: calc(300px + (600 - 300) * ((100vw - 300px) / (1600 - 300)));
    left: 0; /* Align to the left of the overlay */
    transform: none; /* Remove transform to prevent centering */
}


.modal-content-text1 {
    margin:1em;
    font-size:calc(12px + (16 - 12) * ((100vw - 300px) / (1600 - 300)))!important;
}
.modal-content-text1-mobile {
    margin:1em;
    max-width:100%;
    font-size:calc(12px + (16 - 12) * ((100vw - 300px) / (1600 - 300)))!important;
}

.modal-content-text2 {
    margin-bottom: 1em;
    font-size:calc(12px + (16 - 12) * ((100vw - 300px) / (1600 - 300)))!important;
}
.modal-content-text2-mobile {
    margin-bottom: 1em;
    font-size:calc(12px + (16 - 12) * ((100vw - 300px) / (1600 - 300)))!important;
}

.modal-content-header h2 {
    margin-left: 1em !important;
    margin-right: 1em !important;
    margin-top:1em !important;
    margin-bottom:0px !important;
    font-size:calc(17px + (26 - 17) * ((100vw - 300px) / (1600 - 300))) !important;
    font-weight:600 !important;
    
}

.modal-content-header-mobile h2 {
    margin-left: 1em !important;
    margin-right: 1em !important;
    margin-bottom:0px !important;
    font-size:calc(17px + (26 - 17) * ((100vw - 300px) / (1600 - 300))) !important;
    margin-top:1em !important;
    font-weight:600 !important;
}

/* Close button */
.close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 20px;
}
.close-mobile {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 20px;
}


/* ---------------------------------------------------------------- */
/* TOUR ACCESS BLOCKING MODAL - POSITIVE & CENTERED (SPECIFIC ONLY) */
/* ---------------------------------------------------------------- */

/* Prevent scrolling when modal is open */
body.tour-modal-open {
    overflow: hidden;
}

/* Full-screen overlay wrapper */
.tour-access-modal-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);  /* 20% opacity */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9998;
    padding: 20px;
    box-sizing: border-box;
}

/* The actual modal card - only affects this modal */
.tour-access-modal-content {
    position: relative;
    background: #ffffff;
    border-radius: 16px;
    max-width: 560px;
    width: 100%;
    padding: 40px 30px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.3);
    text-align: center;
    z-index: 9999;
    animation: tourModalFadeIn 0.4s ease-out;
}

@keyframes tourModalFadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to   { opacity: 1; transform: scale(1); }
}

/* Header - Welcome! */
.tour-access-modal-header h2 {
    font-size: calc(24px + (32 - 24) * ((100vw - 300px) / (1600 - 300)));
    font-weight: 600;
    color: var(--e-global-color-primary, #446344);
    margin: 0 0 20px 0;
    line-height: 1.2;
}

/* Thank you message */
.tour-access-modal-text1 {
    font-size: calc(16px + (20 - 16) * ((100vw - 300px) / (1600 - 300)));
    line-height: 1.6;
    margin: 0 0 24px 0;
    color: #333;
}
.tour-access-modal-text1 strong {
    color: var(--e-global-color-primary, #446344);
    font-weight: 600;
}

/* Secondary message */
.tour-access-modal-text2 {
    font-size: calc(14px + (16 - 14) * ((100vw - 300px) / (1600 - 300)));
    color: #666;
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Close button - clean × */
.tour-access-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    font-size: 28px;
    width: 40px;
    height: 40px;
    color: #999;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s ease;
}
.tour-access-close:hover {
    color: var(--e-global-color-primary, #446344);
    background: rgba(68, 99, 68, 0.1);
}

/* Center the subscription form inside this modal */
.tour-access-modal-content .custom-subscription-process-container {
    display: flex;
    justify-content: center;
    width: 100%;
}
.tour-access-modal-content .subscription-container {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    background: rgba(224, 224, 224, 0.3);
    border-radius: 12px;
    padding: 24px;
    border: 2px groove #2C3E2C;
}

/* Hide old partial overlays - not needed anymore */
.modal-overlay-full,
.modal-overlay-full-mobile {
    display: none !important;
}


/* -------------------------------------------END-------------------------------------------------------  */
/*                                  SUBSCRIPTION DETECTION MODAL                                          */
/* -----------------------------------------------------------------------------------------------------  */



/* -------------------------------------------BEGIN---------------------------------------------------------*/
/*                              USER SUBSCRIPTION PROCESSES CLASS                                           */
/* ---------------------------------------------------------------------------------------------------------*/

.custom-subscription-process-container{
    background-color: rgba(224, 224, 224, 0.4);
}

.subscription-container{
    display: flex;
    flex-direction: column;
    justify-content: center !important;
    align-items: center !important;
    padding:1em !important;
    margin:0.25em;
    width: calc(260px + (520 - 260) * ((100vw - 300px) / (1600 - 300)));
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    border-radius:10px;
    border-style:groove;
    border-width:2px;
    border-color:#2C3E2CCC;
    z-index: 1002;
 
}

.modal-contentsubscription-container{
    margin:0px !important;
    width: calc(260px + (560 - 260) * ((100vw - 300px) / (1600 - 300))) !important;
}
.subscription-heading-group{
     margin:1em;
     gap:1em;
}

.subscription-heading{
    text-align:center !important;
    font-weight:600 !important;
    font-size:calc(17px + (26 - 17) * ((100vw - 300px) / (1600 - 300))) !important;
    font-family:'Averia Serif Libre', serif !important;
    color:var(--e-global-color-primary) !important;
    padding: 0px !important;
    margin:0px !important;
}

.send-new-code-button-div{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding:0px !important;
    height:50%;
}

.resend-new-code-link {
    text-align: center !important;
    font-weight: 400 !important;
    font-size: calc(16px + (24 - 16) * ((100vw - 300px) / (1600 - 300))) !important;
    font-family: 'Averia Serif Libre', serif !important;    
    color: #0275BD !important;
}

#resend-new-code-link-0.disabled, #resend-new-code-link-1.disabled,
#resend-new-code-link-2.disabled, #resend-new-code-link-3.disabled{
    opacity: 0.6;
    cursor: not-allowed !important;
    background-color: #E0E0E0 !important;
}

.resend-new-code-link:hover{
    color:#FFCC33 !important;
}

.subscription-form-label{
    text-align:center;
    font-weight:600;
    font-size:calc(11px + (17 - 11) * ((100vw - 300px) / (1600 - 300)));
    font-family:'Averia Serif Libre', serif;
    color:var(--e-global-color-primary);
    margin-top:1em !important;
}

.subscription-button-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    gap:1em;
}

.subscription-label{
    font-family: 'Averia Serif Libre', serif !important;
    font-size: calc(8px + (14 - 8) * ((100vw - 300px) / (1600 - 300)));
    color: var(--e-global-color-secondary,'#446344');
    font-weight: 400;
    text-align:center;
}

input.subscription-input{
    font-size: calc(7px + (12 - 7) * ((100vw - 300px) / (1600 - 300))) !important;
    font-family: 'Verdana', sans-serif !important;
}

.password-input-wrapper {
    position: relative;
}

.toggle-password {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

#password-field {
    padding-right: 1em;
}


input.subscription-input::placeholder {
    color: #999;
    font-style: italic;
    font-size: calc(8px + (14 - 8) * ((100vw - 300px) / (1600 - 300))) !important;
    opacity: 0.7;
    font-family: 'Verdana', sans-serif !important;
}


.subscription-password-input::placeholder{
    color: #999;
    font-style: italic;
    font-size: calc(8px + (14 - 8) * ((100vw - 300px) / (1600 - 300)));
    opacity: 0.7;
    font-family: 'Verdana', sans-serif !important;
}


.toggle-password {
    position: absolute;
    cursor: pointer;
    font-size: calc(17px + (25 - 17) * ((100vw - 300px) / (1600 - 300))) !important;
    display: flex;
    align-items: center;
    height: 160%;
    margin-bottom:1em;
    padding-right:1em;
}

.password-input-wrapper {
    position: relative;
}

#password-field-0,#password-field-1,#password-field-2 ,#password-field-3,#password-field-4,#password-field-5
, #password-field-6, #password-field-7,#password-field-8{
    padding-right: 2em; /* Add some padding to prevent text overlap with the icon */
}

#subscription-button-0, #subscription-button-1, #subscription-button-2,#subscription-button-3,#subscription-button-4,#subscription-button-5,
#subscription-button-6, #subscription-button-7, #subscription-button-8{
    background-color: var(--e-global-color-primary) !important;
    color: #FFFFFF !important;
    border: none !important;
    font-size: calc(12px + (18 - 12) * ((100vw - 300px) / (1600 - 300))) !important;
    font-family: 'Averia Serif Libre', serif !important;
    width: 60%;
    
    /* Added styles for rounded corners, shadow, and centering */
    border-radius: 25px; /* Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    display: block; /* Makes the button a block element */
    margin: 0 auto; /* Centers the button horizontally */
    padding: 10px 20px; /* Adds some padding for better appearance */
    cursor: pointer; /* Changes cursor to pointer on hover */
    transition: all 0.3s ease; /* Smooth transition for hover effects */
}

#subscription-button-0.disabled, #subscription-button-1.disabled, #subscription-button-2.disabled,#subscription-button-3.disabled, #subscription-button-4.disabled,
#subscription-button-5.disabled, #subscription-button-6.disabled, #subscription-button-7.disabled, #subscription-button-8.disabled{
    opacity: 0.6;
    cursor: not-allowed !important;
    background-color: #E0E0E0 !important;
}


#subscription-button-0:hover, #subscription-button-1:hover, #subscription-button-2:hover,#subscription-button-3:hover, #subscription-button-4:hover,
#subscription-button-5:hover, #subscription-button-6:hover, #subscription-button-7:hover, #subscription-button-8:hover{
    background-color:var(--e-global-color-7620581) !important;
}

#subscription-button-0 a, #subscription-button-1 a, #subscription-button-2 a,#subscription-button-3 a, #subscription-button-4 a,
#subscription-button-5 a, #subscription-button-6 a, #subscription-button-7 a, #subscription-button-8 a{
    color: #FFFFFF;
}

/* Make sure the form is centered horizontally when shown */

.subscription-form {
    display: flex;
    flex-direction:column;
    width: 100%;
}







/* -------------------------------------------END---------------------------------------------------------*/
/*                              USER SUBSCRIPTION PROCESSES CLASS                                           */
/* ---------------------------------------------------------------------------------------------------------*/



/* -------------------------------------------BEGIN-----------------------------------------------------*/
/* (PHP add_shortcode('custom_subscription_button', 'custom_subscription_button_shortcode');)           */
/* logged in user info shortcode                                                                        */
/* ---------------------------------------------------------------------------------------------------  */


/* Flexbox styling for the logged-in user info container */
.logged-in-user-info {
    display: flex; /* Use flexbox for horizontal alignment */
    align-items: center; /* Align items vertically centered */
    gap: 10px; /* Space between the elements */
    margin-bottom: 20px; /* Margin below the container */
}

/* Style for the avatar size */
.logged-in-user-info img.avatar {
    width: 30px; /* Set the desired width for the avatar */
    height: 30px; /* Set the desired height for the avatar */
    border-radius: 50%; /* Optional: Make the avatar circular */
}
/* Style for the text and link elements inside the flexbox */
.logged-in-user-info p {
    margin: 0; /* Remove default margin */
    font-family: var(--e-global-typography-Text-font-family, 'Arial');
    font-size:calc(9px + (14 - 9) * ((100vw - 300px) / (1600 - 300)))!important;
}
.logged-in-user-info a {
    color: var(--e-global-color-link, #0275BD) !important; /* Fallback to white color if variable is not found */
    font-family: var(--e-global-typography-accent-font-family, 'Arial') !important; /* Fallback to 'Arial' if variable is not found */
    font-size:calc(9px + (14 - 9) * ((100vw - 300px) / (1600 - 300)))!important;
    font-weight: 600 !important;
}
.logged-in-user-info a:hover {
    color: var(--e-global-color-Hover, #FFCC33) !important;
}

/* ===================== PART 2: additions, 18 Oct 2026 ===================== */
#wcbw-sub-modal[hidden] { display: none; }
#wcbw-sub-modal.is-open { display: block; }
.wcbw-sub-modal .close-modal-buttons { font-size: 1.3em; line-height: 1; color: #446344; }
.wcbw-sub-modal .modal-content { max-height: 90vh; overflow: auto; }

.subscription-container .message-display { display: none; margin-top: .6em; padding: .5em .8em; border-radius: 6px; font-size: .95em; line-height: 1.4; }
.subscription-container .message-display.error   { display: block; background: #fbeaea; color: #7a1f1f; border: 1px solid #e3b4b4; }
.subscription-container .message-display.success { display: block; background: #eaf4ea; color: #2f4f2f; border: 1px solid #b9d6b9; }
.subscription-container .message-display-progress-indicator[hidden] { display: none; }
.subscription-container .message-display-progress-indicator { margin-top: .5em; font-style: italic; opacity: .8; }

.subscription-form .wcbw-sub-privacy,
.subscription-form .wcbw-sub-rules { font-size: .8em; line-height: 1.35; opacity: .85; margin: .6em 0 0; flex-basis: 100%; }
.subscription-form .wcbw-sub-privacy a,
.subscription-form .wcbw-sub-rules a { text-decoration: underline; }
.subscription-form input[name="confirmation_code"] { letter-spacing: .25em; text-align: center; font-weight: 600; }
.subscription-form .toggle-password { background: none; border: 0; cursor: pointer; font-size: 1.1em; padding: 0 .4em; }
.subscription-form .subscription-submit-button.disabled,
.subscription-form .resend-new-code-link.disabled { opacity: .5; pointer-events: none; }
a.subscription-submit-button { display: inline-block; text-align: center; text-decoration: none; }
.wcbw-sub-verified-page { max-width: 640px; margin: 3em auto; padding: 0 16px; text-align: center; }

/* vendor gate notice (vendorGate.php), inside a card panel or a booking-terms card */
.wcbw-gate-notice { padding: 1em 1.2em; border: 1px dashed #446344; border-radius: 8px; background: rgba(68,99,68,.05); text-align: center; margin: .5em 0; }
.wcbw-gate-notice p { margin: 0 0 .6em; }
.wcbw-gate-notice .wcbw-gate-actions { margin: 0; display: flex; gap: 1em; justify-content: center; align-items: center; flex-wrap: wrap; }
.wcbw-gate-notice .wcbw-gate-login { text-decoration: underline; }

/* The registration form inside a gate notice (card panel / booking-terms card): compact, full width,
   fits a phone column. Overrides the modal-sized rules above. */
.wcbw-gate-notice { padding: .9em .6em 1em; }
.wcbw-gate-notice > p { max-width: 36em; margin: 0 auto .5em; }
.wcbw-gate-notice .subscription-container {
    width: 100% !important; max-width: 440px; margin: 0 auto !important; padding: .75em .9em !important;
    box-sizing: border-box; border-style: solid; border-width: 1px; border-color: rgba(68,99,68,.35);
    box-shadow: none; background: #fff; z-index: auto;
}
.wcbw-gate-notice .subscription-heading-group { margin: 0 0 .6em; display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .4em 1em; }
.wcbw-gate-notice .subscription-heading { font-size: 1.05em !important; }
.wcbw-gate-notice .user-login { font-size: .9em; order: 2; }
.wcbw-gate-notice .user-login a { text-decoration: underline; }
.wcbw-gate-notice .subscription-button-group { gap: .6em; }
.wcbw-gate-notice .subscription-form input[type="email"],
.wcbw-gate-notice .subscription-form input[type="text"],
.wcbw-gate-notice .subscription-form input[type="password"] {
    width: 100%; box-sizing: border-box; font-size: 16px; /* 16px: no zoom on iPhone */ padding: .55em .7em; border: 1px solid #b9c4b9; border-radius: 6px;
}
.wcbw-gate-notice .password-input-wrapper { display: flex; align-items: center; gap: .3em; width: 100%; }
.wcbw-gate-notice .subscription-submit-button { width: 100%; padding: .6em 1em; font-size: 1em; border-radius: 6px; }
.wcbw-gate-notice .wcbw-sub-privacy, .wcbw-gate-notice .wcbw-sub-rules { text-align: center; margin-top: .2em; }
.wcbw-gate-notice .message-container { width: 100%; }
@media (max-width: 480px) {
    .wcbw-gate-notice { padding: .7em .3em .8em; border-left: 0; border-right: 0; border-radius: 0; }
    .wcbw-gate-notice .subscription-container { padding: .6em .6em !important; }
}

/* BRAND COLOURS (Anthony, 18 Oct 2026): the form uses site/brand.css tokens; only the error
   message keeps its own red. Overrides the theme's link/button colours inside the form. */
.wcbw-gate-notice { border-color: var(--color-primary, #528377); background: var(--color-brochure-block-bg, #f3f6fc); color: var(--color-text-dark, #333); }
.wcbw-gate-notice .subscription-container { border-color: var(--color-border, #ddd); }
.subscription-container .subscription-heading { color: var(--color-primary-dark, #3f6058) !important; font-family: inherit !important; }
.subscription-container .user-login a,
.subscription-container .resend-new-code-link,
.subscription-container .wcbw-sub-privacy a,
.subscription-container .wcbw-sub-rules a,
.subscription-container .generate-password { color: var(--color-link, #2b678e) !important; text-decoration: underline; font-size: .9em; font-weight: 400; }
.subscription-container .user-login a:hover,
.subscription-container .resend-new-code-link:hover { color: var(--color-primary-dark, #3f6058) !important; }
.subscription-container .send-new-code-button-div { text-align: right; margin: 0; }
.subscription-container .subscription-form input[type="email"],
.subscription-container .subscription-form input[type="text"],
.subscription-container .subscription-form input[type="password"] {
    border: 1px solid var(--color-border-input, #ccc) !important; border-radius: 6px; background: var(--color-white, #fff); color: var(--color-text-dark, #333);
    letter-spacing: normal; font-weight: 400; text-align: left; box-shadow: none;
}
.subscription-container .subscription-form input[name="confirmation_code"] { text-align: center; letter-spacing: .2em; font-weight: 600; }
.subscription-container .subscription-form input:focus { outline: 2px solid var(--color-primary, #528377); outline-offset: 1px; border-color: var(--color-primary, #528377) !important; }
.subscription-container .subscription-submit-button,
.subscription-container a.subscription-submit-button {
    background: var(--color-primary, #528377) !important; color: var(--color-white, #fff) !important; border: 1px solid var(--color-primary-dark, #3f6058) !important;
    border-radius: 6px; font-weight: 600; cursor: pointer;
}
.subscription-container .subscription-submit-button:hover,
.subscription-container a.subscription-submit-button:hover { background: var(--color-primary-dark, #3f6058) !important; }
.subscription-container .toggle-password { color: var(--color-primary, #528377); }
.subscription-container .message-display.success { background: var(--color-admonition-bg, rgba(228,255,188,.7)); border-color: var(--color-admonition-border, #B6D7A8); color: var(--color-text-dark, #333); }
/* errors: their own scheme, unchanged */

/* help under a refusal (step 1): chat + contact */
.subscription-container .message-display .wcbw-sub-help { margin: .6em 0 0; display: flex; gap: .6em; justify-content: center; flex-wrap: wrap; align-items: center; }
.subscription-container .message-display .wcbw-sub-help-chat { background: var(--color-primary, #528377); color: #fff; border: 0; border-radius: 6px; padding: .4em .9em; font-size: .9em; cursor: pointer; }
.subscription-container .message-display .wcbw-sub-help-chat:hover { background: var(--color-primary-dark, #3f6058); }
.subscription-container .message-display .wcbw-sub-help-contact { color: var(--color-link, #2b678e) !important; text-decoration: underline; font-size: .9em; }

/* links inside a message (e.g. "Log in here" under "already registered"): brand link colour */
.subscription-container .message-display a { color: var(--color-link, #2b678e) !important; text-decoration: underline; }
.subscription-container .message-display a:hover { color: var(--color-primary-dark, #3f6058) !important; }

/* member chip (profile.php): top right of every page for a logged-in member */
.wcbw-member-chip { position: fixed; top: 10px; right: 10px; z-index: 1200; display: flex; align-items: center; gap: .6em; padding: .25em .6em .25em .3em; background: rgba(255,255,255,.95); border: 1px solid var(--color-border, #ddd); border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.12); font-size: .85em; }
.wcbw-member-chip a { color: var(--color-primary-dark, #3f6058) !important; text-decoration: none; display: inline-flex; align-items: center; gap: .4em; }
.wcbw-member-chip a:hover { text-decoration: underline; }
.wcbw-member-chip .wcbw-member-chip-avatar { width: 28px; height: 28px; border-radius: 50%; }
.wcbw-member-chip .wcbw-member-chip-logout { border-left: 1px solid var(--color-border, #ddd); padding-left: .6em; color: var(--color-link, #2b678e) !important; }
@media (max-width: 600px) { .wcbw-member-chip .wcbw-member-chip-name { display: none; } }
@media print { .wcbw-member-chip { display: none; } }