/**
 * Noble Strings site customisations.
 *
 * These rules previously lived in Appearance > Additional CSS, which stores
 * them in the database (wp_posts, post type custom_css) where they are not
 * version controlled and do not travel with the theme. They are kept here
 * instead so they are tracked in git.
 *
 * Loaded last — after style.css and every parent stylesheet — by the
 * graceful_delight_blog_enqueue_custom_css() enqueue in functions.php. That
 * ordering matters: several of these selectors tie on specificity with rules
 * in the child style.css, so source order is what decides the winner.
 *
 * Edit this file rather than Additional CSS. Anything added in the admin will
 * override what is here and will not be committed.
 */

/* Hide the theme author's footer credit line. */
.footer-credits {
	visibility: hidden;
}

#main-navigation {
	background-color: #e1e1e1;
	border: none;
	text-align: center;
}

#top-navigation {
	text-align: center;
	box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid #dd9933;
	background: #dd9933 !important;
}

#top-menu li a {
	color: #ffffff;
	font-size: 20px;
}


/* ============================================================
   Sidebar instrument photo
   ============================================================

   One violin photograph inside sidebar-right, directly under the
   Search widget, linking through to the /instruments/ archive.
   Markup comes from inc/header-instrument.php via the
   [ns_header_instrument] shortcode, placed in a block widget
   immediately after Search in sidebars_widgets['sidebar-right'].

   Typography follows the instrument plates: Cormorant Garamond
   for the display line, Montserrat for the small label. Both
   faces are already self-hosted by the parent theme and loaded
   via its `graceful-google-fonts` handle
   (graceful/assets/fonts/), so nothing extra is fetched here —
   these rules only name the families the parent already serves.

   Image and title are centered within the widget. The photo is a
   full-length portrait shot (roughly 2:5), so it is sized by
   HEIGHT rather than width — capping the width instead would
   make it disproportionately tall for the sidebar column.
   ------------------------------------------------------------ */

.ns-header-instrument {
	padding: 4px 0 26px;
	text-align: center;
}

.ns-header-instrument__link {
	display: inline-block;
	border: none;
	text-decoration: none;
}

.ns-header-instrument__photo {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 260px;
	margin: 0 auto;
}

.ns-header-instrument__name {
	display: block;
	margin-top: 16px;
	color: #333333;
	font-family: 'Cormorant Garamond', 'Times', serif;
	font-size: 26px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
}

