/* Checkout Page – One Man One Bag. Desktop sizes follow the 1300px Figma frame. */

.omobc,
.omobc-checkout {
	--brown: #4D1821;
	--brown-dark: #3f141b;
	--brown-soft: #6d462a;
	--cream: #fdfbf7;
	--sand: #f7f2eb;
	--card: #ffffff;
	--line: #e7e0d8;
	--ink: #1d1d1d;
	--text: #4a4a4a;
	--muted: #9a9a9a;
	--feature: #948672;
	--green: #1f8a44;
	--green-bg: #eaf7ea;
	container-type: inline-size;
	container-name: omobc;
	font-family: "Poppins", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
	color: var(--ink);
}
.omobc { background: var(--cream); min-height: 100vh; }
body.omobc-body { margin: 0; background: #fdfbf7; }
:where(.omobc, .omobc-checkout) *, :where(.omobc, .omobc-checkout) *::before, :where(.omobc, .omobc-checkout) *::after { box-sizing: border-box; }
:where(.omobc, .omobc-checkout) :where(h1, h2, h3, p, ul, ol, dl, dd) { margin: 0; padding: 0; }
:where(.omobc, .omobc-checkout) :where(ul, ol) { list-style: none; }
:where(.omobc, .omobc-checkout) a { color: inherit; }
:where(.omobc, .omobc-checkout) button { font: inherit; }
:where(.omobc, .omobc-checkout) img { max-width: 100%; height: auto; display: block; }
:where(.omobc, .omobc-checkout) svg { width: 1em; height: 1em; flex: none; }
.omobc :is(a, button, input, select, textarea, summary, [tabindex="0"]):focus-visible,
.omobc-checkout :is(a, button, input, select, textarea, summary, [tabindex="0"]):focus-visible {
	outline: 2px solid #ffc640; outline-offset: 2px; border-radius: 4px;
}
/* Notices and panels take focus programmatically; they should not draw a ring. */
.omobc [tabindex="-1"]:focus, .omobc [tabindex="-1"]:focus-visible,
.omobc-checkout [tabindex="-1"]:focus, .omobc-checkout [tabindex="-1"]:focus-visible { outline: none !important; }
.omobc-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Header */
.omobc-header {
	background: var(--brown);
	color: #fff;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 24px;
	padding: 14px 36px;
	position: relative;
}
.omobc-header__burger { display: none; background: none; border: 0; color: #fff; font-size: 22px; line-height: 0; padding: 4px; cursor: pointer; }
.omobc-header__logo img { width: 150px; }
.omobc-nav { justify-self: center; }
.omobc-nav__list { display: flex; gap: 44px; }
.omobc-nav__list a { text-decoration: none; text-transform: uppercase; font-size: 15px; padding: 6px 0; border-bottom: 1px solid transparent; }
.omobc-nav__list a:hover { border-bottom-color: currentColor; }
.omobc-header__user { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; color: var(--brown); font-size: 22px; }

/* Page frame */
.omobc-main { max-width: 1300px; margin: 0 auto; padding: 26px 36px 64px; }
.omobc-page-title { font-size: 28px; font-weight: 600; text-transform: uppercase; color: var(--brown); letter-spacing: .02em; margin-bottom: 22px; }
.omobc-columns { display: grid; grid-template-columns: minmax(0, 1.34fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.omobc-card { background: var(--card); border: 1px solid #f1ece5; border-radius: 14px; padding: 26px 30px 30px; box-shadow: 0 1px 3px rgba(60, 30, 0, .05); }
.omobc-card__title { font-size: 18px; font-weight: 600; text-transform: uppercase; color: var(--brown); letter-spacing: .04em; margin-bottom: 22px; }
.omobc-card__subtitle { font-size: 15px; font-weight: 600; text-transform: uppercase; color: var(--brown); letter-spacing: .03em; margin-bottom: 14px; }

/* Fields */
.omobc-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px 22px; }
.omobc-grid > .omobc-col-6 { grid-column: span 6; }
.omobc-grid > .omobc-col-12, .omobc-grid > .form-row { grid-column: span 12; }
.omobc-grid > .omobc-col-6.form-row { grid-column: span 6; }
.omobc-checkout .form-row { margin: 0; padding: 0; }
.omobc-checkout .form-row label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; color: var(--ink); }
.omobc-checkout .form-row label .optional { font-weight: 400; color: var(--muted); }
.omobc-checkout .form-row abbr.required { color: var(--ink); text-decoration: none; border: 0; margin-left: -4px; }
.omobc-checkout .woocommerce-input-wrapper { display: block; width: 100%; }
.omobc-checkout input[type="text"],
.omobc-checkout input[type="tel"],
.omobc-checkout input[type="email"],
.omobc-checkout input[type="number"],
.omobc-checkout input[type="password"],
.omobc-checkout select,
.omobc-checkout textarea,
.omobc-checkout .select2-container .select2-selection--single {
	width: 100%;
	height: 46px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 0 14px;
	font: inherit;
	font-size: 15px;
	color: var(--ink);
	box-shadow: none;
	appearance: none;
}
.omobc-checkout textarea { height: auto; min-height: 96px; padding: 12px 14px; line-height: 1.6; }
.omobc-checkout select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23622900' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 16px;
	padding-right: 40px;
	color: var(--ink);
}
.omobc-checkout ::placeholder { color: #b0a79f; opacity: 1; }
.omobc-checkout input:focus, .omobc-checkout select:focus, .omobc-checkout textarea:focus { border-color: var(--brown); outline: none; box-shadow: 0 0 0 3px rgba(98, 41, 0, .1); }
.omobc-checkout .woocommerce-invalid input, .omobc-checkout .woocommerce-invalid select { border-color: #c0392b; }
.omobc-checkout .select2-container .select2-selection--single { display: flex; align-items: center; }
.omobc-checkout .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 1.4; color: var(--ink); }
.omobc-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px; right: 8px; }

.omobc-field--locked .omobc-locked-value {
	display: flex; align-items: center;
	height: 46px; padding: 0 14px;
	background: var(--sand);
	border: 1px solid #efe6dc;
	border-radius: 8px;
	color: #4a3a2f;
	text-transform: uppercase;
	font-size: 15px;
	letter-spacing: .02em;
}
.omobc-note { display: flex; align-items: center; gap: 10px; color: #6b4a33; font-size: 14px; margin-top: -2px; }
.omobc-note svg { color: var(--brown); font-size: 17px; }

/* Deliver to a different address */
.omobc-toggle { margin: 24px 0 0; }
.omobc-checkbox { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; cursor: pointer; }
.omobc-checkbox input { width: 18px; height: 18px; accent-color: var(--brown); margin: 0; }
.omobc-shipping .shipping_address { margin-top: 20px; padding-top: 20px; border-top: 1px solid #f0eae3; }
.omobc-additional { margin-top: 22px; padding-top: 20px; border-top: 1px solid #f0eae3; }

/* Trust strip */
.omobc-features { display: grid; grid-template-columns: repeat(4, 1fr); border-block: 1px solid #efeae2; margin: 22px 0 0; padding: 14px 0; max-width: 620px; }
.omobc-features li { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; color: var(--feature); font-size: 13px; font-style: italic; line-height: 1.3; border-left: 1px solid #efeae2; padding: 4px 8px; }
.omobc-features li:first-child { border-left: 0; }
.omobc-features svg { font-size: 24px; }
.omobc-features span { max-width: 6.5em; }

/* Order summary */
.omobc-item { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 20px; align-items: start; }
.omobc-item + .omobc-item { margin-top: 18px; }
.omobc-item__thumb { background: #f4efe9; border-radius: 10px; padding: 10px; display: grid; place-items: center; }
.omobc-item__name { font-size: 20px; font-weight: 600; color: var(--brown); line-height: 1.3; }
.omobc-item__qty { color: var(--text); font-weight: 400; font-size: 15px; }
.omobc-item__price { font-size: 24px; font-weight: 600; color: var(--brown); margin-top: 6px; }
.omobc-item__meta, .omobc-item__tax { display: block; color: var(--muted); font-size: 13px; margin-top: 2px; }
.omobc-item__meta p { margin: 0; }

.omobc-rows { margin-top: 26px; }
.omobc-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 9px 0; font-size: 15px; }
.omobc-row dt { text-transform: uppercase; letter-spacing: .02em; }
.omobc-row dd { white-space: nowrap; }
.omobc-row__note { text-transform: none; letter-spacing: 0; color: var(--brown-soft); font-size: 13px; margin-left: 4px; }
.omobc-row--sale dd, .omobc-row--sale .omobc-row__note { color: var(--green); }
.omobc-row--total { border-top: 1px solid #ece5dd; margin-top: 6px; padding-top: 16px; font-size: 19px; font-weight: 600; }
.omobc-free { color: var(--ink); }
.omobc-savings { background: var(--green-bg); color: var(--green); text-align: center; border-radius: 6px; padding: 8px 12px; font-size: 14px; margin-top: 14px; }

/* Payment + place order */
.omobc-payment { margin-top: 24px; }
.omobc-payment .payment_methods { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.omobc-payment .payment_methods > li { background: var(--sand); border-radius: 8px; padding: 13px 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.omobc-payment .payment_methods > li input[type="radio"] { width: 18px; height: 18px; accent-color: var(--brown); margin: 0; }
.omobc-payment .payment_methods > li label { font-size: 15px; font-weight: 600; color: #4a4a4a; margin: 0; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.omobc-payment .payment_methods > li img { max-height: 22px; width: auto; }
.omobc-payment .payment_methods > li input:checked + label { color: var(--brown); }
.omobc-payment .payment_box { flex: 1 0 100%; background: none; padding: 0; margin: 0; font-size: 13px; color: #6a6a6a; line-height: 1.6; }
.omobc-payment .payment_box p { margin: 0; }
.omobc-payment--single .payment_methods { grid-template-columns: 1fr; }
.omobc-payment--single .payment_methods > li { background: none; padding: 0; }
.omobc-payment--single .payment_methods > li input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.omobc-payment--single .payment_methods > li label { color: var(--brown); }
.omobc-payment--single .payment_box { margin-top: 6px; }

.omobc-checkout .place-order { margin-top: 18px; }
.omobc-place-order {
	width: 100%;
	min-height: 56px;
	background: var(--brown);
	color: #fff;
	border: 0;
	border-radius: 8px;
	font-size: 17px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
	cursor: pointer;
	transition: background-color .2s;
}
.omobc-place-order:hover { background: var(--brown-dark, #3f141b); }
.omobc-terms { text-align: center; font-size: 13px; color: #6a6a6a; margin-top: 14px; line-height: 1.6; }
.omobc-terms a, .omobc-terms strong { color: var(--brown); font-weight: 600; text-decoration: none; }
.omobc-terms a:hover { text-decoration: underline; }
.omobc-checkout .woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--text); }

/* Notices */
.omobc .woocommerce-error, .omobc .woocommerce-message, .omobc .woocommerce-info {
	list-style: none; margin: 0 0 20px; padding: 14px 18px; border-radius: 10px;
	background: var(--sand); border-left: 4px solid var(--brown); font-size: 14px;
}
.omobc .woocommerce-error { background: #fdecea; border-left-color: #c0392b; }

@container omobc (max-width: 900px) {
	.omobc-columns { grid-template-columns: 1fr; gap: 20px; }
	.omobc-main { padding: 20px 20px 48px; }
	.omobc-page-title { font-size: 22px; }
	.omobc-card { padding: 20px 18px 24px; border-radius: 12px; }
	.omobc-header { grid-template-columns: auto 1fr auto; padding: 10px 20px; }
	.omobc-header__burger { display: block; }
	.omobc-header__logo { justify-self: center; }
	.omobc-header__logo img { width: 110px; }
	.omobc-header__user { width: 32px; height: 32px; font-size: 18px; }
	.omobc-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--brown); padding: 8px 20px 16px; z-index: 20; }
	.omobc-nav.is-open { display: block; }
	.omobc-nav__list { flex-direction: column; gap: 0; }
	.omobc-nav__list a { display: block; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
	.omobc-item { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
	.omobc-item__name { font-size: 17px; }
	.omobc-item__price { font-size: 20px; }
	.omobc-features { max-width: none; }
	.omobc-payment .payment_methods { grid-template-columns: 1fr; }
}
@container omobc (max-width: 640px) {
	.omobc-grid > .omobc-col-6.form-row, .omobc-grid > .omobc-col-6 { grid-column: span 12; }
	.omobc-row { font-size: 14px; }
}

/* ---------------------------------------------------------------
   Layout hardening. Themes style .form-row, labels and inputs with
   their own widths and floats, so these rules restate the design
   with enough weight to win wherever the plugin is installed.
   --------------------------------------------------------------- */
.omobc { display: block; width: 100%; }
.omobc .omobc-main,
body .omobc .omobc-main {
	max-width: var(--omobc-width, 1300px) !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	float: none !important;
}
.omobc-checkout { max-width: var(--omobc-width, 1300px); margin-left: auto; margin-right: auto; }
.omobc .omobc-checkout { max-width: none; }

.omobc-checkout .omobc-grid { align-items: start; }
.omobc-checkout .omobc-grid > .form-row,
.omobc-checkout .omobc-grid > p.form-row,
.omobc-checkout .omobc-grid > div.form-row {
	display: block !important;
	float: none !important;
	clear: none !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}
.omobc-checkout .omobc-grid > .form-row > label,
.omobc-checkout .omobc-grid > .form-row > label.omobc-label {
	display: block !important;
	float: none !important;
	width: auto !important;
	margin: 0 0 8px !important;
	padding: 0 !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--ink) !important;
}
.omobc-checkout .form-row .woocommerce-input-wrapper {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
}
.omobc-checkout .form-row input.input-text,
.omobc-checkout .form-row input[type="text"],
.omobc-checkout .form-row input[type="tel"],
.omobc-checkout .form-row input[type="email"],
.omobc-checkout .form-row input[type="number"],
.omobc-checkout .form-row input[type="password"],
.omobc-checkout .form-row select {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: 46px !important;
	min-height: 46px !important;
	line-height: 1.4 !important;
	font-size: 15px !important;
	margin: 0 !important;
	float: none !important;
}
.omobc-checkout .form-row textarea { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.omobc-checkout .form-row .description, .omobc-checkout .form-row small { display: block; margin-top: 6px; font-size: 13px; color: var(--muted); }

/* Quantity stepper in the order summary */
.omobc-qty {
	display: inline-flex;
	align-items: center;
	margin-top: 12px;
	border: 1px solid var(--line);
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
}
.omobc-qty__btn {
	width: 38px; height: 38px;
	display: grid; place-items: center;
	background: none; border: 0;
	color: var(--brown);
	font-size: 19px; line-height: 1;
	cursor: pointer;
	transition: background-color .15s;
}
.omobc-qty__btn:hover:not(:disabled) { background: var(--sand); }
.omobc-qty__btn:disabled { color: #c9c0b8; cursor: not-allowed; }
.omobc-checkout .omobc-qty__input {
	width: 48px !important;
	height: 38px !important;
	min-height: 38px !important;
	border: 0 !important;
	border-left: 1px solid var(--line) !important;
	border-right: 1px solid var(--line) !important;
	border-radius: 0 !important;
	text-align: center;
	padding: 0 !important;
	font-size: 15px !important;
	background: #fff;
	-moz-appearance: textfield;
}
.omobc-qty__input::-webkit-outer-spin-button, .omobc-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.omobc-qty__input:focus { box-shadow: none !important; }
.omobc-qty.is-busy { opacity: .55; pointer-events: none; }
.omobc-qty-note { margin-top: 8px; font-size: 13px; color: #c0392b; }

/* ---------------------------------------------------------------
   1.2 – notice button, payment block, spacing and full width
   --------------------------------------------------------------- */

/* "View basket" is stripped from classic notices in PHP. Block notices
   render through their own markup, so hide the button there too. */
.omobc .woocommerce-notices-wrapper .wc-forward,
.omobc .wc-block-components-notice-banner .wc-forward,
.omobc .woocommerce-message .button.wc-forward { display: none !important; }

/* Notice banner: match the card style, no stray outline. */
.omobc .wc-block-components-notice-banner { border-radius: 10px; }

/* One payment method and no details wanted: keep the input for the form,
   drop the name, the description box and the privacy paragraph. */
.omobc-payment--bare .payment_methods > li label,
.omobc-payment--bare .payment_methods > li img,
.omobc-payment--bare .payment_box,
.omobc-payment--bare .woocommerce-privacy-policy-text,
.omobc-payment .woocommerce-privacy-policy-text:empty { display: none !important; }
.omobc-payment--bare .payment_methods { margin: 0 !important; padding: 0 !important; }
.omobc-payment--bare .payment_methods > li { background: none !important; padding: 0 !important; margin: 0 !important; }
.omobc-payment--bare { margin-top: 20px; }

/* Even spacing: label to field, field to note, note to the next block. */
.omobc-checkout .omobc-grid { row-gap: 20px; }
.omobc-checkout .omobc-grid > .form-row > label { margin-bottom: 8px !important; }
.omobc-note { margin-top: 8px; line-height: 1.5; }
.omobc-field--locked { display: flex; flex-direction: column; }
.omobc-toggle { margin-top: 26px !important; }
.omobc-shipping .shipping_address { margin-top: 22px; }

/* The checkout wrapper should use the full page width. The theme caps it. */
.woocommerce-account .wp-block-post-title,
.woocommerce-account main .woocommerce,
.woocommerce-cart .wp-block-post-title,
.woocommerce-cart main .woocommerce,
.woocommerce-checkout .wp-block-post-title,
.woocommerce-checkout main .woocommerce {
	max-width: 100% !important;
}
.woocommerce-checkout main, .woocommerce-checkout .entry-content, .woocommerce-checkout .wp-block-group { max-width: 100% !important; }

/* ---------------------------------------------------------------
   1.3 – select2 alignment, payment block, header and spacing
   --------------------------------------------------------------- */

/* The State field is a Select2 box. It needs flex, not block, or the
   chosen text sits at the top left of the 46px box. */
.omobc-checkout .form-row .select2-container .select2-selection--single,
.omobc-checkout .select2-container--default .select2-selection--single {
	display: flex !important;
	align-items: center !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: 46px !important;
	min-height: 46px !important;
	margin: 0 !important;
	float: none !important;
	padding: 0 40px 0 14px !important;
	border: 1px solid var(--line) !important;
	border-radius: 8px !important;
	background: #fff !important;
}
.omobc-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1.4 !important;
	font-size: 15px !important;
	color: var(--ink) !important;
}
.omobc-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px !important; right: 10px !important; top: 0 !important; }
.omobc-checkout .select2-dropdown { border-color: var(--line); border-radius: 8px; overflow: hidden; }
.omobc-checkout .select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--brown); }

/* WooCommerce paints the payment block grey with a rule under the method
   list. The design has neither. */
.omobc-checkout #payment.omobc-payment,
.omobc-checkout .omobc-payment .place-order {
	background: transparent !important;
	border-radius: 0 !important;
	padding: 0 !important;
}
.omobc-checkout .omobc-payment ul.payment_methods {
	border: 0 !important;
	border-bottom: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	list-style: none !important;
}
.omobc-checkout .omobc-payment::before, .omobc-checkout .omobc-payment::after,
.omobc-checkout .omobc-payment .place-order::before, .omobc-checkout .omobc-payment .place-order::after { display: none !important; }
.omobc-payment--bare ul.payment_methods { display: block !important; height: 0; overflow: hidden; }

/* Terms checkbox, button and the fine print need room to breathe. */
.omobc-checkout .woocommerce-terms-and-conditions-wrapper { margin: 0 0 18px; padding: 0; background: none; border: 0; }
.omobc-checkout .woocommerce-terms-and-conditions-wrapper .form-row { margin: 0; padding: 0; }
.omobc-checkout .woocommerce-terms-and-conditions-wrapper label { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.6; }
.omobc-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"] { width: 18px !important; height: 18px !important; min-height: 0 !important; accent-color: var(--brown); margin: 2px 0 0 !important; flex: none; }
.omobc-checkout .omobc-place-order { margin-top: 4px; margin-bottom: 0; }
.omobc-terms { margin-top: 18px !important; }

/* Distraction free header: logo only. */
.omobc-header--focus { grid-template-columns: auto; justify-content: start; }
body.omobc-focus .omobh-nav, body.omobc-focus .omobh-icons, body.omobc-focus .omobh-burger,
body.omobc-focus .omobc-nav, body.omobc-focus .omobc-header__user, body.omobc-focus .omobc-header__burger { display: none !important; }

/* ---------------------------------------------------------------
   1.4 – nothing may push the page sideways
   --------------------------------------------------------------- */
html, body.omobc-body {
	overflow-x: hidden !important;
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	overscroll-behavior-x: none;
	touch-action: pan-y;
}
/* clip, not hidden, so nothing inside turns into a scroll container */
body.omobc-body .omobc, body.omobc-body .omobc-main, body.omobc-body .omobc-checkout,
body.omobc-body .omobc-columns, body.omobc-body .omobc-card {
	max-width: 100% !important;
	overflow-x: clip;
}
.omobc-main, .omobc-columns, .omobc-card, .omobc-grid { min-width: 0; }
.omobc-columns > *, .omobc-grid > *, .omobc-item, .omobc-item__body, .omobc-row { min-width: 0; }
.omobc-row dt, .omobc-row dd, .omobc-item__name, .omobc-field dd { overflow-wrap: anywhere; }
.omobc-checkout .select2-container { max-width: 100% !important; }
body.omobc-body .woocommerce, body.omobc-body main, body.omobc-body .entry-content { overflow-x: clip; }
/* Full width blocks sized with 100vw are a viewport scrollbar wider than the
   page, which is what lets it drag sideways. */
body.omobc-body .alignfull, body.omobc-body .alignwide, body.omobc-body .wp-block-group.alignfull {
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
body.omobc-body .select2-container { max-width: 100vw; }

/* ---------------------------------------------------------------
   1.4.1 – nothing inside the checkout may be wider than the screen
   --------------------------------------------------------------- */
body.omobc-body { position: relative; }
body.omobc-body img, body.omobc-body svg, body.omobc-body table, body.omobc-body iframe { max-width: 100% !important; }
body.omobc-body .omobc-header, body.omobc-body .omobc-main { width: 100% !important; }
body.omobc-body .woocommerce-notices-wrapper, body.omobc-body .woocommerce-error,
body.omobc-body .woocommerce-message, body.omobc-body .woocommerce-info { max-width: 100%; overflow-wrap: anywhere; }

@container omobc (max-width: 640px) {
	.omobc-main { padding-left: 16px; padding-right: 16px; }
	.omobc-card { padding-left: 16px; padding-right: 16px; }
	.omobc-features { grid-template-columns: repeat(2, 1fr); row-gap: 10px; }
	.omobc-features li:nth-child(3) { border-left: 0; }
}

/* ---------------------------------------------------------------
   1.4.2 – WordPress admin bar on phones
   Logged out, and on desktop, nothing here applies.
   --------------------------------------------------------------- */
@media screen and (max-width: 782px) {
	/* WordPress reserves room for the bar with a margin on <html>, which the
	   overflow handling above can swallow. Pin the bar and reserve the room
	   on the body instead, so it is counted exactly once. */
	html.omobc-adminbar, html:has(body.omobc-body.admin-bar) { margin-top: 0 !important; }
	body.omobc-body.admin-bar { padding-top: 46px !important; }
	body.omobc-body.admin-bar #wpadminbar { position: fixed !important; top: 0 !important; }
}

/* ---------------------------------------------------------------
   1.5 – summary rows and the fine print
   --------------------------------------------------------------- */

/* Label and value are two columns, so the amount never drops to its own
   line. A long note wraps underneath the label instead. */
.omobc-row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: baseline;
	column-gap: 14px;
}
.omobc-row dt { min-width: 0; overflow-wrap: anywhere; }
.omobc-row dd { justify-self: end; white-space: nowrap; }
.omobc-row__note { display: inline; }
@container omobc (max-width: 420px) {
	.omobc-row__note { display: block; margin-left: 0; margin-top: 2px; }
}
.omobc-row--mrp dd { color: var(--text); }

/* Space between the button and the fine print, on every screen. */
.omobc-checkout .place-order .omobc-terms, .omobc-terms { margin-top: 22px !important; }

/* ---------------------------------------------------------------
   1.5.1 – the gap under the place order button
   The spacing lives on the button itself, by id, so no theme rule on
   paragraphs can cancel it. The fine print carries no top margin, so
   the two can never double up or collapse.
   --------------------------------------------------------------- */
.omobc-checkout #place_order,
.omobc-checkout button#place_order.omobc-place-order,
.omobc-checkout .place-order #place_order {
	display: block !important;
	margin: 0 0 24px !important;
}
.omobc-checkout .place-order .omobc-terms,
.omobc-checkout .omobc-terms,
.omobc .omobc-terms { margin-top: 0 !important; margin-bottom: 0 !important; }

/* ---------------------------------------------------------------
   1.6 – brand dropdown (replaces Select2)
   --------------------------------------------------------------- */
.omobc-combo { position: relative; width: 100%; }
/* The original select stays in the form so Checkout Field Editor, validation
   and the posted order data all keep working. It is taken off screen rather
   than removed, because a required field set to display:none blocks submit. */
.omobc-checkout .omobc-combo__native,
.omobc-checkout .form-row select.omobc-combo__native,
.omobc-checkout .omobc-combo select.omobc-combo__native,
.omobc-checkout .form-row .omobc-combo select.omobc-combo__native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
	border: 0 !important;
	background: none !important;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	overflow: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	appearance: none !important;
}
.omobc-combo__btn {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	width: 100%; height: 46px;
	padding: 0 14px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 8px;
	font-size: 15px;
	color: var(--ink);
	text-align: left;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s;
}
.omobc-combo__btn:hover { border-color: #cbbdb2; }
.omobc-combo.is-open .omobc-combo__btn { border-color: var(--brown); box-shadow: 0 0 0 3px rgba(77, 24, 33, .12); }
.omobc-combo__value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.omobc-combo__value.is-placeholder { color: #b0a79f; }
.omobc-combo__arrow { width: 17px; height: 17px; color: var(--brown); flex: none; transition: transform .18s; }
.omobc-combo.is-open .omobc-combo__arrow { transform: rotate(180deg); }
.woocommerce-invalid .omobc-combo__btn { border-color: #c0392b; }

.omobc-combo__panel {
	position: absolute; z-index: 60; top: calc(100% + 6px); left: 0; right: 0;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 10px;
	box-shadow: 0 14px 34px rgba(50, 20, 10, .16);
	padding: 8px;
	max-height: 290px;
	display: flex; flex-direction: column;
	overflow: hidden;
}
.omobc-combo__panel[hidden] { display: none; }
.omobc-checkout .omobc-combo__search,
.omobc-checkout .form-row input.omobc-combo__search[type="text"],
.omobc-checkout .omobc-combo input.omobc-combo__search {
	width: 100% !important;
	height: 40px !important;
	min-height: 40px !important;
	/* 16px keeps phones from zooming the page when this field takes focus */
	font-size: 16px !important;
	padding: 0 12px !important;
	margin: 0 0 6px !important;
	border: 1px solid var(--line) !important;
	border-radius: 7px !important;
	background: #fff !important;
	color: var(--ink) !important;
}
.omobc-combo__search:focus { border-color: var(--brown) !important; outline: none; }
.omobc-combo__list { margin: 0; padding: 0; list-style: none; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.omobc-combo__option {
	padding: 10px 12px;
	border-radius: 7px;
	font-size: 15px;
	line-height: 1.4;
	cursor: pointer;
	color: var(--ink);
}
.omobc-combo__option:hover, .omobc-combo__option.is-active { background: var(--sand); }
.omobc-combo__option.is-selected { background: var(--brown); color: #fff; }
.omobc-combo__empty { margin: 0; padding: 12px; font-size: 14px; color: var(--muted); }

@container omobc (max-width: 640px) {
	.omobc-combo__panel { max-height: 260px; }
	.omobc-combo__option { padding: 12px; }
}
.omobc-checkout .omobc-combo__search:focus-visible { outline: none !important; }

/* ---------------------------------------------------------------
   1.6.2 – only one dropdown, whatever WooCommerce or the theme does
   --------------------------------------------------------------- */
body.omobc-combo-on .select2-container,
body.omobc-combo-on span.select2,
body.omobc-combo-on .omobc-checkout .form-row .select2-container,
body.omobc-combo-on .omobc-checkout .form-row span.select2.select2-container,
body.omobc-combo-on .omobc-checkout .form-row .woocommerce-input-wrapper .select2-container,
body.omobc-combo-on .omobc-checkout .form-row .select2-container--default,
body.omobc-combo-on .omobc-checkout .form-row .selectWoo-container,
body.omobc-combo-on .select2-container--open,
body.omobc-combo-on .select2-dropdown {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	visibility: hidden !important;
}

body.omobc-combo-on .omobc-checkout .omobc-combo > select,
body.omobc-combo-on .omobc-checkout .form-row .omobc-combo > select,
body.omobc-combo-on .omobc-checkout select.omobc-combo__native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
	border: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	overflow: hidden !important;
	z-index: -1;
}

/* ---------------------------------------------------------------
   1.7 – agreement checkbox and the policy panels
   --------------------------------------------------------------- */
.omobc-checkout .woocommerce-terms-and-conditions-wrapper label a,
.omobc-checkout .woocommerce-terms-and-conditions-checkbox-text a,
.omobc-checkout .woocommerce-privacy-policy-link {
	color: var(--brown) !important;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}
.omobc-checkout .woocommerce-terms-and-conditions-wrapper label a:hover { text-decoration-thickness: 2px; }
.omobc-checkout .woocommerce-terms-and-conditions,
.omobc-checkout .omobc-policy {
	background: var(--sand);
	border: 1px solid var(--line);
	border-radius: 10px;
	padding: 16px 18px;
	margin: 0 0 16px;
	font-size: 14px;
	line-height: 1.65;
	color: var(--text);
	max-height: 220px;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.omobc-checkout .woocommerce-terms-and-conditions p,
.omobc-checkout .omobc-policy p { margin: 0 0 10px; }
.omobc-checkout .woocommerce-terms-and-conditions :is(h1, h2, h3, h4),
.omobc-checkout .omobc-policy :is(h1, h2, h3, h4) { font-size: 15px; color: var(--brown); margin: 12px 0 6px; }
.omobc-checkout .woocommerce-terms-and-conditions a,
.omobc-checkout .omobc-policy a { color: var(--brown); text-decoration: underline; overflow-wrap: anywhere; }

/* Checkbox sits in the margin so the required star stays with the sentence. */
.omobc-checkout .woocommerce-terms-and-conditions-wrapper label,
.omobc-checkout .woocommerce-terms-and-conditions-wrapper .form-row label {
	display: block !important;
	position: relative;
	padding-left: 30px;
	font-size: 14px;
	line-height: 1.6;
}
.omobc-checkout .woocommerce-terms-and-conditions-wrapper label input[type="checkbox"] {
	position: absolute !important;
	left: 0; top: 3px;
	margin: 0 !important;
}
.omobc-checkout .woocommerce-terms-and-conditions-wrapper abbr.required { color: var(--brown); text-decoration: none; border: 0; margin-left: 2px; }