/* ==========================================================================
   Polls — Spyral theme
   ========================================================================== */

#polls-spyral {
	--sp-bg-0: #07090c;
	--sp-bg-1: #0b1015;
	--sp-bg-2: #11161c;
	--sp-border: #1c222a;
	--sp-border-strong: #2a313b;
	--sp-text: #d0c8b8;
	--sp-text-muted: #7a8089;
	--sp-gold: #d0a53d;
	--sp-gold-soft: #efc149;
	--sp-blue: #64c8ff;
	--sp-green: #7ddf7d;
	--sp-radius: 8px;
	--sp-radius-sm: 5px;
	--sp-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35);

	color: var(--sp-text);
	font-family: calibrib, Calibri, 'Segoe UI', sans-serif;
	text-shadow: 0 1px 1px #000;
	box-sizing: border-box;
}

#polls-spyral *,
#polls-spyral *::before,
#polls-spyral *::after {
	box-sizing: border-box;
}

.spyral-polls-header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	padding: 14px 18px;
	margin-bottom: 14px;
	background: linear-gradient(180deg, var(--sp-bg-2) 0%, var(--sp-bg-1) 100%);
	border: 1px solid var(--sp-border);
	border-radius: var(--sp-radius);
	box-shadow: var(--sp-shadow-sm);
}

.spyral-polls-title {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 auto;
	min-width: 0;
}

.spyral-polls-title > i {
	color: var(--sp-gold);
	font-size: 22px;
	filter: drop-shadow(0 0 8px rgba(208, 165, 61, 0.35));
}

.spyral-polls-title h2 {
	margin: 0;
	font-family: corbelb, Corbel, 'Segoe UI', sans-serif;
	font-size: 18px;
	color: var(--sp-gold-soft) !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1.2;
}

.spyral-polls-count {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 12px;
	background: rgba(0, 0, 0, 0.35);
	border: 1px solid var(--sp-border);
	border-radius: 30px;
	font-size: 12px;
	color: var(--sp-text-muted) !important;
}

.spyral-polls-count b {
	color: var(--sp-gold-soft) !important;
	font-size: 14px;
}

.spyral-poll-card {
	background: var(--sp-bg-1);
	border: 1px solid var(--sp-border);
	border-radius: var(--sp-radius);
	overflow: hidden;
	box-shadow: var(--sp-shadow-sm);
	margin-bottom: 14px;
}

.spyral-poll-card-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 16px;
	background: linear-gradient(90deg, rgba(208, 165, 61, 0.12) 0%, rgba(208, 165, 61, 0.02) 100%);
	border-bottom: 1px solid rgba(208, 165, 61, 0.18);
}

.spyral-poll-question {
	margin: 0;
	font-family: corbelb, Corbel, 'Segoe UI', sans-serif;
	font-size: 15px;
	color: var(--sp-gold-soft) !important;
	line-height: 1.35;
}

.spyral-poll-meta {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	flex-shrink: 0;
	font-size: 11px;
	color: var(--sp-text-muted) !important;
	white-space: nowrap;
}

.spyral-poll-meta .badge-type {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 20px;
	background: rgba(100, 200, 255, 0.1);
	border: 1px solid rgba(100, 200, 255, 0.25);
	color: var(--sp-blue) !important;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.spyral-poll-card-body {
	padding: 14px 16px 16px;
}

.spyral-poll-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.spyral-poll-option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	background: rgba(0, 0, 0, 0.28);
	border: 1px solid var(--sp-border);
	border-radius: var(--sp-radius-sm);
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.spyral-poll-option:hover {
	border-color: rgba(208, 165, 61, 0.35);
	background: rgba(208, 165, 61, 0.04);
}

.spyral-poll-option input {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	accent-color: var(--sp-gold);
	cursor: pointer;
}

.spyral-poll-option span {
	color: var(--sp-text) !important;
	font-size: 13px;
	line-height: 1.35;
}

.spyral-poll-submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding: 8px 22px;
	font-family: calibrib, Calibri, 'Segoe UI', sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #0d1317 !important;
	background: linear-gradient(180deg, #e2c25e 0%, #d0a53d 50%, #b8882e 100%);
	border: 1px solid rgba(208, 165, 61, 0.6);
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.25s ease;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.15);
}

.spyral-poll-submit:hover {
	background: linear-gradient(180deg, #f0d46e 0%, #ddb344 50%, #c49832 100%);
	box-shadow: 0 0 12px rgba(208, 165, 61, 0.4);
}

.spyral-poll-results {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.spyral-poll-result-row {
	padding: 2px 0;
}

.spyral-poll-result-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 5px;
	font-size: 13px;
}

.spyral-poll-result-label .answer {
	color: var(--sp-text) !important;
	flex: 1;
	min-width: 0;
}

.spyral-poll-result-label .answer.is-mine {
	color: var(--sp-gold-soft) !important;
	font-weight: bold;
}

.spyral-poll-result-label .stats {
	color: var(--sp-text-muted) !important;
	font-size: 12px;
	white-space: nowrap;
}

.spyral-poll-bar {
	height: 10px;
	border: 1px solid #080e14;
	background-color: #000;
	border-radius: 4px;
	overflow: hidden;
}

.spyral-poll-bar-fill {
	height: 100%;
	border-radius: 3px;
	background: linear-gradient(90deg, #7a5524 0%, #d0a53d 55%, #efc149 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
	transition: width 0.35s ease;
}

.spyral-poll-notice {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-radius: var(--sp-radius-sm);
	font-size: 12px;
	line-height: 1.45;
}

.spyral-poll-notice.info {
	background: rgba(100, 200, 255, 0.08);
	border: 1px solid rgba(100, 200, 255, 0.22);
	color: var(--sp-blue) !important;
}

.spyral-poll-notice.success {
	background: rgba(125, 223, 125, 0.08);
	border: 1px solid rgba(125, 223, 125, 0.22);
	color: var(--sp-green) !important;
}

.spyral-poll-notice.warning {
	background: rgba(208, 165, 61, 0.08);
	border: 1px solid rgba(208, 165, 61, 0.25);
	color: var(--sp-gold-soft) !important;
}

.spyral-poll-notice a {
	color: var(--sp-gold-soft) !important;
	border-bottom: 1px dotted rgba(208, 165, 61, 0.4);
	text-decoration: none;
}

.spyral-poll-notice a:hover {
	color: #f0d46e !important;
}

.spyral-poll-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px solid var(--sp-border);
	font-size: 11px;
	color: var(--sp-text-muted) !important;
}

.spyral-poll-footer a {
	color: var(--sp-gold) !important;
	border-bottom: none !important;
	text-decoration: none;
}

.spyral-poll-footer a:hover {
	color: var(--sp-gold-soft) !important;
}

.spyral-polls-empty {
	text-align: center;
	padding: 28px 16px;
	color: var(--sp-text-muted) !important;
	font-style: italic;
	background: rgba(0, 0, 0, 0.22);
	border: 1px dashed var(--sp-border);
	border-radius: var(--sp-radius);
}

.spyral-polls-back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	font-size: 12px;
	color: var(--sp-gold) !important;
	text-decoration: none !important;
	border-bottom: none !important;
}

.spyral-polls-back:hover {
	color: var(--sp-gold-soft) !important;
}

@media (max-width: 768px) {
	.spyral-poll-card-head {
		flex-direction: column;
		align-items: flex-start;
	}

	.spyral-poll-meta {
		align-items: flex-start;
		flex-direction: row;
		flex-wrap: wrap;
	}
}
