/*
Theme Name: ShopSCWR
Description: Lightweight storefront theme for ShopSCWR.
Template: twentytwentyfive
Version: 1.1.0
Text Domain: scwr-shop
*/

:root {
	--scwr-radius: 8px;
	--scwr-field-h: 48px;
	--scwr-orange: var(--wp--preset--color--accent);
	--scwr-ink: var(--wp--preset--color--contrast);
	--scwr-muted: var(--wp--preset--color--muted);
	--scwr-line: var(--wp--preset--color--border);
	--scwr-subtle: var(--wp--preset--color--subtle);
}

body { -webkit-font-smoothing: antialiased; }
:where(h1) { font-size: 2rem; }

/* ── Header ─────────────────────────────────────────────────────────────── */

.scwr-header { border-bottom: 1px solid var(--scwr-line); background: #fff; }
.scwr-logo img { display: block; height: 44px; width: auto; }
.scwr-nav { align-items: center; }
.scwr-nav a { text-decoration: none; color: var(--scwr-ink); }
.scwr-nav a:hover { color: var(--wp--preset--color--accent-dark); }

/* ── Buttons & fields (one system everywhere) ───────────────────────────── */

.wp-element-button,
.woocommerce .button,
.wc-block-components-button:not(.is-link) {
	box-sizing: border-box;
	min-height: var(--scwr-field-h);
	padding: 0 24px;
	border: 0;
	border-radius: var(--scwr-radius);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s, color .15s;
}

.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce-page form .form-row .input-text {
	box-sizing: border-box;
	width: 100%;
	min-height: var(--scwr-field-h);
	padding: 10px 14px;
	border: 1px solid #cfd4db;
	border-radius: var(--scwr-radius);
	background: #fff;
	font-size: 16px;
	box-shadow: none;
}
.woocommerce form .form-row .input-text:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--scwr-orange);
	box-shadow: 0 0 0 3px rgba(255, 146, 0, .2);
}
.woocommerce form .form-row { margin: 0 0 18px; padding: 0; }
.woocommerce form .form-row label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.woocommerce form .form-row .required { color: var(--scwr-muted); }
.woocommerce form .password-input { display: block; position: relative; }

/* ── Notices ────────────────────────────────────────────────────────────── */

.woocommerce-error, .woocommerce-message, .woocommerce-info,
.wc-block-components-notice-banner {
	border-radius: var(--scwr-radius);
	font-size: 15px;
}

/* ── Login (My Account, logged out) ─────────────────────────────────────── */

/* The login card has its own title; hide the page's "My account" heading. */
body.woocommerce-account:not(.logged-in) main > .wp-block-post-title { display: none; }

.scwr-auth {
	max-width: 420px;
	margin: 24px auto 0;
	padding: 36px 32px 32px;
	border: 1px solid var(--scwr-line);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px rgba(16, 24, 40, .06);
}
.scwr-auth__title { margin: 0 0 6px; font-size: 1.6rem; text-align: center; }
.scwr-auth__lead { max-width: 300px; margin: 0 auto 28px; color: var(--scwr-muted); font-size: 15px; text-align: center; }
.scwr-auth form.login { margin: 0; padding: 0; border: 0; }
.scwr-auth__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin: 4px 0 20px;
	font-size: 14px;
}
.scwr-auth__row label { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-weight: 400; }
.scwr-auth__row a { color: var(--scwr-ink); }
.woocommerce .scwr-auth form.login .woocommerce-form-login__submit { float: none; width: 100%; margin: 0; }

.scwr-staff-login { clear: both; margin-top: 24px; }
.scwr-divider { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; color: var(--scwr-muted); font-size: 13px; }
.scwr-divider::before, .scwr-divider::after { content: ""; flex: 1; height: 1px; background: var(--scwr-line); }
.scwr-staff-button.wp-element-button { width: 100%; background: var(--scwr-ink); color: #fff; }
.scwr-staff-button.wp-element-button:hover { background: #000; color: #fff; }

/* Lost / reset password use the same card look. */
.woocommerce-account:not(.logged-in) form.lost_reset_password {
	max-width: 420px;
	margin: 24px auto 0;
	padding: 32px;
	border: 1px solid var(--scwr-line);
	border-radius: 12px;
}
.woocommerce-account:not(.logged-in) form.lost_reset_password .form-row-first { width: 100%; float: none; }
.woocommerce-account:not(.logged-in) form.lost_reset_password .button { width: 100%; }

/* ── My Account (logged in) ─────────────────────────────────────────────── */

.woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 220px 1fr; gap: 48px; align-items: start; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border: 1px solid var(--scwr-line); border-radius: var(--scwr-radius); overflow: hidden; }
.woocommerce-MyAccount-navigation li + li { border-top: 1px solid var(--scwr-line); }
.woocommerce-MyAccount-navigation a { display: block; padding: 12px 16px; text-decoration: none; color: var(--scwr-ink); font-size: 15px; }
.woocommerce-MyAccount-navigation a:hover { background: var(--scwr-subtle); }
.woocommerce-MyAccount-navigation .is-active a { background: var(--scwr-subtle); font-weight: 600; box-shadow: inset 3px 0 0 var(--scwr-orange); }
.woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content { width: auto !important; float: none !important; }
@media (max-width: 780px) {
	.woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; gap: 24px; }
}

/* ── Product grid ───────────────────────────────────────────────────────── */

.wc-block-product-template .wc-block-components-product-image img,
.wc-block-product-template .wp-block-woocommerce-product-image img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: var(--scwr-subtle);
	border-radius: var(--scwr-radius);
	transition: opacity .15s;
}
.wc-block-product-template li:hover img { opacity: .9; }
.wc-block-product-template .wp-block-post-title { font-size: 1rem; font-weight: 600; }
.wc-block-product-template .wp-block-post-title a { text-decoration: none; }

/* ── Single product ─────────────────────────────────────────────────────── */

.single-product .onsale,
.wc-block-components-product-sale-badge {
	border-radius: 999px;
	background: var(--scwr-ink);
	color: #fff;
	border: 0;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.single-product del { color: var(--scwr-muted); font-weight: 400; }
.single-product ins { text-decoration: none; }

/* ── Cart & checkout ────────────────────────────────────────────────────── */

.wc-block-cart .wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button { width: 100%; }
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select__select { border-radius: var(--scwr-radius) !important; }

/* ── Staff session bar ──────────────────────────────────────────────────── */

.scwr-staff-bar { background: var(--scwr-ink); color: #fff; font-size: 14px; text-align: center; padding: 8px 16px; }
.scwr-staff-bar a { color: var(--scwr-orange); margin-left: 8px; }

/* ── Footer ─────────────────────────────────────────────────────────────── */

.scwr-footer { border-top: 1px solid var(--scwr-line); }
.scwr-footer a { color: inherit; }

/* Logged-out hint on product pages (scwr-staff plugin) */
.scwr-staff-hint { margin: 4px 0 0; color: var(--scwr-muted); font-size: 14px; }
.scwr-staff-hint a { color: var(--scwr-ink); font-weight: 600; }