[x-cloak] {
	display: none;
}

:root {
	--subtle-background: #f0f0f0;
}

[data-bs-theme="dark"] {
  --subtle-background: #000000;
}

/* Scale the title along with client resolution */
.offcanvas-body h5 { font-size: 1.1rem; }
@media (min-width: 1440px) { .offcanvas-body h5 { font-size: 1.3rem; } }
@media (min-width: 1920px) { .offcanvas-body h5 { font-size: 1.9rem; } }
@media (min-width: 2560px) { .offcanvas-body h5 { font-size: 2.4rem; } }

.login-logo,
.offcanvas-body .menu-logo {
	width: 100px;
}

/* Mouse over of menu items */
.nav-link:not(.active):hover {
	background-color: var(--subtle-background);
}

.sidebar:focus-visible {
	outline: none !important;
	box-shadow: none !important;
}

/* Show sun/moon icon, depending on if dark mode is set or not */
.nav-link .bi-sun { display: none; }
.nav-link .bi-moon { display: inline-block; }
[data-bs-theme="dark"] .nav-link .bi-sun { display: inline-block; }
[data-bs-theme="dark"] .nav-link .bi-moon { display: none; }

/* Set background color of breadcumb */
.breadcrumb {
	background-color: var(--subtle-background);
}

/* Cursors */
.cursor-pointer,
.pointer {
	cursor: pointer;
}

.cursor-help {
	cursor: help;
}

/* Get rid of the "glow" effect */
.page-link:focus,
.form-select:focus,
.form-control:focus,
.form-check-input:focus {
	box-shadow: none;
}
.form-check-input:active:not(:checked),
.form-check-input:focus:not(:checked) {
	border: var(--bs-border-width) solid var(--bs-border-color);
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-check-input:active:not(:checked),
[data-bs-theme="dark"] .form-check-input:focus:not(:checked) {
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28255, 255, 255, 0.25%29'/%3e%3c/svg%3e");
}

/* Highlight JS */
.hljs-ln-numbers {
    padding-right: 12px !important;
    border-right: 1px solid #555;
}

.hljs-ln-code {
    padding-left: 12px !important;
}

pre {
	max-height: 400px;
	overflow: auto;
}

/* Image displayed when viewing a block */
.block-image-wrapper {
	position: relative;
	max-width: 700px;
	margin: 0 auto;
}

.block-image-wrapper img {
	width: 100%;
	max-height: 400px;
	object-fit: cover;
	display: block;
}

/* overlay desktop */
.block-image-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	max-height: 125px;
	overflow: hidden;
}

/* mobile caption */
.block-image-caption {
	max-width: 700px;
}

/* On block add/edit page */
.block-image-preview-wrapper img:hover {
	opacity: 0.5;
}

/* Mobirise-color styled button */
.btn-pink {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ff4f9a;
    --bs-btn-border-color: #ff4f9a;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #f03d8c;
    --bs-btn-hover-border-color: #e63684;
    --bs-btn-focus-shadow-rgb: 255, 79, 154;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #d92b79;
    --bs-btn-active-border-color: #cc2671;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #ff4f9a;
    --bs-btn-disabled-border-color: #ff4f9a;
	animation: pulse 2s infinite;
}

.btn-pink img {
	width: 1em;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 77, 136, 0.55);
    }

    60% {
        box-shadow: 0 0 0 14px rgba(255, 77, 136, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 77, 136, 0);
    }
}

/* Preview avatar or block image */
img.previewImage {
	min-width: 50px;
	max-width: 250px;
	max-height: 250px;
}

img.is-invalid {
	border: var(--bs-border-width) solid var(--bs-border-color);
	border-color: var(--bs-form-invalid-border-color);
	padding-right: calc(1.5em + .75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(.375em + .1875rem) center;
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

/* Avatar image wrappers*/
.avatar-wrapper {
    overflow: hidden;
    width: 120px;
    height: 120px;
}

.avatar-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.avatar-preview-wrapper img:hover {
	opacity: 0.5;
}

/* Red background color on delete buttons */
.dropdown-item-danger:hover,
.dropdown-item-danger:focus {
	color: #fff;
	background-color: var(--bs-danger);
}

/* */
textarea[name=html],
textarea[name=css] {
	white-space: nowrap;
}