/* ==========================================================================
   Template 24 — clean, neutral, responsive theme for TNG 15
   1 Tokens & base   2 Header & nav   3 Footer   4 Home page   5 TNG pages
   ========================================================================== */

/* ---------- 1. Tokens & base ---------- */
@font-face {
	font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
	src: url("../fonts/inter-cyrillic-wght-normal.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
	src: url("../fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
	src: 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;
}

:root {
	--bg: #ffffff;
	--surface: #f2f0eb;
	--border: #d9d5cc;
	--text: #17202b;
	--text-muted: #4a5561;
	--accent: #1f3a5f;
	--accent-hover: #142842;
	--accent-soft: #e3eaf3;
	--navy-dark: #142842;
	--crimson: #9b1c1f;
	--gold: #c9a24a;
	--row-alt: #eef2f7;
	--radius: 8px;
	--shadow: 0 1px 2px rgba(31, 41, 51, .06), 0 6px 20px rgba(31, 41, 51, .08);
	--container: 1200px;
	--gutter: 24px;
	--header-h: 68px;
	--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
@media (max-width: 600px) {
	:root { --gutter: 16px; --header-h: 60px; }
}

html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 12px); }
body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: var(--font);
	font-size: 16px;
	line-height: 1.6;
}
body input, body select, body textarea, body button, body td, body th { font-family: var(--font); }
[class^="t24-"], [class*=" t24-"] { box-sizing: border-box; }

h1, h2, h3, h4, h5 {
	color: var(--text);
	font-family: var(--font);
	font-weight: 650;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin: 1.4em 0 .5em;
	text-transform: none;
}
h1 { font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.1rem); }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.1rem; }

a:link, a:visited, a:active, div.icons a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); text-decoration: underline; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
hr { border: 0; border-top: 1px solid var(--border); margin: 2rem 0; }

.t24-container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.t24-main { padding-top: 24px; padding-bottom: 56px; min-height: 50vh; }
@media (max-width: 900px) { .t24-main { overflow-x: auto; } }
/* Chart pages (body class = script name): full width, page scrolls like TNG's default */
body.pedigree .t24-main, body.descend .t24-main, body.descendvert .t24-main, body.desctracker .t24-main,
body.familychart .t24-main, body.verticalchart .t24-main, body.fan .t24-main, body.relationship .t24-main,
body.ahnentafel .t24-main { max-width: none; overflow-x: visible; }
.t24-main img { max-width: 100%; }

.t24-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4em;
	padding: .6em 1.15em; border-radius: var(--radius); border: 1px solid var(--accent);
	font: inherit; font-size: .95rem; font-weight: 600; line-height: 1.2;
	cursor: pointer; text-decoration: none !important; white-space: nowrap;
}
.t24-btn--primary, a.t24-btn--primary:link, a.t24-btn--primary:visited { background: var(--accent); color: #fff; }
.t24-btn--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }
.t24-btn--ghost, a.t24-btn--ghost:link, a.t24-btn--ghost:visited { background: transparent; color: var(--accent); }
.t24-btn--ghost:hover { background: var(--accent-soft); }

.t24-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }

/* ---------- 2. Header & nav ---------- */
.t24-header {
	position: sticky; top: 0; z-index: 1000;
	background: rgba(255, 255, 255, .96);
	-webkit-backdrop-filter: saturate(180%) blur(8px); backdrop-filter: saturate(180%) blur(8px);
	border-bottom: 3px solid var(--crimson);
}
.t24-header__inner { display: flex; align-items: center; gap: 12px; min-height: var(--header-h); }

