/* =========================================================================
   School Uniform — Site-wide Brand Design  (Astra Child)
   Professional navy + crest-gold identity applied across header, footer,
   shop/archive, cart, checkout, forms and the global button system.
   Loaded on every front-end page.
   ========================================================================= */

:root {
	--su-navy:       #0B2545;   /* Primary */
	--su-navy-deep:  #0A1422;   /* Ink — deepest navy / footer */
	--su-navy-soft:  #1E5F8C;   /* Steel — secondary */
	--su-steel:      #1E5F8C;   /* Secondary */
	--su-sky:        #5AA9E6;   /* Tint */
	--su-cta:        #FF7A2F;   /* Signal — CTA only */
	--su-cta-deep:   #E8631C;   /* Signal hover */
	--su-gold:       #5AA9E6;   /* accent (mapped to Sky tint) */
	--su-gold-deep:  #1E5F8C;   /* accent (mapped to Steel) */
	--su-ink:        #0A1422;   /* Body text */
	--su-ink-soft:   #3a4a5e;
	--su-muted:      #6b7a8c;
	--su-line:       #dfe7f0;
	--su-line-strong:#c7d3e0;
	--su-canvas:     #EEF3F8;   /* Mist — backgrounds */
	--su-surface:    #ffffff;
	--su-surface-2:  #EEF3F8;   /* Mist */
	--su-success:    #2f7d4f;
	--su-danger:     #c0392b;
	--su-shadow-sm:  0 1px 2px rgba(20,35,60,.06), 0 1px 3px rgba(20,35,60,.05);
	--su-shadow-md:  0 18px 44px -26px rgba(20,35,60,.40);
	--su-radius:     10px;
	--su-radius-sm:  7px;
	--su-font-head:  'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--su-font-body:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---- Base typography --------------------------------------------------- */
body {
	font-family: var(--su-font-body);
	color: var(--su-ink);
	background-color: var(--su-canvas);
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6,
.entry-title, .ast-archive-title {
	font-family: var(--su-font-head);
	color: var(--su-navy);
	letter-spacing: -.01em;
}
a { color: var(--su-navy); }
a:hover { color: var(--su-gold-deep); }

/* =========================================================================
   UTILITY TOP BAR  (injected via functions.php — EDITABLE placeholder copy)
   ========================================================================= */
.su-topbar {
	background: var(--su-navy-deep);
	color: #dbe4f2;
	font-family: var(--su-font-body);
	font-size: .78rem;
	letter-spacing: .02em;
}
.su-topbar__inner {
	max-width: 1260px;
	margin: 0 auto;
	padding: 8px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}
.su-topbar__left { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.su-topbar__item { display: inline-flex; align-items: center; gap: 7px; }
.su-topbar__item svg { width: 15px; height: 15px; color: var(--su-gold); flex: 0 0 auto; }
.su-topbar a { color: #dbe4f2; text-decoration: none; transition: color .2s ease; }
.su-topbar a:hover { color: #fff; }
.su-topbar__right { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.su-topbar__badge {
	display: inline-flex; align-items: center; gap: 7px;
	font-weight: 600; color: #fff;
}
.su-topbar__badge svg { width: 15px; height: 15px; color: var(--su-gold); }
@media (max-width: 768px) {
	.su-topbar__inner { justify-content: center; padding: 7px 16px; }
	.su-topbar__right { display: none; }
}

/* =========================================================================
   HEADER
   ========================================================================= */
.site-header,
header.site-header {
	background: var(--su-surface);
	border-bottom: 1px solid var(--su-line);
	box-shadow: var(--su-shadow-sm);
}
.main-header-bar,
.ast-primary-header-bar .ast-primary-header { background: transparent; }

/* Site title / branding */
.site-title, .site-title a,
.ast-site-identity .site-title a {
	font-family: var(--su-font-head);
	font-weight: 700;
	color: var(--su-navy) !important;
	letter-spacing: -.01em;
}
.site-description { color: var(--su-muted); }

/* Primary navigation */
.main-header-menu .menu-link,
.main-header-menu a,
.ast-builder-menu .menu-item > .menu-link {
	font-family: var(--su-font-body);
	font-weight: 600;
	font-size: .92rem;
	letter-spacing: .01em;
	color: var(--su-ink) !important;
	position: relative;
}
.main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 20px; right: 20px; bottom: 6px;
	height: 2px;
	background: var(--su-gold);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .25s ease;
}
.main-header-menu > .menu-item:hover > .menu-link::after,
.main-header-menu > .menu-item.current-menu-item > .menu-link::after {
	transform: scaleX(1);
}
.main-header-menu > .menu-item:hover > .menu-link,
.main-header-menu > .menu-item.current-menu-item > .menu-link {
	color: var(--su-navy) !important;
}

/* Sub-menus */
.main-header-menu .sub-menu {
	border: 1px solid var(--su-line);
	box-shadow: var(--su-shadow-md);
	border-radius: var(--su-radius-sm);
	overflow: hidden;
	border-top: 3px solid var(--su-gold);
}
.main-header-menu .sub-menu .menu-link { font-weight: 500; }

/* Header cart */
.ast-header-woo-cart .ast-cart-menu-wrap .count,
.ast-site-header-cart .cart-container .ast-cart-menu-wrap .count {
	border-color: var(--su-navy);
	color: var(--su-navy);
}
.ast-header-woo-cart .ast-cart-menu-wrap:hover .count { background: var(--su-navy); color: #fff; }
.ast-header-woo-cart a,
.ast-site-header-cart a { color: var(--su-ink); }

/* =========================================================================
   GLOBAL BUTTON SYSTEM
   ========================================================================= */
.button,
.ast-button,
.wp-block-button__link,
input[type="submit"],
button[type="submit"]:not(.single_add_to_cart_button),
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	font-family: var(--su-font-body);
	font-weight: 600;
	font-size: .8rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #fff !important;
	background: var(--su-navy) !important;
	border: 1px solid var(--su-navy) !important;
	border-radius: var(--su-radius-sm) !important;
	padding: 13px 26px !important;
	box-shadow: var(--su-shadow-sm);
	transition: transform .15s ease, background .25s ease, box-shadow .25s ease !important;
}
.button:hover,
.ast-button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background: var(--su-steel) !important;
	border-color: var(--su-steel) !important;
	transform: translateY(-2px);
	box-shadow: var(--su-shadow-md);
}

/* Primary ACTION CTAs — Signal orange (reserved for add-to-cart / checkout) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce ul.products li.product a.button.add_to_cart_button,
.woocommerce ul.products li.product a.button.ajax_add_to_cart {
	color: #fff !important;
	background: var(--su-cta) !important;
	border-color: var(--su-cta) !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce ul.products li.product a.button.add_to_cart_button:hover,
.woocommerce ul.products li.product a.button.ajax_add_to_cart:hover {
	background: var(--su-cta-deep) !important;
	border-color: var(--su-cta-deep) !important;
}

/* Secondary / outline button (e.g. "View cart", added state) */
.woocommerce a.added_to_cart,
.woocommerce .button.wc-backward,
.woocommerce a.button.wc-forward.wp-element-button {
	background: transparent !important;
	color: var(--su-navy) !important;
	border: 1px solid var(--su-line-strong) !important;
}
.woocommerce a.added_to_cart:hover,
.woocommerce .button.wc-backward:hover {
	background: var(--su-navy) !important;
	color: #fff !important;
	border-color: var(--su-navy) !important;
}

/* =========================================================================
   ARCHIVE / SHOP HEADER
   ========================================================================= */
.ast-archive-description,
.woocommerce-products-header {
	text-align: center;
	margin-bottom: 8px;
	padding: 14px 0 6px;
}
.woocommerce-products-header__title,
.ast-archive-title,
h1.entry-title {
	font-family: var(--su-font-head);
	font-weight: 700;
	font-size: clamp(1.8rem, 3vw, 2.6rem);
	color: var(--su-navy);
	position: relative;
	padding-bottom: 16px;
	display: inline-block;
}
.woocommerce-products-header__title::after,
.ast-archive-title::after {
	content: "";
	position: absolute;
	left: 50%; bottom: 0;
	transform: translateX(-50%);
	width: 56px; height: 3px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--su-gold-deep), var(--su-gold));
}
.woocommerce-breadcrumb {
	color: var(--su-muted);
	font-size: .78rem;
	letter-spacing: .04em;
}
.woocommerce-breadcrumb a { color: var(--su-ink-soft); text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--su-navy); }

/* Result count + ordering */
.woocommerce .woocommerce-result-count {
	color: var(--su-muted);
	font-size: .85rem;
}
.woocommerce .woocommerce-ordering select,
.woocommerce select.orderby {
	border: 1px solid var(--su-line-strong);
	border-radius: var(--su-radius-sm);
	padding: 10px 14px;
	background: var(--su-surface);
	color: var(--su-ink);
	font-size: .85rem;
}

/* =========================================================================
   PRODUCT GRID  (shop / archive / category)
   ========================================================================= */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background: var(--su-surface);
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius);
	padding: 14px 14px 22px;
	box-shadow: var(--su-shadow-sm);
	transition: transform .25s ease, box-shadow .3s ease, border-color .25s ease;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.woocommerce ul.products li.product:hover {
	transform: translateY(-6px);
	box-shadow: var(--su-shadow-md);
	border-color: var(--su-navy);
}
.woocommerce ul.products li.product a img {
	border-radius: var(--su-radius-sm);
	margin-bottom: 14px;
	background: var(--su-surface-2);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--su-font-head);
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.4;
	color: var(--su-ink);
	padding: 0 6px;
}
.woocommerce ul.products li.product .price {
	color: var(--su-navy);
	font-weight: 700;
	font-size: 1.05rem;
}
.woocommerce ul.products li.product .price del {
	color: var(--su-muted);
	font-weight: 500;
	font-size: .9rem;
	opacity: .8;
}
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--su-danger); }
.woocommerce ul.products li.product .star-rating { margin: 6px auto; color: var(--su-gold); }

