
/* ══════════════════════════════════════════════════════════════════════════
   AMSTERDAM KIDS · VOXEL MONEY SURFACES
   Every selector is rooted at a Voxel widget class — nothing leaks.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── shared tokens, scoped ─────────────────────────────────────────────── */
.ts-checkout,
.vx-orders-widget,
.ts-vendor-settings {
	--akv-navy: #0B1324;
	--akv-ink: #41525a;
	--akv-mute: #7d8c93;
	--akv-teal: #2A7780;
	--akv-deep: #1D5B62;
	--akv-tint: #dcedef;
	--akv-wash: #f2f8f9;
	--akv-coral: #ff6b6b;
	--akv-line: rgba(190,201,195,.34);
	--akv-card: 0 2px 10px rgba(11,19,36,.04);
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: var(--akv-ink);
}

/* ════════════════════════════════════════════════════════════════════════
   A · CHECKOUT  (/cart-summary/ — regular, claim and promote screens)
   ════════════════════════════════════════════════════════════════════════ */

body .ts-checkout {
	max-width: 640px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid var(--akv-line);
	border-radius: 20px;
	box-shadow: 0 6px 26px rgba(11,19,36,.06);
	padding: 30px 30px 26px;
	grid-gap: 26px;
}

/* Page frame. The stock /cart-summary/ Elementor container squeezes the form
   into a 520px column 100px down the page; recentre it and calm the rhythm.
   Scoped to page 2223, which holds nothing but this widget. */
body.page-id-2223 .e-con-inner:has(.ts-checkout) {
	max-width: 700px;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-top: 46px !important;
	padding-bottom: 64px !important;
}

body .ts-checkout h1,
body .ts-checkout .ts-cart-head h1,
body .ts-checkout .cart-head h1 {
	font-family: 'Fredoka', 'Plus Jakarta Sans', sans-serif;
	font-weight: 600;
	font-size: 30px;
	line-height: 1.15;
	letter-spacing: -.4px;
	color: var(--akv-navy);
	margin: 0;
}
body .ts-checkout .ts-cart-head,
body .ts-checkout .cart-head {
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding-bottom: 4px;
	border-bottom: 1px solid var(--akv-line);
}
/* eyebrow above the title */
body .ts-checkout .ts-cart-head::before,
body .ts-checkout .cart-head::before {
	content: 'Secure checkout';
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--akv-teal);
}
body .ts-checkout-promotion .cart-head::before { content: 'Boost your listing'; }

/* section dividers */
body .ts-checkout .or-group { margin: 2px 0 -4px; }
body .ts-checkout .or-group .or-text {
	font-family: 'Plus Jakarta Sans', sans-serif;
	color: var(--akv-mute);
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 1.4px;
}
body .ts-checkout .or-group .or-line { background: var(--akv-line); }

body .ts-checkout .checkout-section { grid-gap: 16px; }
body .ts-checkout label {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	color: var(--akv-navy);
}

/* ── cart items ────────────────────────────────────────────────────────── */
body .ts-checkout .ts-cart-list { grid-gap: 12px; display: flex; flex-direction: column; }
body .ts-checkout .ts-cart-list > li {
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--akv-wash);
	border: 1px solid var(--akv-line);
	border-radius: 14px;
	padding: 13px 15px;
	transition: .18s ease;
}
body .ts-checkout .ts-cart-list > li:hover { border-color: #b5d5d9; }
body .ts-checkout .cart-image,
body .ts-checkout .cart-image img {
	width: 56px; height: 56px;
	border-radius: 12px;
	object-fit: cover;
	flex-shrink: 0;
	overflow: hidden;
}
body .ts-checkout .cart-item-details {
	display: flex; flex-direction: column; gap: 2px;
	flex-grow: 1; min-width: 0;
}
body .ts-checkout .cart-item-details > a {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 15.5px;
	color: var(--akv-navy);
	text-decoration: none;
	line-height: 1.3;
}
body .ts-checkout .cart-item-details > a:hover { color: var(--akv-teal); }
body .ts-checkout .cart-item-details > span {
	font-size: 13.5px;
	color: var(--akv-mute);
	line-height: 1.45;
}
body .ts-checkout .cart-item-details > span:last-child {
	color: var(--akv-teal);
	font-weight: 700;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 14.5px;
}
body .ts-checkout .cart-stepper {
	display: flex; align-items: center; gap: 6px; flex-shrink: 0;
}
body .ts-checkout .cart-stepper .ts-icon-btn {
	width: 32px; height: 32px;
	border-radius: 10px;
	border: 1px solid var(--akv-line);
	background: #fff;
	display: inline-flex; align-items: center; justify-content: center;
}
body .ts-checkout .cart-stepper .ts-icon-btn:hover {
	border-color: var(--akv-teal); background: var(--akv-tint);
}
body .ts-checkout .cart-stepper .ts-icon-btn svg { width: 15px; height: 15px; fill: var(--akv-teal); }
body .ts-checkout .cart-stepper > span {
	min-width: 24px; text-align: center;
	font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--akv-navy);
}

