/* Cinema Buffet — near-black + white theme for ordering from the seat (accent tokens keep their old "gold" names). */

:root {
	color-scheme: dark;
	--cb-bg: #131313;
	--cb-card: #232323;
	--cb-surface: #1b1b1b;
	--cb-line: rgba(255, 255, 255, .1);
	--cb-text: #ffffff;
	--cb-muted: #949494;
	--cb-gold: #ffffff;
	--cb-gold-ink: #131313;
	/* Main call to action (cart bar, pay buttons): violet stands apart from the warm food tiles. */
	--cb-cta: #5200ff;
	--cb-cta-ink: #ffffff;
	--cb-radius: 16px;
}

body,
button,
input,
select,
textarea {
	font-family: Vazirmatn, Tahoma, sans-serif !important;
}

body {
	background: var(--cb-bg);
	color: var(--cb-text);
}

/* ---------- Header / footer ---------- */

/* Footer part is empty; keep room at the bottom for the phone's home bar. */
footer.wp-block-template-part {
	padding-bottom: 48px;
}

main.wp-block-group {
	margin-top: 0 !important;
}

/* Page titles: smaller and tighter on mobile. */
.wp-block-post-title {
	font-size: 1.4rem !important;
	margin-block: 20px 12px !important;
}

/* ---------- Category tabs ---------- */

.wpc-food-tab-wrapper .wpc-nav {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	overflow-x: auto;
	scrollbar-width: none;
	padding: 12px 0 !important;
	margin: 0 !important;
	border: 0 !important;
	position: sticky;
	top: 56px;
	z-index: 40;
	background: var(--cb-bg);
}

.wpc-food-tab-wrapper .wpc-nav::-webkit-scrollbar {
	display: none;
}

.wpc-food-tab-wrapper .wpc-nav li {
	flex: 0 0 auto;
	margin: 0 !important;
}

.wpc-food-tab-wrapper .wpc-tab-a {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	padding: 8px 16px !important;
	border-radius: 999px !important;
	border: 1px solid var(--cb-line) !important;
	background: var(--cb-card) !important;
	color: var(--cb-text) !important;
	font-size: .9rem !important;
	font-weight: 600 !important;
	text-transform: none !important;
	text-decoration: none !important;
	white-space: nowrap;
	box-shadow: none !important;
}

.wpc-food-tab-wrapper .wpc-tab-a::after,
.wpc-food-tab-wrapper .wpc-tab-a::before {
	display: none !important;
}

.wpc-food-tab-wrapper .wpc-tab-a.wpc-active {
	background: var(--cb-gold) !important;
	border-color: var(--cb-gold) !important;
	color: var(--cb-gold-ink) !important;
}

.wpc-food-tab-wrapper .wpc-tab-count {
	background: rgba(255, 255, 255, .1) !important;
	color: inherit !important;
	border-radius: 999px;
	padding: 0 7px;
	font-size: .75rem;
}

.wpc-food-tab-wrapper .wpc-tab-a.wpc-active .wpc-tab-count {
	background: rgba(0, 0, 0, .15) !important;
}

.wpc-results-count {
	color: var(--cb-muted) !important;
	font-size: .8rem !important;
	margin: 4px 0 8px !important;
}

/* ---------- Product cards ---------- */

.wpc-card-row-list--boxed {
	gap: 10px !important;
}

.wpc-card-row--boxed {
	background: var(--cb-card) !important;
	border: 1px solid var(--cb-line) !important;
	border-radius: var(--cb-radius) !important;
	box-shadow: none !important;
	padding: 12px !important;
}

.wpc-card-row__media img,
.wpc-food-menu-thumb img {
	border-radius: 12px !important;
}

.wpc-card__title,
.wpc-card__title a,
.wpc-post-title,
.wpc-post-title a {
	color: var(--cb-text) !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	text-decoration: none !important;
}

.wpc-card__desc,
.wpc-card__desc p {
	color: var(--cb-muted) !important;
	font-size: .85rem !important;
	line-height: 1.6 !important;
}