/* Loop add-to-cart button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	display: inline-block;
	margin-top: 12px;
	font-size: .76rem !important;
	padding: 11px 22px !important;
}

/* Sale badge in grid */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
	background: var(--su-navy);
	color: #fff;
	border: 1px solid var(--su-gold);
	border-radius: 999px;
	font-family: var(--su-font-body);
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-size: .62rem;
	padding: 7px 13px;
	min-height: 0;
	min-width: 0;
	line-height: 1;
	top: 14px;
	left: 14px;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul {
	border: 0;
	gap: 8px;
	display: flex;
	justify-content: center;
}
.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
	margin: 0;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--su-line-strong);
	border-radius: var(--su-radius-sm);
	color: var(--su-ink);
	min-width: 42px;
	padding: 10px 12px;
	transition: all .2s ease;
}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--su-navy);
	color: #fff;
	border-color: var(--su-navy);
}

/* =========================================================================
   SIDEBAR / WIDGETS
   ========================================================================= */
.widget-title, .widget .widget-title {
	font-family: var(--su-font-head);
	font-weight: 700;
	color: var(--su-navy);
	font-size: 1.1rem;
	padding-bottom: 12px;
	margin-bottom: 16px;
	border-bottom: 2px solid var(--su-line);
	position: relative;
}
.widget-title::after {
	content: "";
	position: absolute;
	left: 0; bottom: -2px;
	width: 44px; height: 2px;
	background: var(--su-gold);
}
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background: var(--su-navy); }

/* =========================================================================
   CART  &  CHECKOUT
   ========================================================================= */
.woocommerce table.shop_table {
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius);
	overflow: hidden;
	background: var(--su-surface);
	box-shadow: var(--su-shadow-sm);
}
.woocommerce table.shop_table thead th {
	background: var(--su-surface-2);
	color: var(--su-navy);
	font-family: var(--su-font-head);
	font-weight: 600;
	font-size: .8rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 16px 14px;
}
.woocommerce table.shop_table td { padding: 16px 14px; border-top: 1px solid var(--su-line); }
.woocommerce table.shop_table .product-name a { color: var(--su-ink); font-weight: 600; }
.woocommerce table.shop_table .product-name a:hover { color: var(--su-navy); }

