/**
 * WooCommerce Proforma Workflow — front-end styles.
 *
 * Namespaced under .wcpw-* and written with logical properties so the same
 * file works in both RTL and LTR without a separate stylesheet.
 */

.wcpw-cart-button {
	margin-block-start: 1em;
}

.wcpw-cart-button__link {
	display: inline-block;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

.wcpw-cart-button__hint {
	display: block;
	margin-block-start: 0.5em;
	opacity: 0.8;
}

/* Cart Block button (PRD §10.4) ------------------------------------------ */

.wcpw-block-cart-button {
	margin-block-start: 0.75em;
}

.wcpw-block-cart-button__link {
	display: block;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

.wcpw-block-cart-button__hint {
	display: block;
	margin-block-start: 0.5em;
	font-size: 0.85em;
	opacity: 0.8;
}

/* Notices ---------------------------------------------------------------- */

.wcpw-notice {
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 6px;
	padding: 1em 1.25em;
	margin-block: 1em;
	background: rgba(0, 0, 0, 0.02);
}

.wcpw-notice p {
	margin: 0.35em 0;
}

.wcpw-notice--info {
	border-color: rgba(34, 113, 177, 0.35);
	background: rgba(34, 113, 177, 0.06);
}

.wcpw-notice--success {
	border-color: rgba(30, 138, 76, 0.35);
	background: rgba(30, 138, 76, 0.07);
}

/* Items table ------------------------------------------------------------ */

.wcpw-items {
	width: 100%;
	border-collapse: collapse;
	margin-block: 1em;
}

.wcpw-items th,
.wcpw-items td {
	padding: 0.75em;
	text-align: start;
	vertical-align: middle;
	border-block-end: 1px solid rgba(0, 0, 0, 0.08);
}

.wcpw-items thead th {
	font-weight: 600;
}

.wcpw-item__image img {
	width: 56px;
	height: auto;
	border-radius: 4px;
}

.wcpw-item__name {
	font-weight: 600;
}

.wcpw-item__meta,
.wcpw-item__sku {
	font-size: 0.85em;
	opacity: 0.85;
	margin-block-start: 0.25em;
}

.wcpw-items__total-label {
	text-align: end;
	font-weight: 600;
}

/* Form ------------------------------------------------------------------- */

.wcpw-form {
	margin-block-start: 1.5em;
}

.wcpw-form__row {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}

.wcpw-form__row .wcpw-field {
	flex: 1 1 240px;
}

.wcpw-field {
	display: block;
	margin-block: 0.75em;
}

.wcpw-field label {
	display: block;
	margin-block-end: 0.35em;
	font-weight: 600;
}

.wcpw-field input[type="text"],
.wcpw-field input[type="tel"],
.wcpw-field input[type="email"],
.wcpw-field textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.6em 0.75em;
}

.wcpw-field--checkbox label {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	font-weight: 400;
}

.wcpw-field--checkbox input {
	margin-block-start: 0.2em;
}

.wcpw-field .required {
	color: #b32d2e;
	border: 0;
	text-decoration: none;
}

.wcpw-form__actions {
	margin-block-start: 1.5em;
}

.wcpw-button--primary[disabled],
.wcpw-request-form__submit[aria-busy="true"] {
	opacity: 0.6;
	cursor: progress;
}

/* Success ---------------------------------------------------------------- */

.wcpw-success__meta {
	list-style: none;
	margin: 1em 0;
	padding: 0;
}

.wcpw-success__meta li {
	display: flex;
	gap: 0.5em;
	padding-block: 0.35em;
	border-block-end: 1px solid rgba(0, 0, 0, 0.06);
}

.wcpw-success__label {
	font-weight: 600;
	min-width: 10em;
}

.wcpw-success__actions {
	margin-block-start: 1.25em;
}

/* Small screens: turn the items table into stacked cards (PRD §36). */
@media (max-width: 600px) {

	.wcpw-items thead {
		display: none;
	}

	.wcpw-items,
	.wcpw-items tbody,
	.wcpw-items tr,
	.wcpw-items td {
		display: block;
		width: 100%;
	}

	.wcpw-items tr {
		margin-block-end: 1em;
		border: 1px solid rgba(0, 0, 0, 0.08);
		border-radius: 6px;
		padding: 0.5em;
	}

	.wcpw-items td {
		display: flex;
		justify-content: space-between;
		gap: 1em;
		border-block-end: 0;
	}

	.wcpw-items td[data-title]::before {
		content: attr(data-title);
		font-weight: 600;
	}
}

/* My Account: proforma panel (PRD §12) ----------------------------------- */

.wcpw-notice--error {
	border-color: rgba(180, 46, 46, 0.35);
	background: rgba(180, 46, 46, 0.06);
}

.wcpw-account__back {
	margin-block-end: 1em;
}

.wcpw-account__title {
	margin-block: 0 0.5em;
}

.wcpw-account__subtitle {
	margin-block: 1.5em 0.5em;
}

.wcpw-account__meta {
	list-style: none;
	margin: 1em 0;
	padding: 0;
}

.wcpw-account__meta li {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	padding-block: 0.35em;
	border-block-end: 1px solid rgba(0, 0, 0, 0.06);
}

.wcpw-account__label {
	font-weight: 600;
	min-width: 10em;
}

.wcpw-account__hint {
	opacity: 0.8;
	font-size: 0.9em;
}

.wcpw-status-badge {
	display: inline-block;
	padding: 0.15em 0.6em;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.06);
	font-size: 0.9em;
	white-space: nowrap;
}

