/*
 * Book format dropdown — black & gold identity.
 * Colors are centralized here as custom properties: if the exact gold
 * hex used elsewhere on the site differs, only these two lines need editing.
 */
:root {
	--cma-black: #121212;
	--cma-gold: #c8a24d;
	--cma-gold-soft: rgba(200, 162, 77, 0.12);
	--cma-cream: #f4efe4;
}

.cma-bf-heading {
	margin: 18px 0 10px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--cma-gold) !important;
	letter-spacing: .4px !important;
	text-transform: uppercase;
	direction: rtl;
	text-align: right;
	display: block;
}

.cma-bf-wrapper {
	max-width: 440px;
	margin: 0 0 14px;
}

/*
 * !important throughout this control: the surrounding page/theme CSS loads
 * *after* this stylesheet and ships its own generic `select` rules, which
 * would otherwise win the cascade and silently fall back to a plain white
 * browser dropdown.
 */
select.cma-bf-select {
	direction: rtl !important;
	display: block !important;
	width: 100% !important;
	max-width: 440px !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	background-color: var(--cma-black) !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%23c8a24d' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: left 16px center !important;
	color: var(--cma-cream) !important;
	border: 1.5px solid var(--cma-gold) !important;
	border-radius: 10px !important;
	/* The theme forces a fixed --wd-form-height (~35-46px) on every <select>
	   site-wide; height:auto + min-height here override that so our padding
	   never gets clipped inside a box that's too short for it. */
	height: auto !important;
	min-height: 54px !important;
	padding: 14px 46px 14px 18px !important;
	font-size: 15.5px !important;
	font-weight: 600 !important;
	font-family: inherit !important;
	line-height: 1.3 !important;
	cursor: pointer;
	box-sizing: border-box !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25) !important;
	transition: box-shadow .2s ease, border-color .2s ease;
	overflow: visible !important;
}

select.cma-bf-select:hover {
	border-color: #ddb968 !important;
}

select.cma-bf-select:focus {
	outline: none !important;
	border-color: var(--cma-gold) !important;
	box-shadow: 0 0 0 3px var(--cma-gold-soft), 0 2px 10px rgba(0, 0, 0, 0.25) !important;
}

select.cma-bf-select option {
	background: #1a1a1a !important;
	color: var(--cma-cream) !important;
	font-weight: 600;
	padding: 10px !important;
}

/* Quantity stepper on a book product page -- restyled to match the format
   dropdown above it (same black/gold identity, same 54px height). */
form.cart .quantity {
	display: inline-flex !important;
	align-items: stretch !important;
	height: 54px !important;
	background-color: var(--cma-black) !important;
	border: 1.5px solid var(--cma-gold) !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25) !important;
}

form.cart .quantity .qty,
form.cart .quantity input.qty {
	background: transparent !important;
	border: none !important;
	color: var(--cma-cream) !important;
	font-size: 15.5px !important;
	font-weight: 700 !important;
	text-align: center !important;
	width: 56px !important;
	height: 100% !important;
	padding: 0 !important;
	box-shadow: none !important;
	-moz-appearance: textfield !important;
}

form.cart .quantity .qty::-webkit-inner-spin-button,
form.cart .quantity .qty::-webkit-outer-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}

form.cart .quantity .minus,
form.cart .quantity .plus {
	background: transparent !important;
	border: none !important;
	color: var(--cma-gold) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	width: 44px !important;
	height: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: background-color .15s ease;
}

form.cart .quantity .minus:hover,
form.cart .quantity .plus:hover {
	background-color: var(--cma-gold-soft) !important;
}

form.cart .quantity .minus {
	border-inline-end: 1px solid rgba(200, 162, 77, 0.35) !important;
}

form.cart .quantity .plus {
	border-inline-start: 1px solid rgba(200, 162, 77, 0.35) !important;
}

.cma-bf-hint {
	margin: 9px 0 4px !important;
	font-size: 13px !important;
	color: rgba(244, 239, 228, 0.65) !important;
	direction: rtl;
	text-align: right;
	display: none;
}