.wpc-card__price,
.wpc-menu-price,
.wpc-card__price .amount {
	color: var(--cb-gold) !important;
	font-weight: 800 !important;
	font-size: 1rem !important;
}

/* Add buttons */
.wpc-add-to-cart,
.wpc-card .button,
.wpc-btn {
	background: var(--cb-gold) !important;
	color: var(--cb-gold-ink) !important;
	border: 0 !important;
	border-radius: 999px !important;
	font-weight: 700 !important;
	font-family: Vazirmatn, Tahoma, sans-serif !important;
	box-shadow: none !important;
}

.wpc-add-to-cart:hover,
.wpc-card .button:hover {
	filter: brightness(1.08);
}

.wpc-add-to-cart svg,
.wpc-add-to-cart i {
	fill: currentColor !important;
	color: currentColor !important;
}

/* ---------- Floating cart ---------- */

.wpc_cart_block .wpc_cart_icon,
.wpc-cart_main_block .wpc_cart_icon,
.wpc_background_color {
	background: var(--cb-gold) !important;
	color: var(--cb-gold-ink) !important;
}

.wpc_cart_icon svg,
.wpc_cart_icon i,
.wpcafe-cart_icon {
	color: var(--cb-gold-ink) !important;
	fill: var(--cb-gold-ink) !important;
}

.wpc-minicart-wrapper,
.wpc-menu-mini-cart,
.wpc-popup-wrap-inner,
.wpc-product-popup-content,
.wpc_variation_popup_content {
	background: var(--cb-surface) !important;
	color: var(--cb-text) !important;
	font-family: Vazirmatn, Tahoma, sans-serif !important;
}

.wpc-minicart-wrapper *,
.wpc-menu-mini-cart * {
	border-color: var(--cb-line) !important;
}

.wpc-minicart-wrapper a,
.wpc-menu-mini-cart a {
	color: var(--cb-text);
}

.wpc-minicart-wrapper .amount,
.wpc-menu-mini-cart .amount {
	color: var(--cb-gold) !important;
}

/* ---------- WooCommerce cart & checkout ---------- */

.woocommerce table.shop_table,
.woocommerce-checkout-review-order,
#order_review,
.woocommerce-cart-form,
.cart_totals {
	background: var(--cb-card);
	border: 1px solid var(--cb-line) !important;
	border-radius: var(--cb-radius);
	color: var(--cb-text);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	border-color: var(--cb-line) !important;
}

.woocommerce form .form-row label {
	color: var(--cb-text);
	font-weight: 600;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	background: var(--cb-surface) !important;
	color: var(--cb-text) !important;
	border: 1px solid var(--cb-line) !important;
	border-radius: 12px !important;
	padding: 12px 14px !important;
	font-size: 1rem !important;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
	border-color: var(--cb-gold) !important;
	outline: none;
}

.woocommerce-checkout #payment {
	background: var(--cb-card) !important;
	border-radius: var(--cb-radius);
}

.woocommerce-checkout #payment div.payment_box {
	background: var(--cb-surface) !important;
	color: var(--cb-muted) !important;
}

.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: var(--cb-surface) !important;
}

.woocommerce-checkout #payment ul.payment_methods {
	border-color: var(--cb-line) !important;
}

.woocommerce #payment #place_order,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce .checkout-button {
	background: var(--cb-cta) !important;
	color: var(--cb-cta-ink) !important;
	box-sizing: border-box;
	display: block;
	text-align: center;
	margin-inline: 0 !important;
	border-radius: 999px !important;
	font-weight: 800 !important;
	font-size: 1.05rem !important;
	padding: 14px 20px !important;
	width: 100%;
}

.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
	background: var(--cb-card) !important;
	color: var(--cb-text) !important;
	border-top-color: var(--cb-gold) !important;
}

.woocommerce .amount {
	color: var(--cb-gold);
}

/* Keep the layout inside the phone screen. */
/* No overflow rules on html/body/wrappers: on iOS Safari they make the page scroll a different box
   (or break sticky elements) and jump during fast scrolling. Nothing on these pages is wider than the screen. */