.woocommerce .cart_totals h2,
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
	font-family: var(--su-font-head);
	color: var(--su-navy);
}
.woocommerce .cart-collaterals .cart_totals table,
.woocommerce-checkout #order_review {
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius);
	background: var(--su-surface);
	box-shadow: var(--su-shadow-sm);
	padding: 6px;
}

/* Coupon / quantity inputs */
.woocommerce .quantity input.qty,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.select2-container .select2-selection {
	border: 1px solid var(--su-line-strong) !important;
	border-radius: var(--su-radius-sm) !important;
	padding: 12px 14px;
	min-height: 48px;
	background: var(--su-surface);
	color: var(--su-ink);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus {
	border-color: var(--su-navy) !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(20,48,92,.12);
}

/* Checkout place-order button */
.woocommerce #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	width: 100%;
	background: var(--su-cta) !important;
	border-color: var(--su-cta) !important;
	font-size: .9rem !important;
	padding: 16px 24px !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce #place_order:hover {
	background: var(--su-cta-deep) !important;
	border-color: var(--su-cta-deep) !important;
}

/* =========================================================================
   WOOCOMMERCE NOTICES
   ========================================================================= */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top: 0;
	border-left: 4px solid var(--su-navy);
	border-radius: var(--su-radius-sm);
	background: var(--su-surface-2);
	color: var(--su-ink);
	box-shadow: var(--su-shadow-sm);
}
.woocommerce-message { border-left-color: var(--su-success); }
.woocommerce-error { border-left-color: var(--su-danger); }
.woocommerce-message::before { color: var(--su-success); }
.woocommerce-info::before { color: var(--su-navy); }
.woocommerce-error::before { color: var(--su-danger); }

/* =========================================================================
   FOOTER
   ========================================================================= */
.site-footer,
footer.site-footer {
	background: var(--su-navy-deep);
	color: #c4d0e3;
}
.site-footer a,
.ast-small-footer a { color: #dbe4f2; }
.site-footer a:hover,
.ast-small-footer a:hover { color: var(--su-gold); }
.site-footer .widget-title,
.footer-adv .widget-title {
	color: #fff;
	border-bottom-color: rgba(255,255,255,.14);
}
.site-footer .widget-title::after { background: var(--su-gold); }
.ast-small-footer {
	background: var(--su-navy-deep);
	color: #95a6c2;
	border-top: 1px solid rgba(255,255,255,.10);
	font-size: .85rem;
}

/* =========================================================================
   RESPONSIVE TWEAKS
   ========================================================================= */
@media (max-width: 768px) {
	.woocommerce-products-header__title,
	.ast-archive-title { font-size: 1.7rem; }
}

/* =========================================================================
   PROFESSIONAL CATEGORY / SHOP ARCHIVE
   ========================================================================= */
/* Hide the default top breadcrumb + reset header (hero replaces them) */
body.tax-product_cat .woocommerce-breadcrumb,
body.post-type-archive-product .woocommerce-breadcrumb { display: none !important; }
body.tax-product_cat .woocommerce-products-header,
body.post-type-archive-product .woocommerce-products-header {
	text-align: left;
	padding: 0;
	margin: 0;
}

/* ---- Hero banner ------------------------------------------------------- */
.bp-cat-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, var(--su-navy) 0%, var(--su-navy-deep) 100%);
	color: #eaf0f8;
	border-radius: 14px;
	padding: clamp(26px, 4vw, 48px);
	margin: 6px 0 22px;
	box-shadow: var(--su-shadow-md);
}
.bp-cat-hero::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(90deg, var(--su-steel), var(--su-sky), var(--su-cta));
}
.bp-cat-hero::after {
	content: "";
	position: absolute;
	right: -70px; top: -70px;
	width: 260px; height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(90,169,230,.20), transparent 70%);
	pointer-events: none;
}
.bp-crumb {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 14px;
	font-size: .78rem;
	letter-spacing: .04em;
	color: rgba(234,240,248,.7);
}
.bp-crumb a { color: rgba(234,240,248,.85); text-decoration: none; transition: color .2s ease; }
.bp-crumb a:hover { color: #fff; }
.bp-crumb span { opacity: .5; }
.bp-crumb__current { color: #fff; font-weight: 600; opacity: 1; }
.bp-cat-hero__body {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 16px;
}
.bp-cat-hero__title {
	font-family: var(--su-font-head);
	font-weight: 800;
	font-size: clamp(1.8rem, 3.6vw, 2.8rem);
	letter-spacing: -.02em;
	color: #fff;
	margin: 0;
}
.bp-cat-hero__count {
	font-size: .82rem;
	font-weight: 600;
	color: #fff;
	background: rgba(255,255,255,.15);
	padding: 5px 13px;
	border-radius: 999px;
}
.bp-cat-hero__desc {
	position: relative;
	z-index: 1;
	margin-top: 14px;
	max-width: 760px;
	color: rgba(234,240,248,.82);
	font-size: .95rem;
	line-height: 1.7;
}
.bp-cat-hero__desc p:last-child { margin-bottom: 0; }

/* ---- Subcategory chips ------------------------------------------------- */
.bp-cat-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 22px;
}
.bp-chip {
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	border-radius: 999px;
	background: var(--su-surface);
	border: 1px solid var(--su-line-strong);
	font-weight: 600;
	font-size: .85rem;
	color: var(--su-ink);
	text-decoration: none;
	transition: color .2s ease, background .2s ease, border-color .2s ease;
}
.bp-chip:hover { border-color: var(--su-navy); color: var(--su-navy); }
.bp-chip.is-active { background: var(--su-navy); border-color: var(--su-navy); color: #fff; }

/* ---- Sort toolbar ------------------------------------------------------ */
.bp-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
	margin: 0 0 26px;
	padding: 12px 18px;
	background: var(--su-surface);
	border: 1px solid var(--su-line);
	border-radius: 10px;
	box-shadow: var(--su-shadow-sm);
}
.bp-toolbar::before, .bp-toolbar::after { content: none; display: none; }
.bp-toolbar .woocommerce-result-count { display: none !important; }
.bp-toolbar .woocommerce-ordering { float: none !important; margin: 0 0 0 auto !important; }

/* ---- Card polish: aligned buttons / equal heights --------------------- */
.woocommerce ul.products li.product {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart { margin-top: auto; }

@media (max-width: 600px) {
	.bp-cat-hero { padding: 22px; border-radius: 12px; }
	.bp-chip { padding: 8px 14px; font-size: .8rem; }
	.bp-toolbar { padding: 12px 14px; }
}

/* =========================================================================
   CUSTOM HEADER + MEGA MENU  (replaces Astra default header)
   ========================================================================= */
header.site-header { display: none !important; }

.bp-header {
	position: sticky;
	top: 0;
	z-index: 9999;
	background: var(--su-surface);
	border-bottom: 1px solid var(--su-line);
	box-shadow: 0 2px 14px rgba(11,37,69,.06);
	font-family: var(--su-font-body);
}
.bp-header__inner {
	position: relative;
	max-width: 1260px;
	margin: 0 auto;
	padding: 0 20px;
	height: 78px;
	display: flex;
	align-items: center;
	gap: 24px;
}

/* Logo */
.bp-header__logo {
	display: inline-flex;
	align-items: center;
	font-family: var(--su-font-head);
	font-weight: 800;
	font-size: 1.4rem;
	letter-spacing: -.01em;
	color: var(--su-navy);
	text-decoration: none;
	white-space: nowrap;
}
.bp-header__logo img { max-height: 50px; width: auto; display: block; }

/* Nav */
.bp-nav { margin-left: auto; }
.bp-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 2px;
}
.bp-nav__item > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 12px 16px;
	font-weight: 600;
	font-size: .95rem;
	color: var(--su-ink);
	text-decoration: none;
	border-radius: 8px;
	transition: color .2s ease, background .2s ease;
}
.bp-nav__item > a:hover { color: var(--su-navy); background: var(--su-surface-2); }
.bp-nav__item > a svg { width: 13px; height: 13px; transition: transform .25s ease; }
.bp-nav__item.has-mega:hover > a svg,
.bp-nav__item.has-dropdown:hover > a svg { transform: rotate(180deg); }