.t24-brand { display: flex; align-items: center; gap: 12px; margin-right: auto; min-width: 0; text-decoration: none !important; }
a.t24-brand:link, a.t24-brand:visited { color: var(--text); }
.t24-brand__logo { height: 44px; width: auto; flex: none; }
.t24-brand__text { display: flex; flex-direction: column; min-width: 0; }
.t24-brand__title { font-size: 1.2rem; font-weight: 700; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t24-brand__sub { font-size: .85rem; color: var(--text-muted); line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.t24-iconbtn {
	display: none; align-items: center; justify-content: center; flex: none;
	width: 40px; height: 40px; padding: 0;
	border: 1px solid var(--border); border-radius: var(--radius); background: #fff; cursor: pointer;
}
a.t24-iconbtn:link, a.t24-iconbtn:visited, .t24-iconbtn { color: var(--text); }
.t24-iconbtn:hover { background: var(--surface); text-decoration: none; }
.t24-iconbtn svg { width: 20px; height: 20px; }
button.t24-iconbtn { box-shadow: none; background-image: none; }

.t24-nav { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
@media (min-width: 1181px) {
	.t24-brand { flex: 0 1 auto; }
	.t24-nav #print-smicon { display: none; } /* keep the desktop bar on one line; print stays in the phone menu */
}

/* TNG menu markup (tng_icons): div.menucontainer > div.innercontainer > div(inline-flex) > div.icons + ul.tngdd ; div.icons-rt */
.t24-nav div.menucontainer { margin: 0; padding: 0; }
.t24-nav div.innercontainer {
	height: auto; display: flex; align-items: center; gap: 4px;
	background: none; box-shadow: none; border-radius: 0;
}
.t24-nav div.innercontainer > div:first-child { align-items: center; gap: 4px; }
.t24-nav div.icons, .t24-nav div.icons-rt { float: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; font-size: .95rem; }
.t24-nav .tngsmallicon { background: none; padding: 0; }
.t24-nav #home-smicon, .t24-nav #search-smicon { display: none; }
.t24-nav div.icons a, .t24-nav div.icons-rt a {
	display: inline-flex; align-items: center; padding: 8px 10px; margin: 0;
	border-radius: var(--radius); color: var(--text); font-weight: 500; font-size: .95rem; text-transform: none;
}
.t24-nav div.icons a:hover, .t24-nav div.icons-rt a:hover { background: var(--surface); color: var(--text); text-decoration: none; }
.t24-nav #log-smicon, .t24-nav #logout-smicon {
	border: 1px solid var(--accent); color: var(--accent); font-weight: 600; margin-left: 4px;
}
.t24-nav #log-smicon:hover, .t24-nav #logout-smicon:hover { background: var(--accent-soft); color: var(--accent); }
.t24-nav div.icons-rt form { margin: 0; }
.t24-nav div.icons-rt select {
	margin: 0; max-width: 140px; padding: 6px 8px; font-size: .9rem !important;
	border: 1px solid var(--border); border-radius: var(--radius); background: #fff; color: var(--text);
}
.t24-nav div.icons-rt { order: 3; }
.t24-nav div.innercontainer > div:first-child div.icons { order: 2; }

/* Top-level dropdown triggers */
.t24-nav ul.tngdd { min-width: 0; font-size: .95rem; display: flex; order: 1; }
.t24-nav ul.tngdd > li { float: none; }
.t24-nav ul.tngdd .menulink, .t24-family__btn {
	display: inline-flex; align-items: center; gap: 6px; height: auto;
	padding: 8px 10px; border-radius: var(--radius);
	background: none; color: var(--text); font: inherit; font-weight: 500; font-size: .95rem;
	border: 0; cursor: pointer; text-transform: none;
}
.t24-nav ul.tngdd .menulink::after, .t24-family__btn::after {
	content: ""; width: 6px; height: 6px; margin-top: -3px;
	border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); opacity: .6;
}
.t24-nav ul.tngdd .menulink:hover, .t24-nav ul.tngdd .menuhover, .t24-family__btn:hover, .t24-family.is-open .t24-family__btn {
	background: var(--surface); color: var(--text); text-decoration: none;
}

/* Dropdown panels. TNG's JS (tngmenuhover2.js) opens/closes them by animating the inline height
   until offsetHeight reaches 0, so the TNG panel itself must have no padding or border
   (else it never finishes closing and stays faintly visible). Spacing sits on the <li>s, the edge is a shadow. */
.t24-nav ul.tngdd ul, .t24-family__menu {
	top: 100%; left: 0;
	background: #fff; border-radius: var(--radius);
	box-shadow: 0 0 0 1px var(--border), var(--shadow);
}
.t24-nav ul.tngdd ul { padding: 0 !important; border: 0; }
.t24-nav ul.tngdd ul[style*="height: 0px"] { visibility: hidden; } /* fully closed: hide the shadow line too */
.t24-family__menu { padding: 6px !important; }
.t24-nav ul.tngdd ul.last { left: auto; right: 0; }
.t24-nav ul.tngdd ul li { width: 230px; border: 0; padding: 3px 6px !important; box-sizing: border-box; }
.t24-nav ul.tngdd > li:first-child > ul { width: 472px; column-count: 2; column-gap: 0; }
.t24-nav ul.tngdd ul li a, .t24-family__menu a {
	display: flex; align-items: center; gap: 10px; padding: 8px 10px;
	background: none; border: 0 !important; border-radius: 6px !important;
	color: var(--text); font-size: .92rem; text-transform: none;
}
.t24-nav ul.tngdd ul li a:hover, .t24-family__menu a:hover { background: var(--accent-soft); color: var(--accent); text-decoration: none; }
.t24-nav ul.tngdd ul li a .menu-icon { margin: 0; flex: none; opacity: .75; }
.t24-nav .menu-label { padding: 0; }

.t24-family { position: relative; }
.t24-family__btn { box-shadow: none !important; border: 0 !important; background-image: none; }
.t24-nav div.icons-rt select { box-shadow: none !important; }
.t24-family__menu { position: absolute; display: none; list-style: none; margin: 0; min-width: 220px; z-index: 20; }
.t24-family:hover > .t24-family__menu, .t24-family.is-open > .t24-family__menu { display: block; }

/* TNG search slide-down (opened by the menu's search) */
.t24-header #searchdrop { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--border); box-shadow: var(--shadow); padding: 16px var(--gutter); }

/* ---- Mobile / tablet: hamburger panel ---- */
@media (max-width: 1180px) {
	.t24-iconbtn { display: inline-flex; }
	.t24-brand__sub { display: none; }
	.t24-brand__logo { height: 36px; }
	.t24-nav {
		display: none; position: absolute; left: 0; right: 0; top: 100%;
		flex-direction: column; align-items: stretch; gap: 0;
		max-height: calc(100vh - var(--header-h)); overflow-y: auto;
		background: #fff; border-bottom: 1px solid var(--border); box-shadow: var(--shadow);
		padding: 8px var(--gutter) 16px;
	}
	body.t24-nav-open .t24-nav { display: flex; }
	.t24-nav div.innercontainer, .t24-nav div.innercontainer > div:first-child { flex-direction: column; align-items: stretch; display: flex !important; }
	.t24-nav ul.tngdd { flex-direction: column; }
	.t24-nav #print-smicon { display: inline-flex; }
	.t24-nav ul.tngdd .menulink, .t24-family__btn { width: 100%; justify-content: space-between; padding: 12px 8px; border-radius: 0; border-bottom: 1px solid var(--border); }
	.t24-nav div.icons, .t24-nav div.icons-rt { flex-wrap: wrap; padding: 12px 0; }
	/* Submenus: static, shown only when tapped (JS adds .is-open); overrides TNG's inline styles */
	.t24-nav ul.tngdd ul, .t24-family__menu {
		position: static !important; display: none !important; height: auto !important; opacity: 1 !important;
		width: auto !important; column-count: 1 !important; box-shadow: none; border: 0; padding: 4px 0 8px 8px !important;
	}
	.t24-nav ul.tngdd > li.is-open > ul, .t24-family.is-open > .t24-family__menu { display: block !important; }
	.t24-nav ul.tngdd ul li { width: auto; float: none; }
	.t24-brand__title { font-size: 1.05rem; }
	.t24-family:hover > .t24-family__menu { display: none !important; }
	.t24-family.is-open:hover > .t24-family__menu { display: block !important; }
	.t24-header #searchdrop { position: static; box-shadow: none; }
}

/* ---------- 3. Footer ---------- */
.t24-footer {
	position: relative; background: var(--navy-dark); color: #c9d3e0; font-size: .92rem; padding: 52px 0 28px;
	border-top: 4px solid var(--crimson);
}
/* traditional pleter (interlace) strip along the top of the footer */
.t24-footer::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 14px; opacity: .55;
	background: url("../img/pleter-strip.svg") repeat-x center / auto 14px;
}
.t24-footer__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.t24-footer__title { font-size: 1rem; margin: 0 0 .75em; color: #fff; letter-spacing: .01em; }
.t24-footer p { margin: 0 0 .6em; }
.t24-footer__links { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 24px; }
.t24-footer__links li { margin: 0 0 .45em; break-inside: avoid; }
.t24-footer a:link, .t24-footer a:visited { color: #fff; }
.t24-footer a:hover { color: var(--gold); }
.t24-footer .smaller, .t24-footer__credit p { color: #aebbcc; }
.t24-footer__credit .smaller { font-size: .82rem; text-align: left; }
.t24-footer__credit .center { text-align: left; }

.t24-totop {
	position: fixed; right: 20px; bottom: 20px; z-index: 900;
	display: flex; align-items: center; justify-content: center; width: 44px; height: 44px;
	border-radius: 50%; background: var(--crimson); color: #fff !important; box-shadow: var(--shadow);
	opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity .2s, transform .2s;
}
.t24-totop.is-visible { opacity: 1; pointer-events: auto; transform: none; }
.t24-totop:hover { background: #7d1518; }
.t24-totop svg { width: 22px; height: 22px; }
.scroll-to-top { display: none !important; } /* TNG's own back-to-top image in mobile mode */

@media (max-width: 900px) {
	.t24-footer__grid { grid-template-columns: 1fr; gap: 24px; }
}

/* ---------- 4. Home page ---------- */
.t24-hero {
	position: relative; margin: 0 0 32px; border-radius: 12px; overflow: hidden;
	background: var(--accent) center / cover no-repeat;
	min-height: 440px; display: flex; align-items: flex-end;
}
.t24-hero::before {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(15, 23, 32, .78) 0%, rgba(15, 23, 32, .35) 55%, rgba(15, 23, 32, .1) 100%);
}
.t24-hero__inner { position: relative; width: 100%; padding: 40px; color: #fff; }
.t24-hero__title { color: #fff; margin: 0 0 .2em; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem); }
.t24-hero__sub { margin: 0 0 24px; font-size: 1.15rem; color: rgba(255, 255, 255, .88); }
.t24-hero__credit { position: absolute; right: 12px; bottom: 8px; margin: 0; font-size: .72rem; color: rgba(255, 255, 255, .75); }
.t24-hero__credit a:link, .t24-hero__credit a:visited { color: inherit; text-decoration: underline; }

.t24-search {
	display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end;
	max-width: 760px; padding: 16px; color: var(--text);
}
.t24-field { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; font-weight: 600; color: var(--text-muted); }
.t24-field input {
	font: inherit; font-size: 1rem; font-weight: 400; color: var(--text);
	padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; width: 100%; box-sizing: border-box;
}
.t24-field input { box-shadow: none; }
.t24-field input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.t24-search .t24-btn { height: 44px; }
.t24-search__adv { grid-column: 1 / -1; font-size: .88rem; }

.t24-quicklinks { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; margin: 0 0 48px; }
.t24-quicklink {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
	padding: 20px 12px; text-align: center; font-weight: 600; font-size: .95rem; line-height: 1.3;
	box-shadow: none; transition: transform .15s, box-shadow .15s, border-color .15s;
}
a.t24-quicklink:link, a.t24-quicklink:visited { color: var(--text); }
.t24-quicklink:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: #d3d0ca; text-decoration: none; color: var(--accent); }
.t24-quicklink svg { width: 28px; height: 28px; color: var(--accent); }

.t24-welcome { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 40px; align-items: start; margin: 0 0 48px; }
.t24-welcome h2 { margin-top: 0; }
.t24-prose { color: var(--text); }
.t24-prose p { margin: 0 0 1em; }
.t24-welcome__photo { padding: 20px; text-align: center; }
.t24-welcome__photo h2 { font-size: 1.1rem; text-align: left; }
.t24-welcome__photo img { border-radius: 6px; height: auto; }
/* No media yet: randomphoto.php prints nothing, so hide the empty card */
.t24-welcome:not(:has(.t24-welcome__photo img)) { grid-template-columns: 1fr; }
.t24-welcome__photo:not(:has(img)) { display: none; }

.t24-cloud { background: var(--surface); border-radius: 12px; padding: 32px; margin: 0 0 16px; text-align: center; }
.t24-cloud h2 { margin-top: 0; }
.t24-cloud__intro { color: var(--text-muted); margin: 0 0 20px; }
.t24-cloud a { display: inline-block; margin: 4px; padding: 4px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--border); line-height: 1.5; }
.t24-cloud a:hover { border-color: var(--accent); text-decoration: none; }

@media (max-width: 1000px) {
	.t24-quicklinks { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.t24-hero { min-height: 0; border-radius: 8px; }
	.t24-hero__inner { padding: 72px 16px 16px; }
	.t24-search { grid-template-columns: 1fr; }
	.t24-search .t24-btn { width: 100%; }
	.t24-welcome { grid-template-columns: 1fr; gap: 24px; }
	.t24-cloud { padding: 20px 12px; }
}
@media (max-width: 480px) {
	.t24-quicklinks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

/* ---------- 5. TNG pages (overrides of css/genstyle.css) ---------- */
.normal, .indleftcol, td, th { font-size: .95rem; }
.smaller { font-size: .85rem; }
.header, .plainheader, h1.header { font-family: var(--font); color: var(--text); font-weight: 650; line-height: 1.25; }
.header { font-size: 1.35rem; }
.header, .plainheader, h1.header { color: var(--accent); }
h1.header::after, .plainheader::after {
	content: ""; display: block; width: 56px; height: 3px; margin-top: 10px; border-radius: 2px; background: var(--crimson);
}
.t24-main h2, .t24-main h3 { color: var(--accent); }
.plainheader { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); }
.subhead, .subheadbold { color: var(--text); font-size: 1.05rem; }
.titlebox { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; box-shadow: none; }
.headericon { opacity: .8; }

/* Tables */
.whiteback { background: transparent; border-collapse: separate; border-spacing: 0; }
.fieldnameback, .databack, .databackalt { border-right: 0; border-bottom: 1px solid var(--border); padding: 8px 12px; }
.fieldnameback { background: var(--accent); color: #fff; font-weight: 600; border-bottom-color: var(--navy-dark); }
.fieldnameback .fieldname, .fieldname, th.fieldnameback { color: #fff; }
.fieldnameback a:link, .fieldnameback a:visited, .lightlink:link, .lightlink:visited, .lightlink2:link, .lightlink2:visited { color: #fff; }
.databack { background: #fff; }
.databackalt { background: var(--row-alt); }
tbody tr:nth-child(even) > td.databack { background: var(--row-alt); }
tr:hover > .databack, tr:hover > .databackalt { background: var(--accent-soft); }
.lightback { background: var(--surface); }
.tfixed, .thfixed, .dna-tfixed { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: none; }

/* Tabs on person / family pages */
#tngnav { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--border) !important; margin: 0 0 16px; }
#tngnav li { float: none; }
#tngnav a { background: none !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important;
	padding: 10px 14px !important; color: var(--text-muted) !important; font-size: .95rem; font-weight: 500; }
#tngnav a:hover { color: var(--text) !important; text-decoration: none; }
#tngnav a.here { color: #fff !important; background: var(--accent) !important; border-bottom-color: var(--crimson) !important; border-radius: 6px 6px 0 0 !important; }
#tabs a { font-size: .9rem; }

/* Alphabet / surname tabs */
.snlink, a.snlink:link, a.snlink:visited {
	display: inline-block; margin: 2px; padding: 4px 10px; min-width: 1.2em; text-align: center;
	background: var(--accent); border: 1px solid var(--accent); border-radius: 6px; color: #fff; font-weight: 600;
}
a.snlink:hover, .snlinkact { background: var(--crimson); border-color: var(--crimson); color: #fff; text-decoration: none; }

/* Forms & buttons */
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="number"], select, textarea {
	font: inherit; font-size: .95rem; color: var(--text);
	padding: 7px 10px; border: 1px solid var(--border); border-radius: var(--radius); background: #fff;
	max-width: 100%; box-sizing: border-box; box-shadow: none;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="search"]:focus, input[type="number"]:focus, select:focus, textarea:focus {
	outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
.btn, input[type="button"].btn, input[type="submit"].btn, input[type="reset"].btn, button.btn {
	font: inherit; font-size: .92rem; font-weight: 600; line-height: 1.2;
	padding: 8px 16px; border-radius: var(--radius); border: 1px solid var(--accent);
	background: var(--accent); color: #fff; cursor: pointer; background-image: none; text-shadow: none; box-shadow: none;
}
.btn:hover, input[type="submit"].btn:hover, input[type="button"].btn:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }
input[type="reset"].btn { background: #fff; color: var(--accent); }
.disabled { opacity: .5; cursor: not-allowed; }

/* Popups, slide-downs, litbox */
.popup, .popinner, .pboxpopupdiv, .slidedown, .callout {
	background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow);
}
#tnglitbox, .litbox { border-radius: 12px; overflow: hidden; }

/* Charts: colors, borders and fonts only — never width/height/position */
.pedbox { border-color: var(--border) !important; border-radius: 6px; font-family: var(--font); }
.pedbox a:link, .pedbox a:visited { color: var(--accent); }

/* Calendar, timeline, misc */
.calendar td, .calendar th { border-color: var(--border); }
.rounded10 { border-radius: 10px; }