/* ---------- Notices (block + classic) ---------- */

.wc-block-components-notice-banner,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	background: var(--cb-card) !important;
	color: var(--cb-text) !important;
	border: 1px solid var(--cb-line) !important;
	border-radius: 14px !important;
	font-size: .9rem;
}

.wc-block-components-notice-banner.is-success > svg {
	background: var(--cb-gold) !important;
	fill: var(--cb-gold-ink) !important;
}

.wc-block-components-notice-banner a,
.woocommerce-message a {
	color: var(--cb-gold) !important;
}

/* ---------- Cart page ---------- */

.woocommerce .quantity .qty {
	background: var(--cb-surface) !important;
	color: var(--cb-text) !important;
	border: 1px solid var(--cb-line) !important;
	border-radius: 10px;
	width: 4em;
	padding: 6px;
}

.woocommerce table.shop_table a.remove {
	color: #e5484d !important;
}

.woocommerce table.shop_table a:not(.remove) {
	color: var(--cb-text);
	text-decoration: none;
}

.woocommerce button[name="update_cart"] {
	background: transparent !important;
	color: var(--cb-muted) !important;
	border: 1px solid var(--cb-line) !important;
	border-radius: 999px !important;
	font-weight: 600 !important;
}

.cart_totals {
	padding: 16px;
	margin-top: 16px;
}

.cart_totals h2 {
	font-size: 1.1rem;
}

/* Empty "additional information" heading on checkout. */
.woocommerce-additional-fields > h3:empty {
	display: none;
}

/* ---------- Floating cart button ---------- */

.wpc_cart_block,
.wpc-cart_main_block {
	text-decoration: none !important;
}

.wpc_cart_block .wpc_cart_icon,
.wpc-cart_main_block .wpc_cart_icon {
	border-radius: 999px 0 0 999px !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .45) !important;
}

.wpc_cart_icon,
.wpc_cart_icon *,
.wpc_cart_block a {
	text-decoration: none !important;
	font-weight: 800;
}

.wc-block-components-notice-banner__content a,
.wc-block-components-notice-banner .wc-forward {
	color: var(--cb-gold) !important;
	opacity: 1 !important;
	text-decoration: none !important;
	font-weight: 700;
}

input[type="radio"],
input[type="checkbox"] {
	accent-color: var(--cb-gold);
}

.woocommerce-checkout #payment ul.payment_methods li label {
	color: var(--cb-text);
	font-weight: 700;
}

.wc-block-components-notice-banner a.button,
.wc-block-components-notice-banner .wc-forward,
.woocommerce-message a.button {
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	color: var(--cb-gold) !important;
	font-weight: 700 !important;
	text-decoration: none !important;
}

.woocommerce-privacy-policy-text,
.woocommerce-privacy-policy-text p {
	color: var(--cb-muted) !important;
	font-size: .8rem !important;
}

/* Menu page template: the ticket replaces the header, so drop page chrome. */
.cb-menu-main {
	margin: 0 !important;
	padding: 0 !important;
}

.wc-block-components-notice-banner.is-info > svg {
	background: var(--cb-gold) !important;
	fill: var(--cb-gold-ink) !important;
}

/* ======================================================================
   Cart / checkout / thank-you — same language as the menu
   ====================================================================== */

/* ---------- Top bar: back to menu + seat pill ---------- */

.cb-topbar {
	display: flex;
	justify-content: space-between; /* RTL: title on the right, back button on the left */
	align-items: center;
	gap: 10px;
	/* Same width and side gutters as the page content, so the title lines up with the cards. */
	box-sizing: content-box;
	max-width: var(--wp--style--global--content-size, 645px);
	margin: 0 auto;
	padding: 16px var(--wp--style--root--padding-right, 16px) 0 var(--wp--style--root--padding-left, 16px);
}

.woocommerce-checkout main.wp-block-group {
	padding-top: 14px !important;
}

.cb-topbar__title {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif;
	font-weight: 400;
	font-size: 2.1rem;
	line-height: 1.1;
	margin: 0;
	color: #ffffff;
}

