/* ========================================
   SANGEETLY MY ACCOUNT LOGIN PAGE STYLES
   OyeHappy Design System Implementation
   ======================================== */

/* Import Poppins font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap');

/* Design tokens matching OyeHappy design system */
:root {
	--myaccount-bg: #ffffff;
	--myaccount-text: #333333;
	--myaccount-text-muted: #333333;
	--myaccount-input-bg: rgba(51, 51, 51, 0.024);
	--myaccount-input-border: transparent;
	--myaccount-accent: #333333;
	--myaccount-accent-dark: #1a1a1a;
	--myaccount-link: #333333;
	--myaccount-link-hover: #1a1a1a;
	--myaccount-radius: 12px;
	--myaccount-radius-button: 60px;
	--myaccount-spacing: 24px;
	--myaccount-font: 'Poppins', sans-serif;
}

/* Reset page-content wrapper for myaccount pages */
.page-content .woocommerce,
.woocommerce-template .woocommerce,
.site-main .woocommerce,
.page-content .woocommerce-account,
.woocommerce-account {
	width: 100% !important;
	max-width: 100% !important;
}

/* Ensure page-content wrapper displays correctly on myaccount pages */
article.page-content,
.page-content,
.page.type-page.status-publish.hentry {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Base wrapper selector - targets page-content and all WooCommerce wrapper classes - Mobile first */
.page-content .sangeetly-login-wrapper,
.woocommerce-template .sangeetly-login-wrapper,
.site-main .sangeetly-login-wrapper,
.page-content .woocommerce-account .sangeetly-login-wrapper,
.woocommerce-account .sangeetly-login-wrapper,
article.page-content .sangeetly-login-wrapper,
.page.type-page .sangeetly-login-wrapper,
.hentry .sangeetly-login-wrapper,
.sangeetly-login-wrapper {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: calc(100vh - 150px) !important;
	padding: 32px var(--layout-padding-horizontal) !important;
	background-color: #ffffff !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Login container - centers form content - Mobile first */
.sangeetly-login-container {
	width: 100% !important;
	max-width: 100% !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 0 !important;
	background-color: transparent !important;
	padding: 0 !important;
}

/* Login title - large, bold, dark gray, centered - Mobile first */
.sangeetly-login-title {
	font-family: var(--myaccount-font) !important;
	font-size: 24px !important;
	font-weight: 700 !important;
	color: var(--myaccount-text) !important;
	margin: 0 0 28px 0 !important;
	text-align: center !important;
	line-height: 1.2 !important;
	width: 100% !important;
	letter-spacing: 0 !important;
}

.sangeetly-login-title span {
	display: inline-block;
}

/* Lost password description text (OyeHappy style) */
.sangeetly-lost-password-description {
	font-family: var(--myaccount-font) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: var(--myaccount-text) !important;
	line-height: 1.6 !important;
	margin: 0 0 24px 0 !important;
	text-align: center !important;
	width: 100% !important;
}

/* Login form container */
.sangeetly-login-form {
	width: 100% !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

/* Form row spacing - consistent vertical spacing between inputs - Mobile first */
.sangeetly-form-row {
	margin: 0 0 18px 0 !important;
	padding: 0 !important;
	width: 100% !important;
}

.sangeetly-form-row:last-of-type {
	margin-bottom: 0 !important;
}

/* First Name and Last Name side-by-side layout */
.sangeetly-login-form .form-row-first,
.sangeetly-login-form .form-row-last {
	width: 100% !important;
	margin-bottom: 16px !important;
}

@media (min-width: 425px) {
	.sangeetly-login-form .form-row-first,
	.sangeetly-login-form .form-row-last {
		display: inline-block !important;
		vertical-align: top !important;
	}

	.sangeetly-login-form .form-row-first {
		margin-right: 16px !important;
	}

	.sangeetly-login-form .form-row-last {
		margin-right: 0 !important;
	}
}

/* Privacy Policy Text Styling on Registration Form */
.sangeetly-login-form .woocommerce-privacy-policy-text {
	margin: 24px 0 0 0 !important;
	padding: 0 !important;
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1.6 !important;
	color: var(--myaccount-text-muted) !important;
	text-align: left !important;
	width: 100% !important;
}

.sangeetly-login-form .woocommerce-privacy-policy-text p {
	margin: 0 0 8px 0 !important;
	padding: 0 !important;
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: var(--myaccount-text-muted) !important;
}

.sangeetly-login-form .woocommerce-privacy-policy-text p:last-child {
	margin-bottom: 0 !important;
}

.sangeetly-login-form .woocommerce-privacy-policy-text a {
	color: var(--myaccount-link) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
	transition: color 0.2s ease !important;
}

.sangeetly-login-form .woocommerce-privacy-policy-text a:hover,
.sangeetly-login-form .woocommerce-privacy-policy-text a:focus {
	color: var(--myaccount-link-hover) !important;
	text-decoration: underline !important;
}

/* Input fields - OyeHappy style: 12px radius, subtle gray background, Poppins font - Mobile first */
.sangeetly-input {
	width: 100% !important;
	padding: 14px 20px !important;
	border: 0 !important;
	border-radius: var(--myaccount-radius) !important;
	background-color: var(--myaccount-input-bg) !important;
	color: var(--myaccount-text) !important;
	font-family: var(--myaccount-font) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	box-sizing: border-box !important;
	transition: background-color 0.2s ease !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.sangeetly-input::placeholder {
	color: var(--myaccount-text-muted) !important;
	opacity: 0.6 !important;
}

.sangeetly-input:focus {
	outline: none !important;
	background-color: rgba(51, 51, 51, 0.04) !important;
	box-shadow: none !important;
}

.sangeetly-input:hover {
	background-color: rgba(51, 51, 51, 0.035) !important;
}

/* Hide labels visually but keep for accessibility */
.sangeetly-form-row .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* Forgot password link - left-aligned, underlined, dark gray (OyeHappy style) - Mobile first */
.sangeetly-forgot-password {
	margin: 0 0 20px 0 !important;
	padding: 0 !important;
	text-align: left !important;
	width: 100% !important;
}

.sangeetly-forgot-password-link {
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: var(--myaccount-link) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
	transition: color 0.2s ease !important;
	display: inline-block !important;
}

.sangeetly-forgot-password-link:hover,
.sangeetly-forgot-password-link:focus {
	color: var(--myaccount-link-hover) !important;
	text-decoration: underline !important;
}

/* Login actions container - button and create account link side by side - Mobile first */
.sangeetly-login-actions {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	gap: 12px !important;
	width: 100% !important;
	margin: 0 0 28px 0 !important;
	padding: 0 !important;
	flex-wrap: wrap !important;
}

/* Sign in button - OyeHappy style: dark gray background, 60px radius, 18px 26px padding, 14.6px font - Mobile first */
.sangeetly-sign-in-button {
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.3px !important;
	color: #ffffff !important;
	background-color: var(--myaccount-accent) !important;
	border: none !important;
	border-radius: var(--myaccount-radius-button) !important;
	padding: 16px 24px !important;
	min-height: 48px !important;
	cursor: pointer !important;
	transition: background-color 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.sangeetly-sign-in-button:hover,
.sangeetly-sign-in-button:focus {
	background-color: var(--myaccount-accent-dark) !important;
	outline: none !important;
	box-shadow: none !important;
	transform: none !important;
}

.sangeetly-sign-in-button:active {
	background-color: #000000 !important;
}

/* Create account link - dark gray text, uppercase, not underlined, next to button (OyeHappy style) - Mobile first */
.sangeetly-create-account-link {
	font-family: var(--myaccount-font) !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.3px !important;
	color: var(--myaccount-accent) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
	display: inline-block !important;
	white-space: nowrap !important;
	text-align: center !important;
	width: 100% !important;
}

.sangeetly-create-account-link:hover,
.sangeetly-create-account-link:focus {
	color: var(--myaccount-accent-dark) !important;
	text-decoration: none !important;
	outline: none !important;
}

/* Return to Store link - bottom center, dark gray, underlined, with left arrow icon (OyeHappy style) */
.sangeetly-return-to-store {
	margin: 0 !important;
	padding: 0 !important;
	text-align: center !important;
	width: 100% !important;
	margin-top: 0 !important;
}

.sangeetly-return-link {
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: var(--myaccount-link) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	transition: color 0.2s ease !important;
}

.sangeetly-return-link:hover,
.sangeetly-return-link:focus {
	color: var(--myaccount-link-hover) !important;
	text-decoration: underline !important;
	outline: none !important;
}

/* Return icon - curved left arrow */
.sangeetly-return-icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: transform 0.2s ease;
	order: -1;
}

.sangeetly-return-link:hover .sangeetly-return-icon {
	transform: translateX(-2px);
}

/* Responsive adjustments - Tablet and up */
@media (min-width: 768px) {
	.page-content .sangeetly-login-wrapper,
	.woocommerce-template .sangeetly-login-wrapper,
	.site-main .sangeetly-login-wrapper,
	.page-content .woocommerce-account .sangeetly-login-wrapper,
	.woocommerce-account .sangeetly-login-wrapper,
	.sangeetly-login-wrapper {
		padding: 48px var(--layout-padding-horizontal) !important;
		min-height: calc(100vh - 200px) !important;
	}

	.sangeetly-login-container {
		max-width: 400px !important;
	}

	.sangeetly-login-title {
		font-size: 30px !important;
		margin-bottom: 30px !important;
	}

	.sangeetly-form-row {
		margin-bottom: 16px !important;
	}

	.sangeetly-input {
		padding: 16px 26px !important;
		font-size: 16px !important;
	}

	.sangeetly-forgot-password {
		margin-bottom: 24px !important;
	}

	.sangeetly-login-actions {
		flex-direction: row !important;
		align-items: center !important;
		gap: 16px !important;
		margin-bottom: 32px !important;
	}

	.sangeetly-sign-in-button {
		width: auto !important;
		padding: 18px 26px !important;
		font-size: 14.6px !important;
		flex: 0 0 auto !important;
	}

	.sangeetly-create-account-link {
		width: auto !important;
		font-size: 14.6px !important;
		text-align: left !important;
		flex: 0 0 auto !important;
	}
}

/* Responsive adjustments - Desktop */
@media (min-width: 1024px) {
	.page-content .sangeetly-login-wrapper,
	.woocommerce-template .sangeetly-login-wrapper,
	.site-main .sangeetly-login-wrapper,
	.page-content .woocommerce-account .sangeetly-login-wrapper,
	.woocommerce-account .sangeetly-login-wrapper,
	.sangeetly-login-wrapper {
		padding: 60px var(--layout-padding-horizontal) !important;
	}

	.sangeetly-login-container {
		max-width: 420px !important;
	}

	.sangeetly-login-title {
		font-size: 35px !important;
		margin-bottom: 32px !important;
	}

	.sangeetly-input {
		padding: 16px 26px !important;
	}

	.sangeetly-sign-in-button {
		padding: 18px 26px !important;
		font-size: 14.6px !important;
	}
}

/* Error and success message styling */
.page-content .sangeetly-login-wrapper .woocommerce-error,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-error,
.site-main .sangeetly-login-wrapper .woocommerce-error,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-error,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-error,
.sangeetly-login-wrapper .woocommerce-error,
.page-content .sangeetly-login-wrapper .woocommerce-message,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-message,
.site-main .sangeetly-login-wrapper .woocommerce-message,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-message,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-message,
.sangeetly-login-wrapper .woocommerce-message,
.page-content .sangeetly-login-wrapper .woocommerce-info,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-info,
.site-main .sangeetly-login-wrapper .woocommerce-info,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-info,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-info,
.sangeetly-login-wrapper .woocommerce-info {
	font-family: var(--myaccount-font) !important;
	font-size: 14px !important;
	padding: 12px 16px !important;
	border-radius: var(--myaccount-radius) !important;
	margin-bottom: 20px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.page-content .sangeetly-login-wrapper .woocommerce-error,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-error,
.site-main .sangeetly-login-wrapper .woocommerce-error,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-error,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-error,
.sangeetly-login-wrapper .woocommerce-error {
	background-color: #fee !important;
	border-left: 3px solid #dc3545 !important;
	color: #721c24 !important;
}

.page-content .sangeetly-login-wrapper .woocommerce-message,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-message,
.site-main .sangeetly-login-wrapper .woocommerce-message,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-message,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-message,
.sangeetly-login-wrapper .woocommerce-message,
.page-content .sangeetly-login-wrapper .woocommerce-info,
.woocommerce-template .sangeetly-login-wrapper .woocommerce-info,
.site-main .sangeetly-login-wrapper .woocommerce-info,
.page-content .woocommerce-account .sangeetly-login-wrapper .woocommerce-info,
.woocommerce-account .sangeetly-login-wrapper .woocommerce-info,
.sangeetly-login-wrapper .woocommerce-info {
	background-color: #e7f5e7 !important;
	border-left: 3px solid #28a745 !important;
	color: #155724 !important;
}

/* Ensure form validation styling matches OyeHappy theme */
.sangeetly-input:invalid:not(:placeholder-shown) {
	border: 1px solid #dc3545 !important;
	background-color: rgba(220, 53, 69, 0.05) !important;
}

.sangeetly-input:valid:not(:placeholder-shown) {
	border: 1px solid #28a745 !important;
	background-color: rgba(40, 167, 69, 0.05) !important;
}

/* Loading state for button */
.sangeetly-sign-in-button:disabled {
	opacity: 0.6 !important;
	cursor: not-allowed !important;
	transform: none !important;
}

.sangeetly-sign-in-button:disabled:hover {
	transform: none !important;
	box-shadow: none !important;
}

/* ========================================
   MY ACCOUNT PAGE STYLES (LOGGED IN)
   ======================================== */

/* My Account wrapper - contains navigation and content - Mobile first */
.page-content .sangeetly-myaccount-wrapper,
.woocommerce-template .sangeetly-myaccount-wrapper,
.site-main .sangeetly-myaccount-wrapper,
.page-content .woocommerce-account .sangeetly-myaccount-wrapper,
.woocommerce-account .sangeetly-myaccount-wrapper,
.sangeetly-myaccount-wrapper {
	width: 100%;
	max-width: 100%;
	padding: 24px var(--layout-padding-horizontal);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* My Account Content wrapper - main content area */
.page-content .woocommerce-MyAccount-content,
.woocommerce-template .woocommerce-MyAccount-content,
.site-main .woocommerce-MyAccount-content,
.page-content .sangeetly-myaccount-content,
.woocommerce-template .sangeetly-myaccount-content,
.site-main .sangeetly-myaccount-content,
.woocommerce-MyAccount-content,
.sangeetly-myaccount-content {
	width: 100%;
	max-width: 100%;
	font-family: var(--myaccount-font);
	color: var(--myaccount-text);
	background-color: var(--myaccount-bg);
	box-sizing: border-box;
}

/* My Account Navigation */
.page-content .woocommerce-MyAccount-navigation,
.woocommerce-template .woocommerce-MyAccount-navigation,
.site-main .woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-navigation {
	width: 100%;
	margin-bottom: 0;
}

.page-content .woocommerce-MyAccount-navigation ul,
.woocommerce-template .woocommerce-MyAccount-navigation ul,
.site-main .woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	border-bottom: 1px solid var(--myaccount-input-border);
}

.page-content .woocommerce-MyAccount-navigation ul li,
.woocommerce-template .woocommerce-MyAccount-navigation ul li,
.site-main .woocommerce-MyAccount-navigation ul li,
.woocommerce-MyAccount-navigation ul li {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--myaccount-input-border);
}

.page-content .woocommerce-MyAccount-navigation ul li:last-child,
.woocommerce-template .woocommerce-MyAccount-navigation ul li:last-child,
.site-main .woocommerce-MyAccount-navigation ul li:last-child,
.woocommerce-MyAccount-navigation ul li:last-child {
	border-bottom: none;
}

.page-content .woocommerce-MyAccount-navigation ul li a,
.woocommerce-template .woocommerce-MyAccount-navigation ul li a,
.site-main .woocommerce-MyAccount-navigation ul li a,
.woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 16px 20px;
	font-family: var(--myaccount-font);
	font-size: 16px;
	font-weight: 400;
	color: var(--myaccount-text);
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
	border-left: 3px solid transparent;
}

.page-content .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-template .woocommerce-MyAccount-navigation ul li.is-active a,
.site-main .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.is-active a,
.page-content .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-template .woocommerce-MyAccount-navigation ul li a:hover,
.site-main .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-MyAccount-navigation ul li a:hover {
	background-color: var(--myaccount-input-bg);
	color: var(--myaccount-accent);
	border-left-color: var(--myaccount-accent);
}

/* Dashboard and Content Area */
.page-content .woocommerce-MyAccount-content p,
.woocommerce-template .woocommerce-MyAccount-content p,
.site-main .woocommerce-MyAccount-content p,
.sangeetly-myaccount-content p,
.woocommerce-MyAccount-content p {
	font-family: var(--myaccount-font);
	font-size: 16px;
	line-height: 1.6;
	color: var(--myaccount-text);
	margin: 0 0 20px 0;
}

.page-content .woocommerce-MyAccount-content p:last-child,
.woocommerce-template .woocommerce-MyAccount-content p:last-child,
.site-main .woocommerce-MyAccount-content p:last-child,
.sangeetly-myaccount-content p:last-child,
.woocommerce-MyAccount-content p:last-child {
	margin-bottom: 0;
}

.page-content .woocommerce-MyAccount-content a,
.woocommerce-template .woocommerce-MyAccount-content a,
.site-main .woocommerce-MyAccount-content a,
.sangeetly-myaccount-content a,
.woocommerce-MyAccount-content a {
	color: var(--myaccount-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color 0.2s ease;
}

.page-content .woocommerce-MyAccount-content a:hover,
.woocommerce-template .woocommerce-MyAccount-content a:hover,
.site-main .woocommerce-MyAccount-content a:hover,
.sangeetly-myaccount-content a:hover,
.woocommerce-MyAccount-content a:hover {
	color: var(--myaccount-accent-dark);
	text-decoration: underline;
}

.page-content .woocommerce-MyAccount-content strong,
.woocommerce-template .woocommerce-MyAccount-content strong,
.site-main .woocommerce-MyAccount-content strong,
.sangeetly-myaccount-content strong,
.woocommerce-MyAccount-content strong {
	font-weight: 700;
	color: var(--myaccount-text);
}

/* Headings in My Account */
.page-content .woocommerce-MyAccount-content h2,
.woocommerce-template .woocommerce-MyAccount-content h2,
.site-main .woocommerce-MyAccount-content h2,
.sangeetly-myaccount-content h2,
.woocommerce-MyAccount-content h2,
.page-content .woocommerce-MyAccount-content h3,
.woocommerce-template .woocommerce-MyAccount-content h3,
.site-main .woocommerce-MyAccount-content h3,
.sangeetly-myaccount-content h3,
.woocommerce-MyAccount-content h3 {
	font-family: var(--myaccount-font);
	font-weight: 700;
	color: var(--myaccount-text);
	margin: 0 0 24px 0;
}

.page-content .woocommerce-MyAccount-content h2,
.woocommerce-template .woocommerce-MyAccount-content h2,
.site-main .woocommerce-MyAccount-content h2,
.sangeetly-myaccount-content h2,
.woocommerce-MyAccount-content h2 {
	font-size: clamp(24px, 3vw, 28px);
}

.page-content .woocommerce-MyAccount-content h3,
.woocommerce-template .woocommerce-MyAccount-content h3,
.site-main .woocommerce-MyAccount-content h3,
.sangeetly-myaccount-content h3,
.woocommerce-MyAccount-content h3 {
	font-size: clamp(20px, 2.5vw, 24px);
}

/* Forms in My Account */
.page-content .woocommerce-MyAccount-content form,
.woocommerce-template .woocommerce-MyAccount-content form,
.site-main .woocommerce-MyAccount-content form,
.sangeetly-myaccount-content form,
.woocommerce-MyAccount-content form {
	width: 100%;
	max-width: 100%;
}

.page-content .woocommerce-MyAccount-content .form-row,
.woocommerce-template .woocommerce-MyAccount-content .form-row,
.site-main .woocommerce-MyAccount-content .form-row,
.sangeetly-myaccount-content .form-row,
.woocommerce-MyAccount-content .form-row {
	margin-bottom: 20px;
	width: 100%;
}

.page-content .woocommerce-MyAccount-content .form-row label,
.woocommerce-template .woocommerce-MyAccount-content .form-row label,
.site-main .woocommerce-MyAccount-content .form-row label,
.sangeetly-myaccount-content .form-row label,
.woocommerce-MyAccount-content .form-row label {
	display: block;
	font-family: var(--myaccount-font);
	font-size: 14px;
	font-weight: 600;
	color: var(--myaccount-text);
	margin-bottom: 8px;
}

.page-content .woocommerce-MyAccount-content input[type="text"],
.page-content .woocommerce-MyAccount-content input[type="email"],
.page-content .woocommerce-MyAccount-content input[type="password"],
.page-content .woocommerce-MyAccount-content input[type="tel"],
.page-content .woocommerce-MyAccount-content input[type="url"],
.page-content .woocommerce-MyAccount-content textarea,
.page-content .woocommerce-MyAccount-content select,
.woocommerce-template .woocommerce-MyAccount-content input[type="text"],
.woocommerce-template .woocommerce-MyAccount-content input[type="email"],
.woocommerce-template .woocommerce-MyAccount-content input[type="password"],
.woocommerce-template .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-template .woocommerce-MyAccount-content input[type="url"],
.woocommerce-template .woocommerce-MyAccount-content textarea,
.woocommerce-template .woocommerce-MyAccount-content select,
.site-main .woocommerce-MyAccount-content input[type="text"],
.site-main .woocommerce-MyAccount-content input[type="email"],
.site-main .woocommerce-MyAccount-content input[type="password"],
.site-main .woocommerce-MyAccount-content input[type="tel"],
.site-main .woocommerce-MyAccount-content input[type="url"],
.site-main .woocommerce-MyAccount-content textarea,
.site-main .woocommerce-MyAccount-content select,
.sangeetly-myaccount-content input[type="text"],
.sangeetly-myaccount-content input[type="email"],
.sangeetly-myaccount-content input[type="password"],
.sangeetly-myaccount-content input[type="tel"],
.sangeetly-myaccount-content input[type="url"],
.sangeetly-myaccount-content textarea,
.sangeetly-myaccount-content select,
.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="url"],
.woocommerce-MyAccount-content textarea,
.woocommerce-MyAccount-content select {
	width: 100% !important;
	padding: 14px 16px !important;
	border: none !important;
	border-radius: var(--myaccount-radius) !important;
	background-color: var(--myaccount-input-bg) !important;
	color: var(--myaccount-text) !important;
	font-family: var(--myaccount-font) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	box-sizing: border-box !important;
	transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.page-content .woocommerce-MyAccount-content input:focus,
.page-content .woocommerce-MyAccount-content textarea:focus,
.page-content .woocommerce-MyAccount-content select:focus,
.woocommerce-template .woocommerce-MyAccount-content input:focus,
.woocommerce-template .woocommerce-MyAccount-content textarea:focus,
.woocommerce-template .woocommerce-MyAccount-content select:focus,
.site-main .woocommerce-MyAccount-content input:focus,
.site-main .woocommerce-MyAccount-content textarea:focus,
.site-main .woocommerce-MyAccount-content select:focus,
.sangeetly-myaccount-content input:focus,
.sangeetly-myaccount-content textarea:focus,
.sangeetly-myaccount-content select:focus,
.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content textarea:focus,
.woocommerce-MyAccount-content select:focus {
	outline: none !important;
	background-color: #ffffff !important;
	box-shadow: 0 0 0 2px var(--myaccount-accent) !important;
}

.page-content .woocommerce-MyAccount-content textarea,
.woocommerce-template .woocommerce-MyAccount-content textarea,
.site-main .woocommerce-MyAccount-content textarea,
.sangeetly-myaccount-content textarea,
.woocommerce-MyAccount-content textarea {
	min-height: 120px;
	resize: vertical;
}

/* Buttons in My Account */
.page-content .woocommerce-MyAccount-content .button,
.woocommerce-template .woocommerce-MyAccount-content .button,
.site-main .woocommerce-MyAccount-content .button,
.sangeetly-myaccount-content .button,
.woocommerce-MyAccount-content .button,
.page-content .woocommerce-MyAccount-content button[type="submit"],
.woocommerce-template .woocommerce-MyAccount-content button[type="submit"],
.site-main .woocommerce-MyAccount-content button[type="submit"],
.sangeetly-myaccount-content button[type="submit"],
.woocommerce-MyAccount-content button[type="submit"] {
	font-family: var(--myaccount-font) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
	background-color: var(--myaccount-accent) !important;
	border: none !important;
	border-radius: var(--myaccount-radius-button) !important;
	padding: 14px 32px !important;
	min-height: 48px !important;
	cursor: pointer !important;
	transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
}

.page-content .woocommerce-MyAccount-content .button:hover,
.woocommerce-template .woocommerce-MyAccount-content .button:hover,
.site-main .woocommerce-MyAccount-content .button:hover,
.sangeetly-myaccount-content .button:hover,
.woocommerce-MyAccount-content .button:hover,
.page-content .woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-template .woocommerce-MyAccount-content button[type="submit"]:hover,
.site-main .woocommerce-MyAccount-content button[type="submit"]:hover,
.sangeetly-myaccount-content button[type="submit"]:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover {
	background-color: var(--myaccount-accent-dark) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(163, 225, 255, 0.3) !important;
}

/* Tables in My Account (Orders, Downloads) */
.page-content .woocommerce-MyAccount-content table,
.woocommerce-template .woocommerce-MyAccount-content table,
.site-main .woocommerce-MyAccount-content table,
.sangeetly-myaccount-content table,
.woocommerce-MyAccount-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 24px 0;
}

.page-content .woocommerce-MyAccount-content table th,
.woocommerce-template .woocommerce-MyAccount-content table th,
.site-main .woocommerce-MyAccount-content table th,
.sangeetly-myaccount-content table th,
.woocommerce-MyAccount-content table th,
.page-content .woocommerce-MyAccount-content table td,
.woocommerce-template .woocommerce-MyAccount-content table td,
.site-main .woocommerce-MyAccount-content table td,
.sangeetly-myaccount-content table td,
.woocommerce-MyAccount-content table td {
	padding: 14px 16px;
	border-bottom: 1px solid var(--myaccount-input-border);
	font-family: var(--myaccount-font);
	font-size: 15px;
	color: var(--myaccount-text);
	text-align: left;
}

.page-content .woocommerce-MyAccount-content table th,
.woocommerce-template .woocommerce-MyAccount-content table th,
.site-main .woocommerce-MyAccount-content table th,
.sangeetly-myaccount-content table th,
.woocommerce-MyAccount-content table th {
	font-weight: 700;
	color: var(--myaccount-text);
	background-color: var(--myaccount-input-bg);
}

.page-content .woocommerce-MyAccount-content table tr:last-child td,
.woocommerce-template .woocommerce-MyAccount-content table tr:last-child td,
.site-main .woocommerce-MyAccount-content table tr:last-child td,
.sangeetly-myaccount-content table tr:last-child td,
.woocommerce-MyAccount-content table tr:last-child td {
	border-bottom: none;
}

/* My Account Navigation - Mobile first (horizontal scroll on mobile) */
.page-content .woocommerce-MyAccount-navigation ul,
.woocommerce-template .woocommerce-MyAccount-navigation ul,
.site-main .woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-navigation ul {
	flex-direction: row;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.page-content .woocommerce-MyAccount-navigation ul::-webkit-scrollbar,
.woocommerce-template .woocommerce-MyAccount-navigation ul::-webkit-scrollbar,
.site-main .woocommerce-MyAccount-navigation ul::-webkit-scrollbar,
.woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
	display: none;
}

.page-content .woocommerce-MyAccount-navigation ul li,
.woocommerce-template .woocommerce-MyAccount-navigation ul li,
.site-main .woocommerce-MyAccount-navigation ul li,
.woocommerce-MyAccount-navigation ul li {
	flex-shrink: 0;
	border-bottom: none;
	border-right: 1px solid var(--myaccount-input-border);
}

.page-content .woocommerce-MyAccount-navigation ul li a,
.woocommerce-template .woocommerce-MyAccount-navigation ul li a,
.site-main .woocommerce-MyAccount-navigation ul li a,
.woocommerce-MyAccount-navigation ul li a {
	padding: 12px 16px;
	font-size: 14px;
	white-space: nowrap;
	border-left: none;
	border-bottom: 3px solid transparent;
}

.page-content .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-template .woocommerce-MyAccount-navigation ul li.is-active a,
.site-main .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.is-active a {
	border-bottom-color: var(--myaccount-accent);
	border-left: none;
}

/* Responsive adjustments for My Account - Tablet and up */
@media (min-width: 768px) {
	.page-content .sangeetly-myaccount-wrapper,
	.woocommerce-template .sangeetly-myaccount-wrapper,
	.site-main .sangeetly-myaccount-wrapper,
	.page-content .woocommerce-account .sangeetly-myaccount-wrapper,
	.woocommerce-account .sangeetly-myaccount-wrapper,
	.sangeetly-myaccount-wrapper {
		flex-direction: row;
		align-items: flex-start;
		gap: 48px;
		padding: 40px var(--layout-padding-horizontal);
	}

	.page-content .woocommerce-MyAccount-navigation,
	.woocommerce-template .woocommerce-MyAccount-navigation,
	.site-main .woocommerce-MyAccount-navigation,
	.woocommerce-MyAccount-navigation {
		width: 240px;
		flex-shrink: 0;
	}

	.page-content .woocommerce-MyAccount-navigation ul,
	.woocommerce-template .woocommerce-MyAccount-navigation ul,
	.site-main .woocommerce-MyAccount-navigation ul,
	.woocommerce-MyAccount-navigation ul {
		flex-direction: column;
		overflow-x: visible;
	}

	.page-content .woocommerce-MyAccount-navigation ul li,
	.woocommerce-template .woocommerce-MyAccount-navigation ul li,
	.site-main .woocommerce-MyAccount-navigation ul li,
	.woocommerce-MyAccount-navigation ul li {
		border-right: none;
		border-bottom: 1px solid var(--myaccount-input-border);
	}

	.page-content .woocommerce-MyAccount-navigation ul li a,
	.woocommerce-template .woocommerce-MyAccount-navigation ul li a,
	.site-main .woocommerce-MyAccount-navigation ul li a,
	.woocommerce-MyAccount-navigation ul li a {
		padding: 16px 20px;
		font-size: 16px;
		border-bottom: none;
		border-left: 3px solid transparent;
	}

	.page-content .woocommerce-MyAccount-navigation ul li.is-active a,
	.woocommerce-template .woocommerce-MyAccount-navigation ul li.is-active a,
	.site-main .woocommerce-MyAccount-navigation ul li.is-active a,
	.woocommerce-MyAccount-navigation ul li.is-active a {
		border-left-color: var(--myaccount-accent);
		border-bottom: none;
	}

	.page-content .woocommerce-MyAccount-content,
	.woocommerce-template .woocommerce-MyAccount-content,
	.site-main .woocommerce-MyAccount-content,
	.page-content .sangeetly-myaccount-content,
	.woocommerce-template .sangeetly-myaccount-content,
	.site-main .sangeetly-myaccount-content,
	.woocommerce-MyAccount-content,
	.sangeetly-myaccount-content {
		flex: 1 1 auto;
		min-width: 0;
	}
}

