/*
 * scbt-rebrand.css — site-wide brand colour override.
 * Part of plg_system_scbtbrand.
 *
 * Replaces the template preset's orange-red #ec430f with the plugin's brand
 * colour, and the #044cd0 link-hover blue with the hover colour.
 *
 * ---------------------------------------------------------------------------
 * WHY THIS FILE IS SHORT AND COMPLETE
 *
 * The whole brand-colour surface of this template lives in ONE generated file,
 * templates/shaper_helixultimate/css/presets/preset2.css — 169 lines holding
 * 25 occurrences of #ec430f, one rgba(236,67,15,.1) and 4 of #044cd0.
 * css/template.css contains the brand colour ZERO times: it is geometry only.
 *
 * So every rule below is a deliberate restatement of a rule in preset2.css,
 * using the identical selector. Equal specificity plus later source order wins
 * — no !important anywhere in this file. Grouped and ordered to match
 * preset2.css so the two can be diffed side by side.
 *
 * That file is regenerated from scss/ at runtime whenever a colour param or
 * the cache changes, which is exactly why the override lives here and not
 * there.
 *
 * NOT COVERED: SP Page Builder content. SPPB stores per-addon colours in each
 * page's own JSON in the database and emits them as inline styles, which beat
 * any stylesheet. Buttons, headings and sections where the orange was picked
 * in the builder must be changed page by page in SP Page Builder.
 * ---------------------------------------------------------------------------
 */

/* --- preloader (preset2.css:11) ------------------------------------------ */
.sp-preloader > div {
	background: var(--scbt-brand, #E6007E);
}

/* --- links (preset2.css:26, :29) ----------------------------------------- */
a {
	color: var(--scbt-brand, #E6007E);
}

a:hover,
a:focus,
a:active {
	color: var(--scbt-brand-hover, #B3005F);
}

/* --- tags (preset2.css:36, :40) ------------------------------------------ */
.tags > li a {
	background: var(--scbt-brand-wash, rgba(230, 0, 126, .1));
	color: var(--scbt-brand, #E6007E);
}

.tags > li a:hover {
	background: var(--scbt-brand-hover, #B3005F);
}

/* --- article social share (preset2.css:47) ------------------------------- */
.article-social-share .social-share-icon ul li a:hover,
.article-social-share .social-share-icon ul li a:focus {
	background: var(--scbt-brand, #E6007E);
}

/* --- reading progress bar (preset2.css:53) ------------------------------- */
.sp-reading-progress-bar {
	background-color: var(--scbt-brand, #E6007E);
}

/* --- main menu (preset2.css:59, :62) -------------------------------------
   Kept so the menu is still on-brand when the pill sheet is switched off.
   When it is on, its #sp-menu rules have higher specificity and take over. */
.sp-megamenu-parent > li:hover > a {
	color: var(--scbt-brand, #E6007E);
}

.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.active:hover > a {
	color: var(--scbt-brand, #E6007E);
}

/* --- dropdown items (preset2.css:71, :74) -------------------------------- */
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover {
	color: var(--scbt-brand, #E6007E);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
	color: var(--scbt-brand, #E6007E);
}

/* --- offcanvas toggler and drawer (preset2.css:83, :92) ------------------
   This is the mobile menu: a separate DOM subtree with its own class
   vocabulary, so the pill sheet never reaches it. */
#offcanvas-toggler > .fa:hover,
#offcanvas-toggler > .fa:focus,
#offcanvas-toggler > .fa:active {
	color: var(--scbt-brand, #E6007E);
}

.offcanvas-menu .offcanvas-inner .sp-module ul > li a:hover,
.offcanvas-menu .offcanvas-inner .sp-module ul > li span:hover,
.offcanvas-menu .offcanvas-inner .sp-module ul > li a:focus,
.offcanvas-menu .offcanvas-inner .sp-module ul > li span:focus {
	color: var(--scbt-brand, #E6007E);
}

/* --- buttons (preset2.css:103, :107) ------------------------------------- */
.btn-primary,
.sppb-btn-primary {
	border-color: var(--scbt-brand, #E6007E);
	background-color: var(--scbt-brand, #E6007E);
}

.btn-primary:hover,
.sppb-btn-primary:hover {
	border-color: var(--scbt-brand-hover, #B3005F);
	background-color: var(--scbt-brand-hover, #B3005F);
}

/* --- social icons (preset2.css:111) -------------------------------------- */
ul.social-icons > li a:hover {
	color: var(--scbt-brand, #E6007E);
}

/* --- page title band (preset2.css:114) ----------------------------------- */
.sp-page-title {
	background: var(--scbt-brand, #E6007E);
}

/* --- module lists (preset2.css:124, :130, :133) -------------------------- */
.sp-module ul > li > a:hover {
	color: var(--scbt-brand, #E6007E);
}

.sp-module .latestnews > div > a:hover {
	color: var(--scbt-brand, #E6007E);
}

.sp-module .tagscloud .tag-name:hover {
	background: var(--scbt-brand, #E6007E);
}

/* --- search (preset2.css:136) -------------------------------------------- */
.search .btn-toolbar button {
	background: var(--scbt-brand, #E6007E);
}

/* --- coming soon (preset2.css:151) --------------------------------------- */
.sp-comingsoon body {
	background-color: var(--scbt-brand, #E6007E);
}

/* --- pagination (preset2.css:160, :164) ---------------------------------- */
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
	border-color: var(--scbt-brand, #E6007E);
	background-color: var(--scbt-brand, #E6007E);
}

/* --- error / coming-soon numerals (preset2.css:167) ---------------------- */
.error-code,
.coming-soon-number {
	color: var(--scbt-brand, #E6007E);
}