/* With no title (thank-you page) the back button still sits on the left. */
.cb-back:only-child {
	margin-inline-start: auto;
}

/* The checkout title moved into the top bar. */
.woocommerce-checkout:not(.woocommerce-order-received) .wp-block-post-title {
	display: none;
}

.cb-back {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid #ffffff;
	border-radius: 9999px;
	padding: 7px 16px;
	color: #ffffff !important;
	text-decoration: none !important;
	font-weight: 700;
	font-size: .9rem;
}

.cb-back:hover,
.cb-back:focus-visible {
	background: #ffffff;
	color: var(--cb-gold-ink) !important;
}

/* ---------- Page title in the display face ---------- */

.woocommerce-cart .wp-block-post-title,
.woocommerce-checkout .wp-block-post-title {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif !important;
	font-weight: 400 !important;
	font-size: 2.6rem !important;
	line-height: 1.1;
	margin-block: 14px 8px !important;
}

/* Section headings ("اطلاعات شما", "اینم سفارش‌تون"). */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif !important;
	font-weight: 400 !important;
	font-size: 1.6rem !important;
	margin: 22px 0 10px !important;
}

/* ---------- Order card ("اینم سفارش‌تون") ---------- */

.woocommerce .cb-order {
	background: #1d1d1d !important;
	border: 0 !important;
	border-radius: 24px !important;
	padding: 14px 16px 18px;
	margin: 0 0 18px;
}

.cb-order__head {
	display: flex;
	justify-content: space-between;
	font-size: .86rem;
	font-weight: 800;
	color: #d9d9d9;
	padding: 0 2px 8px;
	border-bottom: 1px dashed rgba(255, 255, 255, .15);
}

.cb-order__items {
	list-style: none;
	margin: 0;
	padding: 4px 0;
}

.cb-order__item {
	display: grid;
	grid-template-columns: 46px 1fr auto auto;
	gap: 10px;
	align-items: center;
	padding: 10px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.cb-order__img {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	overflow: hidden;
	background: #2d2d2d;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, .18);
}

.cb-order__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 50%;
}

.cb-order__name {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif;
	font-size: 1.08rem;
	line-height: 1.35;
	min-width: 0;
}

.cb-order__name dl.variation {
	font-family: Vazirmatn, Tahoma, sans-serif;
	font-size: .75rem;
	color: var(--cb-muted);
	margin: 2px 0 0;
}

.cb-order__qty {
	background: #ffffff;
	color: var(--cb-gold-ink);
	border-radius: 9999px;
	padding: 1px 9px;
	font-size: .8rem;
	font-weight: 900;
}

.cb-order__price {
	font-weight: 800;
	font-size: .9rem;
	white-space: nowrap;
}

.cb-order__extra {
	display: flex;
	justify-content: space-between;
	font-size: .85rem;
	color: var(--cb-muted);
	padding: 6px 0;
}

.cb-order__total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 14px 2px 4px;
	margin-top: 4px;
	border-top: 1px dashed rgba(255, 255, 255, .15);
}

.cb-order__total-label {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif;
	font-size: 1.4rem;
}

.cb-order__total-amount,
.cb-order__total-amount .amount {
	font-size: 1.35rem;
	font-weight: 900;
	color: #ffffff !important;
}

/* "قابلتونو نداره، مهمان ما باشید" — words hop one after another while their colour pulses. */
.cb-order__treat {
	margin: 10px 0 0;
	text-align: center;
	font-weight: 800;
	font-size: .98rem;
	color: #ffffff;
}

.cb-order__treat span {
	display: inline-block;
	animation: cb-hop 2.4s ease-in-out 3;
}

.cb-order__treat span:nth-child(2) { animation-delay: .12s; }
.cb-order__treat span:nth-child(3) { animation-delay: .24s; }
.cb-order__treat span:nth-child(4) { animation-delay: .36s; }
.cb-order__treat span:nth-child(5) { animation-delay: .48s; }
.cb-order__treat span:nth-child(6) { animation-delay: .6s; }

