/**
 * Woakey — theme overrides
 *
 * Migrated verbatim from Appearance → Customize → Additional CSS
 * (WordPress core custom CSS, printed as <style id="wp-custom-css">).
 *
 * SOURCE ORDER IS LOAD-BEARING. `.wfls-btn-default` must stay above
 * `.default_inactive_button_001, .wfls-disabled, .tab-btn` — both use
 * !important at equal specificity and can hit the same element, so the
 * later one wins. The original carried a "don't change order" comment;
 * it is preserved below. Add new rules at the END of the file only.
 *
 * @since 1.2.137
 */

/* ---------------------------------------------------------------- tokens */
:root {
	/* One source of truth for the header / footer / bottom-bar gradient.
	   The bottom-bar content template consumes this via var(), so the
	   three surfaces can never drift apart again. */
	--woakey-bar-gradient: linear-gradient(
		90deg,
		rgba(7, 48, 61, 1) 10%,
		rgba(18, 38, 45, 1) 20%,
		rgba(2, 25, 25, 1) 50%,
		rgba(18, 38, 45, 1) 80%,
		rgba(7, 48, 61, 1) 90%
	);
	--woakey-dark: #07303d;
	--woakey-gold: #e09d27;        /* accent: borders, text, chips */
	--woakey-gold-fill: #e98d26;   /* button FILL — pairs with the accent as
	                                  its border, per .pm-overlay-close */

	/* Shared page-surface tokens. Home and Magazine both consume these, so
	   the white "sheet" treatment stays consistent across page templates —
	   change the shadow once here and every sheet on the site follows. */
	--woakey-page-bg: #f7f4ee;
	--woakey-sheet-bg: #ffffff;
	--woakey-sheet-pad: 60px;
	--woakey-sheet-pad-md: 40px;
	--woakey-sheet-pad-sm: 24px;
	--woakey-sheet-radius: 0px;
	--woakey-sheet-shadow: 5px 5px 15px 5px rgba(0, 0, 0, 0.3);

	/* Shared hover language for image cards and headers. Every card and
	   article header consumes these, so the whole site's hover feel is
	   tuned from one place. */
	--woakey-zoom-scale: 1.08;
	--woakey-zoom-duration: 1.2s;
	--woakey-zoom-ease: cubic-bezier(.22, 1, .36, 1);

	/* The scrim sits over the image so white text stays legible. Dark at
	   top and bottom, lighter through the middle, so it works whether the
	   text sits high (article headers) or low (smart-look cards). */
	--woakey-scrim: linear-gradient(
		180deg,
		rgba(7, 48, 61, 0.95) 0%,
		rgba(7, 48, 61, 0.65) 40%,
		rgba(7, 48, 61, 0.95) 100%
	);
	--woakey-scrim-hover: 0.75;

	/* air under a PINNED sidebar heading (Saved / My connections /
	   Highlights / Companies / Professionals). Only applies while the rail
	   is stuck; unpinned headings keep their normal 10px. */
	--woakey-rail-stuck-gap: 45px;

	/* ---- filter modal tunables ----
	   Exposed as tokens so the modal can be retuned WITHOUT editing the
	   plugin. Override any of them from a content-template CSS panel or
	   from Customizer → Additional CSS:

	       :root { --woakey-tax-scroll-height: 140px; }

	   A variable assignment always wins on value regardless of where it is
	   written, so this avoids the specificity fights that come from trying
	   to out-declare the component's own rules. */
	--woakey-tax-scroll-height: 90px;   /* default term-list height   */
	--woakey-tax-scroll-min: 60px;      /* floor when dragged shorter */
	--woakey-chip-radius: 50px;         /* taxonomy chip corner       */

	/* ---- notice language (1.2.240) ----
	   ONE definition for every notice on the site: [woakey_notice] in
	   content templates, WooCommerce's own .woocommerce-error / -info /
	   -message, and anything added later. Previously the colours lived
	   inside the shortcode's inline <style>, which is why WooCommerce
	   notices had to repeat them — and why they drifted.

	   Four levels. Keep them semantic: danger is for "something failed
	   and you must act", warning for "this needs your attention",
	   info for "here is where you stand", success for "done". Dressing a
	   normal step in red teaches people to ignore red. */
	--woakey-notice-radius: 6px;
	--woakey-notice-pad: 12px 14px;
	--woakey-notice-gap: 12px;
	--woakey-notice-size: 14px;
	--woakey-notice-icon: 20px;

	--woakey-notice-info-bg: #f2f7f9;
	--woakey-notice-info-border: #cfe2e9;
	--woakey-notice-info-text: #204a57;
	--woakey-notice-info-icon: #3a7d8c;

	--woakey-notice-warning-bg: #fdf6ec;
	--woakey-notice-warning-border: #f2dcb8;
	--woakey-notice-warning-text: #6b4e18;
	--woakey-notice-warning-icon: #d99125;

	--woakey-notice-success-bg: #f0f7f2;
	--woakey-notice-success-border: #cfe5d6;
	--woakey-notice-success-text: #1f5130;
	--woakey-notice-success-icon: #3f8f5c;

	--woakey-notice-danger-bg: #fdf2f2;
	--woakey-notice-danger-border: #f3cfcf;
	--woakey-notice-danger-text: #7a2020;
	--woakey-notice-danger-icon: #c0392b;

	/* ---- spinner (1.2.240) ----
	   The ring was declared four times — filter modal, load-more, the
	   Views override, the CRED overlay and the overlay iframe — at three
	   different speeds (.7s / .8s / 1s) with #e09d27 hardcoded rather
	   than reading --woakey-gold. One ring now, tuned here. */
	--woakey-spinner-size: 34px;
	--woakey-spinner-width: 4px;
	--woakey-spinner-track: rgba(0, 0, 0, 0.12);
	--woakey-spinner-speed: .7s;
	--woakey-spinner-speed-reduced: 2.4s;  /* prefers-reduced-motion */

	/* Panel behind form furniture. A shade off the page background so the
	   form reads as a surface without introducing a fourth neutral —
	   --woakey-page-bg is the page, white is the sheet, this sits between.
	   (1.2.244) */
	--woakey-panel-bg: #f2f0ea;

	/* Tabs (1.2.320). The rule colour was hard-coded as #f2f2f2 in the Home
	   page CT; named here so "our light grey" is one value rather than a
	   literal repeated wherever tabs appear. */
	--woakey-rule: #f2f2f2;
	--woakey-tab-hover-bg: #f9f9f9;
	--woakey-tab-hover-border: #f2f2f2;

	/* Sheet width. Matches the header container so a sheet's edges line up
	   with the top menu rather than sitting a few pixels off. One token,
	   because cart, checkout, account, the catalogue surfaces and the
	   validation pages all want the same measure. (1.2.251) */
	--woakey-sheet-max: 1200px;

	/* Channel triples for the two brand colours. Needed because rgba()
	   cannot take a hex var — `rgba(var(--woakey-gold), .45)` is invalid.
	   Templates that tint or fade a brand colour use these instead of
	   writing the channels out again:
	     rgba(var(--woakey-gold-rgb), .45)
	   Without them, every translucent gold in the site is a fresh literal
	   nobody will remember to update. (1.2.254) */
	--woakey-gold-rgb: 224, 157, 39;
	--woakey-dark-rgb: 7, 48, 61;

	/* ---- UI face (1.2.241) ----
	   filter-modal.css already read var(--woakey-ui-font, Montserrat) in
	   several places, but the variable was never declared — every one of
	   those was silently falling back. Declared here so the fallbacks stop
	   being the real value, and so the CRED forms, filter controls and
	   WooCommerce form labels can be moved to a different face by editing
	   one line. */
	--woakey-ui-font: Montserrat;
	--woakey-chip-pad: 5px 8px;
	--woakey-chip-font: 12.5px;
	--woakey-ui-font: Montserrat;       /* controls typeface — matches .woakey-form */

	/* Bell glyph as a mask, so it can be recoloured (see the notification
	   button rule below for why the emoji itself cannot be). */
	--woakey-bell-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M224 0c-17.7 0-32 14.3-32 32V51.2C119 66 64 130.6 64 208v18.8c0 47-17.3 92.4-48.5 127.6l-7.4 8.3c-8.4 9.4-10.4 22.9-5.3 34.4S19.4 416 32 416H416c12.6 0 24-7.4 29.2-18.9s3.1-25-5.3-34.4l-7.4-8.3C401.3 319.2 384 273.9 384 226.8V208c0-77.4-55-142-128-156.8V32c0-17.7-14.3-32-32-32zm45.3 493.3c12-12 18.7-28.3 18.7-45.3H224 160c0 17 6.7 33.3 18.7 45.3s28.3 18.7 45.3 18.7s33.3-6.7 45.3-18.7z'/%3E%3C/svg%3E");
}

