/* ===================================================================
   Lens + Linen — My Account (WooCommerce) brand styling
   ===================================================================
   Loaded only on is_account_page() (see functions.php), after style.css
   and the WooCommerce/Astra stylesheets, so these rules win.

   Matches the homepage: cream / warm-white grounds, navy serif headings,
   Outfit body text, gold accents, stone borders, navy buttons that turn
   gold on hover.

   Brand tokens are redefined here because homepage.css (where :root lives)
   is not loaded on the account page. This file supersedes the small
   "Woo Account" block in style.css.
=================================================================== */

:root {
	--ll-cream:       #F6F1EB;
	--ll-warm-white:  #FDFBF8;
	--ll-stone:       #D4C9BC;
	--ll-stone-dark:  #B8A99A;
	--ll-navy:        #1A2236;
	--ll-navy-light:  #2A3550;
	--ll-ink:         #0F1520;
	--ll-gold:        #C4A46C;
	--ll-gold-light:  #D4BC92;
	--ll-text-body:   #4A4440;
	--ll-text-muted:  #8A8078;
	--ll-serif:       'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--ll-sans:        'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- Canvas + typography ---------- */
body.woocommerce-account,
body.woocommerce-account .site-content {
	background-color: var(--ll-warm-white);
}

body.woocommerce-account,
body.woocommerce-account .woocommerce,
body.woocommerce-account .woocommerce-MyAccount-content {
	font-family: var(--ll-sans);
	color: var(--ll-text-body);
}

body.woocommerce-account h1,
body.woocommerce-account h2,
body.woocommerce-account h3,
body.woocommerce-account .entry-title,
body.woocommerce-account .ast-archive-title,
body.woocommerce-account .my-account-page-title {
	font-family: var(--ll-serif);
	color: var(--ll-navy);
	font-weight: 600;
	letter-spacing: 0;
}

body.woocommerce-account .woocommerce-MyAccount-content p,
body.woocommerce-account .woocommerce-account-greeting,
body.woocommerce-account .woocommerce-account-intro {
	color: var(--ll-text-body);
	line-height: 1.7;
}

body.woocommerce-account a {
	color: var(--ll-navy);
	transition: color .2s ease;
}
body.woocommerce-account a:hover,
body.woocommerce-account a:focus {
	color: var(--ll-gold);
}

/* Dashboard's in-content section links (a copy of the nav). Hidden on desktop
   (the sidebar nav covers navigation there); shown on mobile in the mobile
   block below, where the sidebar nav is hidden. */
body.woocommerce-account .ll-account-mobile-menu-wrap {
	display: none;
}

/* ===================================================================
   Account navigation
=================================================================== */

/* Desktop sidebar (Astra floats nav ~30% / content ~68%). */
body.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--ll-stone);
	border-radius: 8px;
	overflow: hidden;
	background-color: var(--ll-cream);
}

body.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--ll-stone);
	margin: 0;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
	border-bottom: none;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li::before {
	display: none !important; /* kill Astra/theme list bullets */
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 14px 18px;
	color: var(--ll-navy);
	font-family: var(--ll-sans);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .04em;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background-color: var(--ll-stone);
	color: var(--ll-navy);
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background-color: var(--ll-navy);
	color: var(--ll-warm-white);
}

/* Tablet + mobile: hide the sidebar account navigation. On the dashboard,
   show the in-content section links (a copy of the nav) instead. */
