/**
 * NSE global front-end rules (burgundy brand, buttons, radii).
 * Loaded after theme/Elementor so these act as a consistent baseline.
 *
 * @package Niche_Site_Engine
 */

:root {
	--nse-core-burgundy: #722f37;
	--nse-core-burgundy-dark: #5c262d;
	--nse-core-radius-md: 8px;
	--nse-core-radius-sm: 6px;
	--nse-core-btn-font-weight: 600;
}

/* Primary / accent buttons — align hover with burgundy brand */
.elementor-widget-button .elementor-button,
.elementor-widget-button .elementor-button-wrapper a.elementor-button,
a.elementor-button.elementor-size-md,
a.elementor-button.elementor-size-lg {
	border-radius: var(--nse-core-radius-md);
	font-weight: var(--nse-core-btn-font-weight);
}

.elementor-widget-button .elementor-button.elementor-button-link,
.elementor-widget-button .elementor-button.elementor-button-info {
	border-radius: var(--nse-core-radius-sm);
}

.elementor-widget-button .elementor-button:hover,
.elementor-widget-button .elementor-button:focus,
.elementor-widget-button .elementor-button:active {
	filter: brightness(0.95);
}

/* When theme uses global primary color, reinforce hover state for filled primaries */
.elementor-button.elementor-button-primary:hover,
.elementor-button.elementor-button-primary:focus {
	background-color: var(--nse-core-burgundy-dark);
	border-color: var(--nse-core-burgundy-dark);
}

/* Outline / ghost buttons on light backgrounds */
.elementor-button.elementor-button-default:hover {
	border-color: var(--nse-core-burgundy);
	color: var(--nse-core-burgundy);
}

/* Cards / images: consistent corner radius where NSE shortcodes render */
.nse-review-card,
.nse-contextual-reviews__card {
	border-radius: var(--nse-core-radius-md);
}

/* v34.22.1 — Business hours rendering.
   Two layouts share the same markup, scoped by modifier:
     • .nse-business-hours--table → location / service-area pages (loc_hours field).
     • .nse-business-hours--list  → footer + inline two-column lists (default of the
        nse-business-hours Elementor dynamic tag).
   Goal: zero borders, friendly padding, alternating row stripes for the table; pure
   inherited text on the list (footer must look like the rest of the footer copy). */

/* Table layout (location pages): no borders, padded cells, alternating zebra rows. */
.nse-business-hours.nse-business-hours--table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	background: transparent;
	box-shadow: none;
}

.nse-business-hours.nse-business-hours--table tbody tr {
	background: #ffffff;
	border: 0;
}

.nse-business-hours.nse-business-hours--table tbody tr:nth-child(even) {
	background: #f4f4f5;
}

.nse-business-hours.nse-business-hours--table th,
.nse-business-hours.nse-business-hours--table td {
	padding: 0.85rem 1.1rem;
	border: 0;
	background: transparent;
	box-shadow: none;
	text-align: left;
	vertical-align: middle;
}

.nse-business-hours.nse-business-hours--table th.nse-business-hours__day {
	width: 40%;
	font-weight: 600;
}

/* List layout (footer + sidebars): plain inherited text — no chrome whatsoever.
   Aggressive resets defeat theme / Elementor wrappers that otherwise paint each
   row as an empty white "card" block on dark footers (the dadstowingservicellc
   footer regression). */
.nse-business-hours.nse-business-hours--list,
.nse-business-hours.nse-business-hours--list .nse-business-hours__row,
.nse-business-hours.nse-business-hours--list .nse-business-hours__day,
.nse-business-hours.nse-business-hours--list .nse-business-hours__time {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	border: 0 !important;
	box-shadow: none !important;
	color: inherit;
}

/* v34.22.3 — Force typography inheritance from the parent text-editor widget.
   Themes (Hello / Astra / Hello+) commonly inject `footer span { font-size: 1.25rem }`
   or similar high-specificity rules that win over Elementor's per-widget typography
   and blow up the day / time labels to 30–40px. Locking font-family / font-size /
   line-height to `inherit !important` on the hours block + every child element makes
   the widget's own typography settings always drive the rendering. Day stays bold
   via the explicit weight rule below; everything else inherits cleanly. */
.nse-business-hours,
.nse-business-hours .nse-business-hours__row,
.nse-business-hours .nse-business-hours__day,
.nse-business-hours .nse-business-hours__time,
.nse-business-hours th,
.nse-business-hours td {
	font-family: inherit !important;
	font-size: inherit !important;
	line-height: inherit !important;
	font-style: inherit !important;
	letter-spacing: inherit !important;
	text-transform: inherit !important;
}

.nse-business-hours.nse-business-hours--list {
	display: block;
	margin: 0;
	padding: 0;
	line-height: 1.6;
}

.nse-business-hours.nse-business-hours--list .nse-business-hours__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	margin: 0;
	padding: 0.15rem 0;
	min-height: 0;
}

.nse-business-hours.nse-business-hours--list .nse-business-hours__day {
	font-weight: 600;
}

.nse-business-hours.nse-business-hours--list .nse-business-hours__time {
	white-space: nowrap;
}