.cb-order__treat .cb-order__wink {
	animation-name: cb-wink;
}

@keyframes cb-hop {
	0%, 60%, 100% { transform: translateY(0); color: #ffffff; }
	20% { transform: translateY(-6px); color: #b9a4ff; }
	35% { transform: translateY(0); color: #ffffff; }
}

@keyframes cb-wink {
	0%, 60%, 100% { transform: rotate(0) scale(1); }
	25% { transform: rotate(-15deg) scale(1.25); }
	40% { transform: rotate(10deg) scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
	.cb-order__treat span { animation: none; }
}

/* ---------- Payment box ---------- */

.woocommerce-checkout #payment {
	background: #1d1d1d !important;
	border-radius: 24px !important;
	padding: 6px 4px 16px;
}

.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
}

.woocommerce-checkout #payment div.form-row {
	padding: 12px 14px 0 !important;
}

/* Cart page: same rule as checkout, the total is the only number shown. */
.woocommerce .cart_totals tr.cart-subtotal {
	display: none !important;
}

/* ---------- Guest details: one compact card, three fields stacked ---------- */

.woocommerce-checkout #customer_details {
	box-sizing: border-box;
	width: 100% !important;
	margin-inline: 0 !important;
	background: #1d1d1d;
	border-radius: 24px;
	padding: 4px 16px 14px;
	margin-bottom: 8px;
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.woocommerce-checkout #customer_details h3 {
	margin: 12px 0 8px !important;
}

.woocommerce-checkout #customer_details .form-row {
	padding: 0 !important;
	margin: 0 0 10px !important;
}

.woocommerce-checkout #customer_details .form-row:last-child {
	margin-bottom: 0 !important;
}

.woocommerce-checkout #customer_details label {
	font-size: .95rem !important;
	font-weight: 800 !important;
	color: #f2f2f2 !important;
	margin-bottom: 4px !important;
	line-height: 1.5;
}

.woocommerce-checkout #customer_details label .required {
	color: #ff6b81 !important;
	text-decoration: none;
}

.woocommerce-checkout #customer_details .optional {
	font-weight: 500;
	font-size: .85rem;
	color: #bdbdbd;
}

.woocommerce-checkout #customer_details input.input-text,
.woocommerce-checkout #customer_details textarea {
	background: #131313 !important;
	border: 1px solid rgba(255, 255, 255, .12) !important;
	border-radius: 14px !important;
	padding: 11px 14px !important;
	font-size: 16px !important;
	min-height: 0;
}

.woocommerce-checkout #customer_details input.input-text:focus,
.woocommerce-checkout #customer_details textarea:focus {
	border-color: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, .12);
}

.woocommerce-checkout #customer_details textarea {
	height: 64px !important;
	resize: none;
}

.woocommerce-checkout #customer_details input#billing_phone {
	direction: ltr;
	text-align: right;
	letter-spacing: .04em;
}

/* The notes block only adds a heading-less wrapper; keep it flush inside the card. */
.woocommerce-checkout .woocommerce-additional-fields {
	margin: 10px 0 0 !important;
}

/* The order and payment cards carry their own background; drop the old outer frame so all three cards line up. */
.woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-checkout-review-order {
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
}

.woocommerce-checkout #order_review_heading {
	padding: 0 !important;
}

.woocommerce-checkout #customer_details input.input-text::placeholder,
.woocommerce-checkout #customer_details textarea::placeholder {
	color: #8a8a8a;
	opacity: 1;
}

/* ---------- Thank-you page: the final screen, no receipt ---------- */

.woocommerce-order-received .wp-block-post-title {
	display: none;
}

.cb-thanks {
	display: grid;
	justify-items: center;
	text-align: center;
	gap: 22px;
	padding: 40px 8px 8px;
}

.cb-thanks__badge {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	background: var(--cb-cta);
	color: #ffffff;
	display: grid;
	place-items: center;
	font-size: 3rem;
	font-weight: 900;
	box-shadow: 0 0 0 10px rgba(82, 0, 255, .18), 0 16px 40px rgba(82, 0, 255, .35);
	animation: cb-pop 1.1s cubic-bezier(.22, .9, .3, 1) both;
}