/* ------------------------------------------------- migrated, verbatim */

/*@media (min-width: 922px) {
    .ast-container {
        max-width: 1140px;
    }
}*/

body {
	background: transparent !important;
}

.site-title {
	display: none !important;
	visibility: hidden !important;
}

.default_button_001, .woocommerce-form-login__submit, #tfa_login_btn, .wpt-form-submit, .woocommerce-Button, .woocommerce-address-fields > p > button, .woocommerce-info > a, .simbatfa_settings_save, #wfls-token-submit, #wfls-recovery-download, .tab-btn.active {
	display: inline-flex !important;
	font-family: Montserrat !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	padding: 9px 12px !important;
	border-radius: 14px !important;
	font-weight: 800 !important;
	font-size: 12.5px !important;
	line-height: 1 !important;
	border: 1px solid transparent !important;
	cursor: pointer !important;
	text-decoration: none !important;
	transition: transform .12s ease, background .12s ease, color .12s ease, border-color .12s ease, opacity .12s ease !important;
	user-select: none !important;
	/* background: #e09d27 !important; */
	background: #e98d26 !important;
	color: #07303d !important;
	border-color: #e09d27 !important;
}

.default_button_001:hover, .woocommerce-form-login__submit:hover, #tfa_login_btn:hover, .wpt-form-submit:hover, .woocommerce-Button:hover, .woocommerce-address-fields:hover > p > button, .woocommerce-info:hover > a, .simbatfa_settings_save:hover, #wfls-token-submit:hover, #wfls-recovery-download:hover, .tab-btn.active:hover {
	filter: brightness(1.05);
}

/* don't change order */

.wfls-btn-default {
	background-color: #e09d27 !important;
	font-family: Montserrat !important;
	border-radius: 3px !important;
	color: white !important;
	display: inline-block !important;
	font-size: 15px !important;
	line-height: 1 !important;
	padding: 12px 24px !important;
	fill: #fff !important;
	text-align: center !important;
	transition: all .3s !important;
	cursor: pointer !important;
	border-color: transparent !important;
}

.default_inactive_button_001, .wfls-disabled, .tab-btn {
	background-color: #bcbcbc !important;
	font-family: Montserrat !important;
	border-radius: 3px !important;
	color: white !important;
	display: inline-block !important;
	font-size: 15px !important;
	line-height: 1 !important;
	padding: 12px 24px !important;
	fill: #fff !important;
	text-align: center !important;
	transition: all .3s !important;
	cursor: pointer !important;
	border-color: transparent !important;
}

.default_button_002 {
	display: inline-flex !important;
	font-family: Montserrat !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	padding: 9px 12px !important;
	border-radius: 14px !important;
	font-weight: 800 !important;
	font-size: 12.5px !important;
	line-height: 1 !important;
	border: 1px solid rgba(255, 255, 255, .12) !important;
	cursor: pointer !important;
	text-decoration: none !important;
	transition: transform .12s ease, background .12s ease, color .12s ease, border-color .12s ease, opacity .12s ease !important;
	user-select: none !important;
	background: #07303d !important;
	color: white !important;
}

/* FOOTER AND HEADER */
.ast-footer-row-mobile-stack, .ast-below-header-bar, .ast-builder-grid-row-mobile-layout-default {
	background: var(--woakey-bar-gradient) !important;
}

/* --------------------------------------------------- added in 1.2.137 */

/* Bottom toolbar: match the header / footer gradient.
   Toolset injects content-template CSS into <head> from JS at the end of
   the document, so it lands AFTER any enqueued stylesheet. `body ` lifts
   this to 0,1,1 so it still wins without !important. The CT panel remains
   the owner of layout; this only sets the surface. */
body .profile-management-container {
	background: var(--woakey-bar-gradient);
	border-top: 1px solid var(--woakey-dark);
}

/* wpautop leftovers: empty paragraphs and stray line breaks that Toolset
   templates emit between block-level constructs. Structural only — a real
   <br> inside a paragraph is untouched. */
.entry-content > p:empty,
.entry-content > br {
	display: none;
}

/* --------------------------------------------------- added in 1.2.138 */

/* Scroll-to-top button: lift it clear of the fixed bottom toolbar and
   recolour to the brand gold.

   Astra sets `bottom` from `.ast-scroll-to-top-right` (0,1,0) but
   `background-color` from `#ast-scroll-top` — an ID, 1,0,0. A plain class
   selector loses the background. `#ast-scroll-top.ast-scroll-to-top-right`
   is 1,1,0 and clears both in one rule, no !important.

   Scoped to .logged-in: the bottom toolbar only renders inside a
   [wpv-conditional] on the current user, so for logged-out visitors there
   is nothing down there to clear and the button should sit at Astra's
   default 30px. */
body.logged-in #ast-scroll-top.ast-scroll-to-top-right {
	bottom: 80px;
}

#ast-scroll-top.ast-scroll-to-top-right {
	background-color: var(--woakey-gold);
}

#ast-scroll-top.ast-scroll-to-top-right:hover,
#ast-scroll-top.ast-scroll-to-top-right:focus {
	background-color: #e98d26;
}

/* --------------------------------------------------- added in 1.2.139 */

/* Page titles are carried by the content templates themselves, so the
   theme's own entry header is redundant everywhere. */
.entry-header {
	display: none !important;
	visibility: hidden !important;
}

/* Astra's article wrapper adds margin that shows as a band above the
   footer on full-bleed page templates. */
#primary {
	margin: 0;
}

/* --------------------------------------------------- added in 1.2.141 */

/* Bottom toolbar: no underlines anywhere in the bar. Toolset injects
   content-template CSS from JS at the end of <head>, so it lands after
   enqueued styles — `body ` lifts these to 0,1,1 to win on ties. */
body .profile-management-container a,
body .profile-management-container a:hover,
body .profile-management-container a:focus,
body .profile-management-container .pm-toolbar a,
body .profile-management-container .profile-management-box a {
	text-decoration: none !important;
}

/* Notification bell in brand gold, matching the envelope.

   WHY THIS IS NOT JUST `color:`. The label is the emoji U+1F514, whose
   Unicode default is EMOJI presentation — the browser paints it from a
   colour font and ignores `color` entirely. The envelope U+2709 defaults
   to TEXT presentation, which is why that one already takes the colour
   and the bell did not.

   So the glyph is suppressed and replaced with a masked SVG, which takes
   its colour from background-color and is deterministic across platforms.
   No content-template change needed. */
body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger {
	color: var(--woakey-gold);
	font-size: 0;                      /* hides the emoji glyph */
	line-height: 0;

	/* 1.2.213 — dress the bell like its siblings (Add +, envelope):
	   outline pill, not a filled blob, and the SAME hover contract —
	   everything turns white, background stays put. Whatever button
	   default was filling it gold is overridden here rather than hunted,
	   because this block is already the bell's single owner. */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent !important;
	border: 1px solid var(--woakey-gold) !important;
	border-radius: 999px;
	padding: 6px 12px !important;
	height: auto !important;
	width: auto !important;
	box-shadow: none !important;
	transition: border-color .15s ease;
}

body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger::before {
	content: "";
	display: inline-block;
	width: 13px;
	height: 13px;
	vertical-align: middle;
	background-color: var(--woakey-gold);
	-webkit-mask: var(--woakey-bell-mask) center / contain no-repeat;
	mask: var(--woakey-bell-mask) center / contain no-repeat;
	transition: background-color .15s ease;
}

body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger:hover,
body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger:focus-visible {
	background: transparent !important;
	border-color: var(--woakey-gold) !important; /* border keeps brand gold; only the bell whitens (owner's call, 1.2.214) */
}

body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger:hover::before,
body .profile-management-container .main-button-wrapper-notifications .woakey-overlay-trigger:focus-visible::before {
	background-color: #ffffff;
}

/* Narrow screens: the "Add" word is dropped and the "+" carries the button.
   Requires the bottom-bar content template paste that wraps the word in
   <span class="pm-btn-label">. Without it this rule is simply inert. */
@media (max-width: 575px) {
	body .profile-management-container .pm-btn-label {
		display: none;
	}
}

/* Footer sits directly against the content above it.

   Astra writes this as `.site-above-footer-wrap[data-section="..."]
   { border-top-width: 1px }` — a class PLUS an attribute selector, 0,2,0.
   A plain class list is 0,1,0 and loses, which is why the first attempt
   did nothing. Matching the attribute selector clears it without
   !important. */
