/*!
 * Prizino Treasury (Classic) — Single Product CSS · v0.1.0
 *
 * Scoped under `.prtreasc-b2*` so AutomaticCSS variables and Oxygen theme
 * styles flow through. Add overrides in your theme, not here.
 *
 * Locked B2 layout — May 07 client decision.
 */

.prtreasc-b2 {
	--prtreasc-bg: #0a0a0a;
	--prtreasc-card: #131313;
	--prtreasc-card-2: #1a1a1a;
	--prtreasc-border: #262626;
	--prtreasc-border-2: #333;
	--prtreasc-gold: #f5c518;
	--prtreasc-gold-2: #d4a90f;
	--prtreasc-gold-soft: rgba(245, 197, 24, 0.12);
	--prtreasc-green: #3ddc84;
	--prtreasc-purple: #b57bee;
	--prtreasc-blue: #4da6ff;
	--prtreasc-red: #ff5f5f;
	--prtreasc-text: #f0f0f0;
	--prtreasc-muted: #9ca3af;

	background: var(--prtreasc-card);
	border: 1px solid var(--prtreasc-border);
	border-radius: 16px;
	padding: 18px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-family: inherit;
	color: var(--prtreasc-text);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.03) inset;
	box-sizing: border-box;
}

.prtreasc-b2 * { box-sizing: border-box; }

/* ───── 1 · BAG+ (hero) ───── */
.prtreasc-b2-bag {
	background: linear-gradient(180deg, var(--prtreasc-gold) 0%, var(--prtreasc-gold-2) 100%);
	color: #111;
	border: 0;
	padding: 18px 22px;
	border-radius: 12px;
	font-weight: 800;
	font-size: 18px;
	letter-spacing: 0.02em;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	text-transform: uppercase;
	box-shadow: 0 4px 0 var(--prtreasc-gold-2), 0 12px 28px rgba(245, 197, 24, 0.35);
	transition: transform 0.1s, box-shadow 0.15s;
	width: 100%;
}
.prtreasc-b2-bag:hover { box-shadow: 0 6px 0 var(--prtreasc-gold-2), 0 16px 36px rgba(245, 197, 24, 0.5); }
.prtreasc-b2-bag:active { transform: translateY(3px); box-shadow: 0 1px 0 #a87a1c; }
.prtreasc-b2-bag[disabled] { opacity: 0.6; cursor: wait; }

/* ───── 2 · Split row ───── */
.prtreasc-b2-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px;
}
.prtreasc-b2-flag {
	background: var(--prtreasc-card-2);
	border: 1px solid var(--prtreasc-border);
	border-radius: 10px;
	padding: 9px 8px;
	font-size: 11px;
	font-weight: 700;
	text-align: center;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.prtreasc-b2-flag--free { color: var(--prtreasc-green); }
.prtreasc-b2-flag--pr { color: var(--prtreasc-purple); }

/* ───── 3 · Price ───── */
.prtreasc-b2-price {
	text-align: center;
	padding: 4px 0 2px;
}
.prtreasc-b2-dz {
	font-size: 28px;
	font-weight: 700;
	color: var(--prtreasc-gold);
	line-height: 1;
}
.prtreasc-b2-dz-unit { color: var(--prtreasc-gold); font-size: 16px; font-weight: 700; margin-left: 2px; }
.prtreasc-b2-eur,
.prtreasc-b2-rrp { font-size: 13px; color: var(--prtreasc-muted); margin-left: 6px; }

/* ───── 4 · Items left ───── */
.prtreasc-b2-stock {
	text-align: center;
	font-size: 12px;
	color: var(--prtreasc-muted);
	padding: 2px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.prtreasc-b2-stock strong { color: #fff; font-weight: 700; }
.prtreasc-b2-stock-bar {
	width: 60px;
	height: 4px;
	background: var(--prtreasc-border-2);
	border-radius: 999px;
	overflow: hidden;
	display: inline-block;
}
.prtreasc-b2-stock-bar-fill {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--prtreasc-red), var(--prtreasc-gold));
}

/* ───── 5 · Play to Win ───── */
.prtreasc-b2-play {
	background: rgba(77, 166, 255, 0.13);
	color: var(--prtreasc-blue);
	border: 1px solid rgba(77, 166, 255, 0.4);
	padding: 11px;
	border-radius: 10px;
	font-weight: 700;
	font-size: 13px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: all 0.15s;
}
.prtreasc-b2-play:hover { background: rgba(77, 166, 255, 0.22); border-color: var(--prtreasc-blue); }
.prtreasc-b2-play[disabled] { opacity: 0.6; cursor: wait; }

/* ───── 6 · Star Pick ───── */
.prtreasc-b2-star {
	background: transparent;
	color: var(--prtreasc-text);
	border: 1px solid var(--prtreasc-border-2);
	padding: 11px;
	border-radius: 10px;
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: all 0.15s;
}
.prtreasc-b2-star:hover { background: var(--prtreasc-gold-soft); border-color: var(--prtreasc-gold); color: var(--prtreasc-gold); }
.prtreasc-b2-star.is-picked {
	background: var(--prtreasc-gold-soft);
	border-color: var(--prtreasc-gold);
	color: var(--prtreasc-gold);
}
.prtreasc-b2-star[disabled] { opacity: 0.6; cursor: wait; }

/* ───── 7 · Countdown (smallest, bottom) ───── */
.prtreasc-b2-timer {
	text-align: center;
	font-size: 10.5px;
	letter-spacing: 0.15em;
	color: var(--prtreasc-muted);
	text-transform: uppercase;
	padding-top: 6px;
	border-top: 1px dashed var(--prtreasc-border-2);
	margin-top: 2px;
	font-weight: 600;
}
.prtreasc-b2-timer-clock {
	color: var(--prtreasc-gold);
	font-family: ui-monospace, "JetBrains Mono", Menlo, monospace;
	margin-left: 6px;
	letter-spacing: 0.06em;
}

/* ───── Collapsed (in-cart / display-no-add) ───── */
.prtreasc-b2--collapsed {
	display: block;
	text-align: center;
	padding: 16px;
}
.prtreasc-b2-collapsed-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	background: linear-gradient(180deg, var(--prtreasc-gold) 0%, var(--prtreasc-gold-2) 100%);
	color: #111;
	border: 0;
	padding: 16px;
	border-radius: 12px;
	font-weight: 800;
	font-size: 16px;
	text-decoration: none;
	box-shadow: 0 4px 0 var(--prtreasc-gold-2);
	transition: transform 0.1s;
}
.prtreasc-b2-collapsed-btn:hover { color: #111; text-decoration: none; }
.prtreasc-b2-collapsed-btn:active { transform: translateY(3px); box-shadow: 0 1px 0 #a87a1c; }
.prtreasc-b2-collapsed-hint {
	font-size: 11.5px;
	color: var(--prtreasc-muted);
	margin: 10px 0 0;
}

/* ───── Mobile ───── */
@media (max-width: 480px) {
	.prtreasc-b2 { padding: 14px; gap: 10px; }
	.prtreasc-b2-bag { font-size: 16px; padding: 16px; }
	.prtreasc-b2-dz { font-size: 24px; }
}