.cb-thanks__badge--fail {
	background: #e5484d;
	box-shadow: 0 0 0 10px rgba(229, 72, 77, .18);
}

@keyframes cb-pop {
	from { transform: scale(.75); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}

.cb-thanks__title {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif !important;
	font-weight: 400 !important;
	font-size: 2.8rem !important;
	line-height: 1.1;
	margin: 18px 0 0 !important;
}

.cb-thanks__lead {
	margin: 0;
	color: #e9e9e9;
	font-size: 1.05rem;
}

/* Ticket: seat + "نوش جان" on the left part, order number on the perforated stub. */
.cb-ticket {
	width: 100%;
	max-width: 420px;
	margin-top: 6px;
	display: grid;
	grid-template-columns: 1fr auto;
	background: #ffffff;
	color: var(--cb-gold-ink);
	border-radius: 18px;
	overflow: hidden;
	position: relative;
	text-align: center;
}

.cb-ticket::before,
.cb-ticket::after {
	content: "";
	position: absolute;
	left: 96px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--cb-bg);
}

.cb-ticket::before { top: -8px; }
.cb-ticket::after { bottom: -8px; }

.cb-ticket__main {
	padding: 16px;
	display: grid;
	gap: 6px;
	align-content: center;
	align-self: center;
	justify-items: center;
}

.cb-ticket__seat {
	font-weight: 900;
	font-size: 1.02rem;
}

.cb-thanks .cb-ticket__treat {
	margin: 0;
	text-align: center;
	font-size: .98rem;
	color: var(--cb-gold-ink);
}

.cb-ticket__treat span {
	animation-name: cb-hop-ink;
}

.cb-ticket__treat .cb-order__wink {
	animation-name: cb-wink;
}

