/* ==========================================================================
   Full-page split-screen auth layout (login & register)
   Green theme — Glenburn Tea Direct
   ========================================================================== */

.wcwrp-auth-body {
        margin: 0;
        padding: 0;
        background: #f4f7f0;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        color: #1f2937;
        -webkit-font-smoothing: antialiased;
}

.wcwrp-auth {
        display: flex;
        min-height: 100vh;
        width: 100%;
}

/* Left branding panel */
.wcwrp-auth__brand {
        flex: 1 1 50%;
        background: linear-gradient(150deg, #2f5a1c 0%, #4e8a2e 55%, #5fa235 100%);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 56px;
        position: relative;
        overflow: hidden;
}

.wcwrp-auth__brand::after {
        content: "";
        position: absolute;
        right: -120px;
        bottom: -120px;
        width: 360px;
        height: 360px;
        background: rgba(255, 255, 255, 0.07);
        border-radius: 50%;
}

.wcwrp-auth__brand::before {
        content: "";
        position: absolute;
        left: -80px;
        top: -80px;
        width: 240px;
        height: 240px;
        background: rgba(255, 255, 255, 0.05);
        border-radius: 50%;
}

/* Optional background image behind a green overlay */
.wcwrp-auth__brand[data-has-image] {
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
}

.wcwrp-auth__brand-overlay {
        display: none;
}

.wcwrp-auth__brand[data-has-image] .wcwrp-auth__brand-overlay {
        display: block;
        position: absolute;
        inset: 0;
        z-index: 0;
        background: linear-gradient(150deg, rgba(47, 90, 28, 0.92) 0%, rgba(78, 138, 46, 0.88) 55%, rgba(95, 162, 53, 0.85) 100%);
}

.wcwrp-auth__brand-inner {
        position: relative;
        z-index: 1;
        max-width: 460px;
        width: 100%;
}

/* "What happens after you register" steps */
.wcwrp-auth__steps {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 22px;
}

.wcwrp-auth__steps li {
        display: flex;
        align-items: flex-start;
        gap: 16px;
}

.wcwrp-auth__step-num {
        flex: 0 0 auto;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
        border: 1px solid rgba(255, 255, 255, 0.4);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 15px;
}

.wcwrp-auth__step-body {
        display: flex;
        flex-direction: column;
        gap: 3px;
}

.wcwrp-auth__step-title {
        font-weight: 700;
        font-size: 16px;
        color: #fff;
}

.wcwrp-auth__step-text {
        font-size: 14px;
        line-height: 1.55;
        color: rgba(255, 255, 255, 0.85);
}

.wcwrp-auth__brand-logo {
        margin-bottom: 32px;
}

.wcwrp-auth__brand-logo img {
        max-height: 56px;
        width: auto;
        filter: brightness(0) invert(1);
}

.wcwrp-auth__brand-name {
        font-size: 26px;
        font-weight: 800;
        letter-spacing: 0.5px;
}

.wcwrp-auth__brand-title {
        font-size: 40px;
        line-height: 1.15;
        font-weight: 800;
        margin: 0 0 16px;
        color: #fff;
}

.wcwrp-auth__brand-text {
        font-size: 17px;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.88);
        margin: 0 0 36px;
}

.wcwrp-auth__features {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
}

.wcwrp-auth__features li {
        display: flex;
        align-items: center;
        gap: 14px;
        font-size: 16px;
        font-weight: 500;
        color: rgba(255, 255, 255, 0.95);
}

.wcwrp-auth__features svg {
        flex: 0 0 auto;
        width: 22px;
        height: 22px;
        padding: 5px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
        color: #fff;
        box-sizing: content-box;
}

/* Right form panel */
.wcwrp-auth__panel {
        flex: 1 1 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 48px 40px;
        overflow-y: auto;
}

.wcwrp-auth__panel-inner {
        width: 100%;
        max-width: 460px;
}

/* Neutralise the inner card chrome when shown inside the split panel:
   the panel itself is the card surface here. */
.wcwrp-auth__panel-inner .wcwrp-login-wrap,
.wcwrp-auth__panel-inner .wcwrp-register-wrap {
        margin: 0;
        max-width: 100%;
        padding: 0;
}

.wcwrp-auth__panel-inner .wcwrp-login-card,
.wcwrp-auth__panel-inner .wcwrp-register-card {
        box-shadow: none;
        border: none;
        border-radius: 0;
        background: transparent;
}

