/*
 * edCircuit design values (PRD ETP-6.3). Every colour, font, size and spacing
 * the templates use is set here once; components read these properties.
 *
 * Greys and borders: the Lovable design's src/styles.css. Orange: the owner's
 * tiers (2026-10-19), because the design's #E55A1C measures 3.61:1 on white
 * and fails for small text (PRD ETP-6.2).
 */

@font-face {
	font-family: "Inter Variable";
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url(fonts/inter-latin-wght-normal.woff2) format("woff2-variations"), url(fonts/inter-latin-wght-normal.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Inter Variable";
	font-style: italic;
	font-display: swap;
	font-weight: 100 900;
	src: url(fonts/inter-latin-wght-italic.woff2) format("woff2-variations"), url(fonts/inter-latin-wght-italic.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* For devices without Georgia (ETP-6.1): drawn to Georgia's letter widths. */
@font-face {
	font-family: "Gelasio";
	font-style: normal;
	font-display: swap;
	font-weight: 700;
	src: url(fonts/gelasio-latin-700-normal.woff2) format("woff2");
}

:root {
	/* Type */
	--edct-font-sans: "Inter Variable", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--edct-font-serif: Georgia, "Gelasio", "Times New Roman", serif;
	--edct-text-11: 0.6875rem;
	--edct-text-12: 0.75rem;
	--edct-text-14: 0.875rem;
	--edct-text-16: 1rem;
	--edct-text-17: 1.0625rem;
	--edct-text-18: 1.125rem;
	--edct-text-20: 1.25rem;
	--edct-text-24: 1.5rem;
	--edct-text-30: 1.875rem;
	--edct-text-36: 2.25rem;
	--edct-heading-tracking: -0.02em;

	/* Colour: greys from the design */
	--edct-fg: hsl(222 22% 12%);
	--edct-fg-90: hsl(222 22% 12% / 0.9);
	--edct-muted: hsl(220 16% 96%);
	--edct-muted-fg: hsl(220 10% 42%);
	--edct-border: hsl(220 14% 90%);
	--edct-border-60: hsl(220 14% 90% / 0.6);
	--edct-card: #fff;
	--edct-page: #fff;
	/* The article page's canvas: the design's panel grey hsl(220 16% 96%) at 40%
	   over white (its preview's bg-muted/40), written opaque so the rail's sticky
	   band matches it exactly. */
	--edct-article-page: #fafbfb;

	/* Colour: the owner's orange tiers */
	--edct-accent: #ff8500;      /* lines, bars, ticks, icons */
	--edct-button: #f06a0a;      /* filled buttons, white 19px bold text */
	--edct-button-hover: #c35608;
	--edct-orange-text: #b55e00; /* small orange text, 4.60:1 */
	--edct-accent-soft: rgb(255 133 0 / 0.06);
	--edct-accent-line: rgb(255 133 0 / 0.35);

	/* Shape */
	--edct-radius-md: 8px;
	--edct-radius-lg: 10px;
	--edct-radius-xl: 14px;
	--edct-radius-2xl: 16px;
	--edct-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
	--edct-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
	--edct-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);

	/* Layout */
	--edct-max: 1280px;
	--edct-rail: 288px;
	--edct-gap: 24px;
	--edct-card-gap: 16px;
	--edct-sticky-top: 80px;
}

/*
 * Links on every page this plugin draws (owner, 2026-10-23): nothing
 * underlines when pointed at except a card's or list item's title; the card's
 * border and shadow are the rest of the signal. Links inside running text keep
 * a thin, light underline at all times, so they can be found without telling
 * colours apart (WCAG 1.4.1). The site's own link rule underlines on hover,
 * which underlined every line of a card, so it is cancelled here.
 */
html body :is(.edct, .edca, .edcc, .edct-dialog, .edca-sub, .edcc-dialog) a,
html body :is(.edct, .edca, .edcc, .edct-dialog, .edca-sub, .edcc-dialog) a:hover {
	text-decoration: none;
}
html body :is(.edct, .edca, .edcc) a:hover :is(.edct-fcard__title, .edct-mini__title, .edca-item__title, .edcc-lcard__title, .edcc-pcard__title, .edcc-rrow__title, .edcc-guide__title, .edcc-writer__name) {
	text-decoration: underline;
	text-underline-offset: 3px;
}
html body :is(.edct-body, .edcc-intro, .edca-profile__bio, .edca-sub__terms) a,
html body :is(.edct-body, .edcc-intro, .edca-profile__bio, .edca-sub__terms) a:hover {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
}
html body :is(.edct-body, .edcc-intro, .edca-profile__bio, .edca-sub__terms) a:hover {
	text-decoration-color: currentColor;
}