.wcpw-status--quote-approved .wcpw-status-badge {
	background: rgba(30, 138, 76, 0.14);
}

.wcpw-status--quote-rejected .wcpw-status-badge,
.wcpw-status--quote-expired .wcpw-status-badge,
.wcpw-status--quote-cancelled .wcpw-status-badge {
	background: rgba(180, 46, 46, 0.12);
}

.wcpw-col--actions .wcpw-action,
.wcpw-account__actions .wcpw-action {
	margin-inline-end: 0.5em;
	margin-block-end: 0.35em;
}

.wcpw-action-form {
	display: inline-block;
	margin: 0;
}

.wcpw-account__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	margin-block-start: 1.5em;
}

.wcpw-account__addresses {
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
}

.wcpw-account__address {
	flex: 1 1 16em;
}

.wcpw-account__address address {
	font-style: normal;
}

.wcpw-account__note {
	white-space: pre-line;
}

.wcpw-items__total-value {
	font-weight: 600;
}

.wcpw-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75em;
	margin-block-start: 1.25em;
}

.wcpw-pagination__status {
	opacity: 0.85;
}

/* Theme-integration polish -------------------------------------------------
 * Works standalone (so a bare theme still looks intentional) while inheriting
 * the theme's fonts/colours for text. Kept defensive and RTL-safe.
 */

.wcpw-request,
.wcpw-success {
	margin-block: 1em;
}

.wcpw-request__title {
	margin-block: 1.25em 0.6em;
	font-size: 1.15em;
	font-weight: 700;
}

.wcpw-request__items,
.wcpw-request-form__form,
.wcpw-success {
	padding: 1.25em 1.5em;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 12px;
	background: rgba(0, 0, 0, 0.015);
	margin-block-end: 1.5em;
}

.wcpw-request__items > .wcpw-request__title:first-child,
.wcpw-request-form__form > .wcpw-request__title:first-child {
	margin-block-start: 0;
}

.wcpw-field input[type="text"],
.wcpw-field input[type="tel"],
.wcpw-field input[type="email"],
.wcpw-field textarea {
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	background: #fff;
	line-height: 1.6;
}

.wcpw-field input:focus,
.wcpw-field textarea:focus {
	border-color: #123a86;
	outline: 2px solid rgba(18, 58, 134, 0.18);
	outline-offset: 1px;
}

.wcpw-field input[readonly] {
	background: rgba(0, 0, 0, 0.04);
}

/* Primary button + success actions — styled standalone with theme-matching
 * blue, scoped tightly so it overrides a generic theme `.button`. */
.wcpw-form__actions .wcpw-button--primary,
.wcpw-success__actions .wcpw-button,
a.wcpw-button {
	display: inline-block;
	padding: 0.8em 2.2em;
	border: 0;
	border-radius: 10px;
	background: #123a86;
	color: #fff;
	font-weight: 700;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease;
}

.wcpw-form__actions .wcpw-button--primary:hover,
.wcpw-success__actions .wcpw-button:hover,
a.wcpw-button:hover {
	background: #0e2c66;
	color: #fff;
}

.wcpw-items thead th {
	background: rgba(0, 0, 0, 0.03);
}

.wcpw-items tfoot .wcpw-items__total-label,
.wcpw-items tfoot .wcpw-items__total {
	font-size: 1.05em;
}

.wcpw-success__subline {
	margin-block: 0.4em 0;
	opacity: 0.9;
}

.wcpw-success__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75em;
	align-items: center;
}

/* Secondary success button — outlined, distinct from the primary. */
.wcpw-success__actions .wcpw-button--secondary {
	background: transparent;
	color: #123a86;
	box-shadow: inset 0 0 0 1px #123a86;
}

.wcpw-success__actions .wcpw-button--secondary:hover {
	background: rgba(18, 58, 134, 0.08);
	color: #123a86;
}