/* =========================================================
   AnteEnti Telugu Q&A UI
   Component: Vote Controls
   File: assets/css/components/vote-controls.css

   Purpose:
   Standardize AnsPress vote controls across:
   - Single question card
   - Answer cards
   - Future reusable Q&A cards

   Safety:
   CSS-only. Does not change voting functionality.
========================================================= */

/* ---------------------------------------------------------
   Base vote wrapper reset
--------------------------------------------------------- */

.anteenti-qa-ui .ap-vote,
.anteenti-qa-ui .ap-vote.net-vote {
	position: static !important;
	inset: auto !important;
	float: none !important;
	clear: none !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0 !important;
	vertical-align: middle;
}

/* ---------------------------------------------------------
   Vote container when inside our question/answer cards
--------------------------------------------------------- */

.anteenti-single-question-card__vote,
.anteenti-answer-card__vote,
.anteenti-vote-controls {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: auto;
	max-width: 100%;
}

/* ---------------------------------------------------------
   AnsPress vote links/buttons
--------------------------------------------------------- */

.anteenti-qa-ui .ap-vote a,
.anteenti-qa-ui .ap-vote button,
.anteenti-qa-ui .ap-vote .apicon-thumb-up,
.anteenti-qa-ui .ap-vote .apicon-thumb-down,
.anteenti-qa-ui .ap-vote .ap-vote-up,
.anteenti-qa-ui .ap-vote .ap-vote-down {
	position: static !important;
	float: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 34px !important;
	height: 34px !important;
	min-width: 34px !important;
	min-height: 34px !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--anteenti-color-surface, #fffaf0) !important;
	border: 1px solid var(--anteenti-color-border, #ead9bd) !important;
	border-radius: 999px !important;
	color: var(--anteenti-color-primary, #8f1d23) !important;
	box-shadow: none !important;
	text-decoration: none !important;
	line-height: 1 !important;
	cursor: pointer;
	transition:
		background-color 0.18s ease,
		border-color 0.18s ease,
		transform 0.18s ease,
		box-shadow 0.18s ease;
}

.anteenti-qa-ui .ap-vote a:hover,
.anteenti-qa-ui .ap-vote button:hover,
.anteenti-qa-ui .ap-vote .ap-vote-up:hover,
.anteenti-qa-ui .ap-vote .ap-vote-down:hover {
	background: #fff4dc !important;
	border-color: rgba(143, 29, 35, 0.24) !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 14px rgba(31, 24, 18, 0.08) !important;
}

/* ---------------------------------------------------------
   Vote count
--------------------------------------------------------- */

.anteenti-qa-ui .ap-vote .net-vote-count,
.anteenti-qa-ui .ap-vote .ap-vote-count,
.anteenti-qa-ui .ap-vote-count,
.anteenti-qa-ui .net-vote-count {
	position: static !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	min-width: 34px !important;
	height: 34px !important;
	margin: 0 -2px !important;
	padding: 0 12px !important;
	background: rgba(255, 248, 230, 0.84) !important;
	border: 1px solid var(--anteenti-color-border, #ead9bd) !important;
	border-radius: 999px !important;
	color: var(--anteenti-color-text, #241815) !important;
	font-family: var(--anteenti-font-main, inherit);
	font-size: 0.9rem !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	text-align: center !important;
}

/* ---------------------------------------------------------
   Emoji/icon normalization
--------------------------------------------------------- */

.anteenti-qa-ui .ap-vote .ap-vote-up::before,
.anteenti-qa-ui .ap-vote .ap-vote-down::before {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.05rem;
	line-height: 1;
}

.anteenti-qa-ui .ap-vote .ap-vote-up,
.anteenti-qa-ui .ap-vote .ap-vote-down {
	font-size: 0 !important;
}

.anteenti-qa-ui .ap-vote .ap-vote-up::before {
	content: "👍";
}

.anteenti-qa-ui .ap-vote .ap-vote-down::before {
	content: "👎";
}

/* If AnsPress already outputs emoji/text, keep it centered */
.anteenti-qa-ui .ap-vote a span,
.anteenti-qa-ui .ap-vote button span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

/* ---------------------------------------------------------
   Question card vote row
--------------------------------------------------------- */

.anteenti-single-question-card__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

.anteenti-single-question-card__meta-line {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	min-width: 0;
}

.anteenti-single-question-card__vote {
	background: transparent;
	border: 0;
	padding: 0;
}

.anteenti-single-question-card__vote .ap-vote,
.anteenti-single-question-card__vote .ap-vote.net-vote {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Keep answer button aligned with vote row */
.anteenti-single-question-card__answer-btn {
	white-space: nowrap;
}

/* ---------------------------------------------------------
   Answer card vote row
--------------------------------------------------------- */

.anteenti-answer-card__footer,
.anteenti-answer-card__bottom,
.anteenti-answer-card__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

.anteenti-answer-card__vote {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* ---------------------------------------------------------
   AnsPress fallback selectors inside single answer templates
--------------------------------------------------------- */

.anteenti-qa-page-single-question .ap-a-list .ap-vote,
.anteenti-qa-page-single-question .answer .ap-vote,
.anteenti-qa-page-single-question .ap-answer .ap-vote {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* ---------------------------------------------------------
   Active / voted states
--------------------------------------------------------- */

.anteenti-qa-ui .ap-vote a.active,
.anteenti-qa-ui .ap-vote a.voted,
.anteenti-qa-ui .ap-vote .active,
.anteenti-qa-ui .ap-vote .voted {
	background: var(--anteenti-color-primary, #8f1d23) !important;
	border-color: var(--anteenti-color-primary, #8f1d23) !important;
	color: #ffffff !important;
}

/* ---------------------------------------------------------
   Mobile layout
--------------------------------------------------------- */

@media (max-width: 768px) {
	.anteenti-single-question-card__bottom {
		align-items: stretch;
		flex-direction: column;
		gap: 12px;
	}

	.anteenti-single-question-card__meta-line {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		gap: 8px;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 2px;
	}

	.anteenti-single-question-card__vote {
		flex: 0 0 auto;
	}

	.anteenti-single-question-card__answer-btn {
		width: 100%;
		text-align: center;
	}

	.anteenti-answer-card__footer,
	.anteenti-answer-card__bottom,
	.anteenti-answer-card__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.anteenti-answer-card__vote,
	.anteenti-answer-card__vote .ap-vote {
		justify-content: flex-start !important;
		width: 100%;
	}

	.anteenti-qa-ui .ap-vote a,
	.anteenti-qa-ui .ap-vote button,
	.anteenti-qa-ui .ap-vote .apicon-thumb-up,
	.anteenti-qa-ui .ap-vote .apicon-thumb-down,
	.anteenti-qa-ui .ap-vote .ap-vote-up,
	.anteenti-qa-ui .ap-vote .ap-vote-down,
	.anteenti-qa-ui .ap-vote .net-vote-count,
	.anteenti-qa-ui .ap-vote .ap-vote-count {
		height: 36px !important;
		min-height: 36px !important;
	}

	.anteenti-qa-ui .ap-vote a,
	.anteenti-qa-ui .ap-vote button,
	.anteenti-qa-ui .ap-vote .ap-vote-up,
	.anteenti-qa-ui .ap-vote .ap-vote-down {
		width: 36px !important;
		min-width: 36px !important;
	}
}

/* ---------------------------------------------------------
   Very small screens
--------------------------------------------------------- */

@media (max-width: 420px) {
	.anteenti-qa-ui .ap-vote .net-vote-count,
	.anteenti-qa-ui .ap-vote .ap-vote-count,
	.anteenti-qa-ui .ap-vote-count,
	.anteenti-qa-ui .net-vote-count {
		min-width: 32px !important;
		padding: 0 10px !important;
	}

	.anteenti-single-question-card__meta-line {
		gap: 6px;
	}
}