@keyframes cb-hop-ink {
	0%, 60%, 100% { transform: translateY(0); color: #131313; }
	20% { transform: translateY(-5px); color: #5200ff; }
	35% { transform: translateY(0); color: #131313; }
}

.cb-ticket__stub {
	width: 104px;
	border-right: 2px dashed rgba(19, 19, 19, .25);
	display: grid;
	place-content: center;
	text-align: center;
	gap: 2px;
	padding: 12px 0;
	font-size: .78rem;
	font-weight: 700;
	color: #6b6b6b;
}

.cb-ticket__stub strong {
	font-family: Lalezar, Vazirmatn, Tahoma, sans-serif;
	font-weight: 400;
	font-size: 2rem;
	line-height: 1;
	color: var(--cb-gold-ink);
}

.cb-thanks__retry {
	background: var(--cb-cta) !important;
	color: var(--cb-cta-ink) !important;
	border-radius: 9999px !important;
	padding: 12px 24px !important;
	font-weight: 800 !important;
	margin-top: 8px;
}

/* Payment instructions printed under it (e.g. cash on delivery). */
.cb-thanks > p:not([class]) {
	margin: 6px 0 0;
	color: var(--cb-muted);
	font-size: .85rem;
}

@media (prefers-reduced-motion: reduce) {
	.cb-thanks__badge { animation: none; }
}

/* Keep each order line on one row everywhere (WooCommerce list rules on the thank-you page break the grid). */
.cb-order .cb-order__items > li.cb-order__item {
	display: grid !important;
	grid-template-columns: 46px minmax(0, 1fr) auto auto !important;
	margin: 0 !important;
	float: none !important;
	width: auto !important;
}

/* Breathing room between the details card and the «اینم سفارش‌تون» heading. */
.woocommerce-checkout #order_review_heading {
	margin-top: 36px !important;
}


/* ======================================================================
   Interface-guidelines pass (2026-10-06)
   ====================================================================== */

/* (5, 11) No double-tap zoom, no tap flash. */
html {
	touch-action: manipulation;
}

a,
button,
input,
textarea,
label {
	-webkit-tap-highlight-color: transparent;
}

/* (4) The back button is a 44px target. */
.cb-back {
	min-height: 44px;
	box-sizing: border-box;
}

.cb-topbar__title,
.cb-thanks__title,
.woocommerce-checkout h3 {
	text-wrap: balance;
}

.cb-order__price,
.cb-order__total-amount,
.cb-ticket__stub strong {
	font-variant-numeric: tabular-nums;
}


/* Prices on checkout / thank-you: big number, small unit (same as the menu). */
.cb-money {
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.cb-money__num {
	font-weight: 900;
	font-size: 1.12em;
}

.cb-money__unit {
	font-size: .72em;
	font-weight: 500;
	opacity: .72;
}


/* Order lines: quantity sits as a badge on the thumbnail corner (no separate "×N" column). */
.cb-order .cb-order__items > li.cb-order__item {
	grid-template-columns: 46px minmax(0, 1fr) auto !important;
}

.cb-order__img {
	position: relative;
	overflow: visible !important;
}

.cb-order__badge {
	position: absolute;
	top: -6px;
	right: -6px;
	min-width: 22px;
	height: 22px;
	padding: 0 5px;
	box-sizing: border-box;
	border-radius: 11px;
	background: #ffffff;
	color: #131313;
	border: 2px solid #1d1d1d;
	display: grid;
	place-items: center;
	font-size: .74rem;
	font-weight: 900;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

/* One divider only: the last line drops its own border so the dashed total rule stands alone. */
.cb-order .cb-order__items > li.cb-order__item:last-child {
	border-bottom: 0;
}

/* Column headers sit exactly over their columns: «آیتم» over the names, «مبلغ» over where prices start. */
.cb-order__head {
	display: grid;
	grid-template-columns: 46px minmax(0, 1fr) 7.5em;
	gap: 10px;
	padding-inline: 0;
}

.cb-order__head > span:first-child { grid-column: 2; }
.cb-order__head > span:last-child { grid-column: 3; text-align: start; }

.cb-order .cb-order__items > li.cb-order__item {
	grid-template-columns: 46px minmax(0, 1fr) 7.5em !important;
}

.cb-order__price {
	text-align: start;
}

/* Total row on the same columns: «مجموع» under the names, the amount under the prices. */
.cb-order__total {
	display: grid;
	grid-template-columns: 46px minmax(0, 1fr) 7.5em;
	gap: 10px;
	align-items: baseline;
	padding-inline: 0;
}

.cb-order__total-label { grid-column: 2; }

.cb-order__total-amount {
	grid-column: 3;
	text-align: start;
	white-space: nowrap;
}

/* Order thumbnails as rounded squares, same as the menu; columns follow the wider thumb. */
.cb-order__img {
	width: 50px;
	height: 50px;
	border-radius: 12px;
	background: #2d2d2d;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .1);
}

.cb-order__img img {
	border-radius: 12px;
}

.cb-order__head,
.cb-order__total,
.cb-order .cb-order__items > li.cb-order__item {
	grid-template-columns: 50px minmax(0, 1fr) 7.5em !important;
}


/* Checkout seat: scanned seat shown as a fixed line; otherwise hall / row / seat fields (row + seat side by side). */
.cb-seat-fixed {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	padding: 12px 14px;
	border-radius: 14px;
	background: #131313;
	border: 1px solid rgba(255, 255, 255, .12);
}

.cb-seat-fixed span {
	color: var(--cb-muted);
	font-size: .85rem;
	font-weight: 700;
}

.cb-seat-fixed strong {
	font-weight: 900;
}

.woocommerce-checkout #customer_details .cb-seat-field.form-row-first,
.woocommerce-checkout #customer_details .cb-seat-field.form-row-last {
	width: calc(50% - 5px) !important;
	display: inline-block;
	vertical-align: top;
}

.woocommerce-checkout #customer_details .cb-seat-field.form-row-first {
	margin-inline-end: 10px !important;
}

.woocommerce-checkout #customer_details select {
	width: 100%;
	background: #131313 !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, .12) !important;
	border-radius: 14px !important;
	padding: 11px 14px !important;
	font-size: 16px !important;
	font-family: Vazirmatn, Tahoma, sans-serif;
}

.woocommerce-checkout #customer_details select:disabled {
	opacity: .5;
}