/* Simple dropdown (e.g. Wholesale) */
.bp-nav__item.has-dropdown { position: relative; }
.bp-dropdown {
	position: absolute;
	top: 100%;
	right: 0;
	left: auto;
	min-width: 230px;
	list-style: none;
	margin: 0;
	padding: 8px;
	background: var(--su-surface);
	border-top: 3px solid var(--su-navy);
	border-radius: 0 0 8px 8px;
	box-shadow: 0 24px 40px -22px rgba(11,37,69,.30);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
	z-index: 60;
}
.bp-nav__item.has-dropdown:hover > .bp-dropdown,
.bp-nav__item.has-dropdown:focus-within > .bp-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.bp-dropdown li { margin: 0; }
.bp-dropdown a {
	display: block;
	padding: 9px 12px;
	border-radius: 6px;
	font-size: .9rem;
	color: var(--su-ink-soft);
	text-decoration: none;
	transition: color .15s ease, background .15s ease;
}
.bp-dropdown a:hover { color: var(--su-navy); background: var(--su-surface-2); }

/* Header actions (account / cart) */
.bp-header__actions { display: flex; align-items: center; gap: 4px; }
.bp-header__icon {
	position: relative;
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--su-ink);
	border-radius: 50%;
	transition: background .2s ease, color .2s ease;
}
.bp-header__icon:hover { background: var(--su-surface-2); color: var(--su-navy); }
.bp-header__icon svg { width: 22px; height: 22px; }
.bp-header__cart-count {
	position: absolute;
	top: 3px; right: 0;
	min-width: 18px; height: 18px;
	padding: 0 5px;
	background: var(--su-cta);
	color: #fff;
	font-size: .66rem;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	border-radius: 999px;
}

/* Mega panel (desktop) */
.bpmega {
	position: absolute;
	top: 100%;
	left: 0; right: 0;
	background: var(--su-surface);
	border-top: 3px solid var(--su-navy);
	box-shadow: 0 28px 44px -22px rgba(11,37,69,.30);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .22s ease, transform .22s ease, visibility .22s;
	z-index: 60;
}
.bp-nav__item.has-mega:hover > .bpmega,
.bp-nav__item.has-mega:focus-within > .bpmega {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.bpmega__inner {
	max-width: 1260px;
	margin: 0 auto;
	padding: 22px 24px 24px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
}
.bpmega__col {
	padding: 0 26px;
	border-left: 1px solid var(--su-line);
}
.bpmega__col:first-child { border-left: 0; padding-left: 0; }
.bpmega__col:last-child { padding-right: 0; }

/* Wide column (e.g. School Uniforms): spans 2 tracks, groups side-by-side */
.bpmega__col--wide { grid-column: span 2; }
.bpmega__col--wide .bpmega__groups {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 26px;
}
.bpmega__title {
	font-family: var(--su-font-head);
	font-weight: 700;
	font-size: .98rem;
	color: var(--su-navy);
	margin: 0 0 12px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--su-line);
	position: relative;
}
.bpmega__title::after {
	content: "";
	position: absolute;
	left: 0; bottom: -2px;
	width: 36px; height: 2px;
	background: var(--su-cta);
}
.bpmega__title a { color: inherit; text-decoration: none; transition: color .15s ease; }
.bpmega__title a:hover { color: var(--su-steel); }
.bpmega__group-title a { color: inherit; text-decoration: none; }
.bpmega__group-title a:hover { color: var(--su-navy); }
.bpmega__group { margin-bottom: 12px; }
.bpmega__group:last-child { margin-bottom: 0; }
.bpmega__group-title {
	display: block;
	font-weight: 700;
	font-size: .68rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--su-cta);
	margin: 0 0 4px;
}
.bpmega__links { list-style: none; margin: 0; padding: 0; }
.bpmega__links li { margin: 0; }
.bpmega__links a {
	display: block;
	padding: 5px 8px;
	margin: 0 -8px;
	border-radius: 6px;
	font-size: .88rem;
	line-height: 1.3;
	color: var(--su-ink-soft);
	text-decoration: none;
	transition: color .15s ease, background .15s ease;
}
.bpmega__links a:hover { color: var(--su-navy); background: var(--su-surface-2); }