/* Footer scope: belt-and-suspenders. Some themes/accessibility plugins add a
   background / min-height to direct children of text-editor widgets. Force the
   hours block back to plain inherited text inside any footer-typed container,
   regardless of which layout modifier was chosen. */
footer .nse-business-hours,
footer .nse-business-hours *,
[data-elementor-type="footer"] .nse-business-hours,
[data-elementor-type="footer"] .nse-business-hours *,
.elementor-location-footer .nse-business-hours,
.elementor-location-footer .nse-business-hours * {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	border: 0 !important;
	box-shadow: none !important;
	min-height: 0 !important;
}

footer .elementor-widget-text-editor p:empty,
[data-elementor-type="footer"] .elementor-widget-text-editor p:empty,
.elementor-location-footer .elementor-widget-text-editor p:empty {
	display: none !important;
}

/* ============================================================================
 * v34.25.3 — Operator-applied tile-grid utility classes
 * ============================================================================
 *
 * Reusable CSS hook classes operators can add to ANY section, column, container,
 * or widget in Elementor (Advanced → CSS Classes) to force a tile-grid layout
 * regardless of which widget is rendering the cards (Elementor Posts, Loop Grid,
 * Inner Section with Image Boxes, custom widget, etc.). Replaces hand-tweaking
 * each widget's column setting in Elementor every time the operator wants 2-up
 * cards on a page.
 *
 * Operator (Jill) building out customsitense's Managed IT (hub_a) page,
 * 2026-04-29: "these repeaters need to be in 2 columns always and margin
 * between them vertically." Implemented as a class hook so any future page
 * with the same shape (Cybersecurity hub, Service Areas hub, etc.) gets the
 * same treatment with one CSS-class add in Elementor.
 *
 * Available classes (compose freely):
 *  - .nse-2col-tiles    — force 2-column grid; collapses to 1 col on mobile (<768px)
 *
 * (Future additions slated for later versions: .nse-3col-tiles / .nse-4col-tiles
 * / .nse-2col-mobile if the operator needs them. Adding them is safe — they're
 * additive utility classes, no breakage to anything else.)
 *
 * Implementation strategy: target the most common Elementor inner-grid containers
 * (Posts widget, Loop Grid, flex-container Containers, classic Sections+Columns)
 * with the same rule, so the class works whether the operator adds it directly
 * to the widget or to a wrapper section/column. Uses `!important` because every
 * Elementor widget already has its own column/grid CSS that we need to override.
 */

/* ---- Pattern A: applied directly to a Posts / Loop / Loop-Grid widget. */
.elementor-widget.nse-2col-tiles .elementor-posts-container,
.elementor-widget.nse-2col-tiles .elementor-posts,
.elementor-widget.nse-2col-tiles .e-loop-grid,
.elementor-widget.nse-2col-tiles .elementor-loop-container,
.elementor-widget-posts.nse-2col-tiles .elementor-posts-container,
.elementor-widget-posts.nse-2col-tiles .elementor-posts {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	column-gap: 24px !important;
	row-gap: 24px !important;
}

/* ---- Pattern B: applied to a Section / Column / Container holding ad-hoc
 * child widgets (e.g. two Image Boxes in an Inner Section). Grid the
 * widget-wrap so each child widget becomes a grid cell. */
.elementor-section.nse-2col-tiles > .elementor-container > .elementor-row,
.elementor-section.nse-2col-tiles .elementor-container > .elementor-row {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	column-gap: 24px !important;
	row-gap: 24px !important;
	flex-wrap: wrap !important;
}
.elementor-column.nse-2col-tiles > .elementor-widget-wrap,
.elementor-column.nse-2col-tiles > .elementor-element-populated > .elementor-widget-wrap {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	column-gap: 24px !important;
	row-gap: 24px !important;
}
.e-con.nse-2col-tiles,
.e-container.nse-2col-tiles {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	column-gap: 24px !important;
	row-gap: 24px !important;
}

/* ---- Pattern C: shotgun — if the class is on something whose immediate
 * children are the cards (e.g. a wrapping div with Custom HTML), grid the
 * direct children. Lower specificity than A/B so they win when applicable. */
.nse-2col-tiles[data-element_type="container"],
.nse-2col-tiles[data-element_type="widget"] > .elementor-widget-container > div {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	column-gap: 24px !important;
	row-gap: 24px !important;
}

/* ---- Mobile collapse (< 768px): drop to single-column for readability. */
@media (max-width: 767px) {
	.elementor-widget.nse-2col-tiles .elementor-posts-container,
	.elementor-widget.nse-2col-tiles .elementor-posts,
	.elementor-widget.nse-2col-tiles .e-loop-grid,
	.elementor-widget.nse-2col-tiles .elementor-loop-container,
	.elementor-widget-posts.nse-2col-tiles .elementor-posts-container,
	.elementor-widget-posts.nse-2col-tiles .elementor-posts,
	.elementor-section.nse-2col-tiles > .elementor-container > .elementor-row,
	.elementor-section.nse-2col-tiles .elementor-container > .elementor-row,
	.elementor-column.nse-2col-tiles > .elementor-widget-wrap,
	.elementor-column.nse-2col-tiles > .elementor-element-populated > .elementor-widget-wrap,
	.e-con.nse-2col-tiles,
	.e-container.nse-2col-tiles,
	.nse-2col-tiles[data-element_type="container"],
	.nse-2col-tiles[data-element_type="widget"] > .elementor-widget-container > div {
		grid-template-columns: 1fr !important;
	}
}

