/* Quick Takes — one-click poll card, sits above the first post's body
   (see postbit template: {$post['quicktake_card']} before .post-content__body).
   Uses --surface/--border/--ink/--muted, all already redefined for dark
   mode elsewhere in theme.css.
   --maroon is a different story, and NOT actually override-free the way
   .thread-prefix's badge is — that one uses maroon as a solid background
   fill (ivory text on it stays readable in any theme); the three spots
   below use it as a foreground color/border against this card's own
   theme-flipping surface, where it goes near-invisible in dark mode.
   Found live, same mistake from-archives.css made and recent-activity's
   own dark section already documents the fix for (gold instead). */

.quicktake-card {
	/* .post-content__body (the message below this card) already carries its
	   own 10px top padding -- this margin is the only gap above/below the
	   card itself, not stacked on top of a second spacing source. */
	margin: 12px 0 6px;
	padding: 18px 16px 14px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface-alt);
}

.quicktake-kicker {
	margin: 0 0 4px;
	color: var(--maroon);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .5px;
	text-transform: uppercase;
}

.quicktake-question {
	margin: 0 0 10px;
	color: var(--ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
}

.quicktake-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.quicktake-btn {
	padding: 7px 16px;
	color: var(--ink);
	background: var(--surface);
	border: 1px solid var(--border-strong);
	border-radius: 5px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background .1s ease, border-color .1s ease;
}

.quicktake-btn:hover { background: var(--surface-hover); border-color: var(--maroon); }
.quicktake-btn:disabled { cursor: default; opacity: .6; }

/* Results view replaces the button row after a vote (own or already cast) —
   each option becomes a full-width bar rather than a button. */
.quicktake-options--voted { flex-direction: column; }

.quicktake-result {
	position: relative;
	display: flex;
	align-items: center;
	overflow: hidden;
	height: 30px;
	padding: 0 10px;
	border: 1px solid var(--border);
	border-radius: 5px;
	background: var(--surface);
	font-size: 13px;
	font-weight: 600;
	color: var(--ink);
}

.quicktake-result--mine { border-color: var(--maroon); }

.quicktake-result__bar {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--gold);
	opacity: .35;
	transition: width .3s ease;
}

.quicktake-result--mine .quicktake-result__bar { opacity: .55; }

.quicktake-result__label { position: relative; z-index: 1; }
.quicktake-result__pct { position: relative; z-index: 1; margin-left: auto; padding-left: 10px; }

.quicktake-result.just-voted { animation: quicktake-pop .2s ease; }

@keyframes quicktake-pop {
	0% { transform: scale(.98); }
	100% { transform: scale(1); }
}

.quicktake-total {
	margin: 8px 0 0;
	color: var(--muted);
	font-size: 12px;
}

/* Newthread form — the optional "Add a Quick Take" field group
   ({$windies_quicktake_box}, right after {$pollbox}). */
.windies-qt-toggle { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.windies-qt-fields { margin-top: 8px; }
.windies-qt-fields p { margin: 0 0 8px; }
#windies_qt_type { padding: 6px; border: 1px solid var(--border-strong); border-radius: 4px; }

/* ---------- Dark mode ---------- */
[data-theme="dark"] .quicktake-kicker { color: var(--gold); }
[data-theme="dark"] .quicktake-btn:hover { border-color: var(--gold); }
[data-theme="dark"] .quicktake-result--mine { border-color: var(--gold); }