.elementor-13495 .elementor-element.elementor-element-eaac849{margin-top:55px;margin-bottom:0px;}.elementor-13495 .elementor-element.elementor-element-ea1de70{text-align:center;}.elementor-13495 .elementor-element.elementor-element-ea1de70 .elementor-heading-title{font-family:"Playfair Display";font-size:42px;letter-spacing:2px;word-spacing:0px;color:var( --e-global-color-29947e1 );}.elementor-13495 .elementor-element.elementor-element-46769c5{margin:24px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 111px 0px 111px;text-align:center;font-size:21px;}.elementor-13495 .elementor-element.elementor-element-34da58d{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0px;--margin-bottom:100px;--margin-left:0px;--margin-right:0px;}.elementor-13495 .elementor-element.elementor-element-34da58d.e-con{--align-self:center;}.elementor-13495 .elementor-element.elementor-element-49c698c{width:100%;max-width:100%;}@media(min-width:576px){.elementor-13495 .elementor-element.elementor-element-837c2c1{width:100%;}}@media(max-width:575px){.elementor-13495 .elementor-element.elementor-element-eaac849{padding:0px 25px 0px 25px;}.elementor-13495 .elementor-element.elementor-element-ea1de70 .elementor-heading-title{font-size:26px;}.elementor-13495 .elementor-element.elementor-element-46769c5{padding:0px 4px 0px 5px;text-align:center;font-size:16px;}}/* Start custom CSS for shortcode, class: .elementor-element-49c698c *//* Remove all purple borders, lines, and backgrounds */
.wf-login-tabs,
.wf-tab-btns,
.wf-tab-btn {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Tab container */
.wf-tab-btns {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-bottom: 20px;
    border-bottom: none !important;
}

/* Base styling for all tabs */
.wf-tab-btn {
    padding: 10px 28px !important;
    background: #24446B !important;     /* Inactive tab background */
    color: #ffffff !important;           /* Inactive tab text */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    border-radius: 0px !important;
    border: 1px solid #24446B !important;
    cursor: pointer;
}

/* Active tab */
.wf-tab-btn.active {
    background: #8BA4B5 !important;      /* Active background */
    color: #ffffff !important;           /* Active text color */
    border-color: #8BA4B5 !important;
}

/* Hover effect for inactive tabs */
.wf-tab-btn:not(.active):hover {
    background: #1b324a !important;      /* Slightly darker than #24446B */
    color: #ffffff !important;
}

/* Remove that long purple top border line */
.wf-login-tabs::before,
.wf-login-tabs::after {
    display: none !important;
}

/* Remove purple background from form wrapper */
#wf-login-form,
#wf-register-form {
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-34da58d *//* Apply Montserrat font to the entire form */
#wf-application-form,
#wf-application-form * {
    font-family: 'Montserrat', sans-serif !important;
}

/* RESET all plugin grid behaviors */
#wf-application-form {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 25px !important;
}

/* Remove inline grid-area that breaks layout */
#wf-application-form .wf-application-form-panel-content,
#wf-application-form .wf-application-form-panel-button {
    grid-area: unset !important;
}

/* ---- ROW LAYOUT FIX ---- */

/* First Name + Last Name = row 1 */
#wf-application-form [style*="fname"],
#wf-application-form [style*="lname"] {
    grid-column: span 1 !important;
}

/* Username + Email = row 2 */
#wf-application-form [style*="username"],
#wf-application-form [style*="email"] {
    grid-column: span 1 !important;
}

/* Website URL = full width */
#wf-application-form [style*="website"] {
    grid-column: 1 / 3 !important;
}

/* Promotion textarea = full width */
#wf-application-form [style*="promotion"] {
    grid-column: 1 / 3 !important;
}

/* Terms checkbox = full width */
#wf-application-form [style*="terms"] {
    grid-column: 1 / 3 !important;
}

/* Submit button = full width row, LEFT aligned */
.wf-application-form-panel-button {
    grid-column: 1 / 3 !important;
    justify-self: start !important;
}

/* Style button */
.wf-button {
    background: #24446B !important;
    padding: 14px 28px !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 16px !important;
    cursor: pointer;
}

/* Inputs + textarea styling */
.wf-input,
#wf-application-form textarea {
    width: 100% !important;
    padding: 12px !important;
    border: 1px solid #D4D4D4 !important;
    border-radius: 0px !important;
    font-size: 15px !important;
}

