/*
 * Atlas Arcadia — base page rules (plan 2026-10-08-001, U1 and U9).
 *
 * The cream page ground, for both themes:
 *   - `body` is the ground under Hello and under The7. `:root body` (0,1,1)
 *     outranks the Elementor kit's `.elementor-kit-N { background-color: #fff }`
 *     (0,1,0), which paints the body white once the Additional CSS is gone, and
 *     The7's own `body { background: #252525 }`.
 *   - `#page` is The7's wrapper, which it paints dark (#252525) whenever its
 *     CSS regenerates. Hello has no #page, so the second selector is inert there.
 *     `body #page` outranks The7's own `#page` rule whatever order the sheets load.
 * `!important`, like the Additional CSS rule this replaces: an Elementor page's own
 * background setting (the Location shell paints `body` black through
 * `body.elementor-page-N`) must not show through where #page is absent.
 * This is what makes the Additional CSS override (`body, #page`) redundant; that
 * override stays until U14 as belt and braces. The footer is NOT forced cream: it
 * paints its own brown bar (aa-points.php).
 *
 * --aa-header-h: the height of the fixed/sticky site header, for anything that
 * must sit below it (the Token page sidebar). 114px is The7's header as
 * measured on staging. The header template sets the real value when U10 rebuilds
 * it; until then this default is correct under both themes.
 */

:root {
	--aa-header-h: 114px;
	/* Elementor 4.3.4 prints `line-height: var(--e-global-typography-<slot>-line-height)` on its
	   Heading widget, but this Kit sets no line height for the primary/secondary slots, so the
	   variable is undefined and the heading inherits the body's 1.2em instead of Elementor's own
	   `.elementor-heading-title { line-height: 1 }`. That collapsed every page title (the "inner page"
	   template's 60px heading drew over the header). 1 is the value those headings always had.
	   Set on :root, so a Kit that defines the slot later (on body) overrides it. Both themes. */
	--e-global-typography-primary-line-height: 1;
	--e-global-typography-secondary-line-height: 1;
}

:root body,
body #page {
	background-color: var(--aa-cream, #fdf6e8) !important;
}

/*
 * The7's document baseline, for Hello only (plan U12).
 *
 * Under The7, text the Elementor templates do not style themselves inherits The7's
 * base: the Kit's `--the7-*` variables (Cartridge 16px/1.2em weight 300, letter-spacing
 * .6px; Righteous / Cartridge headings in the brand orange), `#main`'s 50px padding on
 * singular posts and on search, and The7's `.content` rules for lists, links and fields.
 * Hello with reset.css and theme.css OFF supplies none of it (the browser default is
 * Times New Roman), so it is restated here. The values were read off The7's computed
 * styles on staging (probe: an element of each tag appended to the content area under
 * The7, then under Hello). The Kit prints the `--the7-*` variables on `body` under
 * either theme, so the font choices still follow the Kit; the literals are fallbacks.
 *
 * The element rules apply inside the content locations and inside Elementor popups
 * (`.elementor-popup-modal`, body-level, like The7's global rules reached them): without
 * the popup scope the Log In popup's fields fell to the browser default (22px, no padding).
 *
 * Scoped to `body.wp-theme-hello-elementor`: inert under The7 (it already does all
 * this) and in the block editor iframe. Everything below the body rule goes through
 * `:where()`, so it has zero specificity and any class rule (Elementor widget styles,
 * the AA stylesheets) wins exactly as it would over The7's element rules.
 * Delete this block when The7 is removed and nothing is left to compare against (U14).
 */
body.wp-theme-hello-elementor {
	margin: 0;
	font-family: var(--the7-base-font-family, "Cartridge", sans-serif);
	font-size: var(--the7-base-font-size, 16px);
	font-weight: var(--the7-base-font-weight, 300);
	line-height: var(--the7-base-line-height, 1.2em);
	letter-spacing: var(--the7-base-letter-spacing, 0.6px);
	overflow-x: hidden;
}