/* The register form on a wide split panel can keep a wider feel */
.wcwrp-auth__panel-inner .wcwrp-register-wrap {
        max-width: 100%;
}

@media (max-width: 980px) {
        .wcwrp-auth {
                flex-direction: column;
        }
        .wcwrp-auth__brand {
                flex: none;
                padding: 40px 28px;
                min-height: auto;
        }
        .wcwrp-auth__brand-title {
                font-size: 30px;
        }
        .wcwrp-auth__brand-text {
                margin-bottom: 24px;
        }
        .wcwrp-auth__features {
                gap: 12px;
        }
        .wcwrp-auth__panel {
                flex: none;
                padding: 36px 22px 56px;
        }
}

@media (max-width: 600px) {
        .wcwrp-auth__brand {
                padding: 32px 22px;
        }
        .wcwrp-auth__brand-logo {
                margin-bottom: 20px;
        }
        .wcwrp-auth__brand-title {
                font-size: 26px;
        }
}

/* ==========================================================================
   My Account logged-out view (custom login + register, in-theme)
   ========================================================================== */

.wcwrp-myaccount-auth {
        display: flex;
        flex-wrap: wrap;
        gap: 28px;
        align-items: flex-start;
        margin: 0 auto;
        max-width: 1040px;
}

.wcwrp-myaccount-auth__col {
        flex: 1 1 360px;
        min-width: 300px;
        display: flex;
}

/* Make both the login and registration forms fill their column and drop
   their standalone-page centering / max-width so they sit side by side. */
.wcwrp-myaccount-auth__col .wcwrp-login-wrap,
.wcwrp-myaccount-auth__col .wcwrp-register-wrap {
        margin: 0;
        max-width: 100%;
        width: 100%;
        padding: 0;
}

.wcwrp-myaccount-auth__col .wcwrp-login-card,
.wcwrp-myaccount-auth__col .wcwrp-register-card {
        width: 100%;
}

/* Neutralise the registration card's green header bar so it matches the clean
   white login card when shown together on the My Account page. */
.wcwrp-myaccount-auth .wcwrp-register-header {
        background: #fff;
        color: #1f2937;
        text-align: left;
        padding: 32px 36px 4px;
}

.wcwrp-myaccount-auth .wcwrp-register-header h2 {
        color: #1f2937;
}

.wcwrp-myaccount-auth .wcwrp-register-header p {
        color: #6b7280;
        opacity: 1;
}

/* Both forms are right there together — hide the redundant cross-links. */
.wcwrp-myaccount-auth .wcwrp-login-footer,
.wcwrp-myaccount-auth .wcwrp-login-link {
        display: none;
}

/* ==========================================================================
   Combined tabbed auth (My Account login/register + checkout)
   Single centered card · proper tabs · green theme
   ========================================================================== */