/* Disabled fields */
.wf-input:disabled {
    background: #f2f2f2 !important;
    color: #666 !important;
}

/* Responsive fix */
@media (max-width: 768px) {
    #wf-application-form {
        grid-template-columns: 1fr !important;
    }
    #wf-application-form .wf-application-form-panel-content,
    .wf-application-form-panel-button {
        grid-column: 1 / 2 !important;
    }
}
/* Make the whole form wider */
.wf-application-form-panel {
    max-width: 900px !important; /* increase to 1000px or 1100px if you want more */
    margin: 0 auto !important;   /* keep it centered */
}

/* Ensure columns stretch wider */
#wf-application-form {
    grid-template-columns: 1fr 1fr !important; /* same layout, just wider container */
}

/* Make each input fill the extra width */
.wf-input,
#wf-application-form textarea {
    width: 100% !important;
}

/* Remove vertical spacing, keep horizontal spacing */
#wf-application-form {
    column-gap: 25px !important;  /* space between the two columns */
    row-gap: 5px !important;     /* reduce vertical spacing */
}

/* Update label color + font size */
.wf-label {
    color: #69727D !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

/* Apply button text style */
.wf-button {
    color: #FFFFFF !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    border-radius: 0px !important;
    padding-left: 55px !important;
    padding-right: 55px !important;
}

/* Button hover background color */
.wf-button:hover {
    background-color: #8BA4B5 !important;
}




/* -----------------------------------
   MATCH LOGIN INPUTS TO REGISTRATION STYLE
----------------------------------- */

/* Labels */
#wf-login-form label {
    color: #69727D !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Text Inputs */
#wf-login-form input.input-text,
#wf-login-form .woocommerce-Input {
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 0px !important;
    font-size: 15px !important;
    font-family: 'Montserrat', sans-serif !important;
    background: #ffffff !important;
    color: #333 !important;
    height: 44px !important;
    box-shadow: none !important;
}

/* Focus */
#wf-login-form input.input-text:focus,
#wf-login-form .woocommerce-Input:focus {
    border-color: #a0a0a0 !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Checkbox label */
#wf-login-form .woocommerce-form__label span {
    color: #69727D !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Lost password link */
#wf-login-form .lost_password a {
    font-family: 'Montserrat', sans-serif !important;
    color: #24446B !important;
    font-size: 14px !important;
}

/* Login button (to match your Register button style) */
#wf-login-form button.woocommerce-button {
    background: #24446B !important;         /* inactive color */
    color: #FFFFFF !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    padding: 12px 28px !important;
    border-radius: 0px !important;
    border: none !important;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif !important;
}

/* Hover */
#wf-login-form button.woocommerce-button:hover {
    background: #8BA4B5 !important;
}
/* Add space between Login & Registration tabs */
.wf-tab-btns .wf-tab-btn {
    margin: 0 6px !important;  /* adjust 6px to whatever spacing you want */
}

.wf-button {
    text-align: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}



/* Inactive items text color */
.wf-dashboard-navigation ul li a {
    color: #24446B !important;        /* inactive */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
}

/* SVG icons inherit text color */
.wf-dashboard-navigation ul li a svg {
    color: currentColor !important;
    fill: currentColor !important;
}

/* Active item text color */
.wf-dashboard-navigation ul li.active a {
    color: #8BA4B5 !important;        /* active */
    font-weight: 400 !important;
    font-size: 16px !important;
}

/* Optional: On hover keep background but change text */
.wf-dashboard-navigation ul li a:hover {
    color: #8BA4B5 !important;
}

/* Remove ALL plugin borders so we start clean */
.wf-dashboard-navigation ul li,
.wf-dashboard-navigation ul li a {
    border: none !important;
    border-left: none !important;
    box-shadow: none !important;
}

/* Add your own active indicator bar */
.wf-dashboard-navigation ul li.active {
    border-left: 4px solid #8BA4B5 !important;
}
.wf-dashboard-navigation ul li:not(.active) {
    border-left: 4px solid transparent !important;
}



/* Export Report Button Theme Styling */
#wc-affiliate-export-report-btn,
button#wc-affiliate-export-report-btn {
    background-color: #24446B !important;    /* theme primary color */
    color: #FFFFFF !important;               /* white text */
    border: none !important;
    border-radius: 0 !important;             /* square corners */
    padding: 12px 24px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    display: inline-block !important;
}