/* Burger + backdrop (hidden on desktop) */
.bp-burger { display: none; }
.bp-nav__backdrop { display: none; }

/* ---- Tablet / mobile header ------------------------------------------- */
@media (max-width: 992px) {
	.bp-header__inner { height: 64px; gap: 12px; }
	.bp-header__logo { font-size: 1.2rem; }

	.bp-header__actions { margin-left: auto; }

	.bp-burger {
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 44px; height: 44px;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
	}
	.bp-burger span {
		display: block;
		width: 24px; height: 2px;
		background: var(--su-navy);
		border-radius: 2px;
		transition: transform .25s ease, opacity .2s ease;
	}
	body.bp-nav-open .bp-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	body.bp-nav-open .bp-burger span:nth-child(2) { opacity: 0; }
	body.bp-nav-open .bp-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	/* Off-canvas drawer */
	.bp-nav {
		position: fixed;
		top: 0; left: 0; bottom: 0;
		width: min(360px, 86vw);
		margin: 0;
		padding: 78px 0 30px;
		background: var(--su-surface);
		box-shadow: 0 0 60px rgba(10,20,34,.25);
		transform: translateX(-100%);
		transition: transform .3s cubic-bezier(.2,.8,.2,1);
		overflow-y: auto;
		z-index: 10000;
	}
	body.bp-nav-open .bp-nav { transform: translateX(0); }
	.bp-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.bp-nav__item > a {
		justify-content: space-between;
		padding: 15px 24px;
		border-radius: 0;
		border-bottom: 1px solid var(--su-line);
		font-size: 1rem;
	}
	.bp-nav__item > a svg { width: 16px; height: 16px; }
	.bp-nav__item.has-mega.is-expanded > .bp-nav__link svg,
	.bp-nav__item.has-dropdown.is-expanded > .bp-nav__link svg { transform: rotate(180deg); }

	/* Wholesale dropdown becomes an accordion inside the drawer */
	.bp-dropdown {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border-top: 0;
		border-radius: 0;
		background: var(--su-surface-2);
		min-width: 0;
		max-height: 0;
		overflow: hidden;
		padding: 0;
		transition: max-height .35s ease;
	}
	.bp-nav__item.has-dropdown.is-expanded .bp-dropdown { max-height: 600px; padding: 6px 12px; }
	.bp-dropdown a { padding: 12px; }

	/* Mega becomes an accordion inside the drawer */
	.bpmega {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border-top: 0;
		background: var(--su-surface-2);
		max-height: 0;
		overflow: hidden;
		transition: max-height .35s ease;
	}
	.bp-nav__item.has-mega.is-expanded .bpmega { max-height: 2400px; }
	.bpmega__inner { display: block; padding: 8px 24px 16px; }
	.bpmega__col { padding: 0; border-left: 0; }
	.bpmega__col--wide { grid-column: auto; }
	.bpmega__col--wide .bpmega__groups { display: block; }
	.bpmega__title { margin: 16px 0 12px; font-size: .95rem; }
	.bpmega__group { margin-bottom: 14px; }

	.bp-nav__backdrop {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(10,20,34,.5);
		opacity: 0;
		visibility: hidden;
		transition: opacity .3s ease, visibility .3s ease;
		z-index: 9998;
	}
	body.bp-nav-open .bp-nav__backdrop { opacity: 1; visibility: visible; }
	body.bp-nav-open { overflow: hidden; }
}

/* =========================================================================
   CUSTOM PROFESSIONAL FOOTER  (replaces Astra default footer)
   ========================================================================= */
footer.site-footer { display: none !important; }

.bp-footer {
	font-family: var(--su-font-body);
	background: var(--su-navy-deep);
	color: #aeb9cc;
}
.bp-footer a { text-decoration: none; transition: color .2s ease; }

/* ---- Newsletter band (top of footer) ---------------------------------- */
.bp-news {
	background: linear-gradient(120deg, var(--su-navy) 0%, var(--su-steel) 100%);
	position: relative;
	overflow: hidden;
}
.bp-news::before {
	content: "";
	position: absolute;
	right: -60px; top: -70px;
	width: 240px; height: 240px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(90,169,230,.25), transparent 70%);
	pointer-events: none;
}
.bp-news__inner {
	position: relative;
	max-width: 1260px;
	margin: 0 auto;
	padding: 30px 22px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
}
.bp-news__title {
	font-family: var(--su-font-head);
	font-weight: 800;
	color: #fff;
	font-size: clamp(1.2rem, 2.2vw, 1.6rem);
	margin: 0 0 6px;
	letter-spacing: -.01em;
}
.bp-news__sub { margin: 0; color: rgba(234,240,248,.85); font-size: .92rem; }
/* The newsletter band sits inside the footer on EVERY template, so page-scoped
   heading rules (e.g. `.woocommerce-checkout h3` further up this file, which is
   more specific than `.bp-news__title`) were turning this heading navy — i.e.
   invisible against the navy gradient. Pin it from inside .bp-footer so it
   always outranks those. */
