/*
 * DIRECT BARCODE — My Account dashboard theming + shared WooCommerce notice styling.
 * Restyles the default WooCommerce My Account UI to match the site (palette mirrors auth.css).
 * Loaded on page-myaccount.php (body.my-account-page) and page-register.php (notices only).
 */

/* Calmer dashboard background (overrides the sign-in banner from auth.css; loaded after it). */
body.my-account-page {
	background:
		radial-gradient(circle at 86% 6%, rgba(0, 158, 234, 0.12), transparent 30rem),
		radial-gradient(circle at 6% 72%, rgba(107, 209, 47, 0.06), transparent 26rem),
		linear-gradient(180deg, #02070d 0%, #03101d 50%, #03101d 100%);
}

/* Hero heading */
.my-account-page .account-hero {
	padding: clamp(48px, 5vw, 84px) 0 26px;
	border-bottom: 1px solid rgba(0, 158, 234, 0.22);
}

/* auth.css adds a dark fade overlay (.account-hero::after) for the sign-in banner; the dashboard
   wraps ALL its content in .account-hero, so drop that overlay here (it darkened the lower content). */
.my-account-page .account-hero::after {
	content: none;
}
.my-account-page .myaccount-title {
	margin: 6px 0 0;
	font-family: "Inter", Arial, sans-serif;
	font-weight: 900;
	font-style: italic;
	letter-spacing: -0.05em;
	text-transform: uppercase;
	line-height: 0.95;
	font-size: clamp(40px, 4.4vw, 76px);
	color: #fff;
}
.my-account-page .myaccount-sub {
	margin: 14px 0 0;
	max-width: 580px;
	color: rgba(255, 255, 255, 0.74);
	font-size: clamp(15px, 1vw, 18px);
	line-height: 1.6;
}

/* WooCommerce account shell -> nav + content */
.my-account-page .woocommerce {
	margin-top: clamp(28px, 3vw, 46px);
}
.my-account-page .woocommerce-account .woocommerce {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(24px, 3vw, 46px);
	align-items: flex-start;
}
.my-account-page .woocommerce-MyAccount-navigation {
	flex: 0 0 264px;
	max-width: 264px;
}
.my-account-page .woocommerce-MyAccount-content {
	flex: 1 1 320px;
	min-width: 0;
	color: rgba(255, 255, 255, 0.82);
	font-size: 15px;
	line-height: 1.65;
	padding: clamp(22px, 2.4vw, 38px);
	border: 1px solid rgba(0, 158, 234, 0.32);
	border-radius: 10px;
	background: rgba(3, 13, 24, 0.72);
	box-shadow: inset 0 0 28px rgba(0, 158, 234, 0.06);
}

/* Navigation */
.my-account-page .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 10px;
	display: grid;
	gap: 4px;
	border: 1px solid rgba(0, 158, 234, 0.32);
	border-radius: 10px;
	background: rgba(3, 13, 24, 0.72);
	box-shadow: inset 0 0 28px rgba(0, 158, 234, 0.08);
}
.my-account-page .woocommerce-MyAccount-navigation li {
	margin: 0;
}
.my-account-page .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 13px 16px;
	border-radius: 6px;
	color: rgba(255, 255, 255, 0.82);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: -0.01em;
	text-decoration: none;
	transition: background 0.18s ease, color 0.18s ease;
}
.my-account-page .woocommerce-MyAccount-navigation li a:hover {
	background: rgba(0, 158, 234, 0.1);
	color: #fff;
}
.my-account-page .woocommerce-MyAccount-navigation li.is-active a {
	color: #02070d;
	background: linear-gradient(135deg, #75e235, #55c91d);
	box-shadow: 0 0 22px rgba(107, 209, 47, 0.28);
}

/* Content typography */
.my-account-page .woocommerce-MyAccount-content a {
	color: #6bd12f;
	font-weight: 700;
	text-decoration: none;
}
.my-account-page .woocommerce-MyAccount-content a:hover {
	color: #83f043;
}
.my-account-page .woocommerce-MyAccount-content strong {
	color: #fff;
}
.my-account-page .woocommerce-MyAccount-content h2,
.my-account-page .woocommerce-MyAccount-content h3 {
	color: #fff;
	font-weight: 900;
	letter-spacing: -0.03em;
	margin: 0 0 14px;
}
.my-account-page mark {
	background: rgba(107, 209, 47, 0.2);
	color: #fff;
}

/* Tables (orders, downloads) */
.my-account-page .woocommerce table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid rgba(0, 158, 234, 0.26);
	border-radius: 8px;
	overflow: hidden;
	margin: 0 0 18px;
}
.my-account-page .woocommerce table.shop_table th,
.my-account-page .woocommerce table.shop_table td {
	padding: 14px 16px;
	text-align: left;
	border-bottom: 1px solid rgba(0, 158, 234, 0.16);
	font-size: 14px;
	color: rgba(255, 255, 255, 0.82);
}
.my-account-page .woocommerce table.shop_table th {
	color: #fff;
	font-weight: 800;
	background: rgba(0, 158, 234, 0.08);
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 0.03em;
}