.site-above-footer-wrap[data-section],
.site-primary-footer-wrap[data-section],
.site-below-footer-wrap[data-section],
.site-footer[data-section] {
	border-top-width: 0px;
}

.site-footer,
.ast-footer-overlay,
.site-above-footer-wrap,
.site-primary-footer-wrap,
.site-below-footer-wrap {
	border-top-width: 0px;
}

/* =========================================================================
   WooCommerce surfaces — page canvas + sheet (added 1.2.198)

   The sheet chrome used to live as near-identical copies in the Checkout
   (7349) and My Account (2706) content-template CSS panels — the exact
   duplicated-CSS-that-drifts pattern this plugin exists to end. It moves
   here, once, keyed to WooCommerce body classes, for two reasons:

   1. One owner. The CT copies must now be DELETED, not left as harmless
      duplicates: these selectors are body.<class> .site-content (0,2,1),
      which beats a CT panel's bare .site-content (0,1,0) regardless of
      load order — a leftover CT copy is dead code that still looks
      editable, and the next person edits it and nothing happens.

   2. Coverage. The shop, product-category and single-product surfaces are
      rendered by WooCommerce as archives — no page content template ever
      renders there, so no CT panel can ever style them. Only an enqueued
      stylesheet reaches them.

   The sheet reads the shared tokens with the current literals as
   fallbacks; retune once in :root above and every surface moves together.

   Padding steps down at 1024/767 (Home and Magazine convention). This is
   an intentional change for Checkout and My Account, which previously
   held 60px at every width.
   ========================================================================= */

body.woocommerce-cart #page,
body.woocommerce-checkout #page,
body.woocommerce-account #page,
body.post-type-archive-product #page,
body.tax-product_cat #page,
body.tax-product_tag #page,
body.single-product #page {
	background: var(--woakey-page-bg, #f7f4ee);
}

/* Single-sheet pages: cart, checkout, account. display:table + table-cell
   is the vertical centring that produces the tall sheet with content in
   the middle. Load-bearing, not decoration. */
body.woocommerce-cart .site-content,
body.woocommerce-checkout .site-content,
body.woocommerce-account .site-content {
	/* `min-width: 80%` used to sit here alongside max-width. On a viewport
	   wider than 1425px, 80% exceeds the max — and min-width WINS over
	   max-width in the cascade — so the sheet quietly grew past its own
	   limit and stopped lining up with the header. Removed, not retuned. */
	max-width: var(--woakey-sheet-max);
	width: 100%;
	margin: 40px auto;
	padding: var(--woakey-sheet-pad, 60px);
	background: var(--woakey-sheet-bg, #ffffff);
	border-radius: var(--woakey-sheet-radius, 0px);
	box-shadow: var(--woakey-sheet-shadow, 5px 5px 15px 5px rgba(0, 0, 0, 0.3));
	display: table;
}

body.woocommerce-cart .site-content > .ast-container,
body.woocommerce-checkout .site-content > .ast-container,
body.woocommerce-account .site-content > .ast-container {
	display: table-cell;
	vertical-align: middle;
}

/* Catalogue surfaces: same sheet, WITHOUT the table centring — a product
   grid wants flow layout, not a vertically centred cell. */
body.post-type-archive-product .site-content,
body.tax-product_cat .site-content,
body.tax-product_tag .site-content,
body.single-product .site-content {
	/* Same min-width/max-width conflict as the block above. */
	max-width: var(--woakey-sheet-max);
	width: 100%;
	margin: 40px auto;
	padding: var(--woakey-sheet-pad, 60px);
	background: var(--woakey-sheet-bg, #ffffff);
	border-radius: var(--woakey-sheet-radius, 0px);
	box-shadow: var(--woakey-sheet-shadow, 5px 5px 15px 5px rgba(0, 0, 0, 0.3));
}

@media (max-width: 1024px) {
	body.woocommerce-cart .site-content,
	body.woocommerce-checkout .site-content,
	body.woocommerce-account .site-content,
	body.post-type-archive-product .site-content,
	body.tax-product_cat .site-content,
	body.tax-product_tag .site-content,
	body.single-product .site-content {
		padding: var(--woakey-sheet-pad-md, 40px);
	}
}

@media (max-width: 767px) {
	body.woocommerce-cart .site-content,
	body.woocommerce-checkout .site-content,
	body.woocommerce-account .site-content,
	body.post-type-archive-product .site-content,
	body.tax-product_cat .site-content,
	body.tax-product_tag .site-content,
	body.single-product .site-content {
		padding: var(--woakey-sheet-pad-sm, 24px);
	}
}

/* =========================================================================
   Member badge (added 1.2.203) — rendered only by [woakey_member_badge],
   which asks woakey_profile_is_premium(); no template re-derives the test.
   ========================================================================= */

.woakey-member-pill {
	display: inline-block;
	padding: 2px 10px;
	border-radius: var(--woakey-chip-radius, 999px);
	background: var(--woakey-gold, #e09d27);
	color: #1a2b32;
	font-family: var(--woakey-ui-font, inherit);
	font-size: var(--woakey-chip-font, 12px);
	font-weight: 600;
	line-height: 1.6;
	vertical-align: middle;
	white-space: nowrap;
}

.woakey-member-pill-until {
	font-size: var(--woakey-chip-font, 12px);
	color: #6b7075;
	white-space: nowrap;
}

/* =========================================================================
   Toolset loading state (added 1.2.217) — Views' default spinner replaced
   with a brand one: gold ring on the cream canvas, no stock GIF.
   ========================================================================= */
.wpv-spinner, .wpv-loading, .js-wpv-loading .wpv-spinner {
	background: none !important;
	/* Same ring as .woakey-spinner, one size down because Views drops it
	   inline next to text rather than centred in an overlay. !important
	   is required here and only here: Views ships the spinner as a
	   background-image with its own !important. */
	width: 26px !important;
	height: 26px !important;
	border: 3px solid var(--woakey-spinner-track) !important;
	border-top-color: var(--woakey-gold) !important;
	border-radius: 50%;
	animation: woakey-spin var(--woakey-spinner-speed) linear infinite;
	display: inline-block;
}
/* @keyframes woakey-spin lives with the canonical .woakey-spinner further
   down this file — one declaration, not one per consumer. */
@media (prefers-reduced-motion: reduce) {
	.wpv-spinner, .wpv-loading .wpv-spinner { animation-duration: var(--woakey-spinner-speed-reduced); }
}

/* =====================================================================
   THE SPINNER — one ring, every surface (1.2.240)

   Canonical definition. filter-modal.css, the CRED overlay and the
   Views override all consumed their own copy at three different speeds
   with #e09d27 written out by hand. They now consume this.

   This file is enqueued unconditionally at priority 999 on every front
   end request, so it is the safe place for a base component: it is
   always present, and always after the theme.
   ===================================================================== */

.woakey-spinner {
	display: inline-block;
	width: var(--woakey-spinner-size);
	height: var(--woakey-spinner-size);
	border: var(--woakey-spinner-width) solid var(--woakey-spinner-track);
	border-top-color: var(--woakey-gold);
	border-radius: 50%;
	animation: woakey-spin var(--woakey-spinner-speed) linear infinite;
}

@keyframes woakey-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
	.woakey-spinner { animation-duration: var(--woakey-spinner-speed-reduced); }
}

/* =====================================================================
   NOTICES — one visual language (1.2.240)

   Covers BOTH the [woakey_notice] shortcode and WooCommerce's own
   notices, from the same tokens. Previously the shortcode printed its
   colours in an inline <style> guarded by is_user_logged_in(), so:
     - any notice on a public page rendered completely unstyled, and
     - WooCommerce's notices had to repeat every colour to match.
   Both problems came from the same cause. The gate is gone and the
   colours live in :root.

   Structural difference to keep in mind: [woakey_notice] uses a child
   <span class="woakey-notice__icon">, WooCommerce uses a ::before on
   the container. Same result, two selectors — WooCommerce's markup is
   not ours to change.
   ===================================================================== */

.woakey-notice,
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
	position: relative;
	display: flex;
	gap: var(--woakey-notice-gap);
	align-items: flex-start;
	/* !important is required here and not elsewhere: WooCommerce's own
	   stylesheet ships `padding: 1em 2em 1em 3.5em !important` on these
	   three classes, which leaves a 3.5em indent where its font-icon used
	   to sit. Nothing but !important outranks it. */
	padding: var(--woakey-notice-pad) !important;
	margin: 10px 0 18px;
	border: 1px solid transparent;
	border-radius: var(--woakey-notice-radius);
	font-size: var(--woakey-notice-size);
	line-height: 1.5;
	list-style: none;
	background: none;
	/* font-family deliberately unset: notices inherit the surrounding
	   face so they read as part of the page, not as a second voice. */
}

.woakey-notice__icon,
.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
	position: static;
	flex: 0 0 var(--woakey-notice-icon);
	width: var(--woakey-notice-icon);
	height: var(--woakey-notice-icon);
	margin: 1px 0 0;
	padding: 0;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	top: auto;
	left: auto;
}