.wcwrp-auth-tabs {
	max-width: 560px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 18px 50px rgba(31, 41, 55, 0.08);
	color: #1f2937;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.wcwrp-auth-tabs__panel { display: flex; flex-direction: column; }

/* --- Proper tabs (underline style, never button-like) --- */
.wcwrp-auth-tabs__nav {
	display: flex;
	gap: 4px;
	padding: 6px 18px 0;
	background: #f7faf3;
	border-bottom: 1px solid #e6efdb;
}
.wcwrp-auth-tabs .wcwrp-auth-tabs__tab {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: transparent !important;
	border: 0 !important;
	border-bottom: 3px solid transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none;
	margin: 0;
	padding: 16px 12px;
	min-height: 0;
	width: auto;
	height: auto;
	line-height: 1.2;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: #6b7280 !important;
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.wcwrp-auth-tabs .wcwrp-auth-tabs__tab:hover,
.wcwrp-auth-tabs .wcwrp-auth-tabs__tab:focus {
	background: transparent !important;
	color: #3c6e22 !important;
	box-shadow: none !important;
}
.wcwrp-auth-tabs .wcwrp-auth-tabs__tab svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}
.wcwrp-auth-tabs .wcwrp-auth-tabs__tab.is-active {
	color: #2f5a1c !important;
	border-bottom-color: #4e8a2e !important;
}

.wcwrp-auth-tabs__content { padding: 30px 32px 34px; }
.wcwrp-auth-tabs__content[hidden] { display: none; }

/* --- Flatten the nested login/register cards inside the tabbed panel --- */
.wcwrp-auth-tabs .wcwrp-login-wrap,
.wcwrp-auth-tabs .wcwrp-register-wrap {
	margin: 0;
	padding: 0;
	max-width: 100%;
	width: 100%;
}
.wcwrp-auth-tabs .wcwrp-login-card,
.wcwrp-auth-tabs .wcwrp-register-card {
	width: 100%;
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
}
.wcwrp-auth-tabs .wcwrp-login-header,
.wcwrp-auth-tabs .wcwrp-register-header {
	background: transparent;
	color: inherit;
	text-align: center;
	padding: 0 0 20px;
	margin: 0;
}
.wcwrp-auth-tabs .wcwrp-login-header h2,
.wcwrp-auth-tabs .wcwrp-register-header h2 {
	display: block;
	margin: 0 0 6px;
	font-size: 21px;
	font-weight: 800;
	color: #2f5a1c;
}
.wcwrp-auth-tabs .wcwrp-login-header p,
.wcwrp-auth-tabs .wcwrp-register-header p {
	margin: 0;
	color: #6b7280;
	opacity: 1;
	font-size: 14px;
}
.wcwrp-auth-tabs .wcwrp-login-footer,
.wcwrp-auth-tabs .wcwrp-login-link { display: none; }

/* --- Force green over the active theme's accent (links, toggles, controls) --- */
.wcwrp-auth-tabs .wcwrp-forgot-link,
.wcwrp-auth-tabs .wcwrp-forgot-link:hover,
.wcwrp-auth-tabs .wcwrp-auth-switch {
	color: #4e8a2e !important;
	text-decoration: none;
}
.wcwrp-auth-tabs .wcwrp-auth-switch:hover { color: #2f5a1c !important; }
.wcwrp-auth-tabs .wcwrp-toggle-password {
	color: #4e8a2e !important;
	background: transparent !important;
	border-color: #cfe3bb !important;
	box-shadow: none !important;
}
.wcwrp-auth-tabs .wcwrp-toggle-password:hover { color: #2f5a1c !important; }
.wcwrp-auth-tabs input[type="checkbox"] { accent-color: #4e8a2e; }

/* Register multi-step progress in green */
.wcwrp-auth-tabs .wcwrp-progress-fill { background: #4e8a2e !important; }
.wcwrp-auth-tabs .wcwrp-progress-step--active .wcwrp-step-num,
.wcwrp-auth-tabs .wcwrp-progress-step.is-active .wcwrp-step-num {
	background: #4e8a2e !important;
	border-color: #4e8a2e !important;
	color: #fff !important;
}
.wcwrp-auth-tabs .wcwrp-progress-step--active .wcwrp-step-label,
.wcwrp-auth-tabs .wcwrp-progress-step.is-active .wcwrp-step-label { color: #2f5a1c !important; }

/* Primary / outline buttons stay on-brand green */
.wcwrp-auth-tabs .wcwrp-btn-primary {
	background: linear-gradient(135deg, #4e8a2e 0%, #3c6e22 100%) !important;
	border-color: #3c6e22 !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(60, 110, 34, 0.25) !important;
}
.wcwrp-auth-tabs .wcwrp-btn-primary:hover {
	background: linear-gradient(135deg, #3c6e22 0%, #2f5a1c 100%) !important;
}
.wcwrp-auth-tabs .wcwrp-btn-outline {
	background: transparent !important;
	color: #3c6e22 !important;
	border: 1px solid #4e8a2e !important;
}
.wcwrp-auth-tabs .wcwrp-btn-outline:hover {
	background: #f1f8e9 !important;
	color: #2f5a1c !important;
}

/* Inputs: green focus ring */
.wcwrp-auth-tabs .wcwrp-field input:focus,
.wcwrp-auth-tabs .wcwrp-field select:focus,
.wcwrp-auth-tabs .wcwrp-field textarea:focus {
	border-color: #4e8a2e !important;
	box-shadow: 0 0 0 3px rgba(78, 138, 46, 0.15) !important;
	outline: none;
}

/* Checkout wrapper spacing */
.wcwrp-checkout-auth { margin: 0 0 30px; }

@media (max-width: 600px) {
	.wcwrp-auth-tabs__content { padding: 24px 20px 28px; }
	.wcwrp-auth-tabs__nav { padding: 6px 12px 0; }
}