.ns-header-instrument__caption {
	display: block;
	margin-top: 6px;
	color: #6f6f6f;
	font-family: 'Montserrat', sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* #dd9933 is the site accent already used by the top bar and the
   evidence markers. */
.ns-header-instrument__link:hover .ns-header-instrument__name,
.ns-header-instrument__link:focus .ns-header-instrument__name,
.ns-header-instrument__link:hover .ns-header-instrument__caption,
.ns-header-instrument__link:focus .ns-header-instrument__caption {
	color: #dd9933;
}

/* Keyboard focus needs a visible ring: the link's only other
   focus cue is the colour change above, which is too subtle on
   its own to satisfy a keyboard user. */
.ns-header-instrument__link:focus-visible {
	outline: 2px solid #dd9933;
	outline-offset: 6px;
}

@media (max-width: 600px) {

	.ns-header-instrument {
		padding: 22px 16px 26px;
	}

	.ns-header-instrument__photo {
		max-height: 300px;
	}

	.ns-header-instrument__name {
		font-size: 22px;
	}
}


/* ============================================================
   Evidence markers
   ============================================================

   A confidence-marking system for research articles. The rule is
   that untagged prose means "documented, primary source seen" —
   these markers flag only the exceptions. Tagging everything turns
   the badges into wallpaper and readers stop seeing them.

   Two forms:

     [claim reported]  an inline pill, for an ordinary claim that
                       rests on a single or secondary source

     [dispute ...]     a full callout box, reserved for the handful
                       of major disputes where the record contradicts
                       the commonly repeated account

   Markup is generated by the shortcodes in inc/evidence-markers.php.
   Colour never carries meaning alone — every marker also states its
   tier in words, for colourblind readers and for print.
   ------------------------------------------------------------ */

:root {
	--ns-reported-ink: #6b5b3e;
	--ns-reported-bg: #f4efe4;
	--ns-reported-edge: #ccbb96;

	--ns-disputed-ink: #8a5a1f;
	--ns-disputed-bg: #fbf1e2;
	--ns-disputed-edge: #dd9933;

	--ns-corrected-ink: #8c2f2f;
	--ns-corrected-bg: #f9ecec;
	--ns-corrected-edge: #b85c5c;

	--ns-unverified-ink: #4a5568;
	--ns-unverified-bg: #eef1f5;
	--ns-unverified-edge: #a9b4c4;
}

/* --- Inline pill ------------------------------------------- */

.ns-claim {
	display: inline;
	white-space: nowrap;
	margin-left: 0.3em;
	padding: 0.12em 0.5em;
	border: 1px solid var(--ns-claim-edge, #ccc);
	border-radius: 1em;
	background: var(--ns-claim-bg, #eee);
	color: var(--ns-claim-ink, #444);
	font-size: 0.72em;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: lowercase;
	vertical-align: baseline;
	text-decoration: none;
}

a.ns-claim:hover,
a.ns-claim:focus {
	filter: brightness(0.94);
	text-decoration: none;
}

.ns-claim--reported {
	--ns-claim-ink: var(--ns-reported-ink);
	--ns-claim-bg: var(--ns-reported-bg);
	--ns-claim-edge: var(--ns-reported-edge);
}

.ns-claim--disputed {
	--ns-claim-ink: var(--ns-disputed-ink);
	--ns-claim-bg: var(--ns-disputed-bg);
	--ns-claim-edge: var(--ns-disputed-edge);
}

.ns-claim--corrected {
	--ns-claim-ink: var(--ns-corrected-ink);
	--ns-claim-bg: var(--ns-corrected-bg);
	--ns-claim-edge: var(--ns-corrected-edge);
}

.ns-claim--unverified {
	--ns-claim-ink: var(--ns-unverified-ink);
	--ns-claim-bg: var(--ns-unverified-bg);
	--ns-claim-edge: var(--ns-unverified-edge);
}

/* --- Callout box ------------------------------------------- */

.ns-dispute {
	margin: 2em 0;
	border: 1px solid var(--ns-dispute-edge, #ccc);
	border-left-width: 5px;
	border-radius: 3px;
	background: var(--ns-dispute-bg, #f7f7f7);
	padding: 1.15em 1.4em 1.25em;
	font-size: 0.95em;
	line-height: 1.6;
}

.ns-dispute--disputed {
	--ns-dispute-ink: var(--ns-disputed-ink);
	--ns-dispute-bg: var(--ns-disputed-bg);
	--ns-dispute-edge: var(--ns-disputed-edge);
}

.ns-dispute--corrected {
	--ns-dispute-ink: var(--ns-corrected-ink);
	--ns-dispute-bg: var(--ns-corrected-bg);
	--ns-dispute-edge: var(--ns-corrected-edge);
}

.ns-dispute--unverified {
	--ns-dispute-ink: var(--ns-unverified-ink);
	--ns-dispute-bg: var(--ns-unverified-bg);
	--ns-dispute-edge: var(--ns-unverified-edge);
}

.ns-dispute__status {
	display: block;
	margin-bottom: 0.15em;
	color: var(--ns-dispute-ink, #444);
	font-size: 0.72em;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ns-dispute__title {
	margin: 0 0 0.85em;
	color: var(--ns-dispute-ink, #333);
	font-size: 1.15em;
	font-weight: 700;
	line-height: 1.3;
}

.ns-dispute__rows {
	margin: 0;
	display: grid;
	grid-template-columns: minmax(7.5em, max-content) 1fr;
	gap: 0.55em 1.1em;
}

.ns-dispute__label {
	margin: 0;
	color: var(--ns-dispute-ink, #444);
	font-weight: 700;
	line-height: 1.5;
}

.ns-dispute__body {
	margin: 0;
	line-height: 1.5;
}

.ns-dispute__body cite {
	display: block;
	margin-top: 0.2em;
	font-size: 0.88em;
	font-style: normal;
	opacity: 0.8;
}

/* Narrow screens: stack label above body rather than squeezing
   the grid into two unusable columns. */
@media (max-width: 600px) {

	.ns-dispute {
		padding: 1em 1.1em;
	}

	.ns-dispute__rows {
		display: block;
	}

	.ns-dispute__label {
		margin-top: 0.75em;
		font-size: 0.85em;
		letter-spacing: 0.03em;
		text-transform: uppercase;
	}

	.ns-dispute__rows > .ns-dispute__label:first-child {
		margin-top: 0;
	}
}

/* Print: appraisers and archivists print these pages, so the
   markers have to survive without background colour. */
@media print {

	.ns-claim {
		background: none;
		border-color: #666;
		color: #000;
	}

	.ns-dispute {
		background: none;
		border: 1px solid #666;
		border-left-width: 4px;
		break-inside: avoid;
	}

	.ns-dispute__status,
	.ns-dispute__title,
	.ns-dispute__label {
		color: #000;
	}
}

/* Search widget button text was rendering white-on-light-gray (low
   contrast) from the parent theme's default block-search styling. */
.wp-block-search__button {
	color: #000000 !important;
}

/* Production doesn't show this search-icon toggle in the main nav
   (a difference in the untracked, third-party `graceful` parent
   theme between local and production, not a child-theme choice) —
   hide it here rather than hand-edit the parent theme file. */
.main-navigation-search {
	display: none !important;
}
