/* IC Dictionary: spacing and lists of the dictionary's own pages (headword pages and browse hubs). Loaded on those
   pages and, for its letter section, on the front page (IC Search's), after the frame stylesheet (handle ic-frame, shared core library), which holds the container rules
   (.ic-page, .ic-page--classic): width and spacing of the plugins' pages. Fonts are the theme's own. Colours and radii
   are custom properties with the look's values as fallbacks, so a theme can override them:
   --ic-ink #1A1D21, --ic-muted #59616B, --ic-rule #E4E7EB, --ic-surface #F5F6F8, --ic-accent #1D4E89,
   --ic-accent-hover #123459, --ic-radius 10px, --ic-radius-card 12px, --ic-reading 760px (headword column). */
.ic-page:has(.ic-headword) {
	max-inline-size: var(--ic-reading, 760px);
}

.ic-headword__langs {
	color: var(--ic-muted, #59616B);
	font-size: 0.875rem;
}

.ic-sense__term,
.ic-term {
	color: var(--ic-accent, #1D4E89);
	font-weight: 600;
}

.ic-sense__term {
	font-size: 1.25rem;
}

/* An equivalent that is also a headword is a link: it keeps the accent colour and weight of the plain one and is
   underlined, so it is told apart from plain text under any theme (some themes remove link underlines). */
.ic-sense__term a,
.ic-term a {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.ic-sense__term a:hover,
.ic-term a:hover {
	color: var(--ic-accent-hover, #123459);
}

.ic-sense__justification,
.ic-sense__collision {
	color: var(--ic-muted, #59616B);
}

/* One source = one card: the equivalent large in the accent on top, the source name, page and domain on a surface
   strip under it. The markup order is name, page, domain, entries; the flex order puts the entries first. The strip
   items grow (flex-grow: 1), so when the strip wraps onto several lines the items of every line fill that line and it
   is grey to the card's edge. The card and the entries paint nothing: the entries stay on the page's own background. */
.ic-sources .ic-source {
	display: flex;
	flex-wrap: wrap;
	margin-block: 0 1.25rem;
	overflow: hidden;
	border: 1px solid var(--ic-rule, #E4E7EB);
	border-radius: var(--ic-radius-card, 12px);
}

.ic-source__entries {
	flex: 0 0 100%;
	order: 1;
	box-sizing: border-box;
	margin: 0;
	padding: 1rem 1.25rem;
	list-style: none;
}

.ic-source__name,
.ic-source__code,
.ic-source__domain {
	flex-grow: 1;
	order: 2;
	box-sizing: border-box;
	margin: 0;
	padding: 0.625rem 1.25rem;
	background: var(--ic-surface, #F5F6F8);
	color: var(--ic-muted, #59616B);
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.4;
}

.ic-source__name {
	color: var(--ic-ink, #1A1D21);
	font-weight: 600;
}

.ic-source__name a,
.ic-source__code a,
.ic-source__domain a {
	color: var(--ic-accent, #1D4E89);
}

.ic-source__name a:hover,
.ic-source__code a:hover,
.ic-source__domain a:hover {
	color: var(--ic-accent-hover, #123459);
}

.ic-term {
	font-size: 1.5rem;
	line-height: 1.3;
}

.ic-sources .ic-source:last-child {
	margin-bottom: 0;
}

.ic-source__entries > li {
	margin-block-end: 1rem;
}

.ic-source__entries > li:last-child {
	margin-block-end: 0;
}

.ic-definition {
	margin-block: 0.5rem 0;
}

.ic-definition + .ic-definition {
	margin-block-start: 0.75rem;
}

.ic-hub__crumbs {
	margin-block-end: 1rem;
}

.ic-hub__sep {
	margin-inline: 0.4em;
}

.ic-hub__letters,
.ic-hub__domains {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ic-hub__section {
	margin-block-end: 2rem;
}

.ic-hub__list {
	margin-block: 1rem;
}

.ic-hub__list > li {
	margin-block-end: 0.35rem;
}

.ic-hub__lang,
.ic-hub__count {
	margin-inline-start: 0.5em;
	opacity: 0.7;
	font-size: 0.875em;
}

.ic-hub__pager {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin-block: 1.5rem;
}

.ic-citation {
	margin-block: 1rem 1.5rem;
}

.ic-citation dt {
	font-weight: 600;
	margin-block-start: 0.5rem;
}

.ic-citation dd {
	margin-inline-start: 0;
}

/* Front page section (printed by IC Search's front page): a heading, then one row per language with a box per letter
   that has a published headword. */
.ic-home-browse {
	box-sizing: border-box;
	max-inline-size: var(--ic-front-wide, 1120px);
	margin-inline: auto;
	padding: 48px 24px 72px;
}

.ic-home-browse__title {
	margin: 0 0 20px;
	font-size: 30px;
	font-weight: 600;
}

.ic-home-browse__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-block-end: 12px;
}

.ic-home-browse__lang {
	flex: 0 0 92px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ic-muted, #59616B);
}

.ic-home-browse__letters {
	display: flex;
	flex: 1 1 0;
	flex-wrap: wrap;
	gap: 8px;
	min-inline-size: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ic-home-browse__letters li {
	margin: 0;
}

.ic-home-browse__letters a {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	inline-size: 38px;
	block-size: 38px;
	font-size: 15px;
	font-weight: 500;
	color: var(--ic-accent, #1D4E89);
	text-decoration: none;
	border: 1px solid var(--ic-rule, #E4E7EB);
	border-radius: 8px;
}

.ic-home-browse__letters a:hover,
.ic-home-browse__letters a:focus-visible {
	color: var(--ic-accent-hover, #123459);
	border-color: var(--ic-accent, #1D4E89);
}