.bp-footer .bp-news .bp-news__title { color: #fff; }
.bp-footer .bp-news .bp-news__sub   { color: rgba(234,240,248,.85); }

.bp-news__form { flex: 0 1 480px; min-width: 280px; }
.bp-news__hp,
.bp-news .bpf-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bp-news__row { display: flex; gap: 10px; }
.bp-news__row input[type="email"] {
	flex: 1;
	min-width: 0;
	border: 1px solid rgba(255,255,255,.3);
	background: rgba(255,255,255,.12);
	color: #fff;
	border-radius: 9px;
	padding: 13px 16px;
	font-size: .92rem;
	font-family: var(--su-font-body);
	transition: background .2s ease, border-color .2s ease;
}
.bp-news__row input[type="email"]::placeholder { color: rgba(255,255,255,.7); }
.bp-news__row input[type="email"]:focus {
	outline: none;
	background: #fff;
	color: var(--su-ink);
	border-color: #fff;
}
.bp-news__row input[type="email"]:focus::placeholder { color: var(--su-muted); }
.bp-news__row button {
	flex: 0 0 auto;
	font-family: var(--su-font-body);
	font-weight: 700;
	font-size: .78rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: #fff;
	background: var(--su-cta);
	border: 1px solid var(--su-cta);
	border-radius: 9px;
	padding: 13px 24px;
	cursor: pointer;
	transition: background .2s ease;
}
.bp-news__row button:hover { background: var(--su-cta-deep); border-color: var(--su-cta-deep); }
.bp-news__msg { margin: 12px 0 0; font-size: .85rem; font-weight: 600; }
.bp-news__msg--ok  { color: #c8ffd6; }
.bp-news__msg--err { color: #ffd2cc; }

@media (max-width: 860px) {
	.bp-news__inner { flex-direction: column; align-items: flex-start; gap: 18px; }
	.bp-news__form { flex: 1 1 100%; width: 100%; }
}
@media (max-width: 460px) {
	.bp-news__row { flex-direction: column; }
	.bp-news__row button { width: 100%; }
}

.bp-footer__main {
	position: relative;
	border-top: 4px solid transparent;
	border-image: linear-gradient(90deg, var(--su-steel), var(--su-sky), var(--su-cta)) 1;
}
.bp-footer__inner {
	max-width: 1260px;
	margin: 0 auto;
	padding: clamp(40px, 5vw, 66px) 22px clamp(30px, 4vw, 50px);
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr 1.2fr;
	gap: 40px;
}

/* Brand column */
.bp-footer__logo {
	display: inline-block;
	margin-bottom: 16px;
	line-height: 0;
}
.bp-footer__logo img {
	height: 54px;
	width: auto;
	max-width: 240px;
	display: block;
}
.bp-footer__about {
	font-size: .9rem;
	line-height: 1.75;
	color: #94a3ba;
	margin: 0 0 18px;
	max-width: 340px;
}
.bp-footer__contact { list-style: none; margin: 0 0 20px; padding: 0; }
.bp-footer__contact li {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	font-size: .9rem;
	line-height: 1.5;
	color: #b4c0d4;
	margin-bottom: 11px;
}
.bp-footer__contact a { color: #b4c0d4; }
.bp-footer__contact a:hover { color: #fff; }
.bp-footer__ci { flex: 0 0 auto; color: var(--su-sky); margin-top: 1px; }
.bp-footer__ci svg { width: 17px; height: 17px; display: block; }

.bp-footer__social { display: flex; gap: 10px; }
.bp-footer__soc {
	width: 38px; height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(255,255,255,.07);
	color: #cdd7e6;
	transition: background .2s ease, color .2s ease, transform .2s ease;
}
.bp-footer__soc:hover { background: var(--su-cta); color: #fff; transform: translateY(-3px); }
.bp-footer__soc svg { width: 18px; height: 18px; }

/* Link columns */
.bp-footer__title {
	font-family: var(--su-font-head);
	font-weight: 700;
	font-size: .82rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
	margin: 4px 0 18px;
}
.bp-footer__col ul { list-style: none; margin: 0; padding: 0; }
.bp-footer__col li { margin-bottom: 11px; }
.bp-footer__col a {
	position: relative;
	font-size: .9rem;
	color: #a6b2c6;
	padding-left: 0;
	transition: color .2s ease, padding-left .2s ease;
}
.bp-footer__col a:hover { color: #fff; padding-left: 6px; }
.bp-footer__col a::before {
	content: "";
	position: absolute;
	left: -8px; top: 50%;
	transform: translateY(-50%) scaleX(0);
	width: 4px; height: 4px;
	border-radius: 50%;
	background: var(--su-cta);
	transition: transform .2s ease;
}
.bp-footer__col a:hover::before { transform: translateY(-50%) scaleX(1); }

/* Help / WhatsApp column */
.bp-footer__help-text { font-size: .88rem; line-height: 1.7; color: #94a3ba; margin: 0 0 18px; }

/* WhatsApp call-to-action — clean & simple */
.bp-footer__cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #fff;
	background: #25D366;
	border-radius: 12px;
	padding: 12px 22px;
	box-shadow: 0 8px 20px -8px rgba(37,211,102,.55);
}
/* Cancel the generic column-link hover (padding shift + orange dot) on the CTA */
.bp-footer__col a.bp-footer__cta,
.bp-footer__col a.bp-footer__cta:hover { padding-left: 22px; color: #fff; }
.bp-footer__cta::before,
.bp-footer__cta:hover::before { content: none; display: none; }

.bp-footer__cta-ic { flex: 0 0 auto; display: inline-flex; color: #fff; }
.bp-footer__cta-ic svg { width: 28px; height: 28px; color: #fff; fill: #fff; }
.bp-footer__cta-tx { display: flex; flex-direction: column; line-height: 1.25; }
.bp-footer__cta-lead { font-family: var(--su-font-head); font-weight: 700; font-size: .8rem; color: #fff; }

/* Bottom bar */
.bp-footer__bar { border-top: 1px solid rgba(255,255,255,.09); background: #060d18; }
.bp-footer__bar-inner {
	max-width: 1260px;
	margin: 0 auto;
	padding: 18px 22px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
}
.bp-footer__copy { font-size: .82rem; color: #8696ad; }
.bp-footer__legal { display: flex; gap: 18px; list-style: none; margin: 0; padding: 0; }
.bp-footer__legal a { font-size: .82rem; color: #8696ad; }
.bp-footer__legal a:hover { color: #fff; }
.bp-footer__pay { display: flex; align-items: center; gap: 8px; }
.bp-footer__pay-badge {
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .04em;
	color: #cdd7e6;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 5px;
	padding: 5px 9px;
	white-space: nowrap;
}

/* Footer responsive */
@media (max-width: 1100px) {
	.bp-footer__inner { grid-template-columns: 1.4fr 1fr 1fr; row-gap: 36px; }
	.bp-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
	.bp-footer__inner { grid-template-columns: 1fr 1fr; gap: 30px 24px; }
	.bp-footer__brand { grid-column: 1 / -1; }
	.bp-footer__help { grid-column: 1 / -1; }
	.bp-footer__bar-inner { flex-direction: column; text-align: center; }
	.bp-footer__legal { order: 3; }
}
@media (max-width: 420px) {
	.bp-footer__inner { grid-template-columns: 1fr; }
}

/* =========================================================================
   MY ACCOUNT  — professional dashboard + auth screens
   Styles the default WooCommerce my-account markup (no template override).
   ========================================================================= */
.woocommerce-account .woocommerce {
	max-width: 1140px;
	margin: 0 auto;
	padding: 8px 0;
}

/* ---- Logged-in: sidebar + content layout (.tw-account = template wrapper) */
.woocommerce-account .tw-account {
	display: flex;
	align-items: flex-start;
	gap: 28px;
}
/* Override WooCommerce's default float:left / width:30%-68% */
.woocommerce-account .tw-account > .woocommerce-MyAccount-navigation {
	float: none !important;
	width: 268px !important;
	flex: 0 0 268px;
}
.woocommerce-account .tw-account > .woocommerce-MyAccount-content {
	float: none !important;
	width: auto !important;
	flex: 1 1 auto;
	min-width: 0;
}

/* ---- Navigation card (sidebar) ---------------------------------------- */
.woocommerce-MyAccount-navigation {
	float: none;
	width: auto;
	margin: 0;
	background: var(--su-surface);
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius);
	box-shadow: var(--su-shadow-sm);
	overflow: hidden;
	position: sticky;
	top: 24px;
}
.woocommerce-MyAccount-navigation::before {
	content: "My Account";
	display: block;
	font-family: var(--su-font-head);
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #cfe0f3;
	background: var(--su-navy);
	padding: 16px 20px;
}
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 8px;
}
.woocommerce-MyAccount-navigation ul li { margin: 0; }
.woocommerce-MyAccount-navigation ul li a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-radius: var(--su-radius-sm);
	font-family: var(--su-font-head);
	font-size: .92rem;
	font-weight: 600;
	color: var(--su-ink-soft);
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-MyAccount-navigation ul li a::before {
	content: "";
	width: 19px;
	height: 19px;
	flex: 0 0 19px;
	background-color: currentColor;
	-webkit-mask: var(--su-acc-ico) center / contain no-repeat;
	        mask: var(--su-acc-ico) center / contain no-repeat;
	opacity: .85;
}
.woocommerce-MyAccount-navigation ul li a:hover {
	background: var(--su-surface-2);
	color: var(--su-navy);
}
.woocommerce-MyAccount-navigation ul li.is-active a {
	background: var(--su-navy);
	color: #fff;
}
.woocommerce-MyAccount-navigation ul li.is-active a::before { opacity: 1; }

/* Per-item icons (inline SVG, masked to currentColor) */
.woocommerce-MyAccount-navigation-link--dashboard a       { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='9'/><rect x='14' y='3' width='7' height='5'/><rect x='14' y='12' width='7' height='9'/><rect x='3' y='16' width='7' height='5'/></svg>"); }
.woocommerce-MyAccount-navigation-link--orders a          { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/><path d='M3 6h18'/><path d='M16 10a4 4 0 0 1-8 0'/></svg>"); }
.woocommerce-MyAccount-navigation-link--downloads a       { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><path d='M7 10l5 5 5-5'/><path d='M12 15V3'/></svg>"); }
.woocommerce-MyAccount-navigation-link--edit-address a    { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 12-9 12s-9-5-9-12a9 9 0 0 1 18 0Z'/><circle cx='12' cy='10' r='3'/></svg>"); }
.woocommerce-MyAccount-navigation-link--payment-methods a { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2' y='5' width='20' height='14' rx='2'/><path d='M2 10h20'/></svg>"); }
.woocommerce-MyAccount-navigation-link--edit-account a    { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='8' r='4'/><path d='M4 21a8 8 0 0 1 16 0'/></svg>"); }
.woocommerce-MyAccount-navigation-link--customer-logout a { --su-acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><path d='M16 17l5-5-5-5'/><path d='M21 12H9'/></svg>"); }

/* ---- Content card ------------------------------------------------------ */
.woocommerce-MyAccount-content {
	float: none;
	width: auto;
	margin: 0;
	background: var(--su-surface);
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius);
	box-shadow: var(--su-shadow-sm);
	padding: 30px 32px;
	min-height: 360px;
}
.woocommerce-MyAccount-content > p:first-child { margin-top: 0; }
.woocommerce-MyAccount-content a:not(.button) {
	color: var(--su-navy);
	font-weight: 600;
}
.woocommerce-MyAccount-content mark {
	background: var(--su-surface-2);
	color: var(--su-navy);
	padding: 1px 6px;
	border-radius: 4px;
}

/* ======================================================================
   LOGGED-OUT  —  branded split-screen auth (tw-auth, template override)
   ====================================================================== */
.woocommerce-account:not(.logged-in) .woocommerce {
	max-width: 1000px;
	margin: 8px auto 0;
}
.woocommerce-account:not(.logged-in) .woocommerce > h2 { display: none; } /* legacy heading */

/* Hide the "My account" page title on the account page */
.woocommerce-account .entry-header,
.woocommerce-account h1.entry-title { display: none; }

.tw-auth {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	background: var(--su-surface);
	border: 1px solid var(--su-line);
	border-radius: 16px;
	box-shadow: var(--su-shadow-md);
	overflow: hidden;
}

/* ---- Brand panel ------------------------------------------------------ */
.tw-auth__brand {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 28px;
	padding: 40px 38px;
	color: #eaf1fb;
	background:
		radial-gradient(120% 120% at 0% 0%, rgba(90,169,230,.35) 0%, rgba(90,169,230,0) 45%),
		linear-gradient(160deg, var(--su-navy) 0%, var(--su-navy-deep) 100%);
	overflow: hidden;
}
.tw-auth__brand::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -70px;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	background: rgba(255,255,255,.04);
}
.tw-auth__wordmark {
	font-family: var(--su-font-head);
	font-weight: 800;
	font-size: 1.45rem;
	letter-spacing: .02em;
	color: #fff;
}
.tw-auth__wordmark span { color: var(--su-sky); }
.tw-auth__brand-body { position: relative; z-index: 1; }
.tw-auth__headline {
	font-family: var(--su-font-head);
	color: #fff;
	font-size: 1.85rem;
	line-height: 1.15;
	margin: 0 0 12px;
}
.tw-auth__sub {
	color: #c4d4ea;
	font-size: .96rem;
	line-height: 1.6;
	margin: 0 0 22px;
	max-width: 30ch;
}
.tw-auth__points {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}
.tw-auth__points li {
	position: relative;
	padding-left: 30px;
	font-size: .92rem;
	color: #e3ecf8;
}
.tw-auth__points li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 1px;
	width: 19px;
	height: 19px;
	background: var(--su-sky);
	border-radius: 50%;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center / 12px no-repeat;
	        mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center / 12px no-repeat;
}
.tw-auth__brand-foot {
	position: relative;
	z-index: 1;
	font-size: .88rem;
	color: #c4d4ea;
}
.tw-auth__contact a { color: #fff; font-weight: 700; text-decoration: none; }
.tw-auth__contact a:hover { color: var(--su-sky); }

/* ---- Form panel ------------------------------------------------------- */
.tw-auth__panel { padding: 44px 46px; }
.tw-auth__title {
	font-family: var(--su-font-head);
	font-size: 1.5rem;
	color: var(--su-navy);
	margin: 0 0 4px;
	text-align: left;
}
.tw-auth__title-sub {
	color: var(--su-muted);
	font-size: .92rem;
	margin: 0 0 26px;
}
.tw-auth form.woocommerce-form-login,
.tw-auth form.woocommerce-form-register {
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
}
.tw-auth .form-row { margin-bottom: 18px; }
.tw-auth form .form-row label {
	display: block;
	font-family: var(--su-font-head);
	font-size: .82rem;
	font-weight: 600;
	color: var(--su-ink-soft);
	margin-bottom: 7px;
}
.tw-auth form .form-row label .required { color: var(--su-cta); border: 0; }
.tw-auth form .form-row input.input-text {
	width: 100%;
	border: 1px solid var(--su-line-strong);
	border-radius: var(--su-radius-sm);
	padding: 13px 15px;
	min-height: 50px;
	background: var(--su-surface);
	color: var(--su-ink);
	transition: border-color .15s ease, box-shadow .15s ease;
}
.tw-auth form .form-row input.input-text:focus {
	border-color: var(--su-navy);
	outline: none;
	box-shadow: 0 0 0 3px rgba(20,48,92,.12);
}
.tw-auth__row-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 2px 0 22px;
}
.tw-auth__row-meta .woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: .88rem;
	color: var(--su-ink-soft);
}
.tw-auth__forgot { font-size: .88rem; font-weight: 600; color: var(--su-navy); white-space: nowrap; }
.tw-auth__forgot:hover { color: var(--su-cta-deep); }
.tw-auth__submit-row { margin: 0; }
.tw-auth button.woocommerce-form-login__submit,
.tw-auth button.woocommerce-form-register__submit {
	width: 100%;
	background: var(--su-cta) !important;
	border-color: var(--su-cta) !important;
	color: #fff !important;
	padding: 15px 24px !important;
	font-size: .95rem !important;
	letter-spacing: .02em;
}
.tw-auth button.woocommerce-form-login__submit:hover,
.tw-auth button.woocommerce-form-register__submit:hover {
	background: var(--su-cta-deep) !important;
	border-color: var(--su-cta-deep) !important;
}

/* Divider between login & register (when registration enabled) */
.tw-auth__divider {
	position: relative;
	text-align: center;
	margin: 30px 0 24px;
}
.tw-auth__divider::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--su-line);
}
.tw-auth__divider span {
	position: relative;
	background: var(--su-surface);
	padding: 0 14px;
	font-size: .82rem;
	font-weight: 600;
	color: var(--su-muted);
}
.tw-auth__hint { font-size: .9rem; color: var(--su-ink-soft); }

/* ---- Order/address blocks inside content ------------------------------ */
.woocommerce-MyAccount-content table.shop_table { margin: 0; }
.woocommerce-MyAccount-content .woocommerce-Addresses { margin-top: 8px; }
.woocommerce-MyAccount-content .woocommerce-Address {
	background: var(--su-surface-2);
	border: 1px solid var(--su-line);
	border-radius: var(--su-radius-sm);
	padding: 20px 22px;
}
.woocommerce-MyAccount-content .woocommerce-Address-title h3 { margin-top: 0; }

/* ---- Responsive -------------------------------------------------------- */
@media (max-width: 880px) {
	.woocommerce-account .tw-account {
		flex-direction: column;
		gap: 18px;
	}
	.woocommerce-account .tw-account > .woocommerce-MyAccount-navigation {
		width: auto !important;
		flex: 0 0 auto;
		position: static;
	}
	.woocommerce-MyAccount-navigation ul {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
	}
	.woocommerce-MyAccount-navigation ul li a { padding: 10px 12px; }
	.woocommerce-MyAccount-content { padding: 24px 20px; }
}
@media (max-width: 860px) {
	.tw-auth { grid-template-columns: 1fr; }
	.tw-auth__brand {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 16px 24px;
		padding: 26px 28px;
	}
	.tw-auth__brand-body { flex: 1 1 100%; }
	.tw-auth__headline { font-size: 1.5rem; margin-bottom: 8px; }
	.tw-auth__sub { margin-bottom: 16px; max-width: none; }
	.tw-auth__brand-foot { flex: 1 1 100%; }
}
@media (max-width: 480px) {
	.tw-auth__panel { padding: 30px 24px; }
	.tw-auth__brand { padding: 24px 22px; }
	.tw-auth__points { gap: 9px; }
}