/* ==========================================================================
   RIQ brand tokens — layered AFTER mx-theme/assets/css/tokens.css.
   Only brand-carrying tokens change; surfaces, text, meaning colours
   (compliant/non-compliant) and typography stay the MX system.

   Palette (from the RaqabaIQ theme options):
     navy  #0F294C  pressed #0C1F3A   — primary in LIGHT mode, white on it
     gold  #B88645  pressed #A3733A   — accent; primary in DARK mode
   ========================================================================== */

/* Dark mode (and :root default): navy is invisible on the dark surfaces,
   so gold carries the brand. On-brand text stays ink. */
:root,
[data-theme="dark"] {
	--mx-brand: #B88645;
	--mx-brand-pressed: #A3733A;
	--mx-brand-text: #D4A96A;   /* readable gold on dark surfaces (AA on #0D0D0F) */
	--mx-link: #D4A96A;
	--mx-nav-active: #D4A96A;
	--mx-on-brand: #111113;
}

/* Light mode (RIQ default for everyone): navy primary, white on it,
   gold reserved for hover/active accents. */
[data-theme="light"] {
	--mx-brand: #0F294C;
	--mx-brand-pressed: #0C1F3A;
	--mx-brand-text: #0F294C;
	--mx-link: #0F294C;
	--mx-nav-active: #B88645;
	--mx-on-brand: #FFFFFF;
}

/* Header logo: two variants, one visible per mode. */
.mx-brand-logo img { display: none; height: 40px; width: auto; }
[data-theme="light"] .mx-brand-logo__light,
:root:not([data-theme="dark"]) .mx-brand-logo__light { display: inline-block; }
[data-theme="dark"] .mx-brand-logo__dark { display: inline-block; }
[data-theme="dark"] .mx-brand-logo__light { display: none; }

/* Gold hover on the light header/rail links (mirrors the RIQ header spec). */
[data-theme="light"] .mx-brand-riq .mx-nav a:hover,
[data-theme="light"] .mx-brand-riq .mx-rail a:hover {
	color: #B88645;
}

/* Login page (theme prints its own --mxl-* set; light layout by design). */
body.login.mx-brand-riq {
	--mxl-brand: #0F294C;
	--mxl-brand-press: #0C1F3A;
	--mxl-brand-text: #0F294C;
}
body.login.mx-brand-riq .wp-core-ui .button-primary,
body.login.mx-brand-riq .wp-core-ui .button-primary:hover,
body.login.mx-brand-riq .wp-core-ui .button-primary:focus,
body.login.mx-brand-riq .wp-core-ui .button-primary:active {
	color: #FFFFFF !important;
}