.cma-bf-alert {
	margin: 8px 0 12px;
	padding: 10px 14px;
	background: #fdecea;
	border-inline-start: 3px solid #c0392b;
	color: #8a231a;
	font-size: 13.5px;
	font-weight: 600;
	direction: rtl;
	text-align: right;
	border-radius: 4px;
}

@media ( max-width: 480px ) {
	.cma-bf-wrapper,
	select.cma-bf-select {
		max-width: 100%;
	}
}

/* ---------------- Checkout: notices ---------------- */

.cma-bf-notice {
	direction: rtl;
	text-align: right;
	background: var(--cma-black);
	color: var(--cma-cream);
	border: 1px solid var(--cma-gold);
	border-radius: 8px;
	padding: 12px 16px;
	font-size: 13.5px;
	line-height: 1.6;
}

/* ---------------- Product page: "can't mix PDF + printed" notice ---------------- */

/* Neutralize the theme's default yellow/gold error-notice box (background,
   border, padding, its own icon) wherever it wraps our custom card, so the
   card below is the only visible styling instead of "nice card stuck inside
   an ugly box". */
.woocommerce-error:has(.cma-bf-mixed-notice) {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	box-shadow: none !important;
}

.woocommerce-error:has(.cma-bf-mixed-notice)::before {
	display: none !important;
}

.woocommerce-error:has(.cma-bf-mixed-notice) li {
	padding: 0 !important;
	margin: 0 !important;
	background: none !important;
	border: none !important;
	list-style: none !important;
}

.cma-bf-mixed-notice {
	position: relative;
	direction: rtl;
	text-align: right;
	background: linear-gradient(165deg, #1a1a1a, #101010);
	border: 1px solid rgba(200, 162, 77, 0.5);
	border-radius: 16px;
	padding: 22px 24px 24px;
	overflow: hidden;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}

/* Thin gold accent bar along the top edge -- a small premium touch that
   also doubles as an at-a-glance "this needs your attention" cue. */
.cma-bf-mixed-notice::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, var(--cma-gold), transparent);
}

.cma-bf-mixed-notice__top {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 10px;
}

.cma-bf-mixed-notice__icon {
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	background: rgba(200, 162, 77, 0.14);
	border: 1px solid rgba(200, 162, 77, 0.4);
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(200, 162, 77, 0.06);
}

.cma-bf-mixed-notice__heading {
	margin: 0 !important;
	color: var(--cma-cream) !important;
	font-size: 16.5px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
}

.cma-bf-mixed-notice__text {
	margin: 0 0 20px !important;
	padding-inline-start: 54px;
	color: rgba(244, 239, 228, 0.78);
	font-size: 14px;
	line-height: 1.75;
	font-weight: 400;
}

.cma-bf-mixed-notice__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding-inline-start: 54px;
}

.cma-bf-mixed-notice__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 22px;
	border-radius: 9px;
	font-size: 13.5px;
	font-weight: 700;
	text-decoration: none !important;
	transition: filter 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
	white-space: nowrap;
}

.cma-bf-mixed-notice__btn--primary {
	background: var(--cma-gold) !important;
	color: var(--cma-black) !important;
	border: 1px solid var(--cma-gold) !important;
	box-shadow: 0 4px 14px rgba(200, 162, 77, 0.25);
}

.cma-bf-mixed-notice__btn--primary:hover {
	filter: brightness(1.08);
	transform: translateY(-1px);
}

.cma-bf-mixed-notice__btn--ghost {
	background: transparent !important;
	color: var(--cma-cream) !important;
	border: 1px solid rgba(244, 239, 228, 0.3) !important;
}

.cma-bf-mixed-notice__btn--ghost:hover {
	background: rgba(244, 239, 228, 0.06) !important;
	border-color: rgba(244, 239, 228, 0.55) !important;
	transform: translateY(-1px);
}

