/*
 * Shared corrections, loaded last.
 *
 * Forty-five module stylesheets were written independently, and each one set
 * its own weights, radii and link decoration. Editing all of them would be a
 * large change with a real chance of breaking something that currently works,
 * for a product with no users. This file instead states the handful of rules
 * that should hold everywhere, and relies on load order to win ties.
 *
 * It must be enqueued after every module stylesheet. See
 * EVTaxUK_Design_System::enqueue_overrides().
 *
 * @since 21.0.0
 */

/* ---------------------------------------------------------------------
 * Type scale
 *
 * There was no scale. The design tokens covered colour, radius, shadow and
 * spacing, and nothing for type, so every module invented its own sizes: the
 * same page heading appears at 2.6, 2.55, 2.5, 2.45 and 2.35rem across five
 * modules. Nobody notices any one of those. Together they are why the product
 * feels assembled rather than designed.
 * ------------------------------------------------------------------ */
:root{
	--ev-text-xs:.75rem;
	--ev-text-sm:.875rem;
	--ev-text-md:1rem;
	--ev-text-lg:1.25rem;
	--ev-text-xl:1.75rem;
	--ev-text-2xl:2.25rem;
}

/* ---------------------------------------------------------------------
 * Weight
 *
 * The stylesheets carried 226 declarations at weight 800 or 900. In Inter,
 * 900 is Black: a display weight meant for a poster headline. It was being
 * used on 12px uppercase labels, table headers and inline links.
 *
 * When everything is emphasised nothing is, and heavy type on small text is
 * the clearest amateur signal in the whole interface. Three weights is
 * enough for a product that is mostly numbers and dates.
 * ------------------------------------------------------------------ */
.evtaxuk-app-shell :is(h1,h2,h3,h4,h5,th,strong,b){font-weight:650}
.evtaxuk-app-shell :is(span,small,em,label,button,a,dt){font-weight:500}
.evtaxuk-app-shell :is(p,li,td,dd){font-weight:400}

/* Uppercase eyebrows read as shouting at weight 900. */
.evtaxuk-app-shell [class*="__heading"] span,
.evtaxuk-app-shell [class*="__hero"] p{
	font-weight:600;
	letter-spacing:.06em;
}

/* ---------------------------------------------------------------------
 * Link decoration
 *
 * The app shell is injected through the_content, so it renders inside
 * .entry-content and inherits the theme's underline rule. That rule is two
 * classes deep and beat the single-class rules the modules were using, which
 * is why navigation links were underlined. Individual modules had begun
 * patching this one at a time; this states it once for the whole shell.
 * ------------------------------------------------------------------ */
.evtaxuk-app-shell a,
.entry-content .evtaxuk-app-shell a{text-decoration:none}

/* Underline stays where it carries meaning: links inside running prose. */
.evtaxuk-app-shell p > a,
.entry-content .evtaxuk-app-shell p > a{text-decoration:underline}

/* Keyboard focus must remain obvious once the underline is gone. */
.evtaxuk-app-shell a:focus-visible,
.evtaxuk-app-shell button:focus-visible{
	outline:2px solid #60a5fa;
	outline-offset:2px;
	border-radius:6px;
}

/* ---------------------------------------------------------------------
 * Contrast
 *
 * --evtaxuk-muted-2 is #94a3b8, roughly 2.7:1 on white, which fails WCAG AA
 * for normal text. It was applied to the explanatory line under every figure,
 * so the text explaining the numbers was the hardest text on the page to
 * read. Retired in favour of the darker muted token at about 4.8:1.
 * ------------------------------------------------------------------ */
:root{--evtaxuk-muted-2:#64748b}

.evtaxuk-app-shell__nav-heading{color:rgba(255,255,255,.66)}

/* ---------------------------------------------------------------------
 * State colour must win
 *
 * ui-framework-v2.css contains:
 *
 *   .evtaxuk-ui-v2 [class*="__kpis"] article{
 *       border-color:var(--evui-border)!important;
 *   }
 *
 * which was flattening every card border to the same grey, including the
 * amber and red that say a date has passed. Found by inspecting the computed
 * style on the live page rather than by reading the CSS: the class was
 * applied correctly and the colour still did not change.
 *
 * This is the second time in two releases that a rule which looked right lost
 * silently to specificity. Beating an !important needs an !important, which
 * is why these carry one and the rest of the file does not.
 * ------------------------------------------------------------------ */
.evtaxuk-command__kpis article.is-due-soon,
.evtaxuk-ui-v2 [class*="__kpis"] article.is-due-soon{
	border-left-color:var(--evtaxuk-amber)!important;
}
.evtaxuk-command__kpis article.is-overdue,
.evtaxuk-ui-v2 [class*="__kpis"] article.is-overdue{
	border-left-color:var(--evtaxuk-red)!important;
	background:#fef2f2;
}
.evtaxuk-command__hero.is-due-soon{border-left-color:var(--evtaxuk-amber)!important}
.evtaxuk-command__hero.is-overdue{border-left-color:var(--evtaxuk-red)!important;background:#fef2f2}
.evtaxuk-command__hero.is-clear{border-left-color:var(--evtaxuk-green)!important}

/* ---------------------------------------------------------------------
 * Top bar without a search field
 *
 * The bar is a three-column grid and search was the middle one. With search
 * off the column stayed, stranding the user block in the middle of the bar.
 * ------------------------------------------------------------------ */
.evtaxuk-app-shell__topbar.has-no-search{
	grid-template-columns:1fr auto!important;
}
.evtaxuk-app-shell__topbar.has-no-search .evtaxuk-app-shell__user{
	justify-self:end;
}