/* Équivalences : styles volontairement sobres, hérités du thème autant que possible. */
.eq-page, .eq-preview, .eq-list {
	--eq-accent: #2f6fde;
	--eq-accent-soft: rgba(47, 111, 222, .1);
	--eq-border: rgba(127, 127, 127, .25);
	--eq-muted: rgba(127, 127, 127, 1);
	--eq-radius: 10px;
}

.eq-page { display: grid; gap: 2rem; }

.eq-hero { display: flex; gap: 1.25rem; align-items: center; }
.eq-hero__logo .eq-logo { width: 72px; height: 72px; }
.eq-hero__summary { font-size: 1.1em; font-weight: 600; margin: 0 0 .25rem; }
.eq-hero__tagline { margin: 0 0 .5rem; color: var(--eq-muted); }

.eq-logo { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; flex: none; display: inline-block; }
.eq-logo--initial {
	display: inline-flex; align-items: center; justify-content: center;
	background: hsl(var(--eq-hue, 210) 60% 45%); color: #fff; font-weight: 700; font-size: 1.2em;
}

.eq-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.eq-item {
	display: grid; grid-template-columns: 2rem auto 1fr auto; gap: 1rem; align-items: start;
	padding: 1rem; border: 1px solid var(--eq-border); border-radius: var(--eq-radius);
}
.eq-item__rank { font-weight: 700; color: var(--eq-muted); padding-top: .6rem; text-align: center; }
.eq-item__title { margin: 0 0 .25rem; font-size: 1.1em; }
.eq-item__title a { text-decoration: none; }
.eq-item__tagline, .eq-item__note { margin: 0 0 .5rem; }
.eq-item__note { font-style: italic; color: var(--eq-muted); }
.eq-item__more { font-size: .9em; }

.eq-tags { list-style: none; margin: 0 0 .5rem; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.eq-tags li { font-size: .8em; padding: .1rem .55rem; border-radius: 999px; background: var(--eq-accent-soft); }

.eq-vote {
	display: inline-flex; flex-direction: column; align-items: center; gap: .1rem;
	min-width: 3.5rem; padding: .45rem .6rem; cursor: pointer;
	border: 1px solid var(--eq-border); border-radius: var(--eq-radius);
	background: transparent; color: inherit; font: inherit; font-weight: 700; line-height: 1.1;
}
.eq-vote:hover, .eq-vote:focus-visible { border-color: var(--eq-accent); color: var(--eq-accent); }
.eq-vote.is-voted { background: var(--eq-accent); border-color: var(--eq-accent); color: #fff; }
.eq-vote[aria-busy="true"] { opacity: .6; cursor: progress; }

.eq-preview {
	display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem;
	margin: .75rem 0; padding: .6rem .9rem; border: 1px solid var(--eq-border); border-radius: var(--eq-radius);
}
.eq-preview__label { font-weight: 600; }
.eq-preview__items { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .75rem; }
.eq-preview__items a { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; }
.eq-preview__items .eq-logo { width: 24px; height: 24px; border-radius: 5px; font-size: .75em; }
.eq-preview__all { margin-left: auto; font-weight: 600; }

.eq-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .75rem; }
.eq-card {
	display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .75rem; align-items: center;
	padding: .75rem; border: 1px solid var(--eq-border); border-radius: var(--eq-radius); text-decoration: none; color: inherit;
}
.eq-card .eq-logo { grid-row: span 2; }
.eq-card__title { font-weight: 600; }
.eq-card__count { font-size: .85em; color: var(--eq-muted); }
.eq-card:hover { border-color: var(--eq-accent); }

.eq-suggest { padding: 1.25rem; border: 1px dashed var(--eq-border); border-radius: var(--eq-radius); }
.eq-suggest h2 { margin-top: 0; font-size: 1.2em; }
.eq-suggest__form { display: grid; gap: .5rem; max-width: 34rem; }
.eq-suggest__form input[type="search"], .eq-suggest__form textarea { width: 100%; box-sizing: border-box; }
.eq-suggest__message:empty { display: none; }
.eq-suggest__message.is-error { color: #c0392b; }
.eq-button { justify-self: start; cursor: pointer; }

.eq-combobox { position: relative; }
.eq-combobox__results {
	position: absolute; z-index: 10; left: 0; right: 0; margin: 2px 0 0; padding: 0; list-style: none;
	background: Canvas; color: CanvasText; border: 1px solid var(--eq-border); border-radius: 6px; max-height: 16rem; overflow: auto;
}
.eq-combobox__results li { padding: .45rem .7rem; cursor: pointer; }
.eq-combobox__results li[aria-selected="true"], .eq-combobox__results li:hover { background: var(--eq-accent-soft); }

@media (max-width: 600px) {
	.eq-item { grid-template-columns: auto 1fr auto; }
	.eq-item__rank { display: none; }
	.eq-hero { align-items: flex-start; }
	.eq-preview__all { margin-left: 0; }
}
