/**
 * Neutralize SC theme / Bootstrap 3 front-end styles that leak into CMS edit UI.
 * Loaded after bootstrap-modified.css and main.less.
 *
 * Keep this surgical: CMS panels use their own colors (incl. dark mode).
 * Do NOT force color / font-size on entire .ccm-panel trees.
 */

/* ============================================================
   Root fixes for toolbar / panels (CMS 9 uses rem throughout)
   Bootstrap 3's `html { font-size: 10px }` shrinks the entire CMS UI.
   ============================================================ */

html.ccm-toolbar-visible,
html.ccm-panel-open,
html.ccm-panel-ready {
	font-size: 16px !important;
}

/*
 * Page settings slides the panel in and translates .ccm-page.
 * Theme `html,body { overflow-x: hidden }` clips that interaction
 * so the cog appears to hang with nothing opening.
 */
html.ccm-toolbar-visible,
html.ccm-toolbar-visible body,
html.ccm-panel-ready,
html.ccm-panel-ready body,
html.ccm-panel-open,
html.ccm-panel-open body {
	overflow-x: visible !important;
}

/* Detail panels intentionally lock body scroll — don't fight that. */
html.ccm-panel-detail-open body {
	overflow: hidden !important;
}

/*
 * Do NOT raise CMS panel/dialog z-indexes — that breaks the native stack
 * (panels ~900, dialogs ~2000) and makes the gear or file picker look dead.
 *
 * Instead, drop theme layers that use z-index:9999 while editing so they stay
 * under CMS chrome.
 */
html.ccm-toolbar-visible div.ccm-page,
html.ccm-panel-ready div.ccm-page,
html.ccm-panel-open div.ccm-page {
	position: relative;
	z-index: 0;
}

html.ccm-toolbar-visible div.ccm-page .dotsNavHomeNav,
html.ccm-toolbar-visible div.ccm-page .hero-wrap .aos-animate,
html.ccm-panel-ready div.ccm-page .dotsNavHomeNav,
html.ccm-panel-ready div.ccm-page .hero-wrap .aos-animate,
html.ccm-panel-open div.ccm-page .dotsNavHomeNav,
html.ccm-panel-open div.ccm-page .hero-wrap .aos-animate {
	z-index: 1 !important;
}

/* Soft type reset on dialogs / in-page widgets only (not whole panels). */
.ui-dialog,
.ui-dialog .ui-dialog-content,
.bootbox .modal-content,
.modal-content,
.ccm-ui,
.ccm-popover-page-menu,
.ccm-edit-mode-disabled-item {
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: #323232 !important;
}

.ui-dialog h1,
.ui-dialog h2,
.ui-dialog h3,
.ui-dialog h4,
.ui-dialog h5,
.ui-dialog h6,
.ccm-ui h1,
.ccm-ui h2,
.ccm-ui h3,
.ccm-ui h4,
.ccm-ui h5,
.ccm-ui h6,
.bootbox h1,
.bootbox h2,
.bootbox h3,
.bootbox h4,
.bootbox h5,
.bootbox h6 {
	font-family: inherit !important;
	font-weight: 600 !important;
	color: #212529 !important;
	border: 0 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	line-height: 1.3 !important;
	margin-top: 0;
}

.ui-dialog h1,
.ccm-ui h1 {
	font-size: 1.5rem !important;
}

.ui-dialog h2,
.ccm-ui h2 {
	font-size: 1.25rem !important;
}

.ui-dialog h3,
.ui-dialog h4,
.ccm-ui h3,
.ccm-ui h4 {
	font-size: 1.05rem !important;
}

.ui-dialog h5,
.ui-dialog h6,
.ccm-ui h5,
.ccm-ui h6 {
	font-size: 0.95rem !important;
}

.ui-dialog p,
.ccm-ui p,
.bootbox p {
	font-family: inherit !important;
	font-size: 14px !important;
	color: inherit !important;
	line-height: 1.5 !important;
}

.ui-dialog label,
.ui-dialog .form-label,
.ccm-ui label,
.ccm-ui .form-label,
.bootbox label {
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #323232 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
}

.ui-dialog .form-control,
.ui-dialog select,
.ui-dialog textarea,
.ui-dialog .btn,
.ccm-ui .form-control,
.ccm-ui select,
.ccm-ui textarea,
.ccm-ui input[type="text"],
.ccm-ui input[type="email"],
.ccm-ui input[type="number"],
.ccm-ui .btn,
.bootbox .form-control,
.bootbox .btn {
	font-family: inherit !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	max-width: 100%;
}

