/* Competition Orders v1.4 — modern minimal card list + order view.
 *
 * Self-contained surfaces: every component paints its own background, so the
 * design stays readable on ANY .woocommerce-MyAccount-content-wrapper colour
 * (white, grey, dark, image). Nothing relies on the page being white.
 *
 * Retheme per site by overriding the tokens below. Win highlights are GOLD.
 * Every layout-critical rule carries !important so theme CSS cannot break it.
 */




.woocommerce-checkout .competition-order-view {
	margin: 0 auto;
}

.ttyo-items  {
	display: none !important;
}

.ttyo-upsells {
	margin-top: 0px !important;
}

.minigame_buttons_to_open {
	justify-content: center;
}

.woocommerce-checkout p.order-again {
	display: none !important;
}
.competition-orders{
	/* Brand — inherits the Elementor global primary colour per site,
	   falling back to green where no Elementor kit / global exists. */
	--co-accent:var(--e-global-color-primary, #16a34a);
	/* Surfaces (the design's own backgrounds — independent of page bg) */
	--co-surface:#ffffff;           /* cards, buttons */
	--co-surface-2:#f4f4f5;         /* chips, hovers, thumbs */
	--co-border:#e9e9e7;
	/* Text on our surfaces */
	--co-text:#111827;
	--co-muted:#6b7280;
	--co-faint:#9ca3af;
	/* Gold (instant wins) — family derived from brand gold #ffbf00.
	   Icons are pure #ffbf00; text is the same hue deepened for contrast. */
	--co-gold:#ffbf00;
	--co-gold-text:#8a6800;     /* 4.5:1 on the banner tint; icons stay #ffbf00 */
	--co-gold-bg:#fff8e1;
	--co-gold-border:#ffe7a3;
	--co-gold-chip:#ffeec0;
	/* Status */
	--co-ok-bg:#e8f6ee;   --co-ok-text:#15803d;
	--co-mid-bg:#f4f4f5;  --co-mid-text:#52525b;
	--co-bad-bg:#fdecec;  --co-bad-text:#b91c1c;
	/* Shape + type */
	--co-r:16px;
	--co-r-sm:10px;
	--co-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

	color:var(--co-text);
	font-size:14px !important;
	line-height:1.5 !important;
	background:transparent !important;   /* never paint the wrapper */
	box-shadow:none !important;
}
.competition-orders *,
.competition-orders *::before,
.competition-orders *::after{box-sizing:border-box !important}
.competition-orders p{margin:0 !important;padding:0 !important}

.competition-orders-list{display:flex !important;flex-direction:column !important;gap:16px !important}

/* Card ------------------------------------------------------------------ */
.competition-order-card{
	display:block !important;
	background:var(--co-surface) !important;
	border:1px solid var(--co-border) !important;
	border-radius:var(--co-r) !important;
	overflow:hidden !important;
	margin:0 !important;
	box-shadow:none !important;
}

/* Header strip ----------------------------------------------------------- */
.competition-order-card__head{
	display:flex !important;flex-direction:row !important;align-items:center !important;
	gap:8px !important;padding:14px 20px !important;margin:0 !important;
	border:0 !important;border-bottom:1px solid var(--co-border) !important;
	background:transparent !important;
	font-family:var(--co-mono) !important;font-size:13px !important;
	color:var(--co-faint) !important;
}
.competition-order-number{color:var(--co-text) !important;font-weight:600 !important;font-size:13px !important}
.competition-order-date{color:var(--co-faint) !important}
.competition-order-total{
	margin-left:auto !important;
	font-family:inherit !important;font-size:13px !important;font-weight:600 !important;
	color:var(--co-text) !important;
}

/* Instant-win banner (GOLD) ----------------------------------------------- */
.competition-instant-win{
	display:flex !important;flex-direction:row !important;align-items:center !important;
	gap:12px !important;margin:16px 20px 0 !important;padding:12px 14px !important;
	border:1px solid var(--co-gold-border) !important;
	border-radius:var(--co-r-sm) !important;
	background:var(--co-gold-bg) !important;color:var(--co-gold-text) !important;
	box-shadow:none !important;
}
.competition-instant-win__icon{
	display:block !important;width:24px !important;height:24px !important;flex:none !important;
	background:no-repeat center/contain !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffbf00'%3E%3Cpath d='M18 3H6v2H3v2a4 4 0 0 0 4 4 5 5 0 0 0 4 3v2H8v2h8v-2h-3v-2a5 5 0 0 0 4-3 4 4 0 0 0 4-4V5h-3zM5 7V5h1v4a2 2 0 0 1-1-2zm14 0a2 2 0 0 1-1 2V5h1z'/%3E%3C/svg%3E") !important;
}
.competition-instant-win__body{display:flex !important;flex-direction:column !important;line-height:1.35 !important}
.competition-instant-win__title{
	display:block !important;font-size:14px !important;font-weight:600 !important;
	color:var(--co-gold-text) !important;margin:0 !important;
}
.competition-instant-win__prizes{
	display:block !important;font-size:13px !important;font-weight:400 !important;
	color:var(--co-gold-text) !important;opacity:.85 !important;margin:0 !important;
}

/* Competition row --------------------------------------------------------- */
.competition-entry{display:block !important;padding:16px 20px !important;margin:0 !important;border:0 !important;background:transparent !important}
.competition-entry + .competition-entry{border-top:1px solid var(--co-border) !important}

.competition-entry__head{
	display:flex !important;flex-direction:row !important;align-items:center !important;
	gap:12px !important;margin:0 0 12px !important;
}
.competition-entry-thumb{
	display:flex !important;align-items:center !important;justify-content:center !important;
	width:44px !important;height:44px !important;flex:none !important;
	border-radius:var(--co-r-sm) !important;overflow:hidden !important;
	background:var(--co-surface-2) !important;margin:0 !important;
}
.competition-entry-thumb img{
	display:block !important;width:100% !important;height:100% !important;
	max-width:none !important;object-fit:cover !important;margin:0 !important;border:0 !important;
	box-shadow:none !important;
}
.competition-entry-thumb__ph{
	display:block !important;width:20px !important;height:20px !important;
	background:no-repeat center/contain !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%239ca3af'%3E%3Cpath d='M4 6h16a2 2 0 0 1 2 2v2a2 2 0 0 0 0 4v2a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-2a2 2 0 0 0 0-4V8a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") !important;
}
.competition-entry__meta{display:flex !important;flex-direction:column !important;min-width:0 !important;flex:1 !important}
.competition-entry__name{
	display:block !important;font-size:15px !important;font-weight:600 !important;
	line-height:1.25 !important;color:var(--co-text) !important;margin:0 !important;
	overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;
}
.competition-entry__sub{
	display:block !important;font-size:12px !important;font-weight:400 !important;
	color:var(--co-faint) !important;margin:2px 0 0 !important;
}
.competition-entry__price{
	display:block !important;flex:none !important;
	font-size:14px !important;font-weight:600 !important;color:var(--co-text) !important;
	margin:0 !important;white-space:nowrap !important;
}
.competition-entry__price .woocommerce-Price-amount{color:inherit !important;font-weight:inherit !important}

/* Ticket grid ------------------------------------------------------------- */
.competition-tickets{display:flex !important;flex-wrap:wrap !important;gap:6px !important;margin:0 !important; max-height: 300px; overflow: auto;}
.competition-ticket{
	display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:4px !important;
	font-family:var(--co-mono) !important;font-size:12px !important;font-weight:500 !important;
	min-width:32px !important;padding:5px 9px !important;margin:0 !important;
	border:0 !important;border-radius:8px !important;
	background:var(--co-surface-2) !important;color:var(--co-muted) !important;
	line-height:1 !important;box-shadow:none !important;
}
.competition-ticket.is-win{background:var(--co-gold-chip) !important;color:var(--co-gold-text) !important;font-weight:600 !important}
.competition-ticket__star{
	display:block !important;width:11px !important;height:11px !important;flex:none !important;
	background:no-repeat center/contain !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffbf00'%3E%3Cpath d='M12 2l2.9 6.3 6.9.8-5.1 4.7 1.4 6.8L12 17.8 5.9 20.6l1.4-6.8L2.2 9.1l6.9-.8z'/%3E%3C/svg%3E") !important;
}

/* Footer / buttons -------------------------------------------------------- */
.competition-order-card__foot{
	display:flex !important;flex-direction:row !important;align-items:center !important;
	justify-content:flex-end !important;gap:8px !important;
	padding:14px 20px !important;margin:0 !important;
	border:0 !important;border-top:1px solid var(--co-border) !important;
	background:transparent !important;
}
/* Buttons paint their own surface so they're readable on dark wrappers too. */
.competition-orders .competition-btn,
.competition-orders a.competition-btn,
.competition-orders a.competition-btn:visited{
	display:inline-flex !important;align-items:center !important;justify-content:center !important;
	font-family:inherit !important;font-size:13px !important;font-weight:500 !important;
	line-height:1 !important;text-decoration:none !important;text-transform:none !important;
	letter-spacing:0 !important;
	padding:10px 18px !important;margin:0 !important;
	border:1px solid var(--co-border) !important;border-radius:999px !important;
	background:var(--co-surface) !important;color:var(--co-text) !important;
	box-shadow:none !important;cursor:pointer !important;
	transition:background .12s ease,filter .12s ease !important;
}
.competition-orders .competition-btn:hover{background:var(--co-surface-2) !important;color:var(--co-text) !important}
.competition-orders .competition-btn--primary,
.competition-orders a.competition-btn--primary,
.competition-orders a.competition-btn--primary:visited{
	background:var(--co-accent) !important;border-color:var(--co-accent) !important;color:#ffffff !important;
}
.competition-orders .competition-btn--primary:hover{
	background:var(--co-accent) !important;color:#ffffff !important;filter:brightness(.93) !important;
}

/* Pagination + empty ------------------------------------------------------ */
.competition-orders-pagination{display:flex !important;gap:8px !important;margin:16px 0 0 !important}
.competition-orders-empty{display:flex !important;align-items:center !important;gap:12px !important}

/* ========================================================================= *
 * View order page
 * ========================================================================= */
.competition-order-view{display:flex !important;flex-direction:column !important;gap:14px !important;max-width:680px !important}

.competition-order-header{
	display:flex !important;flex-direction:row !important;align-items:center !important;
	justify-content:space-between !important;gap:10px !important;flex-wrap:wrap !important;
	padding:18px 20px !important;margin:0 !important;border:0 !important;background:transparent !important;
}
.competition-order-header__title{
	display:block !important;font-size:17px !important;font-weight:600 !important;
	color:var(--co-text) !important;margin:0 !important;line-height:1.25 !important;
}
.competition-order-header__sub{
	display:block !important;font-family:var(--co-mono) !important;font-size:13px !important;
	color:var(--co-faint) !important;margin:3px 0 0 !important;
}

.competition-order-status{
	display:inline-flex !important;align-items:center !important;
	font-size:12px !important;font-weight:600 !important;line-height:1 !important;
	padding:6px 13px !important;border-radius:999px !important;border:0 !important;
	box-shadow:none !important;
}
.competition-order-status--ok{background:var(--co-ok-bg) !important;color:var(--co-ok-text) !important}
.competition-order-status--mid{background:var(--co-mid-bg) !important;color:var(--co-mid-text) !important}
.competition-order-status--bad{background:var(--co-bad-bg) !important;color:var(--co-bad-text) !important}

.competition-order-view .competition-instant-win{margin:0 20px 16px !important}
.competition-order-view .competition-entry{border-top:1px solid var(--co-border) !important}

/* Totals */
.competition-order-totals{
	display:flex !important;flex-direction:column !important;gap:8px !important;
	padding:16px 20px !important;margin:0 !important;
	border:0 !important;border-top:1px solid var(--co-border) !important;background:transparent !important;
}
.competition-total-row{
	display:flex !important;flex-direction:row !important;justify-content:space-between !important;
	gap:12px !important;margin:0 !important;
	font-size:13px !important;color:var(--co-muted) !important;
}
.competition-total-row span{font-size:13px !important;color:inherit !important}
.competition-total-row .woocommerce-Price-amount{color:inherit !important}
.competition-total-row--grand{
	padding-top:10px !important;border-top:1px solid var(--co-border) !important;
	font-size:15px !important;font-weight:600 !important;color:var(--co-text) !important;
}
.competition-total-row--grand span{font-size:15px !important;font-weight:600 !important}

/* Notes */
.competition-order-notes{padding:16px 20px !important}
.competition-note{
	display:block !important;font-size:13px !important;color:var(--co-muted) !important;
	margin:6px 0 0 !important;line-height:1.55 !important;
}
.competition-note__date{
	font-family:var(--co-mono) !important;font-size:12px !important;
	color:var(--co-faint) !important;margin-right:8px !important;
}

/* Address */
.competition-order-address{
	display:flex !important;flex-direction:row !important;align-items:flex-start !important;
	gap:13px !important;padding:16px 20px !important;
	box-shadow:none !important;
}
.competition-order-address__icon{
	display:block !important;width:19px !important;height:19px !important;flex:none !important;margin-top:2px !important;
	background:no-repeat center/contain !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%239ca3af'%3E%3Cpath d='M12 2a8 8 0 0 0-8 8c0 5.4 7 11.5 7.3 11.8a1 1 0 0 0 1.4 0C13 21.5 20 15.4 20 10a8 8 0 0 0-8-8zm0 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E") !important;
}
.competition-order-address__label{
	display:block !important;font-size:12px !important;font-weight:600 !important;
	color:var(--co-faint) !important;margin:0 0 5px !important;
	text-transform:uppercase !important;letter-spacing:.04em !important;
}
.competition-order-address__body{
	display:block !important;font-style:normal !important;font-size:13px !important;
	color:var(--co-muted) !important;line-height:1.65 !important;margin:0 !important;
	border:0 !important;padding:0 !important;
	background:transparent !important;box-shadow:none !important;
}

/* Footer actions */
.competition-order-actions{display:flex !important;flex-direction:row !important;justify-content:flex-end !important;gap:8px !important;margin:0 !important}

@media (max-width:520px){
	.competition-order-card__head,.competition-entry,.competition-instant-win{padding-left:16px !important;padding-right:16px !important}
	.competition-instant-win{margin-left:16px !important;margin-right:16px !important}
	.competition-order-card__foot{padding:12px 16px !important}
	.competition-order-card__foot .competition-btn{flex:1 !important}
	.competition-order-actions{flex-direction:column-reverse !important}
	.competition-order-actions .competition-btn{width:100% !important;justify-content:center !important}
}

/* ========================================================================= *
 * Dark wrapper adaptation (v1.5)
 * `co-dark` is toggled by detect.js when the effective background behind the
 * My Account content wrapper has low luminance. Only surface/text tokens swap;
 * gold and the accent are shared across both modes.
 * ========================================================================= */
.competition-orders.co-dark{
	--co-surface:#1c1c1e;
	--co-surface-2:#2a2a2d;
	--co-border:#3a3a3e;
	--co-text:#f4f4f5;
	--co-muted:#b6b6bc;
	--co-faint:#84848c;

	--co-gold:#ffbf00;
	--co-gold-text:#ffbf00;
	--co-gold-bg:#332a0a;
	--co-gold-border:#5b4a10;
	--co-gold-chip:#463a0d;

	--co-ok-bg:#143a25;  --co-ok-text:#5fd394;
	--co-mid-bg:#2a2a2d; --co-mid-text:#b6b6bc;
	--co-bad-bg:#3d1a1a; --co-bad-text:#f08c8c;
}
.competition-orders.co-dark .competition-instant-win__icon{
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffbf00'%3E%3Cpath d='M18 3H6v2H3v2a4 4 0 0 0 4 4 5 5 0 0 0 4 3v2H8v2h8v-2h-3v-2a5 5 0 0 0 4-3 4 4 0 0 0 4-4V5h-3zM5 7V5h1v4a2 2 0 0 1-1-2zm14 0a2 2 0 0 1-1 2V5h1z'/%3E%3C/svg%3E") !important;
}
.competition-orders.co-dark .competition-ticket__star{
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffbf00'%3E%3Cpath d='M12 2l2.9 6.3 6.9.8-5.1 4.7 1.4 6.8L12 17.8 5.9 20.6l1.4-6.8L2.2 9.1l6.9-.8z'/%3E%3C/svg%3E") !important;
}

/* "+N more" overflow chip (orders list, v1.6) */
.competition-orders a.competition-ticket--more,
.competition-orders a.competition-ticket--more:visited{
	font-family:inherit !important;
	background:transparent !important;
	border:1px dashed var(--co-border) !important;
	color:var(--co-faint) !important;
	text-decoration:none !important;
	cursor:pointer !important;
}
.competition-orders a.competition-ticket--more:hover{
	background:var(--co-surface-2) !important;color:var(--co-muted) !important;
}

/* Hide WooCommerce's core "Order #X was placed on ... and is currently ..."
 * intro paragraph on the view-order endpoint (v1.6.1). It's hardcoded in the
 * core template above our hook, so it's removed visually here.
 */
.woocommerce-MyAccount-content-wrapper > p:has(> mark.order-number),
.woocommerce-MyAccount-content > p:has(> mark.order-number),
.woocommerce-view-order .woocommerce-MyAccount-content p:has(mark.order-status){
	display:none !important;
}

/* "+N more competitions" overflow row (orders list, v1.6.2) */
.competition-orders a.competition-entry--more,
.competition-orders a.competition-entry--more:visited{
	display:block !important;
	padding:12px 20px !important;
	border-top:1px dashed var(--co-border) !important;
	font-size:13px !important;font-weight:500 !important;
	color:var(--co-faint) !important;
	text-decoration:none !important;text-align:center !important;
	background:transparent !important;cursor:pointer !important;
}
.competition-orders a.competition-entry--more:hover{
	background:var(--co-surface-2) !important;color:var(--co-muted) !important;
}

/* "Processing…" chip — shown while ticket allocation hasn't been written yet
 * (approval_log_wc_lottery_log_pn absent). Gentle pulse, no layout shift. */
.competition-orders .competition-ticket--processing{
	font-family:inherit !important;
	background:var(--co-surface-2) !important;
	color:var(--co-faint) !important;
	animation:co-processing 1.6s ease-in-out infinite !important;
}
@keyframes co-processing{
	0%,100%{opacity:1}
	50%{opacity:.45}
}
@media (prefers-reduced-motion:reduce){
	.competition-orders .competition-ticket--processing{animation:none !important}
}

/* ========================================================================= *
 * Thank-you success hero (v1.8.0)
 * The hero root carries .competition-orders, so all --co-* tokens (and the
 * co-dark swap from detect.js) apply automatically. Only hero-specific
 * layout lives here; every colour comes from the shared token set.
 * ========================================================================= */

/* Hide the stock intro + overview list on the order-received page only. */
.woocommerce-order > .woocommerce-thankyou-order-received,
.woocommerce-order > .woocommerce-order-overview{
	display:none !important;
}

.co-ty-hero{
	display:block !important;
	background:var(--co-surface) !important;
	border:1px solid var(--co-border) !important;
	border-radius:var(--co-r) !important;
	padding:38px 26px 24px !important;
	margin:0 auto 28px !important;
	max-width:680px !important;
	text-align:center !important;
	box-shadow:none !important;
}
.co-ty-hero__icon{
	display:inline-flex !important;align-items:center !important;justify-content:center !important;
	width:56px !important;height:56px !important;
	border-radius:999px !important;
	background:var(--co-ok-bg) !important;color:var(--co-ok-text) !important;
	margin:0 0 12px !important;
}
.co-ty-hero__icon svg{display:block !important}
.co-ty-hero__title{
	font-size:clamp(19px, 3vw, 24px) !important;font-weight:600 !important;
	line-height:1.25 !important;color:var(--co-text) !important;
	margin:0 0 5px !important;
}
.co-ty-hero__sub{
	font-size:13px !important;color:var(--co-muted) !important;
	margin:0 0 22px !important;
}
.co-ty-hero__sub strong{color:var(--co-text) !important;font-weight:600 !important}
.co-ty-hero__grid{
	display:grid !important;
	grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)) !important;
	gap:10px !important;
	margin-top: 20px;
	text-align:left !important;
}
.co-ty-stat{
	display:flex !important;flex-direction:column !important;gap:2px !important;
	background:var(--co-surface-2) !important;
	border-radius:var(--co-r-sm) !important;
	padding:12px 14px !important;margin:0 !important;
}
.co-ty-stat__label{
	font-size:11px !important;font-weight:600 !important;
	letter-spacing:.04em !important;text-transform:uppercase !important;
	color:var(--co-faint) !important;
}
.co-ty-stat__value{
	font-size:15px !important;font-weight:600 !important;
	color:var(--co-text) !important;white-space:nowrap !important;
	overflow:hidden !important;text-overflow:ellipsis !important;
}
.co-ty-stat__value .woocommerce-Price-amount{color:inherit !important;font-weight:inherit !important}