.woakey-notice__body { flex: 1; }

.woakey-notice a,
.woocommerce-error a,
.woocommerce-info a,
.woocommerce-message a { color: inherit; text-decoration: underline; }

/* WooCommerce ships a second pseudo-element and list styling. */
.woocommerce-error::after,
.woocommerce-info::after,
.woocommerce-message::after { content: none; }

.woocommerce-error li,
.woocommerce-info li,
.woocommerce-message li { list-style: none; margin: 0; padding: 0; }

/* ---- levels ---- */

.woakey-notice--info,
.woocommerce-info {
	background: var(--woakey-notice-info-bg);
	border-color: var(--woakey-notice-info-border);
	color: var(--woakey-notice-info-text);
}
.woakey-notice--info .woakey-notice__icon,
.woocommerce-info::before {
	background: var(--woakey-notice-info-icon);
	content: '\2139';
}

.woakey-notice--warning {
	background: var(--woakey-notice-warning-bg);
	border-color: var(--woakey-notice-warning-border);
	color: var(--woakey-notice-warning-text);
}
.woakey-notice--warning .woakey-notice__icon {
	background: var(--woakey-notice-warning-icon);
}

.woakey-notice--success,
.woocommerce-message {
	background: var(--woakey-notice-success-bg);
	border-color: var(--woakey-notice-success-border);
	color: var(--woakey-notice-success-text);
}
.woakey-notice--success .woakey-notice__icon,
.woocommerce-message::before {
	background: var(--woakey-notice-success-icon);
	content: '\2713';
}

.woakey-notice--danger,
.woocommerce-error {
	background: var(--woakey-notice-danger-bg);
	border-color: var(--woakey-notice-danger-border);
	color: var(--woakey-notice-danger-text);
}
.woakey-notice--danger .woakey-notice__icon,
.woocommerce-error::before {
	background: var(--woakey-notice-danger-icon);
	content: '!';
}

/* =====================================================================
   Login form — "Remember me" alignment (1.2.239)

   The checkbox and its label sit on different baselines: the input is a
   replaced element sized by the UA, the span follows the theme's
   line-height. A 2px lift on the text is the smallest fix that survives
   a font-size change.
   ===================================================================== */

.woocommerce form .form-row label.woocommerce-form-login__rememberme,
.woocommerce-page form .form-row label.woocommerce-form-login__rememberme,
label.woocommerce-form-login__rememberme {
	/* Matched against the theme's own `.woocommerce form .form-row label`
	   shape — a bare class selector loses to it and the margin silently
	   did nothing.

	   display:block, NOT inline-block. The label and the submit button are
	   siblings inside the same .form-row, so an inline label lets the button
	   flow up alongside "Remember me" instead of sitting beneath it. */
	display: block;
	margin-top: 5px;
	margin-bottom: 0;
}

/* Belt and braces on the same problem: keep the submit on its own line even
   if the theme changes the label's display. */
.woocommerce form.login .woocommerce-form-login__submit,
.woocommerce-form-login__submit {
	display: inline-block;
	margin-top: 12px;
	margin-bottom: 30px;
}

.woocommerce-form-login__rememberme span {
	position: relative;
	top: -1px;
}

/* =====================================================================
   WooCommerce form labels — house face (1.2.241)

   WooCommerce labels inherit the theme body face, which leaves the login
   and account forms reading in a different voice from every CRED form on
   the site (those set Montserrat on .woakey-form). Same token, so all
   form furniture moves together.
   ===================================================================== */

.woocommerce form .form-row label,
.woocommerce-page form .form-row label,
.woocommerce form label,
.woocommerce-form-login label,
.woocommerce-form-register label,
.woocommerce-ResetPassword label {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--woakey-dark);
}

.woocommerce form .form-row .required,
.woocommerce-form-login .required { color: var(--woakey-notice-danger-icon); }

/* =====================================================================
   Logged-out My Account — two-column sign-in (1.2.241)

   Consumed by the "Page - My Account" content template's logged-out
   branch. The panel is the form; the aside is brand.

   The aside disappears below 1024px rather than stacking. On a phone the
   priority is the form above the fold, and a stacked hero image pushes
   it down for no benefit — so it is display:none, not reordered.
   ===================================================================== */

.wk-signin {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	align-items: stretch;
	min-height: 520px;
}

.wk-signin__aside {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 40px;
	background-color: var(--woakey-dark);
	background-size: cover;
	background-position: center;
	color: #fff;
	overflow: hidden;
}

/* Same scrim as article headers and cards, so white type stays legible
   over whatever image is set. */
.wk-signin__aside::before {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--woakey-scrim);
}

.wk-signin__aside > * { position: relative; }

.wk-signin__tagline {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 14px;
}

.wk-signin__tagline em {
	font-style: normal;
	color: var(--woakey-gold);
}

.wk-signin__keywords {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wk-signin__keywords li {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 6px 11px;
	border: 1px solid var(--woakey-gold);
	border-radius: var(--woakey-chip-radius);
	color: var(--woakey-gold);
}

.wk-signin__panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 40px;
	background: var(--woakey-panel-bg);
}

.wk-signin__panel .woocommerce { width: 100%; }

/* Woo wraps the login form in its own bordered box; the panel is the box
   now, so the inner border is redundant. */
.wk-signin__panel .woocommerce-form-login {
	border: 0;
	padding: 0;
	margin: 0;
}

.wk-signin__foot,
.woocommerce-LostPassword.lost_password a,
.woocommerce-LostPassword a {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
}

.wk-signin__foot { margin: 18px 0 0; }

.woocommerce-LostPassword.lost_password { margin: 10px 0 0; }

@media (max-width: 1023px) {
	.wk-signin { grid-template-columns: 1fr; min-height: 0; }
	.wk-signin__aside { display: none; }
	/* No aside to sit beside, so the panel tint would just be a stray box
	   the full width of the page. Back to the sheet. */
	.wk-signin__panel { padding: 0; background: none; }
}

/* Woo wraps the login fields in a bordered box of its own. Inside .wk-signin
   the panel already provides the frame, so the inner border is a box in a box.
   (1.2.242) */
.wk-signin__panel .woocommerce-form-login,
.wk-signin__panel form.login {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0;
}

/* Login notices are relocated into the panel by
   includes/security/woakey-login-notice-position.php, so they need spacing
   that works above the "Login" heading rather than above the page. (1.2.249) */
.wk-signin__panel > .woocommerce-error,
.wk-signin__panel > .woocommerce-message,
.wk-signin__panel > .woocommerce-info,
.wk-signin__panel > .woocommerce-notices-wrapper {
	margin: 0 0 18px;
	width: 100%;
}

.wk-signin__panel > .woocommerce-notices-wrapper:empty { display: none; margin: 0; }

/* =====================================================================
   PAGE SHEETS — tokens only (1.2.254)

   1.2.252/253 had this file own the sheets outright:
   `body .wk-home-sheet, body .mag-inner, body .community-hub { … }`,
   setting width, padding, background, radius and shadow.

   Reverted, because the `body` prefix it required was the tell. Toolset
   prints a template's CSS panel inline in <head>, after this stylesheet,
   so owning a template's own selector from here means winning a
   specificity fight against the template on every render. That is the
   plugin and the templates arguing over the same rule.

   The boundary that works is VALUES here, LAYOUT there:
     - a value that must be identical everywhere (brand colour, sheet
       measure, notice red, UI face) is a token in :root above;
     - how one page arranges itself stays in that page's CSS panel,
       written against those tokens.

   Custom properties make this cheap both ways. A template consumes
   `var(--woakey-sheet-pad)` for consistency, and when one page needs to
   differ it redeclares the token in its own scope —
   `.mag { --woakey-sheet-pad: 80px; }` — which resolves at use, so no
   !important and no specificity fight either.

   See docs/CT-CSS-AUDIT.md for the per-template panels.
   ===================================================================== */

