/**
 * OSHIDA — chip.
 *
 * @figma 1559:890  123.60 x 60, r=10, veil rgba(74,74,74,.2), padding 15/38
 * @figma 1559:868  label 15px / 400
 *
 * The design hand-sets the inline padding per chip — 37.8px on «درباره ما» and
 * «خدمات ما», 71.7px on «همکاری با ما» (@figma 1559:892). The token
 * --o-pad-chip (15px 38px) is used uniformly instead, so a chip's width follows
 * its label. Deliberate normalisation.
 *
 * Owner: work package B1.
 */

.o-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-block-size: 60px;
	padding: var(--o-pad-chip);
	border-radius: var(--o-radius-xs);
	background-color: var(--o-veil-card);
	color: var(--o-text);
	font-size: var(--o-fs-xs);
	font-weight: var(--o-fw-regular);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
}

a.o-chip:hover,
button.o-chip:hover {
	background-color: var(--o-veil-panel);
}

.o-chip--current,
.o-chip--selected {
	border: var(--o-line-width) solid var(--o-gold-deep);
}

@media (prefers-reduced-motion: no-preference) {
	.o-chip {
		transition: background-color var(--o-dur-fast) var(--o-ease-standard);
	}
}

@media (max-width: 599px) {
	.o-chip {
		min-block-size: 48px;
		padding: var(--o-space-2xs) var(--o-space-md);
	}
}