@media (max-width: 976px) {
	body.woocommerce-account .woocommerce-MyAccount-navigation {
		display: none !important;
	}

	body.woocommerce-account .ll-account-mobile-menu-wrap {
		display: block;
		margin: 24px 0 0;
	}
	body.woocommerce-account .ll-account-mobile-menu {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	body.woocommerce-account .ll-account-mobile-menu li {
		margin: 0 0 14px;
	}
	body.woocommerce-account .ll-account-mobile-menu li:last-child {
		margin-bottom: 0;
	}
	body.woocommerce-account .ll-account-mobile-menu li::before {
		display: none !important;
	}
	/* Plain text links (not buttons). */
	body.woocommerce-account .ll-account-mobile-menu a {
		display: inline-block;
		font-family: var(--ll-sans);
		font-size: 1rem;
		color: var(--ll-navy);
		text-decoration: underline;
		text-underline-offset: 3px;
	}
	body.woocommerce-account .ll-account-mobile-menu a:hover {
		color: var(--ll-gold);
	}
}

/* ===================================================================
   Buttons (match homepage: navy -> gold on hover)
=================================================================== */
body.woocommerce-account .woocommerce .button,
body.woocommerce-account .woocommerce button.button,
body.woocommerce-account .woocommerce input[type="submit"],
body.woocommerce-account .woocommerce-Button,
body.woocommerce-account .woocommerce-form-login__submit,
body.woocommerce-account .woocommerce-form-register__submit {
	background-color: var(--ll-navy) !important;
	color: var(--ll-warm-white) !important;
	border: 1px solid var(--ll-navy) !important;
	border-radius: 2px !important;
	font-family: var(--ll-sans) !important;
	font-size: .78rem !important;
	font-weight: 500 !important;
	letter-spacing: .12em !important;
	text-transform: uppercase !important;
	padding: .85rem 2rem !important;
	line-height: 1.2 !important;
	cursor: pointer;
	transition: background-color .3s ease, color .3s ease, border-color .3s ease !important;
}

body.woocommerce-account .woocommerce .button:hover,
body.woocommerce-account .woocommerce button.button:hover,
body.woocommerce-account .woocommerce input[type="submit"]:hover,
body.woocommerce-account .woocommerce-Button:hover,
body.woocommerce-account .woocommerce-form-login__submit:hover,
body.woocommerce-account .woocommerce-form-register__submit:hover {
	background-color: var(--ll-gold) !important;
	color: var(--ll-navy) !important;
	border-color: var(--ll-gold) !important;
}

/* Secondary / "view" buttons in the orders table — outline style */
body.woocommerce-account .woocommerce-orders-table .button {
	background-color: transparent !important;
	color: var(--ll-navy) !important;
	border: 1px solid var(--ll-navy) !important;
}
body.woocommerce-account .woocommerce-orders-table .button:hover {
	background-color: var(--ll-navy) !important;
	color: var(--ll-warm-white) !important;
}

/* ===================================================================
   Forms (login, register, edit account, addresses)
=================================================================== */
body.woocommerce-account .woocommerce form .form-row label,
body.woocommerce-account .woocommerce-EditAccountForm label,
body.woocommerce-account .woocommerce-address-fields label,
body.woocommerce-account .woocommerce form label {
	font-family: var(--ll-sans);
	color: var(--ll-navy);
	font-weight: 500;
	font-size: .9rem;
}

body.woocommerce-account .woocommerce input[type="text"],
body.woocommerce-account .woocommerce input[type="email"],
body.woocommerce-account .woocommerce input[type="password"],
body.woocommerce-account .woocommerce input[type="tel"],
body.woocommerce-account .woocommerce input[type="number"],
body.woocommerce-account .woocommerce input[type="url"],
body.woocommerce-account .woocommerce input[type="search"],
body.woocommerce-account .woocommerce textarea,
body.woocommerce-account .woocommerce select,
body.woocommerce-account .select2-container .select2-selection {
	border: 1px solid var(--ll-stone) !important;
	border-radius: 2px !important;
	background-color: var(--ll-warm-white) !important;
	color: var(--ll-text-body) !important;
	font-family: var(--ll-sans) !important;
	padding: .7rem .9rem !important;
	box-shadow: none !important;
}

body.woocommerce-account .woocommerce input:focus,
body.woocommerce-account .woocommerce textarea:focus,
body.woocommerce-account .woocommerce select:focus,
body.woocommerce-account .select2-container--focus .select2-selection {
	border-color: var(--ll-gold) !important;
	outline: none !important;
	box-shadow: 0 0 0 1px var(--ll-gold) !important;
}

/* Login / register: present the two columns as brand cards */
body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register,
body.woocommerce-account .u-column1.col-1,
body.woocommerce-account .u-column2.col-2 {
	background-color: var(--ll-cream);
	border: 1px solid var(--ll-stone);
	border-radius: 10px;
	padding: 28px 28px 24px;
}

/* ===================================================================
   Tables (orders, downloads, order details)
=================================================================== */
body.woocommerce-account .woocommerce table.shop_table,
body.woocommerce-account .woocommerce-orders-table,
body.woocommerce-account .woocommerce-table--order-details,
body.woocommerce-account .woocommerce-table--downloads {
	border: 1px solid var(--ll-stone) !important;
	border-radius: 8px;
	border-collapse: separate !important;
	border-spacing: 0;
	overflow: hidden;
	background-color: var(--ll-warm-white);
}

body.woocommerce-account .woocommerce table.shop_table thead th,
body.woocommerce-account .woocommerce-orders-table thead th {
	background-color: var(--ll-cream);
	color: var(--ll-navy);
	font-family: var(--ll-sans);
	font-weight: 600;
	font-size: .82rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-bottom: 1px solid var(--ll-stone) !important;
}

body.woocommerce-account .woocommerce table.shop_table td,
body.woocommerce-account .woocommerce table.shop_table th {
	border-color: var(--ll-stone) !important;
}

body.woocommerce-account .woocommerce table.shop_table tfoot th,
body.woocommerce-account .woocommerce table.shop_table tfoot td {
	color: var(--ll-navy);
}

/* Address / detail panels on the order view + addresses page */
body.woocommerce-account .woocommerce-customer-details address,
body.woocommerce-account .woocommerce-Address address,
body.woocommerce-account .col-1 address,
body.woocommerce-account .col-2 address {
	border: 1px solid var(--ll-stone);
	border-radius: 8px;
	padding: 18px;
	background-color: var(--ll-cream);
	font-style: normal;
	line-height: 1.6;
}

/* ===================================================================
   Notices
=================================================================== */
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info,
body.woocommerce-account .woocommerce-error {
	border-top-width: 3px;
	border-radius: 4px;
	font-family: var(--ll-sans);
}
body.woocommerce-account .woocommerce-message { border-top-color: var(--ll-gold) !important; }
body.woocommerce-account .woocommerce-info    { border-top-color: var(--ll-navy) !important; }
body.woocommerce-account .woocommerce-message::before { color: var(--ll-gold) !important; }
body.woocommerce-account .woocommerce-info::before    { color: var(--ll-navy) !important; }

/* ===================================================================
   Small-screen spacing
=================================================================== */
@media (max-width: 640px) {
	body.woocommerce-account .woocommerce-form-login,
	body.woocommerce-account .woocommerce-form-register,
	body.woocommerce-account .u-column1.col-1,
	body.woocommerce-account .u-column2.col-2 {
		padding: 20px 18px;
	}
	body.woocommerce-account .woocommerce table.shop_table {
		font-size: .92rem;
	}
}