/* Dropdown arrow (RTL: on the left), so hall / row / seat read as choices. */
.woocommerce-checkout #customer_details select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: left 14px center !important;
	padding-left: 36px !important;
}

/* Thank-you ticket: showtime under the seat. */
.cb-ticket__show {
	margin-top: -6px;
	font-weight: 700;
	font-size: .9rem;
	color: var(--cb-muted);
}

/* Thank-you ticket: live order progress (ثبت شد → در حال آماده‌سازی → تحویل شد). */
.cb-progress {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin: 4px 0 2px;
	padding: 0;
	list-style: none;
	font-size: .78rem;
	font-weight: 700;
}

.cb-progress li {
	white-space: nowrap;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(19, 19, 19, .08);
	color: rgba(19, 19, 19, .5);
}

.cb-progress li.is-done {
	color: #131313;
}

.cb-progress li.is-now {
	background: #131313;
	color: #ffffff;
}


/* Seat / showtime labels wrap only between their « - » parts. */
.cb-nw {
	white-space: nowrap;
}

.cb-ticket__seat {
	text-align: center;
}

/* Stub: «شماره سفارش» may wrap to two lines on phones with large text instead of being cut off. */
.cb-ticket__stub span {
	max-width: 88px;
	margin-inline: auto;
	line-height: 1.4;
}

/* Large phone text: the main part shrinks and its rows wrap; the stub keeps its width. */
.cb-ticket {
	grid-template-columns: minmax(0, 1fr) auto;
}

.cb-ticket__main {
	min-width: 0;
}

/* Ticket text scales with the ticket's width (container units), so it keeps its layout on any phone:
   seat on one line, showtime on one line, the three progress steps on one line. */
.cb-ticket__main {
	container-type: inline-size;
	gap: 4px;
}

.cb-ticket__seat,
.cb-ticket__show {
	white-space: nowrap;
	max-width: 100%;
}

.cb-ticket__seat {
	font-size: min(1.02rem, 6.6cqi);
}

.cb-ticket__show {
	margin-top: 0;
	font-size: min(.9rem, 5.6cqi);
}

.cb-progress {
	flex-wrap: nowrap;
	gap: min(6px, 1.5cqi);
	margin-top: 6px;
	font-size: min(.78rem, 4.4cqi);
}

.cb-progress li {
	padding: 3px min(10px, 2.6cqi);
}

/* Progress steps fill the ticket's width: three equal pills, as large as the space allows. */
.cb-ticket__main {
	padding-inline: 12px;
}

.cb-progress {
	justify-self: stretch;
	gap: 5px;
	font-size: min(.92rem, 5.4cqi);
}

.cb-progress li {
	flex: 1 1 0;
	min-width: 0;
	padding: 6px 2px;
	text-align: center;
}

.cb-thanks__lead--after {
	margin-top: 14px;
}

/* Stub text follows the ticket's width too, so large phone fonts don't squeeze the seat and steps. */
.cb-ticket {
	container-type: inline-size;
}

.cb-ticket__stub {
	font-size: min(.78rem, 3.6cqi);
}

.cb-ticket__stub strong {
	font-size: min(2rem, 9cqi);
}

/* Buffet closed for the day (checkout). */
.cb-closed {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-radius: 14px;
	background: rgba(229, 72, 77, .14);
	border: 1px solid rgba(229, 72, 77, .5);
	color: #ffb4b6;
	font-weight: 700;
	line-height: 1.7;
}

/* Retry payment page (order-pay): seat + showtime lines, then the same order card as the checkout. */
.cb-pay .cb-seat-fixed {
	margin-bottom: 8px;
}

.cb-pay #order_review_heading {
	margin-top: 18px;
}

.cb-pay #payment {
	margin-top: 16px;
}

.cb-seat-fixed strong {
	color: var(--cb-text);
}