/* =====================================================================
   DELETE & TRASH (1.2.257)

   The delete control must not look like Edit. It sits beside it in
   .cpt-header-actions and does something irreversible, so it reads as an
   outline in the danger colour rather than a filled button — present,
   findable, and visibly not the primary action.

   Colours come from the notice tokens rather than new ones: the red that
   means "this went wrong" and the red that means "this destroys
   something" should be the same red, or neither carries weight.
   ===================================================================== */

.woakey-delete { display: inline-block; }

.woakey-delete-btn {
	background: transparent;
	color: var(--woakey-notice-danger-icon);
	border: 1px solid var(--woakey-notice-danger-border);
	font-family: var(--woakey-ui-font), sans-serif;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.woakey-delete-btn:hover,
.woakey-delete-btn:focus-visible {
	background: var(--woakey-notice-danger-icon);
	border-color: var(--woakey-notice-danger-icon);
	color: #fff;
}

/* The confirm button inside the modal IS the destructive action, so it is
   filled — by this point the member has read what it does. */
.woakey-delete-modal .wa-modal-confirm,
.woakey-delete-modal [id$="-confirm"] {
	background: var(--woakey-notice-danger-icon);
	border-color: var(--woakey-notice-danger-icon);
	color: #fff;
}

.woakey-delete-modal .wk-del-typed { margin: 14px 0 0; font-size: 14px; }
.woakey-delete-modal .wk-del-confirm {
	width: 100%;
	margin-top: 6px;
	padding: 8px 10px;
	font-family: var(--woakey-ui-font), sans-serif;
}
.woakey-delete-modal .wk-del-msg {
	margin: 10px 0 0;
	font-size: 13px;
	color: var(--woakey-notice-danger-text);
}

/* ---- status badge ---------------------------------------------------
   Amber, not red. A trashed item is recoverable and on a clock — the
   member's own tidying up, not an error and not a moderator action. */

.cpt-badge-trashed {
	background: var(--woakey-notice-warning-bg);
	border: 1px solid var(--woakey-notice-warning-border);
	color: var(--woakey-notice-warning-text);
}

/* ---- the trash list ------------------------------------------------- */

.woakey-trash-list { display: flex; flex-direction: column; gap: 10px; }

.woakey-trash-row {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	justify-content: space-between;
	padding: 14px 16px;
	background: var(--woakey-sheet-bg);
	border: 1px solid #e6e2d8;
	border-radius: var(--woakey-notice-radius);
}

.woakey-trash-main { flex: 1; min-width: 0; }

.woakey-trash-type {
	display: inline-block;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--woakey-gold);
	margin-right: 8px;
}

.woakey-trash-title {
	color: var(--woakey-dark);
	font-weight: 700;
	text-decoration: none;
}
.woakey-trash-title:hover,
.woakey-trash-title:focus-visible {
	color: var(--woakey-gold);
	text-decoration: underline;
}

.woakey-trash-meta {
	margin-top: 4px;
	font-size: 13px;
	color: #707070;
}

.woakey-trash-held {
	color: var(--woakey-notice-warning-text);
	font-weight: 600;
}

/* Moderator removals carry the reason. Amber rather than red: it is an
   instruction to fix something, not a dead end. */
.woakey-trash-reason {
	margin-top: 10px;
	padding: 10px 12px;
	background: var(--woakey-notice-warning-bg);
	border: 1px solid var(--woakey-notice-warning-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-warning-text);
	font-size: 13.5px;
}
.woakey-trash-reason p { margin: 6px 0 0; }

.woakey-trash-actions {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 0 0 auto;
}

