/**
 * Ottoman Luxury Theme - WooCommerce My Account
 * Styles for the my account page only
 */

/* Reset WooCommerce Default Styles */
body.woocommerce-account .woocommerce {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

/* Main Layout - Two Column Grid */
body.woocommerce-account .woocommerce {
	display: grid !important;
	gap: 30px !important;
	max-width: 1400px !important;
	margin: 0 auto !important;
}

/* Main Account Container (Left Sidebar) */
body.woocommerce-account .woocommerce-MyAccount-tabs {
	background: #000 !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 30px !important;
	margin-bottom: 0 !important;
	box-shadow: none !important;
	width: 100% !important;
}

/* User Profile Section */
body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile {
	display: flex !important;
	align-items: center !important;
	gap: 20px !important;
	padding: 20px !important;
	background: #1a1a1a !important;
	border: 1px solid #DBA622 !important;
	border-radius: 8px !important;
	margin-bottom: 30px !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .image {
	flex-shrink: 0 !important;
	width: auto !important;
	height: auto !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .image img {
	border: 3px solid #DBA622 !important;
	border-radius: 50% !important;
	width: 80px !important;
	height: 80px !important;
	object-fit: cover !important;
	box-shadow: 0 4px 12px rgba(219, 166, 34, 0.3) !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info {
	flex: 1 !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info .name {
	color: #DBA622 !important;
	font-family: 'Cinzel', serif !important;
	font-size: 24px !important;
	font-weight: 700 !important;
	margin: 0 0 10px 0 !important;
	text-transform: capitalize !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info a.logout {
	background: transparent !important;
	color: #DBA622 !important;
	border: 2px solid #DBA622 !important;
	padding: 8px 20px !important;
	border-radius: 6px !important;
	font-family: 'Cinzel', serif !important;
	font-size: 14px !important;
	text-decoration: none !important;
	display: inline-block !important;
	transition: all 0.3s ease !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info a.logout:hover {
	background: #DBA622 !important;
	color: #000 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(219, 166, 34, 0.4) !important;
}

/* Navigation Menu */
body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
	border: none !important;
	background: transparent !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
	background: transparent !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a {
	display: block !important;
	background: #1a1a1a !important;
	color: #fff !important;
	border: 2px solid #DBA622 !important;
	border-radius: 6px !important;
	padding: 15px 20px !important;
	font-family: 'Cinzel', serif !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
	position: relative !important;
	overflow: hidden !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a::before {
	content: '' !important;
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	height: 100% !important;
	width: 4px !important;
	background: #DBA622 !important;
	transform: scaleY(0) !important;
	transition: transform 0.3s ease !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a:hover {
	background: #DBA622 !important;
	color: #000 !important;
	transform: translateX(5px) !important;
	box-shadow: 0 4px 12px rgba(219, 166, 34, 0.4) !important;
	border: 2px solid #DBA622 !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a:hover::before {
	transform: scaleY(1) !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link.is-active a {
	background: #DBA622 !important;
	color: #000 !important;
	border: 2px solid #DBA622 !important;
}

body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link.is-active a::before {
	transform: scaleY(1) !important;
}

/* Account Content Section (Right Side) */
body.woocommerce-account .woocommerce-MyAccount-content {
	background: #000 !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 30px !important;
	box-shadow: none !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.woocommerce-account .woocommerce-MyAccount-content > p {
	color: #fff !important;
	font-size: 16px !important;
	line-height: 1.8 !important;
	margin-bottom: 20px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content > p strong {
	color: #DBA622 !important;
	font-family: 'Cinzel', serif !important;
	font-weight: 700 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content > p a {
	color: #DBA622 !important;
	text-decoration: none !important;
	border-bottom: 1px solid transparent !important;
	transition: all 0.3s ease !important;
	font-weight: 600 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content > p a:hover {
	color: #fff !important;
	border-bottom-color: #DBA622 !important;
}

/* WooCommerce Info/Notice Messages - Orders Page */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
	background: #1a1a1a !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 20px !important;
	color: #fff !important;
	font-size: 16px !important;
	margin-bottom: 20px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
	gap: 15px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info::before {
	content: '\f05a' !important;
	font-family: 'FontAwesome' !important;
	color: #DBA622 !important;
	font-size: 32px !important;
	margin-bottom: 10px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.button,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.woocommerce-Button {
	background: #DBA622 !important;
	color: #000 !important;
	border: 2px solid #DBA622 !important;
	padding: 12px 30px !important;
	border-radius: 6px !important;
	font-family: 'Cinzel', serif !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
	display: inline-block !important;
	text-transform: uppercase !important;
	margin: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.button:hover,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.woocommerce-Button:hover {
	background: #000 !important;
	color: #DBA622 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(219, 166, 34, 0.5) !important;
}

/* WooCommerce Messages and Errors */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
	background: #1a1a1a !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 20px !important;
	color: #fff !important;
	font-size: 16px !important;
	margin-bottom: 20px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
	border-color: #ff4444 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message::before {
	color: #DBA622 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error::before {
	color: #ff4444 !important;
}

/* WooCommerce Addresses Page */
body.woocommerce-account .woocommerce-MyAccount-content .u-columns.woocommerce-Addresses.addresses,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses.col2-set {
	grid-template-columns: 1fr 1fr !important;
	gap: 20px !important;
	margin-top: 20px !important;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

/* Individual address column */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .u-column1,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .u-column2,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address {
	background: #1a1a1a !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 0 !important;
	transition: all 0.3s ease !important;
	overflow: hidden !important;
	display: flex !important;
	flex-direction: column !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address:hover {
	transform: translateY(-5px) !important;
	box-shadow: 0 8px 20px rgba(219, 166, 34, 0.3) !important;
}

/* Address header section */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address header.woocommerce-Address-title {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: #DBA622 !important;
}

/* Address title h2 */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address header.woocommerce-Address-title h2 {
	color: #000 !important;
	background: transparent !important;
	font-family: 'Cinzel', serif !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	margin: 0 !important;
	padding: 15px 20px !important;
	text-transform: uppercase !important;
	text-align: center !important;
	border: none !important;
	display: block !important;
	width: 100% !important;
}

/* Hide original edit link in header */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address header.woocommerce-Address-title a.edit {
	display: none !important;
}

/* Address content */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address address {
	color: #fff !important;
	font-style: normal !important;
	font-size: 15px !important;
	line-height: 1.8 !important;
	text-align: center !important;
	padding: 30px 20px !important;
	background: #1a1a1a !important;
	border: none !important;
	margin: 0 !important;
	min-height: 100px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 1 !important;
}

/* Clickable button added by JavaScript */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address a.address-edit-button {
	display: block !important;
	background: #DBA622 !important;
	color: #000 !important;
	text-align: center !important;
	padding: 15px 20px !important;
	font-family: 'Cinzel', serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
	margin: 0 !important;
	border: none !important;
	cursor: pointer !important;
	border-bottom: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address a.address-edit-button:hover {
	background: #c99520 !important;
	color: #000 !important;
	border-bottom: none !important;
}

/* WooCommerce Edit Account Form */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account {
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	max-width: 100% !important;
}

/* Form rows */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.woocommerce-form-row {
	margin-bottom: 20px !important;
}

/* Labels */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm label {
	color: #DBA622 !important;
	font-family: 'Cinzel', serif !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	display: block !important;
	margin-bottom: 8px !important;
	text-transform: uppercase !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm label span.required {
	color: #ff4444 !important;
}

/* Input fields */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm input.woocommerce-Input.input-text {
	background: #1a1a1a !important;
	border: 2px solid #DBA622 !important;
	border-radius: 6px !important;
	color: #fff !important;
	padding: 12px 15px !important;
	font-size: 15px !important;
	width: 100% !important;
	transition: all 0.3s ease !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm input.woocommerce-Input.input-text:focus {
	border-color: #fff !important;
	background: #000 !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(219, 166, 34, 0.2) !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm input.woocommerce-Input.input-text::placeholder {
	color: #666 !important;
}

/* Display name description */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span#account_display_name_description {
	display: block !important;
	margin-top: 8px !important;
	color: #999 !important;
	font-size: 13px !important;
	font-style: italic !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span#account_display_name_description em {
	color: #999 !important;
	font-style: italic !important;
}

/* Password fieldset */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm fieldset {
	background: #1a1a1a !important;
	border: 2px solid #DBA622 !important;
	border-radius: 8px !important;
	padding: 25px !important;
	margin: 30px 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm fieldset legend {
	color: #DBA622 !important;
	font-family: 'Cinzel', serif !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	padding: 0 10px !important;
	text-transform: uppercase !important;
}

/* Password input wrapper */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span.password-input {
	position: relative !important;
	display: block !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span.password-input input {
	padding-right: 50px !important;
}

/* Show password button */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span.password-input button.show-password-input {
	position: absolute !important;
	right: 10px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	background: transparent !important;
	border: none !important;
	color: #DBA622 !important;
	cursor: pointer !important;
	padding: 5px !important;
	font-size: 18px !important;
	transition: color 0.3s ease !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm span.password-input button.show-password-input:hover {
	color: #fff !important;
}

/* Submit button */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm button.woocommerce-Button.button[name="save_account_details"] {
	background: #DBA622 !important;
	color: #000 !important;
	border: 2px solid #DBA622 !important;
	padding: 15px 40px !important;
	border-radius: 6px !important;
	font-family: 'Cinzel', serif !important;
	font-weight: 700 !important;
	font-size: 16px !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
	display: inline-block !important;
	text-transform: uppercase !important;
	margin-top: 20px !important;
	cursor: pointer !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm button.woocommerce-Button.button[name="save_account_details"]:hover {
	background: #000 !important;
	color: #DBA622 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(219, 166, 34, 0.5) !important;
}

/* Clear fix */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm .clear {
	clear: both !important;
	display: block !important;
	height: 0 !important;
}

/* Two column layout for first/last name */
body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.form-row-first {
	float: left !important;
	width: calc(50% - 10px) !important;
	margin-right: 20px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.form-row-last {
	float: left !important;
	width: calc(50% - 10px) !important;
}

body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.form-row-wide {
	width: 100% !important;
	clear: both !important;
	float: none !important;
}

/* Tablet Layout (medium screens) */
@media (max-width: 1024px) {
	body.woocommerce-account .woocommerce {
		gap: 20px !important;
		padding: 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs {
		width: 100% !important;
	}
}

/* Mobile Layout (small screens) */
@media (max-width: 768px) {
	body.woocommerce-account .woocommerce {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
		padding: 10px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs {
		width: 100% !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile {
		flex-direction: column !important;
		text-align: center !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .image {
		width: 80px !important;
		height: 80px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .image img {
		width: 80px !important;
		height: 80px !important;
		min-width: 80px !important;
		min-height: 80px !important;
		max-width: 80px !important;
		max-height: 80px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info {
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		width: 100% !important;
		padding: 0 !important;
		padding-left: 0 !important;
		margin: 0 !important;
		margin-left: 0 !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .oceanwp-user-profile .user-info a.logout {
		margin: 0 auto !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-tabs .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a {
		font-size: 14px !important;
		padding: 12px 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
		padding: 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.button,
	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.woocommerce-Button {
		padding: 10px 20px !important;
		font-size: 14px !important;
		width: 100% !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .u-columns.woocommerce-Addresses.addresses,
	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses.col2-set {
		grid-template-columns: 1fr !important;
		gap: 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address header.woocommerce-Address-title h2 {
		font-size: 14px !important;
		padding: 12px 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address address {
		padding: 20px 15px !important;
		min-height: 80px !important;
		font-size: 14px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address a.address-edit-button {
		padding: 12px 15px !important;
		font-size: 12px !important;
	}

	/* Stack name fields on mobile */
	body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.form-row-first,
	body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm p.form-row-last {
		float: none !important;
		width: 100% !important;
		margin-right: 0 !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm fieldset {
		padding: 20px 15px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm fieldset legend {
		font-size: 16px !important;
	}

	body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm button.woocommerce-Button.button[name="save_account_details"] {
		width: 100% !important;
		padding: 12px 20px !important;
		font-size: 14px !important;
	}
}