/* The7's universal reset (`* { padding: 0; margin: 0 }` in its main.css). Zero specificity, like
   everything below, so Elementor's own class rules and the AA stylesheets are unaffected. */
:where(body.wp-theme-hello-elementor) * {
	padding: 0;
	margin: 0;
}
:where(body.wp-theme-hello-elementor) :where(a) {
	color: #999;
}

/* #main's padding: The7 gave 50px top and bottom to singular posts (Location, Token,
   blog post) and to search results, and none to pages, archives, the blog index and 404.
   Under Hello the Elementor root is a direct child of <body>, so it takes it. */
:where(body.wp-theme-hello-elementor.single, body.wp-theme-hello-elementor.search) > :where([data-elementor-type]:not([data-elementor-type="header"], [data-elementor-type="footer"], [data-elementor-type="popup"])) {
	padding-top: 50px;
	padding-bottom: 50px;
}

/* The7's content wrapper (`#main > .wf-wrap`: 1200px wide, 50px side padding, 20px up to 778px).
   Under The7 it surrounds singular posts and search results, and is dropped (`body.elementor-clear-template`)
   for pages, the 404, the blog index and archives, which run edge to edge. Location, Token, blog post and
   search are one shortcode or loop each and rely on it for their width. */
:where(body.wp-theme-hello-elementor.single, body.wp-theme-hello-elementor.search) > :where([data-elementor-type]:not([data-elementor-type="header"], [data-elementor-type="footer"], [data-elementor-type="popup"])) {
	box-sizing: border-box;
	width: 1200px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 50px;
	padding-right: 50px;
}
@media screen and (max-width: 778px) {
	:where(body.wp-theme-hello-elementor.single, body.wp-theme-hello-elementor.search) > :where([data-elementor-type]:not([data-elementor-type="header"], [data-elementor-type="footer"], [data-elementor-type="popup"])) {
		padding-left: 20px;
		padding-right: 20px;
	}
}

:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h1, h2, h3, h4, h5, h6) {
	margin: 0 0 10px;
	color: var(--the7-title-color, var(--e-global-color-primary, #db680b));
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h1, h2, h3, h4, h5, h6) :where(a) {
	color: inherit;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h1) {
	font: var(--the7-h1-font-weight, 600) var(--the7-h1-font-size, 60px) / 50px var(--the7-h1-font-family, "Cartridge", sans-serif);
	letter-spacing: var(--the7-h1-letter-spacing, normal);
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h2) {
	font: var(--the7-h2-font-weight, 500) var(--the7-h2-font-size, 40px) / 30px var(--the7-h2-font-family, "Righteous", sans-serif);
	letter-spacing: var(--the7-h2-letter-spacing, -1px);
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h3) {
	font: var(--the7-h3-font-weight, 500) var(--the7-h3-font-size, 25px) / 30px var(--the7-h3-font-family, "Righteous", sans-serif);
	letter-spacing: var(--the7-h3-letter-spacing, -1px);
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h4) {
	font: var(--the7-h4-font-weight, 500) var(--the7-h4-font-size, 20px) / 20px var(--the7-h4-font-family, "Cartridge", sans-serif);
	letter-spacing: var(--the7-h4-letter-spacing, -1px);
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h5) {
	font: var(--the7-h5-font-weight, 400) var(--the7-h5-font-size, 15px) / 20px var(--the7-h5-font-family, "Righteous", sans-serif);
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(h6) {
	font: 400 12px / 20px Arial, Helvetica, Verdana, sans-serif;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(p) {
	margin: 0 0 10px;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(a) {
	color: #999;
	text-decoration: underline;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(ul, ol) {
	margin: 0 0 10px 20px;
	padding: 0;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(figure) {
	margin: 0;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(dl, dd) {
	margin: 0;
	list-style: none;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(pre, code) {
	font-family: "courier new", monospace;
	margin: 0;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(small) {
	font-size: 12px;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="hidden"], [type="image"], [type="range"], [type="color"]), select, textarea) {
	box-sizing: border-box;
	margin: 0 0 10px;
	padding: 5px 15px;
	font: var(--the7-form-md-font, 300 16px / 1.2em "Cartridge", sans-serif);
	color: #787d85;
	background-color: #fcfcfc;
	border: 1px solid rgba(173, 176, 182, 0.3);
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(b, strong) {
	font-weight: 700;
}

/* The7's form-control normalisation (`button, input, select, textarea { font-size: 100% }`,
   `button, input { line-height: normal }`) and table spacing, which controls and boards across the
   site were laid out against. Elementor buttons are `inline-flex` under The7's compatibility sheet
   (Elementor's own is inline-block) with letter-spacing 0 on every size. */
:where(body.wp-theme-hello-elementor) :where(button, input, select, textarea) {
	font-size: 100%;
}
:where(body.wp-theme-hello-elementor) :where(button, input) {
	line-height: normal;
}
:where(body.wp-theme-hello-elementor > [data-elementor-type]:not([data-elementor-type="header"], [data-elementor-type="footer"])) :where(table) {
	margin-bottom: 10px;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="hidden"], [type="image"], [type="range"], [type="color"]), select, textarea) {
	line-height: 1.2em;
}
:where(body.wp-theme-hello-elementor > :is(.elementor-location-single, .elementor-location-archive, [data-elementor-type="wp-page"], main, .elementor-popup-modal)) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="hidden"], [type="image"], [type="range"], [type="color"]), select) {
	height: var(--the7-input-height, 38px);
}
body.wp-theme-hello-elementor .elementor-button {
	display: inline-flex;
}
body.wp-theme-hello-elementor .elementor-element .elementor-button:is(.elementor-size-xs, .elementor-size-sm, .elementor-size-md, .elementor-size-lg, .elementor-size-xl) {
	letter-spacing: 0;
}

/* The7's Elementor compatibility sheet (compatibility/elementor/elementor-global.css) styles a few
   widget internals that Elementor leaves alone. Specificity matches the originals. */
body.wp-theme-hello-elementor .elementor-button-wrapper {
	line-height: 0;
}
body.wp-theme-hello-elementor .elementor-widget-text-editor :is(h1, h2, h3, h4, h5, h6) {
	margin-bottom: 10px;
	/* The7 extends the widget's Text Color control to also set --textColor and colours the headings
	   with it; the widget's own colour (default: the Kit's text colour) is what that resolves to. */
	color: inherit;
}
body.wp-theme-hello-elementor .elementor-widget-text-editor p:last-child {
	margin-bottom: 0 !important;
}

/* The7's comment markup rules (main.css, "comments" block) and the custom-CSS fonts and colours
   that go with them. The Location and Token pages and the blog post style their comment areas on
   top of this. Hello only: under The7 these are its own. */
body.wp-theme-hello-elementor :is(.comment-respond, .comments-area) {
	display: flex;
	flex-flow: column nowrap;
}
body.wp-theme-hello-elementor :is(.comment-respond, .comments-area) > h3 {
	margin-bottom: 30px;
}
body.wp-theme-hello-elementor .comment-respond a {
	text-decoration: none;
}
body.wp-theme-hello-elementor #comments :is(.children, .comment-list) {
	margin: 0;
	padding: 0;
	list-style: none;
}
body.wp-theme-hello-elementor #comments .comment-list {
	padding-bottom: 50px;
}
body.wp-theme-hello-elementor #comments .comment-list:last-child {
	padding-bottom: 0;
}
body.wp-theme-hello-elementor .comment-list .comment-body {
	position: relative;
	padding: 20px 20px 10px 100px;
	margin-top: 20px;
	box-sizing: border-box;
}
body.wp-theme-hello-elementor .comment-list > li:first-child > .comment-body {
	margin-top: 0;
}
body.wp-theme-hello-elementor #comments .children {
	margin-left: 90px;
}
body.wp-theme-hello-elementor .comment-author-name {
	display: block;
	margin-bottom: 5px;
}
body.wp-theme-hello-elementor .comment-metadata {
	margin-bottom: 20px;
}
body.wp-theme-hello-elementor .comment-author .avatar {
	float: left;
	margin: 0 20px 15px -80px;
	border-radius: 50%;
}
body.wp-theme-hello-elementor .comment-content {
	overflow: hidden;
	margin-bottom: 10px;
}
body.wp-theme-hello-elementor .comment-list .reply {
	text-align: right;
	margin-bottom: 10px;
}
body.wp-theme-hello-elementor .comment-reply-link {
	margin-left: 10px;
}
body.wp-theme-hello-elementor .comment-reply-title > small {
	display: block;
	text-align: center;
}
body.wp-theme-hello-elementor .comment-reply-title #cancel-comment-reply-link {
	float: left;
	margin-top: 10px;
}
body.wp-theme-hello-elementor :is(.comment-notes, .logged-in-as) {
	margin-bottom: 15px;
}
body.wp-theme-hello-elementor .comment-form .form-fields {
	overflow: hidden;
	margin-bottom: 10px;
}
body.wp-theme-hello-elementor .comment #respond {
	padding-top: 24px;
}
body.wp-theme-hello-elementor #commentform textarea {
	width: 100%;
	margin: 0 0 10px;
}
body.wp-theme-hello-elementor :is(.clear-form, .comment-meta a, .comment-reply-link, .fn a, .pingback a) {
	text-decoration: none;
}
body.wp-theme-hello-elementor :is(#reply-title small a, .clear-form, .comment-meta a, .comment-reply-link, .pingback a):hover {
	text-decoration: underline;
}
body.wp-theme-hello-elementor #reply-title small {
	font: var(--the7-base-font-weight, 300) var(--the7-base-font-size, 16px) / var(--the7-base-line-height, 1.2em) var(--the7-base-font-family, "Cartridge", sans-serif);
}
body.wp-theme-hello-elementor #reply-title small a {
	color: #999;
}
body.wp-theme-hello-elementor :is(.comments-title, .comments-title a, .comment-author a, .comment-author .fn, #reply-title, .fn, .fn a, .pingback-title) {
	color: var(--the7-title-color, var(--e-global-color-primary, #db680b));
}
body.wp-theme-hello-elementor :is(.comment-author a, .comment-author .fn) {
	font: var(--the7-h5-font-weight, 400) var(--the7-h5-font-size, 15px) / 20px var(--the7-h5-font-family, "Righteous", sans-serif);
}

/*
 * Elementor containers saved with `e-con-fit` (the older "fit to content" width; the search results
 * cards are one). Elementor 4.3.4's frontend.css no longer styles that class, and The7 had been
 * supplying the rules in compatibility/elementor/elementor-global.css (copied verbatim), so under
 * Hello those containers lost their direction, gap and padding. Both themes: under The7 these
 * duplicate its own copy, byte for byte, and change nothing. Without them the search results
 * (and any other e-con-fit container) collapse into one-letter columns. Keep after U14.
 */
.elementor-element:where(.e-con-fit) {
	flex-direction: var(--flex-direction);
	flex-wrap: var(--flex-wrap);
	justify-content: var(--justify-content);
	align-items: var(--align-items);
	align-content: var(--align-content);
	gap: var(--gap);
}
.e-con-fit {
	text-align: var(--text-align);
	padding-block-start: var(--bc-padding-block-start, var(--padding-block-start));
	padding-block-end: var(--bc-padding-block-end, var(--padding-block-end));
}
.e-con-fit.e-flex {
	flex-direction: var(--flex-direction);
}

/* The header's Log In popup (Elementor popup 91797): rounded corners from the design system
   (--radius-lg, 16px), under either theme. Specificity (0,3,0): above Elementor's popup.css
   `.elementor-popup-modal .dialog-widget-content { border-radius: 0 }` (0,2,0), below the popup's
   own Elementor style settings (`#elementor-popup-modal-91797 …`, an ID), so a radius set there wins. */
:where(#elementor-popup-modal-91797).elementor-popup-modal .dialog-widget-content.dialog-lightbox-widget-content {
	border-radius: 16px;
	overflow: hidden;
}
