.tbpo-wrap,
.tbpo-wrap * {
	box-sizing: border-box;
}

.tbpo-wrap {
	--tbpo-navy: #052d40;
	--tbpo-blue: #087ea4;
	--tbpo-aqua: #12a9b7;
	--tbpo-green: #239565;
	--tbpo-dark-green: #176f50;
	--tbpo-text: #17343e;
	--tbpo-muted: #657a82;
	--tbpo-border: #d5e9ec;
	position: relative;
	width: 100%;
	max-width: 1220px;
	margin: 30px auto;
	padding: 34px;
	overflow: hidden;
	border: 1px solid var(--tbpo-border);
	border-radius: 28px;
	color: var(--tbpo-text);
	background:
		radial-gradient(circle at 5% 5%, rgba(18, 169, 183, .12), transparent 28%),
		radial-gradient(circle at 95% 95%, rgba(35, 149, 101, .1), transparent 30%),
		linear-gradient(180deg, #fbffff, #f1fafb);
	box-shadow: 0 24px 65px rgba(5, 45, 64, .11);
	font-family: Arial, Helvetica, sans-serif;
}

.tbpo-ornament {
	position: absolute;
	z-index: 0;
	font-size: 100px;
	opacity: .045;
	pointer-events: none;
}

.tbpo-ornament-one { top: -18px; right: 3%; transform: rotate(12deg); }
.tbpo-ornament-two { bottom: 15px; left: 2%; }

.tbpo-header,
.tbpo-form,
.tbpo-alert {
	position: relative;
	z-index: 1;
}

.tbpo-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 35px;
	margin-bottom: 28px;
}

.tbpo-eyebrow {
	display: inline-block;
	margin-bottom: 10px;
	color: var(--tbpo-blue);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 1.5px;
}

.tbpo-header h2 {
	margin: 0 0 11px;
	max-width: 760px;
	color: var(--tbpo-navy);
	font-size: clamp(32px, 4.4vw, 53px);
	line-height: 1.05;
	letter-spacing: -1.8px;
}

.tbpo-header p {
	max-width: 780px;
	margin: 0;
	color: var(--tbpo-muted);
	font-size: 15px;
	line-height: 1.7;
}

.tbpo-price-badge {
	flex: 0 0 150px;
	padding: 20px;
	border: 5px solid #fff;
	border-radius: 24px;
	color: #fff;
	background: linear-gradient(135deg, var(--tbpo-green), var(--tbpo-aqua));
	box-shadow: 0 15px 35px rgba(5, 45, 64, .18);
	text-align: center;
}

.tbpo-price-badge span,
.tbpo-price-badge small {
	display: block;
	font-size: 10px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.tbpo-price-badge strong {
	display: block;
	margin: 3px 0;
	font-size: 42px;
	line-height: 1;
}

.tbpo-alert {
	display: flex;
	align-items: flex-start;
	gap: 13px;
	margin: 0 0 22px;
	padding: 16px 18px;
	border-radius: 15px;
}

.tbpo-alert > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	border-radius: 50%;
	color: #fff;
	font-weight: 900;
}

