/**
 * Theme UI components. Opt-in classes only; bare plugin markup is never styled.
 */

/* ---------------------------------------------------------------------------
 * Buttons
 * ------------------------------------------------------------------------ */

.emt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 44px;
	padding: 0.7rem 1.4rem;
	font-family: var(--emt-font-ui);
	font-size: var(--emt-fs-sm);
	font-weight: var(--emt-fw-semibold);
	line-height: 1.2;
	letter-spacing: 0.01em;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	background-color: transparent;
	border: 1.5px solid transparent;
	border-radius: var(--emt-radius-pill);
	transition:
		color var(--emt-duration) var(--emt-ease),
		background-color var(--emt-duration) var(--emt-ease),
		border-color var(--emt-duration) var(--emt-ease),
		box-shadow var(--emt-duration) var(--emt-ease);
}

.emt-btn:focus-visible {
	outline: var(--emt-focus-ring);
	outline-offset: var(--emt-focus-offset);
}

/* Primary: maroon */
.emt-btn--primary {
	color: var(--emt-on-primary);
	background-color: var(--emt-primary);
	border-color: var(--emt-primary);
}

.emt-btn--primary:hover {
	color: var(--emt-on-primary);
	background-color: var(--emt-primary-hover);
	border-color: var(--emt-primary-hover);
	box-shadow: var(--emt-shadow-sm);
}

/* Secondary: premium gold outline on a warm tint, maroon text */
.emt-btn--secondary {
	color: var(--emt-primary);
	background-color: var(--emt-gold-tint);
	border-color: var(--emt-gold-border);
}

.emt-btn--secondary:hover {
	color: var(--emt-on-primary);
	background-color: var(--emt-primary);
	border-color: var(--emt-primary);
}

/* Outline: maroon */
.emt-btn--outline {
	color: var(--emt-primary);
	background-color: transparent;
	border-color: var(--emt-primary);
}

.emt-btn--outline:hover {
	color: var(--emt-on-primary);
	background-color: var(--emt-primary);
}

/* Text: link-style action */
.emt-btn--text {
	min-height: 0;
	padding: 0.25rem 0;
	color: var(--emt-primary);
	border-radius: var(--emt-radius-xs);
}

.emt-btn--text:hover {
	color: var(--emt-primary-hover);
	text-decoration: underline;
	text-decoration-color: var(--emt-gold-soft);
	text-underline-offset: 0.25em;
}

/* Optional yellow CTA (available, not the default brand voice) */
.emt-btn--cta {
	color: var(--emt-heading);
	background-color: var(--emt-button-yellow);
	border-color: var(--emt-button-yellow);
}

.emt-btn--cta:hover {
	color: var(--emt-on-primary);
	background-color: var(--emt-primary);
	border-color: var(--emt-primary);
}

/* Sizes */
.emt-btn--sm {
	min-height: 38px;
	padding: 0.5rem 1rem;
	font-size: var(--emt-fs-xs);
}

.emt-btn--lg {
	min-height: 52px;
	padding: 0.9rem 1.9rem;
	font-size: var(--emt-fs-base);
}

.emt-btn--block {
	width: 100%;
}

/* Header action (Login / My Dashboard) */
.emt-header-action {
	min-height: 42px;
	padding: 0.55rem 1.25rem;
	border-radius: var(--emt-radius-sm);
}

.emt-btn__icon {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
}

/* ---------------------------------------------------------------------------
 * Card
 * ------------------------------------------------------------------------ */

.emt-card {
	padding: clamp(1.25rem, 3vw, 2rem);
	background: var(--emt-white);
	border: 1px solid var(--emt-border);
	border-radius: var(--emt-radius-md);
	box-shadow: var(--emt-shadow-xs);
}

.emt-card--raised {
	box-shadow: var(--emt-shadow-sm);
}

.emt-card--cream {
	background: var(--emt-warm-white);
}

.emt-card__title {
	margin-bottom: 0.5rem;
	font-size: var(--emt-fs-md);
}

.emt-card__body > :last-child {
	margin-bottom: 0;
}

/* ---------------------------------------------------------------------------
 * Search form (404 / no results)
 * ------------------------------------------------------------------------ */

.emt-entry--none .search-form {
	display: flex;
	gap: 0.5rem;
	max-width: 480px;
	margin-inline: auto;
}

.emt-entry--none .search-form label {
	flex: 1;
	min-width: 0;
}

.emt-entry--none .search-form .search-field {
	width: 100%;
	min-height: 44px;
	padding: 0.6rem 0.9rem;
	background: var(--emt-white);
	border: 1px solid var(--emt-border-strong);
	border-radius: var(--emt-radius-sm);
}

.emt-entry--none .search-form .search-field:focus {
	border-color: var(--emt-primary);
	outline: none;
	box-shadow: 0 0 0 3px var(--emt-primary-tint);
}

.emt-entry--none .search-form .search-submit {
	min-height: 44px;
	padding: 0.6rem 1.1rem;
	font-family: var(--emt-font-ui);
	font-weight: var(--emt-fw-semibold);
	color: var(--emt-on-primary);
	cursor: pointer;
	background: var(--emt-primary);
	border: 0;
	border-radius: var(--emt-radius-sm);
}

.emt-entry--none .search-form .search-submit:hover {
	background: var(--emt-primary-hover);
}