.woakey-trash-actions button {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	padding: 6px 12px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.woakey-trash-actions button:hover { background: var(--woakey-dark); color: #fff; }

.woakey-trash-purge {
	border-color: var(--woakey-notice-danger-border) !important;
	color: var(--woakey-notice-danger-icon) !important;
}
.woakey-trash-purge:hover {
	background: var(--woakey-notice-danger-icon) !important;
	border-color: var(--woakey-notice-danger-icon) !important;
	color: #fff !important;
}

@media (max-width: 767px) {
	.woakey-trash-row { flex-direction: column; }
	.woakey-trash-actions { flex-direction: row; width: 100%; }
}

/* =====================================================================
   ACCOUNT DELETION (1.2.266)

   Danger colours from the notice tokens, not new ones. Deliberately plain:
   this screen should feel considered rather than alarming — the member has
   made a decision and needs to understand it, not be shouted at.
   ===================================================================== */

.wk-account-delete { max-width: 620px; }

.wk-account-delete h3 {
	font-family: var(--woakey-ui-font), sans-serif;
	margin: 0 0 10px;
}

.wk-account-delete-facts {
	margin: 16px 0;
	padding: 14px 16px 14px 32px;
	background: var(--woakey-notice-warning-bg);
	border: 1px solid var(--woakey-notice-warning-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-warning-text);
	font-size: 14px;
}
.wk-account-delete-facts li { margin: 0 0 8px; }
.wk-account-delete-facts li:last-child { margin-bottom: 0; }

.wk-account-delete label {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--woakey-dark);
}

.wk-account-delete input[type="password"],
.wk-account-delete input[type="text"] {
	width: 100%;
	max-width: 320px;
	margin-top: 6px;
	padding: 9px 11px;
	font-family: var(--woakey-ui-font), sans-serif;
}

.wk-account-delete button {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
	border: 1px solid var(--woakey-dark);
	background: transparent;
	color: var(--woakey-dark);
}
.wk-account-delete button:hover { background: var(--woakey-dark); color: #fff; }

/* Only the final, irreversible action is filled red. The step before it is
   still a step, not a decision. */
.wk-account-go {
	background: var(--woakey-notice-danger-icon) !important;
	border-color: var(--woakey-notice-danger-icon) !important;
	color: #fff !important;
}

/* Keeping the account is the safe path, so it gets the affirmative colour. */
.wk-account-keep {
	background: var(--woakey-gold) !important;
	border-color: var(--woakey-gold) !important;
	color: var(--woakey-dark) !important;
	font-weight: 700;
}

.wk-account-msg {
	margin-top: 12px;
	font-size: 14px;
	color: var(--woakey-notice-danger-text);
	min-height: 1.2em;
}

/* =====================================================================
   TRASH — selection and bulk actions (1.2.274)

   Reuses the notifications list's classes (.wa-notif-select,
   .wa-notif-selected-bar, .selection-hidden) so both lists look and
   behave identically. Only what is specific to trash is defined here;
   anything shared is already styled by the notifications CSS.
   ===================================================================== */

.wa-trash-wrap { display: block; }

.wa-trash-bulk-actions { margin-bottom: 10px; }

.wa-trash-selected-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	padding: 10px 14px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	color: var(--woakey-notice-info-text);
}

.wa-trash-selected-count { font-weight: 700; margin-right: 4px; }

.wa-trash-selected-bar button {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	padding: 6px 12px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wa-trash-selected-bar button:hover { background: var(--woakey-dark); color: #fff; }

/* Only the irreversible bulk action wears the danger colour. */
.wa-trash-sel-purge {
	border-color: var(--woakey-notice-danger-border) !important;
	color: var(--woakey-notice-danger-icon) !important;
}
.wa-trash-sel-purge:hover {
	background: var(--woakey-notice-danger-icon) !important;
	border-color: var(--woakey-notice-danger-icon) !important;
	color: #fff !important;
}

.wa-trash-bulk-status {
	margin-left: auto;
	font-size: 13px;
	color: #707070;
	min-height: 1.2em;
}

/* ---- the row checkbox ---- */

.woakey-trash-row .wa-notif-select,
.wa-trash-select-placeholder {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	margin-top: 2px;
}

.woakey-trash-row .wa-notif-select {
	border: 2px solid #c9c4b8;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
	padding: 0;
	position: relative;
}

.woakey-trash-row.is-selected .wa-notif-select {
	background: var(--woakey-gold);
	border-color: var(--woakey-gold);
}

.woakey-trash-row.is-selected .wa-notif-select::after {
	content: '\2713';
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 700;
	color: var(--woakey-dark);
}

.woakey-trash-row.is-selected {
	border-color: var(--woakey-gold);
	background: #fffdf7;
}

/* A held item cannot be restored or purged, so it is not selectable — the
   placeholder keeps the rows aligned rather than letting the text shift left. */
.woakey-trash-row.is-locked { opacity: .85; }

/* ---- trash: load more (1.2.275) ---- */

.wa-trash-more {
	margin: 16px 0 0;
	text-align: center;
}

.wa-trash-load-more {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 20px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wa-trash-load-more:hover { background: var(--woakey-dark); color: #fff; }
.wa-trash-load-more[disabled] { opacity: .6; cursor: default; }

.wa-trash-more-note {
	margin: 8px 0 0;
	font-size: 13px;
	color: #707070;
}

/* =====================================================================
   INITIATIVE PARTICIPATION (1.2.280)
   ===================================================================== */

.wk-init-join,
.wk-init-requests,
.wk-init-members,
.wk-init-comments {
	margin: 20px 0;
	font-family: var(--woakey-ui-font), sans-serif;
}

.wk-init-join { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.wk-init-state { font-size: 14px; color: var(--woakey-dark); }

.wk-init-join button,
.wk-init-row-actions button {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	padding: 7px 14px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-init-join button:hover,
.wk-init-row-actions button:hover { background: var(--woakey-dark); color: #fff; }

.wk-init-join-btn {
	background: var(--woakey-gold) !important;
	border-color: var(--woakey-gold) !important;
	color: var(--woakey-dark) !important;
	font-weight: 700;
}

/* Removal is the only irreversible control here, so it is the only red one. */
.wk-init-remove,
.wk-init-decline {
	border-color: var(--woakey-notice-danger-border) !important;
	color: var(--woakey-notice-danger-icon) !important;
}
.wk-init-remove:hover,
.wk-init-decline:hover {
	background: var(--woakey-notice-danger-icon) !important;
	border-color: var(--woakey-notice-danger-icon) !important;
	color: #fff !important;
}

/* Pending requests read as something needing attention, not as an error. */
.wk-init-requests {
	padding: 14px 16px;
	background: var(--woakey-notice-warning-bg);
	border: 1px solid var(--woakey-notice-warning-border);
	border-radius: var(--woakey-notice-radius);
}
.wk-init-requests h3 { margin: 0 0 10px; font-size: 15px; }

.wk-init-request-row,
.wk-init-member-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #e6e2d8;
}
.wk-init-member-row:last-child,
.wk-init-request-row:last-child { border-bottom: 0; }

.wk-init-name { font-weight: 600; color: var(--woakey-dark); }
.wk-init-when { font-size: 13px; color: #707070; }

.wk-init-role {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	padding: 3px 9px;
	border: 1px solid var(--woakey-gold);
	border-radius: var(--woakey-chip-radius);
	color: var(--woakey-gold);
}
.wk-init-member-row.is-owner .wk-init-role {
	background: var(--woakey-gold);
	color: var(--woakey-dark);
}

.wk-init-grant { font-size: 13px; color: #555; }

/* An organizer's permissions are stated, not offered as a checkbox: anyone
   who can edit this list can also re-grant themselves, so a control there
   would enforce nothing. */
.wk-init-grant.is-implicit {
	font-style: italic;
	color: #8a8a8a;
}

.wk-init-row-actions { margin-left: auto; display: flex; gap: 6px; }

.wk-init-msg { margin: 10px 0 0; font-size: 13px; color: #707070; min-height: 1.2em; }

.wk-init-readonly {
	padding: 10px 14px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-info-text);
	font-size: 14px;
}

@media (max-width: 767px) {
	.wk-init-row-actions { margin-left: 0; width: 100%; }
}

/* ---- 2FA page during a pending deletion (1.2.282) ---- */

.wk-2fa-deletion { margin: 0 0 20px; }

.wk-2fa-deletion-out {
	margin: 10px 0 0;
	font-size: 14px;
	font-family: var(--woakey-ui-font), sans-serif;
	color: #707070;
}
.wk-2fa-deletion-out a { color: var(--woakey-gold); }

/* ---- initiative: add a co-organizer (1.2.283) ---- */

.wk-init-add-coorg {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #e6e2d8;
	font-size: 14px;
}
.wk-init-add-coorg label { font-weight: 600; color: var(--woakey-dark); }
.wk-init-coorg-pick {
	margin-top: 6px;
	padding: 7px 10px;
	font-family: var(--woakey-ui-font), sans-serif;
	max-width: 320px;
}
.wk-init-coorg-add {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	padding: 7px 14px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-init-coorg-add:hover { background: var(--woakey-dark); color: #fff; }
.wk-init-hint { font-size: 13px; color: #707070; margin: 0; }

/* ---- initiative: policies and updates (1.2.285) ---- */

.wk-init-policies {
	margin: 20px 0;
	padding: 14px 18px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-info-text);
	font-family: var(--woakey-ui-font), sans-serif;
}
.wk-init-policies h3 { margin: 0 0 10px; font-size: 15px; }
.wk-init-policies dl { margin: 0; display: grid; grid-template-columns: 150px 1fr; gap: 6px 14px; }
.wk-init-policies dt { font-weight: 700; font-size: 13px; }
.wk-init-policies dd { margin: 0; font-size: 14px; }
.wk-init-policies-edit { margin: 12px 0 0; font-size: 13px; font-style: italic; }

@media (max-width: 600px) {
	.wk-init-policies dl { grid-template-columns: 1fr; gap: 2px; }
	.wk-init-policies dd { margin-bottom: 8px; }
}

.wk-init-updates { margin: 24px 0; }
.wk-init-updates h3 { font-family: var(--woakey-ui-font), sans-serif; }

.wk-init-post-update {
	display: inline-block;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	font-weight: 700;
	padding: 9px 18px;
	background: var(--woakey-gold);
	color: var(--woakey-dark);
	text-decoration: none;
}
.wk-init-post-update:hover { background: var(--woakey-dark); color: #fff; }

.wk-init-update {
	padding: 16px 0;
	border-bottom: 1px solid #e6e2d8;
}
.wk-init-update:last-child { border-bottom: 0; }
.wk-init-update h4 { margin: 0 0 6px; font-family: var(--woakey-ui-font), sans-serif; }
.wk-init-update-meta { font-size: 13px; color: #707070; margin-bottom: 10px; }
.wk-init-update-body { font-size: 15px; }

/* ---- post updates (1.2.286) ---- */

.wk-updates { margin: 24px 0; }
.wk-updates h3 { font-family: var(--woakey-ui-font), sans-serif; }

.wk-update-new {
	display: inline-block;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	font-weight: 700;
	padding: 9px 18px;
	background: var(--woakey-gold);
	color: var(--woakey-dark);
	text-decoration: none;
}
.wk-update-new:hover { background: var(--woakey-dark); color: #fff; }

.wk-update { padding: 16px 0; border-bottom: 1px solid #e6e2d8; }
.wk-update:last-child { border-bottom: 0; }
.wk-update-meta { font-size: 13px; color: #707070; margin-bottom: 10px; }
.wk-update-body { font-size: 15px; }

/* ---- initiative invitations (1.2.294) ---- */

.wk-init-invitation { margin: 20px 0; }
.wk-init-invitation-actions { margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }

.wk-init-invite-accept {
	background: var(--woakey-gold) !important;
	border-color: var(--woakey-gold) !important;
	color: var(--woakey-dark) !important;
	font-weight: 700;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
	border: 1px solid;
}
.wk-init-invite-decline {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-init-invite-decline:hover { background: var(--woakey-dark); color: #fff; }

.wk-init-request-row.is-invite { opacity: .85; }

.wk-init-invite-role {
	font-family: var(--woakey-ui-font), sans-serif;
	padding: 7px 10px;
}

/* ---- "Post an update" trigger (1.2.295) ---- */

button.wk-update-new {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	font-weight: 700;
	padding: 9px 18px;
	background: var(--woakey-gold);
	color: var(--woakey-dark);
	border: 1px solid var(--woakey-gold);
	cursor: pointer;
}
button.wk-update-new:hover { background: var(--woakey-dark); border-color: var(--woakey-dark); color: #fff; }

/* ---- email preference pill + update actions (1.2.297) ---- */

.wk-email-pref {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 7px 14px;
	border: 1px solid #d8d3c7;
	border-radius: var(--woakey-chip-radius);
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	background: var(--woakey-sheet-bg);
}

.wk-email-pref-dot {
	width: 9px; height: 9px; border-radius: 50%;
	background: #c9c4b8;
}
.wk-email-pref.is-on .wk-email-pref-dot { background: #3f8f5c; }

.wk-email-pref-toggle {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 12px;
	padding: 4px 10px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
	border-radius: var(--woakey-chip-radius);
}
.wk-email-pref-toggle:hover { background: var(--woakey-dark); color: #fff; }

.wk-update-actions { margin-top: 10px; display: flex; gap: 8px; }
.wk-update-actions button { font-size: 13px; }

/* ---- succession choice in the deletion flow (1.2.303) ---- */

.wk-account-succession {
	margin: 16px 0;
	padding: 14px 16px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-info-text);
	font-size: 14px;
}
.wk-account-succession select {
	width: 100%;
	margin-top: 6px;
	padding: 8px 10px;
	font-family: var(--woakey-ui-font), sans-serif;
}
.wk-account-hint { margin: 8px 0 0; font-size: 13px; font-style: italic; }

/* ---- succession offer (1.2.304) ---- */

.wk-succession-offer { margin: 20px 0; }
.wk-succession-actions { margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }

.wk-succession-accept {
	background: var(--woakey-gold);
	border: 1px solid var(--woakey-gold);
	color: var(--woakey-dark);
	font-weight: 700;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
}
.wk-succession-decline {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-succession-decline:hover { background: var(--woakey-dark); color: #fff; }

/* A closed initiative should read as finished, not broken. */
.wk-init-closed {
	padding: 12px 16px;
	background: #f2f0ea;
	border: 1px solid #d8d3c7;
	border-radius: var(--woakey-notice-radius);
	color: #5a5a5a;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
}

/* ---- a departed profile (1.2.305) ---- */

.woakey-gone {
	color: #8a8a8a;
	font-style: italic;
	font-weight: 600;
	cursor: default;
}

/* ---- appeals (1.2.318) ---- */

.wk-appeal {
	margin: 20px 0;
	padding: 16px 18px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	font-family: var(--woakey-ui-font), sans-serif;
}
.wk-appeal h4 { margin: 0 0 6px; font-size: 15px; }
.wk-appeal p { font-size: 14px; margin: 0 0 10px; }
.wk-appeal-text { width: 100%; padding: 9px 11px; font-family: var(--woakey-ui-font), sans-serif; }

.wk-appeal-send {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	padding: 9px 16px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-appeal-send:hover { background: var(--woakey-dark); color: #fff; }
.wk-appeal-msg { font-size: 13px; color: #707070; min-height: 1.2em; }

/* ---- a member's own sanctions (1.2.319) ---- */

.wk-sanctions { margin: 20px 0; font-family: var(--woakey-ui-font), sans-serif; }
.wk-sanctions > h3 { margin: 0 0 6px; }
.wk-sanctions > p { font-size: 14px; color: #555; }

.wk-sanction {
	margin: 14px 0;
	padding: 16px 18px;
	background: var(--woakey-notice-warning-bg);
	border: 1px solid var(--woakey-notice-warning-border);
	border-radius: var(--woakey-notice-radius);
}
.wk-sanction h4 { margin: 0 0 4px; font-size: 15px; }
.wk-sanction-what { margin: 0; font-size: 14px; color: var(--woakey-notice-warning-text); }
.wk-sanction-note {
	margin: 10px 0 0;
	padding: 8px 12px;
	border-left: 3px solid var(--woakey-notice-warning-border);
	font-size: 14px;
	font-style: italic;
}
/* The appeal box sits inside a warning panel, so drop its own frame. */
.wk-sanction .wk-appeal { background: transparent; border: 0; padding: 12px 0 0; }

/* =====================================================================
   TABS (1.2.320) — the shared component

   Lifted from the Home page's Community Insights CT, where it lived as
   page-local CSS. Every other tabbed thing on the site was inventing its
   own, so a change to "how tabs look" meant finding all of them.

   The hover was the missing state: an inactive tab gave no feedback at
   all, so nothing told you a tab was a control until you clicked it.
   ===================================================================== */

.wk-tabs-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	border-bottom: 1px solid var(--woakey-rule);
	margin: 0;
	padding: 0;
}

/* Toolset's wpautop injects stray <p> between structural children. */
.wk-tabs-nav > p,
.wk-tabs-panels > p { display: none; }

.wk-tabs-tab {
	appearance: none;
	background: transparent;
	border: 1px solid transparent;
	border-bottom: 0;
	padding: 14px 22px;
	margin: 0;
	font: inherit;
	font-family: var(--woakey-ui-font), sans-serif;
	font-weight: 600;
	color: var(--woakey-dark);
	cursor: pointer;
	line-height: 1.2;
	border-radius: 0;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}

/* Hover: a filled, bordered shape, so the tab reads as a control before
   it is clicked. Light enough that it is clearly not the active state. */
.wk-tabs-tab:hover {
	background: var(--woakey-tab-hover-bg);
	border-color: var(--woakey-tab-hover-border);
	color: var(--woakey-gold);
}

.wk-tabs-tab.is-active {
	color: var(--woakey-gold);
	border-color: var(--woakey-rule);
	background: #fff;
	margin-bottom: -1px;
	padding-bottom: 15px;
}

/* Active beats hover: without this, hovering the current tab greys it and
   makes it look like it has been deselected. */
.wk-tabs-tab.is-active:hover {
	background: #fff;
	border-color: var(--woakey-rule);
}

.wk-tabs-tab:focus-visible {
	outline: 2px dotted var(--woakey-gold);
	outline-offset: -4px;
}

.wk-tabs-panels {
	border: 1px solid var(--woakey-rule);
	border-top: 0;
	padding: 20px;
}

.wk-tabs-panel[hidden] { display: none; }

/* A count beside a tab label, for queues. */
.wk-tabs-count {
	display: inline-block;
	margin-left: 7px;
	padding: 1px 7px;
	border-radius: 10px;
	background: var(--woakey-gold);
	color: var(--woakey-dark);
	font-size: 11px;
	font-weight: 700;
}

@media (max-width: 767px) {
	.wk-tabs-nav { flex-direction: column; border-bottom: 0; }
	.wk-tabs-tab { border: 1px solid var(--woakey-rule); border-bottom: 0; text-align: left; }
	.wk-tabs-tab:last-child { border-bottom: 1px solid var(--woakey-rule); }
	.wk-tabs-tab.is-active { margin-bottom: 0; padding-bottom: 14px; }
	.wk-tabs-panels { border-top: 1px solid var(--woakey-rule); padding: 16px 12px; }
}

/* ---- account tables inside tabs (1.2.320) ---- */

.wk-acc-table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
}
.wk-acc-table th {
	text-align: left;
	padding: 8px 10px;
	border-bottom: 2px solid var(--woakey-rule);
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #707070;
}
.wk-acc-table td {
	padding: 10px;
	border-bottom: 1px solid var(--woakey-rule);
	vertical-align: top;
}

/* ---- Ownership tabs (1.2.321, folded into .wk-acc in 1.2.322) ---- */

.wk-acc-soon {
	padding: 10px 14px;
	background: var(--woakey-notice-info-bg);
	border: 1px solid var(--woakey-notice-info-border);
	border-radius: var(--woakey-notice-radius);
	color: var(--woakey-notice-info-text);
	font-size: 14px;
}
.wk-tabs-panels h3 {
	font-family: var(--woakey-ui-font), sans-serif;
	margin: 0 0 8px;
}

/* =====================================================================
   ACCOUNT AREA (1.2.322) — one visual system for every tab

   The tabs had three systems between them:
   · Ownership and Extra Security: an inline
     `font-size:16px; color:#e09d27; font-style:0px` on a <p> used as a
     heading. `font-style: 0px` is not valid CSS — it has been silently
     doing nothing on both.
   · Moderation: real headings, but h2/h6/h5 with h6 ABOVE h5, plus its
     own tab implementation.
   · Everything else: no structure at all.

   A <p> styled to look like a heading is also invisible to a screen
   reader's outline, so the fix is structural rather than only visual.

   The scale below is deliberately short. Two heading levels inside a tab
   is enough for anything here, and offering six is how you end up with
   h6 above h5.
   ===================================================================== */

/* The section wrapper every tab's content sits in. */
.wk-acc { font-family: var(--woakey-ui-font), sans-serif; }

/* Tab title — the thing the old inline style was trying to be. */
.wk-acc h2,
.wk-acc-title {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--woakey-dark);
	margin: 0 0 6px;
	padding: 0;
}

/* Section within a tab. */
.wk-acc h3,
.wk-acc-section-title {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: var(--woakey-gold);
	margin: 26px 0 8px;
	padding: 0;
}
.wk-acc h3:first-child,
.wk-acc-section-title:first-child { margin-top: 0; }

/* The explanatory line under a title. Every tab needs one and none had a
   consistent style for it. */
/* No max-width. 60ch is the right measure for a page of prose, but these are
   one- and two-line explanations inside a panel — capping them wrapped a
   sentence in half while the panel beside it sat empty. */
.wk-acc-lede {
	font-size: 14px;
	line-height: 1.55;
	color: #707070;
	margin: 0 0 18px;
}

.wk-acc p { font-size: 15px; line-height: 1.6; }

/* ---- form controls, one size everywhere ----
   Inputs were inheriting from WooCommerce, Toolset and Astra depending on
   which tab you were on, so the same field was three heights. */

.wk-acc input[type="text"],
.wk-acc input[type="email"],
.wk-acc input[type="password"],
.wk-acc input[type="search"],
.wk-acc input[type="url"],
.wk-acc input[type="tel"],
.wk-acc select,
.wk-acc textarea {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 15px;
	line-height: 1.4;
	padding: 10px 12px;
	border: 1px solid #d8d3c7;
	border-radius: 3px;
	background: #fff;
	color: var(--woakey-dark);
	width: 100%;
	max-width: 420px;
	box-sizing: border-box;
}

/* A select needs a stated height.
   Astra and WooCommerce both set one, and whichever wins is usually shorter
   than the padding above needs — the text then clips at the bottom, which is
   what "Active (recommended)" was doing. height:auto lets the padding decide,
   and the min-height keeps a single-line select from being shorter than the
   text inputs beside it. */
.wk-acc select {
	height: auto;
	min-height: 45px;
	line-height: 1.4;
	appearance: auto;
	padding-right: 32px;   /* room for the native arrow */
}

.wk-acc textarea { max-width: 100%; min-height: 96px; }

.wk-acc input:focus,
.wk-acc select:focus,
.wk-acc textarea:focus {
	border-color: var(--woakey-gold);
	outline: 2px solid rgba(var(--woakey-gold-rgb), .25);
	outline-offset: 0;
}

.wk-acc label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--woakey-dark);
	margin-bottom: 5px;
}

/* A checkbox label must NOT be a block, or the box and its text stack. */
.wk-acc label.wk-acc-inline,
.wk-acc .wk-acc-checkbox label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 400;
}

.wk-acc .form-group,
.wk-acc-field { margin-bottom: 18px; }

.wk-acc-help {
	display: block;
	font-size: 13px;
	color: #8a8a8a;
	margin-top: 4px;
}

/* ---- a divider between sections ---- */
.wk-acc-rule {
	margin: 26px 0;
	border: 0;
	border-top: 1px solid var(--woakey-rule);
}

@media (max-width: 767px) {
	.wk-acc h2, .wk-acc-title { font-size: 18px; }
	.wk-acc input[type="text"],
	.wk-acc input[type="email"],
	.wk-acc input[type="password"],
	.wk-acc select { max-width: 100%; }
}

/* ---- CT-authored account tabs (1.2.322) ----
   Ownership and Extra Security style a <p> as a heading with an inline
   `font-size:16px; color:#e09d27; font-style:0px`. The last of those is not
   valid CSS and has been doing nothing on both tabs.

   These rules let those templates drop the inline style and use
   .wk-acc-section-title instead. Kept as a named class rather than styling
   bare <p> inside .wk-acc, because a paragraph should not become a heading by
   virtue of where it sits. */

.wk-acc .ownership_subsections,
.wk-acc .security_subsections { margin: 0; }

/* Bridge, so the existing markup looks right before the CTs are edited. */
.ownership_subsections > p[style],
.security_subsections > p[style] {
	font-family: var(--woakey-ui-font), sans-serif !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--woakey-gold) !important;
	font-style: normal !important;
	margin: 26px 0 8px !important;
}
.ownership_subsections > p[style]:first-child,
.security_subsections > p[style]:first-child { margin-top: 0 !important; }

/* ---- Wordfence 2FA inside our tab (1.2.324) ----
   Wordfence ships its own styling, built for a full-width admin page. Inside a
   tab panel it overflows and its buttons do not match anything around them.
   Constrained and re-skinned rather than replaced, so Wordfence's own updates
   keep working. */

.wk-acc .wf-2fa-container,
.wk-acc .wfls-container,
.wk-acc [class*="wfls-"] { max-width: 100%; box-sizing: border-box; }

.wk-acc .wfls-block,
.wk-acc .wf-2fa-block {
	border: 1px solid var(--woakey-rule);
	border-radius: 3px;
	padding: 16px;
	background: #fff;
}

.wk-acc [class*="wfls-"] input[type="text"],
.wk-acc [class*="wfls-"] input[type="password"] {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 15px;
	padding: 10px 12px;
	max-width: 320px;
}

/* The QR code should not stretch to the panel width. */
.wk-acc [class*="wfls-"] img { max-width: 220px; height: auto; }

/* ---- moderator action panel (1.2.329) ---- */

.wk-mod-actions {
	margin-top: 10px;
	padding: 8px 10px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 3px;
	font-size: 13px;
}
.wk-mod-actions summary { cursor: pointer; font-weight: 600; }
.wk-mod-history { margin: 8px 0; font-size: 12px; color: #555; }
.wk-mod-act-form p { margin: 8px 0; }

/* ---- moderator action hints (1.2.330) ---- */

.wk-mod-hint {
	margin: 6px 0;
	padding: 8px 10px;
	background: #fcf9e8;
	border-left: 3px solid #dba617;
	font-size: 12px;
	line-height: 1.5;
	color: #5a4a00;
}

.wk-mod-close { font-size: 12px; display: inline-flex; align-items: center; gap: 6px; }

/* ---- moderation panel details (1.2.337) ---- */

.wk-mod-cap { display: block; font-size: 12px; margin: 3px 0; }
.wk-mod-caps { margin: 6px 0; padding: 8px 10px; background: #fff; border: 1px solid #dcdcde; }
.wk-mod-log-wrap { margin: 8px 0; font-size: 12px; }
.wk-mod-log { margin: 8px 0 0 16px; list-style: disc; }
.wk-mod-log li { margin-bottom: 8px; }
.wk-mod-log-detail { color: #555; }
.wk-mod-log-note { color: #777; }
.wk-report-status { display: block; font-size: 13px; margin: 2px 0; }

/* ---- update subscriptions (1.2.339) ---- */

.wk-sub-pill {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	flex-wrap: wrap;
	padding: 7px 14px;
	border: 1px solid #d8d3c7;
	border-radius: var(--woakey-chip-radius);
	background: var(--woakey-sheet-bg);
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 13px;
	margin: 12px 0;
}
.wk-sub-dot { width: 9px; height: 9px; border-radius: 50%; background: #c9c4b8; }
.wk-sub-pill.is-on .wk-sub-dot { background: #3f8f5c; }

.wk-sub-btn,
.wk-sub-reset {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 12px;
	padding: 4px 10px;
	cursor: pointer;
	background: transparent;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
	border-radius: var(--woakey-chip-radius);
}
.wk-sub-btn:hover, .wk-sub-reset:hover { background: var(--woakey-dark); color: #fff; }
.wk-sub-reset { border-style: dashed; }
.wk-sub-msg { font-size: 12px; color: #707070; }

.wk-subs-bulk {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	padding: 10px 14px;
	margin-bottom: 12px;
	background: var(--woakey-sheet-bg);
	border: 1px solid var(--woakey-rule);
	font-size: 13px;
}
.wk-subs-bulk-btn {
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 12px;
	padding: 5px 11px;
	cursor: pointer;
	background: #fff;
	border: 1px solid var(--woakey-dark);
	color: var(--woakey-dark);
}
.wk-subs-bulk-btn:hover { background: var(--woakey-dark); color: #fff; }
.wk-subs .wk-subs-state { max-width: 220px; }

.wk-subs-profile {
	font-size: 12px;
	padding: 2px 8px;
	border-radius: var(--woakey-chip-radius);
	background: var(--woakey-sheet-bg);
	border: 1px solid var(--woakey-rule);
	white-space: nowrap;
}

/* ---- capability picker (1.2.342) ---- */

.wk-mod-caps {
	margin: 8px 0;
	padding: 10px 12px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 3px;
	transition: opacity .15s ease;
}
/* Idle rather than hidden: a JS failure leaves it readable, not absent. */
.wk-mod-caps.is-idle { opacity: .45; }

.wk-mod-caps-title { margin: 0 0 6px; font-size: 12px; font-weight: 600; color: #555; }
.wk-mod-caps-note  { margin: 8px 0 0; font-size: 11px; color: #888; }
.wk-mod-cap        { display: block; font-size: 12px; margin: 4px 0; }
.wk-mod-cap-on     { color: #996800; font-size: 11px; }

/* ---- stuck on the 2FA page (1.2.345) ---- */

.wk-2fa-stuck {
	margin: 0 0 16px;
	padding: 10px 14px;
	background: var(--woakey-sheet-bg);
	border: 1px solid var(--woakey-rule);
	border-radius: var(--woakey-notice-radius);
	font-family: var(--woakey-ui-font), sans-serif;
	font-size: 14px;
	color: #5a5a5a;
}
.wk-2fa-stuck a { text-decoration: underline; }