/* v34.25.33–34 — Service silo prev | hub | next (flex containers + legacy sections) */

/* Prefer class stamped in PHP {@see nse_elementor_container_mark_service_silo_nav_row()} */
body.nse-is-service-silo-page .nse-service-silo-nav-row.e-con,
body.nse-is-service-silo-page .elementor-element.nse-service-silo-nav-row {
	align-items: center !important;
}
body.nse-is-service-silo-page .nse-service-silo-nav-row > .elementor-element.elementor-widget-button {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	align-self: center !important;
}
body.nse-is-service-silo-page .nse-service-silo-nav-row > .elementor-element.elementor-widget-button .elementor-widget-container,
body.nse-is-service-silo-page .nse-service-silo-nav-row > .elementor-element.elementor-widget-button .elementor-button-wrapper {
	width: 100%;
	max-width: 100%;
}
body.nse-is-service-silo-page .nse-service-silo-nav-row > .elementor-element.elementor-widget-button .elementor-button {
	width: 100%;
	justify-content: center;
	box-sizing: border-box;
}

/* Elementor 3: e-flex is usually on the outer .e-con, not .e-con-inner */
body.nse-is-service-silo-page .e-con.e-flex > .e-con-inner {
	align-items: center !important;
}
body.nse-is-service-silo-page .e-con.e-flex > .e-con-inner > .elementor-element.elementor-widget-button {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	align-self: center !important;
}
body.nse-is-service-silo-page .e-con.e-flex > .e-con-inner > .elementor-element.elementor-widget-button .elementor-widget-container,
body.nse-is-service-silo-page .e-con.e-flex > .e-con-inner > .elementor-element.elementor-widget-button .elementor-button-wrapper {
	width: 100%;
	max-width: 100%;
}
body.nse-is-service-silo-page .e-con.e-flex > .e-con-inner > .elementor-element.elementor-widget-button .elementor-button {
	width: 100%;
	justify-content: center;
	box-sizing: border-box;
}

/* Rare: flex declared on inner */
body.nse-is-service-silo-page .e-con-inner.e-flex > .elementor-element.elementor-widget-button {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	align-self: center !important;
}

/* Legacy inner section + columns */
body.nse-is-service-silo-page .elementor-inner-section .elementor-container > .elementor-row {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
}
body.nse-is-service-silo-page .elementor-inner-section .elementor-container > .elementor-row > .elementor-column {
	flex: 1 1 0% !important;
	min-width: 0 !important;
	align-self: center !important;
}
body.nse-is-service-silo-page .elementor-inner-section .elementor-widget-button .elementor-button {
	width: 100%;
	justify-content: center;
	box-sizing: border-box;
}

/* v34.25.40 — NSE Styled Layout: service reason bullets split (srv_why_bullets; image + dashed rows) */
.nse-styled-layout--service_why_bullets_split .nse-srv-why-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.25rem, 4vw, 2.75rem);
	align-items: start;
	width: 100%;
	box-sizing: border-box;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split--no-media {
	grid-template-columns: 1fr;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__figure {
	margin: 0;
	padding: 0;
	width: 100%;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	aspect-ratio: 4 / 3;
	border-radius: var(--nse-core-radius-sm, 6px);
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__list {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__item {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0 0 1.25rem;
	margin: 0 0 1.25rem;
	border-bottom: 1px dashed rgba(0, 0, 0, 0.22);
	box-sizing: border-box;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__item:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	box-sizing: border-box;
	border: 2px solid var(--e-global-color-primary, var(--nse-primary, #e87722));
	border-radius: 4px;
	color: var(--e-global-color-primary, var(--nse-primary, #e87722));
	line-height: 1;
	margin-top: 0.15rem;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__icon i {
	font-size: 1rem;
	line-height: 1;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__body {
	flex: 1;
	min-width: 0;
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__title {
	/* v34.25.45: title size 16px (was 30px), letter-spacing 1px (was 4px) for the smaller scale.
	 * v34.25.43: every repeater title defaults to var(--nse-secondary). Operator-overridable via Brand Colors. */
	margin: 0 0 0.35rem;
	font-size: 16px;
	line-height: 1.25;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--nse-secondary, var(--global-secondary, var(--e-global-color-secondary, #1b1b1b)));
}

.nse-styled-layout--service_why_bullets_split .nse-srv-why-split__desc {
	margin: 0;
	font-size: var(--nse-font-text-size, 1rem);
	line-height: 1.5;
	color: var(--e-global-color-text, #444);
	font-weight: 400;
}

@media (max-width: 767px) {
	.nse-styled-layout--service_why_bullets_split .nse-srv-why-split:not(.nse-srv-why-split--no-media) {
		grid-template-columns: 1fr;
	}
}