/* Hover */
#wc-affiliate-export-report-btn:hover,
button#wc-affiliate-export-report-btn:hover {
    background-color: #8BA4B5 !important;    /* theme hover color */
    color: #FFFFFF !important;
}
/* Base pagination buttons */
.tablenav .pagination-links .tablenav-pages-navspan.button,
.tablenav .pagination-links .button {
    background-color: #24446B !important;   /* initial state */
    color: #FFFFFF !important;              /* icon always white */
    border: none !important;
    border-radius: 0 !important;            /* square */
    padding: 6px 12px !important;
    font-size: 18px !important;             /* bigger icons */
    font-weight: 700 !important;
    font-family: 'Montserrat', sans-serif !important;
    width: 34px !important;
    height: 34px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
}

/* Hover state */
.tablenav .pagination-links .tablenav-pages-navspan.button:not(.disabled):hover,
.tablenav .pagination-links .button:not(.disabled):hover {
    background-color: #24446B !important;   /* theme hover */
    color: #FFFFFF !important;              /* icon stays white */
}

/* "Active" state (if plugin adds it) */
.tablenav .pagination-links .tablenav-pages-navspan.button.active,
.tablenav .pagination-links .button.active {
    background-color: #24446B !important;
    color: #FFFFFF !important;
}

/* Disabled state */
.tablenav .pagination-links .tablenav-pages-navspan.button.disabled {
    background-color: #24446B !important;   /* same as base */
    color: #FFFFFF !important;              /* keep white icon */
    opacity: 0.3 !important;
    cursor: not-allowed !important;
}

/* Copy URL button theme styling */
#wf-copy-long-url,
button#wf-copy-long-url,
.wf-url-copy.button {
    background-color: #24446B !important;   /* default theme color */
    color: #FFFFFF !important;               /* icon/text always white */
    border: none !important;
    border-radius: 0 !important;             /* square corners */
    padding: 10px 16px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;                                 /* space between icon & text */
}

/* Force SVG icon to be white */
#wf-copy-long-url svg,
.wf-url-copy.button svg {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
    width: 18px !important;
    height: 18px !important;
}

/* Hover effect */
#wf-copy-long-url:hover,
.wf-url-copy.button:hover {
    background-color: #8BA4B5 !important;     /* theme hover color */
    color: #FFFFFF !important;
}


/* Apply Montserrat to all elements inside the dashboard panel */
.wf-dashboard-panel,
.wf-dashboard-panel * {
    font-family: 'Montserrat', sans-serif !important;
}




/* -----------------------------------------
   DESKTOP (unchanged)
------------------------------------------ */
#wf-application-form {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 25px !important;
}

/* Full-width general fields */
#wf-application-form [style*="promotion"],
#wf-application-form [style*="terms"],
.wf-application-form-panel-button,
#wf-application-form [style*="website"] {
    grid-column: 1 / 3 !important;
}

/* -----------------------------------------
   MOBILE LAYOUT (under 768px)
------------------------------------------ */
@media (max-width: 768px) {

    #wf-application-form {
        grid-template-columns: 1fr 1fr !important;
        gap: 15px !important;
    }

    /* 1️⃣ First + Last name */
    #wf-application-form [style*="fname"],
    #wf-application-form [style*="lname"] {
        grid-column: span 1 !important;
    }

    /* 2️⃣ Username + Email in ONE row */
    #wf-application-form [style*="username"],
    #wf-application-form [style*="email"] {
        grid-column: span 1 !important;
    }

    /* 3️⃣ Password + Confirm Password */
    #wf-application-form [style*="password"],
    #wf-application-form [style*="password2"] {
        grid-column: span 1 !important;
    }

    /* 4️⃣ Website URL full width */
    #wf-application-form [style*="website"] {
        grid-column: 1 / 3 !important;
    }

    /* 5️⃣ Promotion, Terms, Button full width */
    #wf-application-form [style*="promotion"],
    #wf-application-form [style*="terms"],
    .wf-application-form-panel-button {
        grid-column: 1 / 3 !important;
    }

    /* Inputs full width */
    .wf-input,
    #wf-application-form textarea {
        width: 100% !important;
    }

    /* Button full width */
    .wf-button {
        width: 100% !important;
        text-align: center !important;
    }
    .wf-button[type="submit"],
input.wf-button[type="submit"] {
    padding-left: 25px !important;
    padding-right: 25px !important;
}

}/* End custom CSS */