/* Theme forces .img-fluid { display: inline-block !important } */
.ui-dialog img,
.ccm-ui img,
#ccm-toolbar img {
	display: inline-block;
	max-width: 100%;
	height: auto;
}

/* Soften theme white headings that appear inside panel detail on-page overlays */
html.ccm-panel-ready div.ccm-panel,
html.ccm-panel-ready div.ccm-panel-detail {
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	letter-spacing: normal;
	text-transform: none;
}

html.ccm-panel-ready div.ccm-panel h1,
html.ccm-panel-ready div.ccm-panel h2,
html.ccm-panel-ready div.ccm-panel h3,
html.ccm-panel-ready div.ccm-panel h4,
html.ccm-panel-ready div.ccm-panel h5,
html.ccm-panel-ready div.ccm-panel h6,
html.ccm-panel-ready div.ccm-panel-detail h1,
html.ccm-panel-ready div.ccm-panel-detail h2,
html.ccm-panel-ready div.ccm-panel-detail h3,
html.ccm-panel-ready div.ccm-panel-detail h4,
html.ccm-panel-ready div.ccm-panel-detail h5,
html.ccm-panel-ready div.ccm-panel-detail h6 {
	font-family: inherit;
	border: 0;
	letter-spacing: normal;
	text-transform: none;
	/* leave color to CMS (panel themes vary) */
}

/* ============================================================
   Dialog close buttons (jQuery UI + Bootbox / BS5 btn-close)
   ============================================================ */

.ui-dialog .ui-dialog-titlebar-close,
.ui-dialog .ui-dialog-titlebar-close.close,
.ui-dialog .bootbox-close-button,
.ui-dialog .btn-close,
.ui-dialog-titlebar .close,
.ccm-ui .ui-dialog-titlebar-close,
.ccm-ui .bootbox-close-button,
.ccm-ui .btn-close,
.bootbox .bootbox-close-button,
.bootbox .btn-close,
.modal .btn-close,
.modal .bootbox-close-button {
	position: absolute !important;
	top: 50% !important;
	right: 0.75rem !important;
	left: auto !important;
	float: none !important;
	width: 1.5rem !important;
	height: 1.5rem !important;
	margin: -0.75rem 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background-color: transparent !important;
	box-shadow: none !important;
	opacity: 1 !important;
	filter: none !important;
	color: #fff !important;
	text-shadow: none !important;
	font-size: 0 !important;
	line-height: 0 !important;
	overflow: hidden !important;
}

.ui-dialog .ui-dialog-titlebar-close .ui-button-text,
.ui-dialog .ui-dialog-titlebar-close .ui-button-icon-space {
	display: none !important;
	font-size: 0 !important;
	color: transparent !important;
}

.ui-dialog .ui-dialog-titlebar-close:not(.btn-close)::before,
.ui-dialog .bootbox-close-button:not(.btn-close)::before,
.bootbox .bootbox-close-button:not(.btn-close)::before,
.ccm-ui .bootbox-close-button:not(.btn-close)::before {
	content: "\00d7" !important;
	display: block !important;
	position: absolute !important;
	inset: 0 !important;
	font-family: system-ui, -apple-system, "Segoe UI", sans-serif !important;
	font-size: 1.5rem !important;
	font-weight: 400 !important;
	line-height: 1.5rem !important;
	text-align: center !important;
	text-indent: 0 !important;
	color: #fff !important;
	opacity: 0.9 !important;
}

.ui-dialog .ui-dialog-titlebar-close:not(.btn-close):hover::before,
.ui-dialog .bootbox-close-button:not(.btn-close):hover::before,
.bootbox .bootbox-close-button:not(.btn-close):hover::before {
	opacity: 1 !important;
}

.ui-dialog .btn-close,
.bootbox .btn-close,
.ccm-ui .btn-close,
.modal .btn-close {
	background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat !important;
}

.ui-dialog .btn-close::before,
.bootbox .btn-close::before,
.ccm-ui .btn-close::before,
.modal .btn-close::before {
	content: none !important;
}

.ui-dialog .ui-dialog-title,
.ui-dialog .ui-dialog-titlebar,
.ui-dialog-titlebar .ui-dialog-title {
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	color: #fff !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}