@media (max-width:520px){
	.co-ty-hero{padding:30px 16px 18px !important}
	.co-ty-hero__grid{grid-template-columns:1fr 1fr !important}
}

/* Dark mode: the hero goes TRANSPARENT (v1.8.1) — instead of painting its own
 * dark surface (#1c1c1e) that can clash with the site's actual dark bg, the
 * hero blends into whatever dark colour sits behind it. Chips and the border
 * switch to translucent white overlays so they read on any dark shade. */
.competition-orders.co-dark.co-ty-hero{
	background:transparent !important;
	border-color:rgba(255,255,255,.12) !important;
}
.competition-orders.co-dark.co-ty-hero .co-ty-stat{
	background:rgba(255,255,255,.06) !important;
}

/* Dark mode: the whole plugin goes transparent (v1.8.3 — now EVERYWHERE,
 * My Account orders list + view-order included, not just checkout).
 * Retokening instead of per-element overrides — when co-dark is active the
 * surface/border/chip tokens become translucent overlays, so cards, entries,
 * tickets, totals, and buttons all blend into the site's own dark bg. This
 * block sits AFTER the base .co-dark token block, so it wins on order. Gold,
 * status pills, and the accent keep their dedicated dark tokens. */
.competition-orders.co-dark{
	--co-surface:transparent;
	--co-surface-2:rgba(255,255,255,.06);
	--co-border:rgba(255,255,255,.12);
}
/* Buttons need a hover you can see now that their resting bg is transparent. */
.competition-orders.co-dark .competition-btn:hover{
	background:rgba(255,255,255,.10) !important;
}

/* Dark mode: gold + status surfaces go translucent too (v1.8.5).
 * The instant-win banner, win chips, and status pills were painting their own
 * solid dark colours (#332a0a / #143a25 / #463a0d), which clash on sites
 * whose dark bg isn't that exact tone. Same treatment as the surfaces: tint
 * built from the family's own hue at low alpha, so it reads as a wash of the
 * real page colour. Text colours are untouched (already contrast-safe). */
.competition-orders.co-dark{
	--co-gold-bg:rgba(255,191,0,.10);
	--co-gold-border:rgba(255,191,0,.30);
	--co-gold-chip:rgba(255,191,0,.16);

	--co-ok-bg:rgba(95,211,148,.14);
	--co-mid-bg:rgba(255,255,255,.08);
	--co-bad-bg:rgba(240,140,140,.14);
}


.competition-ticket--processed {
	    background: var(--co-ok-bg) !important;
    color: var(--co-ok-text) !important;
}