.tbpo-alert strong { display: block; margin-bottom: 4px; }
.tbpo-alert p { margin: 0; font-size: 12px; line-height: 1.55; }
.tbpo-alert-success { border: 1px solid #bfe6d5; background: #ecfbf5; color: #176f50; }
.tbpo-alert-success > span { background: #239565; }
.tbpo-alert-error { border: 1px solid #f0c9c9; background: #fff4f4; color: #8a3030; }
.tbpo-alert-error > span { background: #c64a4a; }

.tbpo-form {
	display: grid;
	gap: 19px;
}

.tbpo-honeypot {
	position: absolute !important;
	left: -99999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.tbpo-section {
	padding: 25px;
	border: 1px solid var(--tbpo-border);
	border-radius: 20px;
	background: rgba(255, 255, 255, .93);
	box-shadow: 0 11px 28px rgba(5, 45, 64, .055);
}

.tbpo-section-title {
	display: flex;
	align-items: center;
	gap: 13px;
	margin-bottom: 21px;
}

.tbpo-section-title > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	flex: 0 0 42px;
	border-radius: 13px;
	color: #fff;
	background: linear-gradient(135deg, var(--tbpo-blue), var(--tbpo-green));
	font-size: 16px;
	font-weight: 900;
	box-shadow: 0 8px 18px rgba(8, 126, 164, .18);
}

.tbpo-section-title h3 {
	margin: 0 0 3px;
	color: var(--tbpo-navy);
	font-size: 20px;
}

.tbpo-section-title p {
	margin: 0;
	color: var(--tbpo-muted);
	font-size: 11px;
}

.tbpo-fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 15px;
}

.tbpo-field {
	display: block;
}

.tbpo-field-wide {
	grid-column: 1 / -1;
}

.tbpo-field > span {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-bottom: 7px;
	color: #294a55;
	font-size: 12px;
	font-weight: 800;
}

.tbpo-field b { color: #c43f3f; }
.tbpo-field em { color: var(--tbpo-muted); font-size: 9px; font-style: normal; font-weight: 600; }

.tbpo-field input,
.tbpo-field select,
.tbpo-field textarea {
	width: 100%;
	margin: 0;
	border: 1px solid #cbdfe3;
	border-radius: 11px;
	color: var(--tbpo-text);
	background: #fff;
	font: inherit;
	font-size: 13px;
	outline: none;
	box-shadow: none;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.tbpo-field input,
.tbpo-field select {
	height: 47px;
	padding: 0 13px;
}

.tbpo-field textarea {
	min-height: 125px;
	padding: 13px;
	resize: vertical;
}

.tbpo-field input:focus,
.tbpo-field select:focus,
.tbpo-field textarea:focus {
	border-color: var(--tbpo-aqua);
	box-shadow: 0 0 0 3px rgba(18, 169, 183, .12);
}

.tbpo-products {
	overflow: hidden;
	border: 1px solid #d7e8eb;
	border-radius: 15px;
}

.tbpo-products-head,
.tbpo-product {
	display: grid;
	grid-template-columns: minmax(180px, 1.5fr) minmax(125px, .9fr) 100px 150px 110px;
	align-items: center;
	gap: 10px;
}

.tbpo-products-head {
	padding: 12px 15px;
	color: #fff;
	background: var(--tbpo-navy);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .7px;
	text-transform: uppercase;
}

.tbpo-product {
	min-height: 76px;
	padding: 12px 15px;
	border-bottom: 1px solid #e2eef0;
	background: #fff;
	transition: background .2s ease;
}

.tbpo-product:last-child { border-bottom: 0; }
.tbpo-product.has-quantity { background: #f0fbf7; }

.tbpo-product-name {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--tbpo-navy);
	font-size: 13px;
}

.tbpo-leaf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 37px;
	height: 37px;
	flex: 0 0 37px;
	border-radius: 11px;
	background: #e9f9f3;
	font-size: 19px;
}

.tbpo-product-size,
.tbpo-product-price,
.tbpo-line-total {
	font-size: 12px;
	font-weight: 700;
}

.tbpo-product-price { color: var(--tbpo-dark-green); }
.tbpo-line-total { color: var(--tbpo-navy); text-align: right; }

.tbpo-quantity {
	display: grid;
	grid-template-columns: 38px 54px 38px;
	align-items: center;
	justify-content: start;
}

.tbpo-quantity input {
	width: 54px !important;
	height: 38px !important;
	margin: 0 !important;
	padding: 0 3px !important;
	border: 1px solid #cbdfe3 !important;
	border-radius: 0 !important;
	text-align: center;
	font-size: 13px !important;
	font-weight: 800;
	-moz-appearance: textfield;
}

.tbpo-quantity input::-webkit-outer-spin-button,
.tbpo-quantity input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }

.tbpo-qty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 1px solid #cbdfe3;
	color: var(--tbpo-navy);
	background: #f4fafb;
	font-size: 19px;
	font-weight: 900;
	cursor: pointer;
}

.tbpo-minus { border-radius: 9px 0 0 9px; }
.tbpo-plus { border-radius: 0 9px 9px 0; }
.tbpo-qty-btn:hover { color: #fff; border-color: var(--tbpo-blue); background: var(--tbpo-blue); }

.tbpo-summary {
	display: flex;
	justify-content: flex-end;
	gap: 11px;
	margin-top: 14px;
}

.tbpo-summary > div {
	min-width: 180px;
	padding: 13px 16px;
	border: 1px solid #d7e8eb;
	border-radius: 12px;
	background: #f7fbfc;
}

.tbpo-summary span {
	display: block;
	margin-bottom: 4px;
	color: var(--tbpo-muted);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .6px;
	text-transform: uppercase;
}

.tbpo-summary strong {
	color: var(--tbpo-navy);
	font-size: 20px;
}

.tbpo-submit-area {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 25px;
	padding: 22px;
	border-radius: 18px;
	color: #fff;
	background: linear-gradient(135deg, var(--tbpo-navy), #075f78);
	box-shadow: 0 16px 40px rgba(5, 45, 64, .16);
}

.tbpo-notice {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	max-width: 700px;
}

.tbpo-notice > span { color: #72e1d2; font-size: 19px; }
.tbpo-notice p { margin: 0; color: rgba(255,255,255,.75); font-size: 10px; line-height: 1.55; }

.tbpo-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 51px;
	padding: 12px 20px;
	border: 0;
	border-radius: 12px;
	color: var(--tbpo-navy);
	background: #fff;
	font-size: 12px;
	font-weight: 900;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: 0 9px 22px rgba(0,0,0,.16);
	transition: transform .2s ease, box-shadow .2s ease;
}

.tbpo-submit:hover { transform: translateY(-2px); box-shadow: 0 13px 28px rgba(0,0,0,.2); }
.tbpo-submit:disabled { opacity: .72; cursor: wait; }

@media (max-width: 950px) {
	.tbpo-products-head { display: none; }
	.tbpo-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; border: 0; overflow: visible; }
	.tbpo-product { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; min-height: 0; padding: 17px; border: 1px solid #d7e8eb !important; border-radius: 14px; }
	.tbpo-product-name { width: 100%; padding-bottom: 9px; border-bottom: 1px solid #e5eff1; }
	.tbpo-product-size,
	.tbpo-product-price,
	.tbpo-line-total,
	.tbpo-quantity { width: calc(50% - 6px); }
	.tbpo-product-size::before,
	.tbpo-product-price::before,
	.tbpo-line-total::before,
	.tbpo-quantity::before { content: attr(data-label); display: block; margin-bottom: 5px; color: var(--tbpo-muted); font-size: 8px; font-weight: 900; text-transform: uppercase; }
	.tbpo-line-total { text-align: left; }
	.tbpo-quantity { display: block; }
	.tbpo-quantity::after { content: ''; display: table; clear: both; }
	.tbpo-quantity .tbpo-qty-btn,
	.tbpo-quantity input { float: left; }
}

@media (max-width: 700px) {
	.tbpo-wrap { margin: 18px auto; padding: 22px 13px; border-radius: 20px; }
	.tbpo-header { flex-direction: column; align-items: stretch; text-align: center; }
	.tbpo-price-badge { flex: none; width: 145px; margin: 0 auto; }
	.tbpo-section { padding: 18px 14px; }
	.tbpo-fields { grid-template-columns: 1fr; }
	.tbpo-field-wide { grid-column: auto; }
	.tbpo-products { grid-template-columns: 1fr; }
	.tbpo-summary { flex-direction: column; }
	.tbpo-summary > div { min-width: 0; }
	.tbpo-submit-area { flex-direction: column; text-align: center; }
	.tbpo-submit { width: 100%; white-space: normal; }
}

@media (max-width: 390px) {
	.tbpo-header h2 { font-size: 31px; }
	.tbpo-section-title { align-items: flex-start; }
	.tbpo-product-size,
	.tbpo-product-price,
	.tbpo-line-total,
	.tbpo-quantity { width: 100%; }
}

/* Sold-out inventory state */
.tbpo-inventory-alert {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 14px;
	padding: 13px 15px;
	border: 1px solid #efcaca;
	border-radius: 13px;
	background: #fff4f4;
	color: #843434;
}

.tbpo-inventory-alert > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 28px;
	padding: 5px 10px;
	border-radius: 999px;
	color: #fff;
	background: #c64545;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .5px;
	text-transform: uppercase;
	white-space: nowrap;
}

.tbpo-inventory-alert p {
	margin: 0;
	font-size: 11px;
	line-height: 1.5;
}

.tbpo-product-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
}

.tbpo-sold-out-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 8px;
	border-radius: 999px;
	color: #fff;
	background: #c64545;
	font-size: 8px;
	font-weight: 900;
	letter-spacing: .6px;
	line-height: 1;
	text-transform: uppercase;
}

.tbpo-product.is-sold-out {
	background: #fff8f8;
	border-color: #efd4d4;
}

.tbpo-product.is-sold-out .tbpo-leaf {
	filter: grayscale(1);
	opacity: .58;
}

.tbpo-product.is-sold-out .tbpo-product-size,
.tbpo-product.is-sold-out .tbpo-product-price {
	color: #8a7070;
}

.tbpo-product.is-sold-out .tbpo-line-total {
	color: #b43d3d;
	font-size: 10px;
	font-weight: 900;
	text-transform: uppercase;
}

.tbpo-product.is-sold-out .tbpo-qty-btn,
.tbpo-product.is-sold-out .tbpo-quantity input,
.tbpo-qty-btn:disabled,
.tbpo-quantity input:disabled {
	border-color: #e4d5d5 !important;
	color: #a99a9a !important;
	background: #f3eeee !important;
	cursor: not-allowed !important;
	opacity: .75;
}

.tbpo-submit:disabled {
	color: rgba(5, 45, 64, .66);
	background: #dce5e7;
	box-shadow: none;
	cursor: not-allowed;
}