@media (max-width: 560px) {
	.cma-bf-mixed-notice {
		padding: 18px 16px 20px;
		border-radius: 14px;
	}
	.cma-bf-mixed-notice__icon {
		width: 36px;
		height: 36px;
		font-size: 17px;
	}
	.cma-bf-mixed-notice__heading {
		font-size: 15px !important;
	}
	.cma-bf-mixed-notice__text,
	.cma-bf-mixed-notice__actions {
		padding-inline-start: 0;
	}
	.cma-bf-mixed-notice__text {
		margin-top: 14px !important;
		font-size: 13.5px;
	}
	.cma-bf-mixed-notice__actions {
		flex-direction: column;
	}
	.cma-bf-mixed-notice__btn {
		width: 100%;
		padding: 13px 20px;
	}
}

/* ---------------- Checkout: field layout for book-only carts ---------------- */

.woocommerce-checkout .required {
	color: #c0392b;
	font-weight: 700;
}

.woocommerce-checkout form.woocommerce-checkout .woocommerce-invalid input.input-text,
.woocommerce-checkout form.woocommerce-checkout .woocommerce-invalid select {
	border-color: #c0392b !important;
	box-shadow: 0 0 0 1px #c0392b;
}

@media ( max-width: 600px ) {
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last {
		width: 100% !important;
		float: none !important;
	}
	.woocommerce-checkout .col2-set,
	.woocommerce-checkout .col-1,
	.woocommerce-checkout .col-2 {
		width: 100% !important;
		float: none !important;
	}
	.woocommerce-checkout input.input-text,
	.woocommerce-checkout select,
	.woocommerce-checkout textarea {
		max-width: 100%;
		box-sizing: border-box;
	}
}

/* Quick-access download button appended directly onto the "Thank you, your
   order has been received" line -- visible immediately, no scrolling past
   the order-summary list needed to find it. */
.cma-bf-quick-download-wrap {
	display: block;
	margin-top: 14px;
}

.cma-bf-quick-download-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--cma-gold);
	color: var(--cma-black) !important;
	font-weight: 700;
	font-size: 14.5px;
	padding: 13px 30px;
	border-radius: 9px;
	text-decoration: none !important;
	box-shadow: 0 4px 14px rgba(200, 162, 77, 0.3);
	transition: filter 0.15s ease, transform 0.15s ease;
}

.cma-bf-quick-download-btn:hover {
	filter: brightness(1.08);
	transform: translateY(-1px);
}

@media (max-width: 480px) {
	.cma-bf-quick-download-btn {
		width: 100%;
		justify-content: center;
	}
}

/* Thank-you / order-received download box. */
.cma-bf-thankyou {
	--cma-black: #121212;
	--cma-gold: #c8a24d;
	--cma-cream: #f4efe4;
	direction: rtl;
	max-width: 640px;
	margin: 28px auto;
}

.cma-bf-thankyou-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	background: var(--cma-black);
	border: 1px solid var(--cma-gold);
	border-radius: 14px;
	padding: 24px;
	margin-bottom: 16px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.cma-bf-thankyou-cover {
	flex: 0 0 auto;
	width: 96px;
	height: 128px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid rgba(200, 162, 77, 0.4);
}

.cma-bf-thankyou-info {
	flex: 1 1 220px;
	min-width: 0;
	text-align: right;
}

.cma-bf-thankyou-title {
	margin: 0 0 8px;
	color: var(--cma-cream);
	font-size: 18px;
}

.cma-bf-thankyou-msg {
	margin: 0 0 14px;
	color: var(--cma-gold);
	font-weight: 700;
	font-size: 14.5px;
}

.cma-bf-thankyou-msg.cma-bf-pending {
	color: var(--cma-cream);
}

.cma-bf-thankyou-btn {
	display: inline-block;
	background: var(--cma-gold);
	color: var(--cma-black) !important;
	font-weight: 700;
	padding: 12px 28px;
	border-radius: 8px;
	text-decoration: none !important;
	margin-bottom: 10px;
}

.cma-bf-thankyou-btn:hover {
	filter: brightness(1.08);
}

.cma-bf-thankyou-note {
	margin: 4px 0 0;
	color: rgba(244, 239, 228, 0.65);
	font-size: 12.5px;
}

@media ( max-width: 480px ) {
	.cma-bf-thankyou-box {
		flex-direction: column;
		text-align: center;
	}
	.cma-bf-thankyou-info {
		text-align: center;
	}
}