/* ── pricing summary ───────────────────────────────────────────────────── */
body .ts-checkout .ts-cost-calculator {
	background: var(--akv-wash);
	border: 1px solid var(--akv-line);
	border-radius: 14px;
	padding: 16px 18px;
	gap: 9px;
	margin-bottom: 18px;
}
body .ts-checkout .ts-cost-calculator li p { font-size: 14.5px; color: var(--akv-ink); }
body .ts-checkout .ts-cost-calculator li .ts-item-name p { color: var(--akv-mute); }
body .ts-checkout .ts-cost-calculator li.ts-total {
	border-top: 1px dashed var(--akv-line);
	padding-top: 11px;
	margin-top: 3px;
}
body .ts-checkout .ts-cost-calculator li.ts-total p {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 18px;
	color: var(--akv-navy);
}

/* ── the pay button ────────────────────────────────────────────────────────
   !important is needed here (and on the other .ts-btn rules below): the site
   already ships global `.ts-btn-1 { background: transparent !important }` /
   `.ts-btn-2` overrides. Our selectors are both scoped and more specific, so
   they win the !important tie without leaking anywhere else. */
body .ts-checkout .ts-btn.ts-btn-2 {
	width: 100%;
	height: auto;
	min-height: 56px !important;
	border-radius: 999px !important;
	background: #ff6b6b !important;
	border: none !important;
	color: #fff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-weight: 800;
	font-size: 16.5px;
	letter-spacing: -.1px;
	gap: 10px;
	box-shadow: 0 8px 20px rgba(255,107,107,.30) !important;
	transition: .18s ease;
}
body .ts-checkout .ts-btn.ts-btn-2:hover {
	background: #f2554f !important;
	box-shadow: 0 10px 26px rgba(255,107,107,.38) !important;
	transform: translateY(-1px);
	color: #fff !important;
}
body .ts-checkout .ts-btn.ts-btn-2 svg,
body .ts-checkout .ts-btn.ts-btn-2 i { fill: #fff !important; color: #fff !important; width: 18px; height: 18px; }
/* Voxel puts opacity:.6 on .vx-disabled, so the disabled state needs its own
   readable pairing rather than washed-out white-on-coral. */
body .ts-checkout .ts-btn.ts-btn-2.vx-disabled {
	background: #e1ebee !important;
	box-shadow: none !important;
	color: #59707a !important;
	opacity: 1 !important;
	cursor: not-allowed;
}
body .ts-checkout .ts-btn.ts-btn-2.vx-disabled svg { fill: #59707a !important; }

/* secondary checkout actions — "Existing customer? Sign in", "Send code" */
body .ts-checkout .ts-btn.ts-btn-1 {
	width: 100%;
	min-height: 50px !important;
	border-radius: 999px !important;
	background: #fff !important;
	border: 1.5px solid #b5d5d9 !important;
	color: var(--akv-deep) !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-weight: 700;
	font-size: 15px;
	gap: 9px;
	box-shadow: none !important;
	transition: .18s ease;
}
body .ts-checkout .ts-btn.ts-btn-1:hover {
	background: var(--akv-tint) !important;
	border-color: var(--akv-teal) !important;
	color: var(--akv-deep) !important;
}
body .ts-checkout .ts-btn.ts-btn-1 svg,
body .ts-checkout .ts-btn.ts-btn-1 i { fill: var(--akv-teal) !important; color: var(--akv-teal) !important; width: 17px; height: 17px; }

/* ── inputs (guest email, confirmation code) ───────────────────────────────
   Note: horizontal padding and the absolute icon position are owned by
   ak-checkout-fixes.php (site-wide .ts-input-icon rules, !important). We only
   touch the frame so the two never fight. */
body .ts-checkout input.ts-filter {
	min-height: 52px;
	border-radius: 14px;
	border: 1px solid var(--akv-line);
	background: #fff;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	color: var(--akv-navy);
}
body .ts-checkout input.ts-filter:focus {
	border-color: var(--akv-teal);
	box-shadow: 0 0 0 3px rgba(42,119,128,.12);
	outline: none;
}
body .ts-checkout .ts-input-icon > svg { fill: var(--akv-teal); }

/* ── order notes / checkboxes / textareas ──────────────────────────────── */
body .ts-checkout textarea.ts-filter {
	border-radius: 14px;
	border: 1px solid var(--akv-line);
	padding: 13px 15px;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	color: var(--akv-navy);
	background: #fff;
}
body .ts-checkout textarea.ts-filter:focus {
	border-color: var(--akv-teal);
	box-shadow: 0 0 0 3px rgba(42,119,128,.12);
	outline: none;
}
body .ts-checkout .tos-checkbox label { font-size: 14.5px; color: var(--akv-ink); cursor: pointer; }
body .ts-checkout .tos-checkbox .checkmark { border-radius: 7px; }
body .ts-checkout .tos-checkbox .field-info { margin: 0; }
body .ts-checkout .tos-checkbox a { color: var(--akv-teal); font-weight: 700; }

/* empty / loading states */
body .ts-checkout .ts-no-posts p,
body .vx-orders-widget .ts-no-posts p {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	color: var(--akv-mute);
}
body .ts-checkout .ts-no-posts svg,
body .vx-orders-widget .ts-no-posts svg { fill: #b5d5d9; }

/* ── trust bar (inserted as a sibling AFTER the Vue root) ──────────────── */
.ak-vx-trust {
	max-width: 640px;
	margin: 16px auto 0;
	display: flex;
	align-items: flex-start;
	gap: 11px;
	padding: 14px 18px;
	background: var(--akv-wash, #f2f8f9);
	border: 1px solid rgba(190,201,195,.34);
	border-radius: 16px;
}
.ak-vx-trust svg { width: 19px; height: 19px; flex-shrink: 0; fill: #2A7780; margin-top: 1px; }
.ak-vx-trust b {
	display: block;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 14px;
	color: #0B1324;
	margin-bottom: 2px;
}
.ak-vx-trust span {
	display: block;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 1.55;
	color: #7d8c93;
}

/* ════════════════════════════════════════════════════════════════════════
   B · PROMOTE / BOOST  (.ts-checkout-promotion)
   ════════════════════════════════════════════════════════════════════════ */

body .ts-checkout-promotion .addon-cards { gap: 14px; }
body .ts-checkout-promotion .addon-cards li {
	--ts-accent-1: #2A7780 !important;   /* overrides the inline package colour */
	border: 1.5px solid rgba(190,201,195,.34);
	border-radius: 16px;
	padding: 18px 20px;
	gap: 16px;
	background: #fff;
	align-items: flex-start;
}
body .ts-checkout-promotion .addon-cards li:hover { border-color: #b5d5d9; }
body .ts-checkout-promotion .addon-cards li.adc-selected {
	border-color: #2A7780;
	box-shadow: 0 0 0 3px rgba(42,119,128,.12);
	background: #f2f8f9;
}
body .ts-checkout-promotion .card-icn {
	width: 44px; height: 44px; border-radius: 14px; margin-top: 2px;
}
body .ts-checkout-promotion .card-icn:before { opacity: .10; }
/* Both boost packages have a MALFORMED icon setting in voxel:promotions — the
   raw JSON leaks into the class attribute (`class='"las la-rocket","library":…'`)
   so the <i> renders nothing and the tile looks empty. Hide the broken glyph
   and draw a brand bolt. A correctly configured icon still wins.
   (Fixing the stored setting is a Voxel admin job — see report.) */
body .ts-checkout-promotion .card-icn i[class*="library"] { display: none !important; }
body .ts-checkout-promotion .card-icn:has(i[class*="library"]):after,
body .ts-checkout-promotion .card-icn:not(:has(svg)):not(:has(i)):after {
	content: '';
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232A7780' d='M13 2 4 14h6l-1 8 9-12h-6z'/%3E%3C/svg%3E") center/21px no-repeat;
}
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child .card-icn:after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ff6b6b' d='M13 2 4 14h6l-1 8 9-12h-6z'/%3E%3C/svg%3E");
}
body .ts-checkout-promotion .addon-details { gap: 5px; padding-right: 76px; }
body .ts-checkout-promotion .addon-details .adc-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 17px;
	color: #0B1324;
}
body .ts-checkout-promotion .addon-cards li.adc-selected .adc-title { font-weight: 800; }
body .ts-checkout-promotion .addon-details .adc-subtitle {
	font-size: 14px; line-height: 1.5; color: #7d8c93;
}
body .ts-checkout-promotion .vx-addon-price {
	top: 18px; right: 20px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 20px;
	color: #0B1324;
}
/* recommended: exactly-two-package layouts get a coral "Best value" ribbon
   on the longer package. */
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child {
	border-color: rgba(255,107,107,.55);
}
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child::after {
	content: 'Best value';
	position: absolute;
	top: -1px; right: -1px;
	background: #ff6b6b;
	color: #fff;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 10px;
	letter-spacing: 1.1px;
	text-transform: uppercase;
	padding: 5px 12px;
	border-radius: 0 15px 0 12px;
}
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child .vx-addon-price { top: 40px; }
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child.adc-selected {
	border-color: #ff6b6b;
	box-shadow: 0 0 0 3px rgba(255,107,107,.14);
	background: #fff7f6;
}
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child .card-icn:before {
	background: #ff6b6b;
}
body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child .card-icn svg {
	fill: #ff6b6b; color: #ff6b6b;
}

/* "what a boost does" strip, inserted as a sibling before the Vue root */
.ak-vx-boostnote {
	max-width: 640px;
	margin: 0 auto 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	padding: 14px 20px;
	background: #f2f8f9;
	border: 1px solid rgba(190,201,195,.34);
	border-radius: 16px;
	justify-content: center;
}
.ak-vx-boostnote i {
	display: inline-flex; align-items: center; gap: 7px;
	font-style: normal;
	font-family: 'Manrope', sans-serif;
	font-size: 13.5px;
	color: #7d8c93;
}
.ak-vx-boostnote i::before {
	content: '';
	width: 16px; height: 16px; border-radius: 50%;
	background: #dcedef url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232A7780' d='M9.6 16.6 5 12l1.4-1.4 3.2 3.2 8-8L19 7.2z'/%3E%3C/svg%3E") center/13px no-repeat;
	flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════════════════
   C · ORDERS — list
   ════════════════════════════════════════════════════════════════════════ */

/* the dashboard shell already prints the page title in its hero */
body .ak-dash-main .vx-orders-widget .widget-head h1 { display: none; }
body .vx-orders-widget .widget-head { margin-bottom: 18px; }
body .vx-orders-widget .widget-head h1 {
	font-family: 'Fredoka', 'Plus Jakarta Sans', sans-serif;
	font-weight: 600; font-size: 28px; color: var(--akv-navy); margin: 0 0 4px;
}
body .vx-orders-widget .widget-head p {
	font-size: 14.5px; color: var(--akv-mute); margin: 0;
}

/* filter row */
body .vx-orders-widget .vx-order-filters { gap: 10px; margin-bottom: 20px; }
body .vx-orders-widget .ts-filter {
	border-radius: 12px;
	border: 1px solid var(--akv-line);
	background: #fff;
	font-family: 'Manrope', sans-serif;
	font-size: 14.5px;
	color: var(--akv-ink);
	min-height: 46px;
}
body .vx-orders-widget .ts-filter:hover { border-color: #b5d5d9; }
body .vx-orders-widget .ts-filter.ts-filled {
	border-color: var(--akv-teal);
	background: var(--akv-tint);
	color: var(--akv-deep);
	font-weight: 700;
}
body .vx-orders-widget .ts-filter svg { fill: var(--akv-teal); }
body .vx-orders-widget .order-keyword-search .ts-input-icon input { font-size: 14.5px; }

/* order rows */
body .vx-orders-widget .vx-order-list { display: flex; flex-direction: column; gap: 10px; }
body .vx-orders-widget .vx-order-card {
	border: 1px solid var(--akv-line);
	border-radius: 16px;
	padding: 16px 18px;
	gap: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(11,19,36,.03);
}
body .vx-orders-widget .vx-order-card:hover {
	border-color: #b5d5d9;
	box-shadow: 0 6px 18px rgba(11,19,36,.07);
	transform: translateY(-1px);
}
body .vx-orders-widget .vx-order-card b {
	font-family: 'Manrope', sans-serif;
	font-size: 14.5px;
	color: var(--akv-navy);
	font-weight: 600;
}
body .vx-orders-widget .vx-order-card.vx-status-pending_approval b { font-weight: 800; }
body .vx-orders-widget .vx-order-meta { display: flex; align-items: center; gap: 10px; min-width: 0; }
body .vx-orders-widget .vx-order-title { flex-grow: 1; }
body .vx-orders-widget .vx-order-meta span {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 13.5px;
	color: var(--akv-mute);
	white-space: nowrap;
}
body .vx-orders-widget .vx-avatar,
body .vx-orders-widget .vx-avatar img {
	width: 36px; height: 36px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
}
body .vx-orders-widget .order-badge {
	background: var(--akv-tint);
	color: var(--akv-deep);
	border-radius: 999px;
	padding: 4px 10px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 12px;
}

/* ── status pills (brand palette) ──────────────────────────────────────── */
body .vx-orders-widget .vx-green,
body .single-order .vx-green   { --s-color: #17876a; }
body .vx-orders-widget .vx-orange,
body .single-order .vx-orange  { --s-color: #b26b12; }
body .vx-orders-widget .vx-red,
body .single-order .vx-red     { --s-color: #d24a44; }
body .vx-orders-widget .vx-blue,
body .single-order .vx-blue    { --s-color: #2A7780; }
body .vx-orders-widget .vx-neutral,
body .single-order .vx-neutral { --s-color: #6b7a82; }

body .vx-orders-widget .order-status,
body .single-order .order-status {
	border-radius: 999px;
	padding: 6px 13px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: .2px;
	line-height: 1.25;
	white-space: nowrap;
}
body .vx-orders-widget .order-status:after,
body .single-order .order-status:after { opacity: .12; }

/* pager */
body .vx-orders-widget .vx-order-more { display: flex; gap: 10px; margin-top: 22px; }
body .vx-orders-widget .ts-load-more.ts-btn-1,
body .single-order .ts-btn.ts-btn-1 {
	border-radius: 999px !important;
	border: 1.5px solid var(--akv-line) !important;
	background: #fff !important;
	color: var(--akv-navy) !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-weight: 700;
	font-size: 14px;
	min-height: 44px !important;
	padding: 0 18px;
	transition: .18s ease;
}
body .vx-orders-widget .ts-load-more.ts-btn-1:hover,
body .single-order .ts-btn.ts-btn-1:hover {
	border-color: var(--akv-teal) !important; background: var(--akv-tint) !important; color: var(--akv-deep) !important;
}
body .vx-orders-widget .ts-btn svg,
body .single-order .ts-btn.ts-btn-1 svg { fill: var(--akv-teal) !important; width: 16px; height: 16px; }

/* ════════════════════════════════════════════════════════════════════════
   D · ORDERS — single order
   ════════════════════════════════════════════════════════════════════════ */

body .single-order .vx-order-head {
	gap: 10px;
	flex-wrap: wrap;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--akv-line);
}
body .single-order .ts-btn.ts-btn-2 {
	border-radius: 999px !important;
	background: #ff6b6b !important;
	border: none !important;
	color: #fff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-weight: 800;
	font-size: 14px;
	min-height: 44px !important;
	padding: 0 20px;
	box-shadow: 0 6px 16px rgba(255,107,107,.26) !important;
}
body .single-order .ts-btn.ts-btn-2:hover { background: #f2554f !important; color: #fff !important; }
body .single-order .ts-btn.ts-btn-2 svg { fill: #fff !important; }

/* timeline */
body .single-order .order-timeline { padding: 32px 0 8px; }
body .single-order .order-event { gap: 9px; }
body .single-order .order-event:after {
	height: 28px; width: 2px; border-radius: 2px;
	background: linear-gradient(#b5d5d9, rgba(181,213,217,.25));
	margin: 18px 0;
}
body .single-order .order-event h3 {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 19px;
	color: var(--akv-navy);
	letter-spacing: -.2px;
}
body .single-order .order-event > span { font-size: 13.5px; color: var(--akv-mute); }
body .single-order .order-event > b {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800; font-size: 15px; color: var(--akv-navy);
}
body .single-order .order-event .vx-avatar,
body .single-order .order-event .vx-avatar img {
	width: 60px; height: 60px; border-radius: 50%; overflow: hidden;
}
body .single-order .order-event-icon {
	width: 42px; height: 42px; border-radius: 14px;
	display: flex; align-items: center; justify-content: center;
	background: var(--akv-tint);
}
body .single-order .order-event-icon > svg { width: 22px; height: 22px; }

body .single-order .order-event-box {
	border: 1px solid var(--akv-line);
	border-radius: 18px;
	padding: 22px;
	gap: 16px;
	background: #fff;
	box-shadow: 0 2px 10px rgba(11,19,36,.04);
	margin-top: 8px;
}

/* item cards inside the box */
body .single-order .order-event-box .ts-cart-list { display: flex; flex-direction: column; gap: 12px; }
body .single-order .order-event-box .ts-cart-list > li {
	display: flex; gap: 14px;
	background: var(--akv-wash);
	border: 1px solid var(--akv-line);
	border-radius: 14px;
	padding: 13px 15px;
	align-items: flex-start;
}
body .single-order .order-event-box .cart-image img {
	width: 56px; height: 56px; border-radius: 12px; object-fit: cover;
}
body .single-order .order-item-title {
	display: flex; justify-content: space-between; gap: 14px; align-items: baseline;
}
body .single-order .order-item-title a {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800; font-size: 15.5px; color: var(--akv-navy); text-decoration: none;
}
body .single-order .order-item-title a:hover { color: var(--akv-teal); }
body .single-order .order-item-title > span {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800; font-size: 15px; color: var(--akv-teal); white-space: nowrap;
}
body .single-order .cart-item-details > span { font-size: 13.5px; color: var(--akv-mute); }
body .single-order .order-expand-details span {
	color: var(--akv-teal); font-weight: 700; font-size: 13px; cursor: pointer;
}

/* totals */
body .single-order .order-event-box .ts-cost-calculator {
	background: var(--akv-wash);
	border: 1px solid var(--akv-line);
	border-radius: 14px;
	padding: 16px 18px;
	gap: 9px;
}
body .single-order .ts-cost-calculator li p { font-size: 14.5px; color: var(--akv-ink); }
body .single-order .ts-cost-calculator li .ts-item-name p { color: var(--akv-mute); }
body .single-order .ts-cost-calculator li.ts-total {
	border-top: 1px dashed var(--akv-line); padding-top: 11px; margin-top: 3px;
}
body .single-order .ts-cost-calculator li.ts-total p {
	font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 18px; color: var(--akv-navy);
}

/* accordions */
body .single-order .order-accordion { border-top: 1px solid var(--akv-line); }
body .single-order .order-accordion summary {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700; font-size: 14.5px; color: var(--akv-navy);
	padding-top: 16px; align-items: center;
}
body .single-order .order-accordion summary svg { fill: var(--akv-teal); }
body .single-order .order-accordion .details-body { padding-top: 14px; }
body .single-order .further-actions { display: flex; gap: 9px; flex-wrap: wrap; justify-content: center; margin-top: 4px; }

/* child orders */
body .single-order .ts-child-orders .vx-order-list { width: 100%; display: flex; flex-direction: column; gap: 10px; }
body .single-order .ts-child-orders .vx-order-card {
	border: 1px solid var(--akv-line); border-radius: 14px; padding: 14px 16px; background: #fff;
}

/* ════════════════════════════════════════════════════════════════════════
   E · STRIPE CONNECT  (/stripe-account/)
   ════════════════════════════════════════════════════════════════════════ */

body .ts-vendor-settings .ts-panel {
	border: 1px solid var(--akv-line);
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 2px 10px rgba(11,19,36,.04);
}
body .ts-vendor-settings .ts-panel > img {
	width: 100%; height: auto; display: block; max-height: 190px; object-fit: cover;
}
body .ts-vendor-settings .ac-body { padding: 22px; display: flex; flex-direction: column; gap: 14px; }
body .ts-vendor-settings .ac-body > p {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: var(--akv-navy);
	margin: 0;
}
body .ts-vendor-settings .ac-bottom { margin: 0; }
body .ts-vendor-settings .current-plan-btn { display: flex; flex-wrap: wrap; gap: 10px; }
body .ts-vendor-settings .current-plan-btn > li { flex: 1 1 auto; }
body .ts-vendor-settings .ts-btn.ts-btn-1 {
	width: 100%;
	border-radius: 999px !important;
	min-height: 52px !important;
	background: #ff6b6b !important;
	border: none !important;
	color: #fff !important;
	font-family: 'Plus Jakarta Sans', sans-serif !important;
	font-weight: 800;
	font-size: 15.5px;
	gap: 9px;
	box-shadow: 0 8px 20px rgba(255,107,107,.28) !important;
	transition: .18s ease;
}
body .ts-vendor-settings .ts-btn.ts-btn-1:hover {
	background: #f2554f !important; color: #fff !important; transform: translateY(-1px);
}
body .ts-vendor-settings .ts-btn.ts-btn-1 svg,
body .ts-vendor-settings .ts-btn.ts-btn-1 i { fill: #fff !important; color: #fff !important; width: 18px; height: 18px; }
/* secondary actions (once onboarded) stay quiet */
body .ts-vendor-settings .ac-bottom ~ .ac-bottom .ts-btn.ts-btn-1 {
	background: #fff !important;
	color: var(--akv-navy) !important;
	border: 1.5px solid var(--akv-line) !important;
	box-shadow: none !important;
}
body .ts-vendor-settings .ac-bottom ~ .ac-bottom .ts-btn.ts-btn-1:hover {
	border-color: var(--akv-teal) !important; background: var(--akv-tint) !important; color: var(--akv-deep) !important; transform: none;
}
body .ts-vendor-settings .ac-bottom ~ .ac-bottom .ts-btn.ts-btn-1 svg { fill: var(--akv-teal) !important; }

/* payout explainer, inserted as a sibling BEFORE the Vue root */
/* dormant: payoutNote() only runs when ak_ticketing_enabled() is true */
.ak-vx-payout {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 18px;
}
.ak-vx-payout div {
	flex: 1 1 168px;
	background: #f2f8f9;
	border: 1px solid rgba(190,201,195,.34);
	border-radius: 14px;
	padding: 13px 15px;
}
.ak-vx-payout b {
	display: block;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 13px;
	color: #2A7780;
	letter-spacing: .3px;
	margin-bottom: 3px;
}
.ak-vx-payout span {
	font-family: 'Manrope', sans-serif;
	font-size: 13.5px;
	line-height: 1.5;
	color: #7d8c93;
}

/* ════════════════════════════════════════════════════════════════════════
   F · "Sponsored" chip on place / event / service cards
   ════════════════════════════════════════════════════════════════════════ */
.ts-preview .akpv-link,
.ts-preview .akvt-media { position: relative; }
.ak-boost-chip {
	position: absolute;
	top: 12px; left: 12px;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 11px 5px 8px;
	border-radius: 999px;
	background: rgba(255,107,107,.94);
	color: #fff;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 10.5px;
	letter-spacing: .9px;
	text-transform: uppercase;
	box-shadow: 0 2px 8px rgba(11,19,36,.20);
	backdrop-filter: saturate(1.2) blur(2px);
	pointer-events: none;
}
.ak-boost-chip svg { width: 12px; height: 12px; fill: #fff; }
/* event cards already carry a category pill top-left — sit under it instead */
.ts-preview .akvt-media > .ak-boost-chip { top: auto; bottom: 10px; }
/* family-service cards are an <article>, not a .ts-preview — same chip, top-left
   over the logo tile, exactly as on /places/ */
.akfs-card > .akfs-cardlink { position: relative; }
.akfs-cardlink > .ak-boost-chip { top: 10px; left: 10px; }

/* ════════════════════════════════════════════════════════════════════════
   G · Responsive
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
	body.page-id-2223 .e-con-inner:has(.ts-checkout) {
		padding-top: 26px !important;
		padding-bottom: 40px !important;
	}
	body .ts-checkout {
		padding: 22px 18px 20px;
		border-radius: 18px;
		grid-gap: 20px;
	}
	body .ts-checkout h1,
	body .ts-checkout .ts-cart-head h1,
	body .ts-checkout .cart-head h1 { font-size: 24px; }
	body .ts-checkout .ts-cart-list > li { padding: 11px 12px; gap: 11px; }
	body .ts-checkout .cart-image,
	body .ts-checkout .cart-image img { width: 48px; height: 48px; }
	body .ts-checkout .cart-item-details > a { font-size: 14.5px; }
	body .ts-checkout .ts-btn.ts-btn-2 { min-height: 54px; font-size: 15.5px; }
	.ak-vx-trust { margin: 14px 14px 0; padding: 13px 15px; }

	body .ts-checkout-promotion .addon-cards li { padding: 16px 16px 18px; gap: 13px; }
	body .ts-checkout-promotion .addon-details { padding-right: 0; }
	body .ts-checkout-promotion .vx-addon-price {
		position: static; margin-top: 6px; font-size: 22px;
	}
	body .ts-checkout-promotion .addon-cards li:nth-child(2):last-child .vx-addon-price { top: auto; }

	body .vx-orders-widget .vx-order-card {
		flex-wrap: wrap;
		padding: 14px 15px;
		gap: 10px;
	}
	body .vx-orders-widget .vx-order-title { flex: 1 1 100%; }
	body .vx-orders-widget .order-status { margin-left: auto; }
	body .vx-orders-widget .vx-order-filters { flex-wrap: wrap; }
	body .vx-orders-widget .order-keyword-search { flex: 1 1 100%; }

	body .single-order .vx-order-head { gap: 8px; }
	body .single-order .vx-order-head .ts-btn { min-height: 42px; font-size: 13.5px; padding: 0 14px; }
	body .single-order .order-event-box { padding: 16px; border-radius: 16px; }
	body .single-order .order-event-box .ts-cart-list > li { flex-direction: column; }
	body .single-order .order-item-title { flex-direction: column; gap: 2px; align-items: flex-start; }
	body .single-order .order-timeline { padding: 22px 0 4px; }

	body .ts-vendor-settings .ac-body { padding: 18px; }
	.ak-vx-payout div { flex: 1 1 100%; }
}