/* Forms (edit account, addresses, lost password) */
.my-account-page .woocommerce form .form-row,
.my-account-page .woocommerce .form-row {
	margin: 0 0 16px;
	display: block;
}
.my-account-page .woocommerce label {
	display: block;
	margin: 0 0 8px;
	color: #fff;
	font-weight: 800;
	font-size: 13px;
}
.my-account-page .woocommerce input.input-text,
.my-account-page .woocommerce input[type="text"],
.my-account-page .woocommerce input[type="email"],
.my-account-page .woocommerce input[type="password"],
.my-account-page .woocommerce input[type="tel"],
.my-account-page .woocommerce select,
.my-account-page .woocommerce textarea {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 6px;
	background: rgba(2, 7, 13, 0.68);
	font-family: "Inter", Arial, sans-serif;
	font-size: 15px;
}
.my-account-page .woocommerce textarea {
	height: auto;
	padding: 14px 16px;
}
.my-account-page .woocommerce input:focus,
.my-account-page .woocommerce select:focus,
.my-account-page .woocommerce textarea:focus {
	outline: none;
	border-color: #009eea;
	box-shadow: 0 0 18px rgba(0, 158, 234, 0.26);
}
.my-account-page .woocommerce fieldset {
	margin: 22px 0 0;
	padding: 18px;
	border: 1px solid rgba(0, 158, 234, 0.22);
	border-radius: 8px;
}
.my-account-page .woocommerce fieldset legend {
	padding: 0 8px;
	color: #fff;
	font-weight: 900;
}
.my-account-page .woocommerce address {
	padding: 16px;
	border: 1px solid rgba(0, 158, 234, 0.22);
	border-radius: 8px;
	background: rgba(2, 7, 13, 0.4);
	color: rgba(255, 255, 255, 0.82);
	font-style: normal;
	line-height: 1.7;
}

/* Password show/hide eye on the Account-details password fields (injected by account-signin.js;
   .password-toggle button styling comes from auth.css). */
.my-account-page .woocommerce .input-shell {
	position: relative;
	display: block;
}
.my-account-page .woocommerce .input-shell > input[type="password"] {
	padding-right: 52px;
}

/* Buttons */
.my-account-page .woocommerce .button,
.my-account-page .woocommerce button.button,
.my-account-page .woocommerce input.button,
.my-account-page .woocommerce a.button,
.my-account-page .woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 26px;
	color: #02070d !important;
	border: 1px solid #6bd12f;
	border-radius: 6px;
	background: linear-gradient(135deg, #75e235, #55c91d) !important;
	box-shadow: 0 0 22px rgba(107, 209, 47, 0.25);
	font-family: "Inter", Arial, sans-serif;
	font-weight: 900;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	cursor: pointer;
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.my-account-page .woocommerce .button:hover,
.my-account-page .woocommerce button.button:hover,
.my-account-page .woocommerce input.button:hover,
.my-account-page .woocommerce a.button:hover,
.my-account-page .woocommerce-Button:hover {
	transform: translateY(-2px);
	box-shadow: 0 0 30px rgba(107, 209, 47, 0.42);
}

/* WooCommerce notices (My Account + Create Account pages) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
ul.woocommerce-error {
	list-style: none;
	margin: 0 0 18px;
	padding: 14px 16px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 700;
}
.woocommerce-message {
	color: #6bd12f;
	border: 1px solid rgba(107, 209, 47, 0.45);
	background: rgba(107, 209, 47, 0.08);
}
.woocommerce-info {
	color: #009eea;
	border: 1px solid rgba(0, 158, 234, 0.45);
	background: rgba(0, 158, 234, 0.08);
}
.woocommerce-error,
ul.woocommerce-error {
	color: #ff6b6b;
	border: 1px solid rgba(255, 107, 107, 0.45);
	background: rgba(255, 107, 107, 0.08);
}
.woocommerce-error li {
	list-style: none;
	margin: 0;
}
.woocommerce-message .button,
.woocommerce-info .button {
	float: right;
}

@media (max-width: 780px) {
	.my-account-page .woocommerce-account .woocommerce {
		flex-direction: column;
	}
	.my-account-page .woocommerce-MyAccount-navigation {
		flex-basis: auto;
		max-width: none;
		width: 100%;
	}
}