/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
:root {
	--cnvs-body-bg-boxed: #EAE7DC;
	--cnvs-contrast-bg: #EAE7DC;
	--bs-white-rgb: #EAE7DC;
	--cnvs-themecolor: #E98074;
	--cnvs-themecolor-rgb: #E98074;
	--cnvs-body-bg: #EAE7DC;
	--um-black:#17252A;
	--um-red: #E85A4F;
	--um-coral: #E98074;
	--um-light-brown: #D8C3A5;
	--um-light: #EAE7DC;
}

main .slider-element {
	background-color: var(--um-coral) !important;
}

.col-lg-6 .tab-content {
	background-color: var(--um-light) !important;
}

.button.button-light {
	background-color: var(--um-light);
	color: var(--um-black);
}

.button.button-light:hover {
	background-color: var(--um-black);
	color: var(--um-light);
}

.header-extras li .he-text span {
	color: var(--um-light);
}

.header-extras li .he-text span:hover {
	color: var(--um-light-brown);
}


.text-white-50 {
	color: var(--um-light-brown);
}

button.w-100 {
	background-color: var(--um-coral) !important;
	color: var(--um-light) !important;
}

button.w-100:hover {
	background-color: var(--um-black) !important;
	color: var(--um-light) !important;
}

span.input-group-text {
	background-color: var(--um-coral) !important;
	color: var(--um-light) !important;
}

div.section.p-0.dark.mb-0 {
	background: linear-gradient(to right, rgba(232, 89, 79, 0.39), var(--um-coral)) !important;
}

.iconlist > li i {
	color: var(--um-light) !important;
}

svg.svg-curve path {
	fill: var(--um-light) !important;
}

.movers {
	margin: 0;
	background: linear-gradient(to bottom, #E98074, rgba(232, 89, 79, 0.39)) !important;
	padding: 2rem 0;
}

/* Footer */

.um-footer-icons {
	margin-top: 1rem;
	justify-content:center;
	align-items: center;
}

.um-footer-icons .social-icon {
	border: none;
}

.copyright-conteiner {
		padding: 1rem 0;
		border-top: 1px solid var(--um-black);
	}

.copyright-conteiner p {
	font-size: 0.75rem;
}

.qm-footer-list li {
	list-style: none;
}


/* Header and Logo */
#header .um-top-header {
	width: 100%;
	background-color: var(--um-light);
}

.um-top-header,
.um-header-logo {
	background-color: var(--um-light);
}

.um-logo {
	padding: 0.5rem 0 0.5rem 0;
	width: 150px;
	height: auto;
}

.um-top-menu-list .i-plain {
	color: inherit !important;
	transition: color .2s ease;
}

	.um-top-menu-list .i-plain:hover {
		color: var(--um-black) !important;
	}

/* Landing page content -- Add any custom CSS related to Boxed Move landing page*/

/* h3 heading - tag line */
.um-tag-line {
	color: var(--um-light);
}

.um-tab-line-dark {
	color: var(--um-black);
}

.um-top-form h2 {
	margin: 0;
} 

/* Spacing */
.py-6 {
	padding-top: 6rem !important;
	padding-bottom: 6rem !important;
}

.py-7 {
	padding-top: 7rem !important;
	padding-bottom: 7rem !important;
}

.py-8 {
	padding-top: 8rem !important;
	padding-bottom: 8rem !important;
}

.um-mb-5 {
	margin-bottom: 4rem !important;
}

.form-active-bg {
	background-color: #EAE7DC; /* light blue example */
}

/* Get a quote form - all custom CSS related to form */
/* Card content */
.um-form-card {
	margin-bottom: 1.75rem;
	margin-left: 0;
	margin-right: 0;
}

.um-form-card .card-body {
	background-color: var(--um-light);
}

#slider .form-control {
	height: auto;
}

/* Form post code prom selection */
.um-form-select {
	position: absolute;
	top: 100%;
	left: 0.75rem;
	right: 0.75rem;
	background-color: #fff;
	border: 1px solid #CCC;
	border-top: none;
	border-radius: 0 0 0.5rem 0.5rem;
	max-height: 220px;
	overflow-y: auto;
	z-index: 9999;
} 

.um-form-select .suggestion {
	padding: 0.25rem 3.25rem;
	cursor: pointer;
	transition: background 0.15s;
}

.um-form-select .suggestion:hover {
	background-color: var(--um-light);
	color: var(--um-black);
}

.um-form-select, .postcode-suggestions {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: #fff;
	border: 1px solid #ccc;
	border-top: none;
	max-height: 250px;
	overflow-y: auto;
	z-index: 9999;
	display: none;
	border-radius: 0 0 6px 6px;
}

.suggestion {
	padding: 10px 12px;
	cursor: pointer;
}

	.suggestion:hover {
		background: #f2f2f2;
	}
/* =============================== */
/* HEADER CTA BUTTONS              */
/* =============================== */

/* Shared CTA look */
.menu-btn-primary,
.menu-btn-secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px; /* pill style */
	font-weight: 600;
	padding: 0.45rem 1.25rem;
	font-size: 0.95rem;
	gap: 0.35rem;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .12s ease;
	text-decoration: none !important;
}

/* PRIMARY — Become a Partner (solid coral) */
.menu-btn-primary {
	background-color: var(--um-coral);
	color: var(--um-light) !important;
	border: 2px solid var(--um-coral);
}

	.menu-btn-primary:hover {
		background-color: var(--um-red);
		border-color: var(--um-red);
		color: var(--um-light) !important;
		transform: translateY(-1px);
	}

/* SECONDARY — Login (outline) */
.menu-btn-secondary {
	background-color: transparent;
	color: #ffffff !important; /* assuming dark header background */
	border: 2px solid rgba(255, 255, 255, .85);
}

	.menu-btn-secondary:hover {
		background-color: var(--um-black);
		color: #ffffff !important;
		transform: translateY(-1px);
	}


/* CTA buttons only: remove any underline/line effects from Canvas menu */
#header .primary-menu .menu-item-cta > a.menu-link,
#header .primary-menu .menu-item-cta > a.menu-link:hover,
#header .primary-menu .menu-item-cta > a.menu-link:focus {
	text-decoration: none !important;
	/*border-bottom: 0 !important;*/
	box-shadow: none !important;
	background-image: none !important;
}

	/* Canvas sometimes applies the line/underline to the inner div */
	#header .primary-menu .menu-item-cta > a.menu-link > div,
	#header .primary-menu .menu-item-cta > a.menu-link:hover > div {
		text-decoration: none !important;
		border-bottom: 0 !important;
	}

		/* Canvas sometimes draws underline using pseudo-elements */
		#header .primary-menu .menu-item-cta > a.menu-link::after,
		#header .primary-menu .menu-item-cta > a.menu-link:hover::after,
		#header .primary-menu .menu-item-cta > a.menu-link > div::after,
		#header .primary-menu .menu-item-cta > a.menu-link:hover > div::after {
			content: none !important;
			display: none !important;
		}


/* =============================== */
/* RESPONSIVE BEHAVIOUR            */
/* =============================== */

/* Desktop: keep them tight with a gap */
@media (min-width: 992px) {
	.menu-item-cta + .menu-item-cta {
		margin-left: 0.5rem;
	}
}

/* Mobile: full-width stacked buttons */
@media (max-width: 991.98px) {
	.menu-item-cta {
		width: 100%;
		margin-top: 0.25rem;
	}

		.menu-item-cta .menu-link {
			width: 100%;
		}

	.menu-btn-primary,
	.menu-btn-secondary {
		justify-content: center;
		padding: 0.55rem 1rem;
		font-size: 1rem;
	}
}

/* ================================ */
/* SHARED CARD + TABLE THEME        */
/* ================================ */

/* Main cards (desktop & mobile containers) */
.um-card {
	background-color: var(--um-light);
	color: var(--um-black);
	border: 1px solid var(--um-light-brown); /* was none */
	border-radius: 0.75rem;
}
/* Make desktop table background match mobile cards */
.table-theme,
.table-theme thead,
.table-theme tbody,
.table-theme tr,
.table-theme td,
.table-theme th {
	background-color: var(--um-light) !important;
}

/* Header for cards (same accent as table header) */
.um-card-header {
	background-color: var(--um-light-brown);
	color: var(--um-black);
	border-bottom: 2px solid var(--um-coral);
}

/* Mobile company card */
.um-company-card {
	background-color: var(--um-light);
	color: var(--um-black);
	border: 1px solid var(--um-light-brown);
	border-radius: 0.75rem;
}

/* ================================ */
/* TABLE THEME (PC)                 */
/* ================================ */

.table-theme {
	background-color: var(--um-light);
	color: var(--um-black);
	border-radius: 0.75rem; /* match cards */
	border: 1px solid var(--um-light-brown); /* match cards */
	overflow: hidden;
}

	.table-theme thead {
		background-color: var(--um-light-brown);
		color: var(--um-black);
		border-bottom: 2px solid var(--um-coral);
	}

	.table-theme th {
		padding-top: 14px;
		padding-bottom: 14px;
		font-weight: 600;
		text-transform: uppercase;
		font-size: 0.8rem;
		letter-spacing: 0.5px;
	}

	.table-theme tbody tr {
		border-bottom: 1px solid var(--um-light-brown); /* match mobile card border */
	}

		.table-theme tbody tr:last-child {
			border-bottom: none;
		}

		.table-theme tbody tr:hover {
			background-color: rgba(233, 128, 116, 0.12); /* softer coral hover */
			transition: background-color .2s ease;
		}

/* Optional: soften table edges wrapper */
.table-responsive {
	border-radius: 0.75rem;
}

/* ================================ */
/* LINKS (PC + MOBILE)              */
/* ================================ */

.table-theme a,
.um-company-card a {
	color: var(--um-coral);
	font-weight: 600;
	text-decoration: none;
}

	.table-theme a:hover,
	.um-company-card a:hover {
		color: var(--um-red);
		text-decoration: underline;
	}

/* ================================ */
/* BUTTONS                          */
/* ================================ */

/* Solid brand button */
.btn-um-primary {
	background-color: var(--um-coral) !important;
	border-color: var(--um-coral) !important;
	color: var(--um-light) !important; /* readable on coral */
	font-weight: 600;
	border-radius: 0.5rem;
}

	.btn-um-primary:hover {
		background-color: var(--um-red) !important; /* darker on hover */
		border-color: var(--um-red) !important;
		color: var(--um-light) !important;
	}

/* Outline button */
.btn-um-outline {
	border: 2px solid var(--um-coral) !important;
	color: var(--um-coral) !important;
	font-weight: 600;
	background-color: transparent !important;
	border-radius: 0.5rem;
}

	.btn-um-outline:hover {
		background-color: var(--um-coral) !important;
		color: var(--um-light) !important; /* invert: coral bg, light text */
	}

/* Desktop table refinements */
@media (min-width: 992px) {
	.table-theme {
		font-size: 0.9rem;
	}

		.table-theme th,
		.table-theme td {
			padding: 0.85rem 1rem;
			vertical-align: middle;
		}

			.table-theme td:first-child {
				font-weight: 600; /* company name stronger */
			}

			/* keep layout tidy, avoid text wrapping in tiny columns */
			.table-theme th:nth-child(6),
			.table-theme th:nth-child(7),
			.table-theme td:nth-child(6),
			.table-theme td:nth-child(7) {
				white-space: nowrap;
			}
}
/* ============================= */
/* SEND MESSAGE PAGE THEME MATCH */
/* ============================= */

/* Match beige card background (same as mobile cards & table) */
.send-message-card {
	background-color: var(--um-light) !important;
	border: 1px solid var(--um-light-brown) !important;
	border-radius: 0.75rem;
}

/* Header matches table/card header */
.send-message-header {
	background-color: var(--um-light-brown) !important;
	border-bottom: 2px solid var(--um-coral) !important;
}

/* Textarea + form controls style */
.send-message-card .form-control {
	background-color: #fffdf8;
	border: 1px solid var(--um-light-brown);
	border-radius: 0.5rem;
	color: var(--um-black);
}

	.send-message-card .form-control:focus {
		border-color: var(--um-coral);
		box-shadow: 0 0 0 0.15rem rgba(233, 128, 116, 0.28);
	}

/* Buttons – match table/card buttons exactly */

/* Cancel = Outline coral */
.btn-um-outline {
	border: 2px solid var(--um-coral) !important;
	color: var(--um-coral) !important;
	background: transparent !important;
	border-radius: 0.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	font-size: 0.875rem;
}

	.btn-um-outline:hover {
		border: 2px solid var(--um-black) !important;
		background-color: var(--um-black) !important;
		color: var(--um-light) !important;
	}

/* Submit = Solid coral */
.btn-um-primary {
	background-color: var(--um-coral) !important;
	border-color: var(--um-coral) !important;
	color: var(--um-light) !important;
	border-radius: 0.5rem;
	font-size: 0.875rem;
}

	.btn-um-primary:hover {
		background-color: var(--um-red) !important;
		border-color: var(--um-red) !important;
	}


/* ========================================= */
/* COMPANY DETAILS PAGE – MATCH MAIN THEME   */
/* ========================================= */

.company-details-page {
	background-color: #f5e9da; /* same as other pages if you're using this */
}

	/* Make all cards on this page look like your themed cards/table */
	.company-details-page .card {
		background-color: var(--um-light);
		color: var(--um-black);
		border: 1px solid var(--um-light-brown);
		border-radius: 0.75rem;
	}

		/* Optional: slightly stronger header text inside cards */
		.company-details-page .card h2,
		.company-details-page .card h5 {
			color: var(--um-black);
		}

	/* Gallery info alert – tone it down to fit the palette */
	.company-details-page .alert-info {
		background-color: #dff7ff;
		border-color: #c4eaf6;
		color: #235a73;
		border-radius: 0.5rem;
	}
/* =============================== */
/* POST DETAILS PAGE – THEME      */
/* =============================== */

.post-details-page {
	background-color: #f5e9da; /* same page bg you use elsewhere */
}



/* Category badge in coral theme */
.badge-post-category {
	background-color: var(--um-coral);
	color: var(--um-light);
	border-radius: 999px;
	font-weight: 600;
}

/* Text hierarchy in the post card */
.post-details-page h2 {
	color: var(--um-black);
}

.post-details-page .small.text-muted {
	color: rgba(23, 37, 42, 0.7) !important;
}

/* Post body readability */
.post-details-page .post-body {
	line-height: 1.7;
	font-size: 1rem;
}

/* Image rule from your inline style – move here */
img.card-img-top.post-fixed {
	height: 300px !important;
	max-height: none !important;
	width: 100%;
	object-fit: cover;
	display: block;
}



/* ============================== */
/* BLOG PAGE THEME                */
/* ============================== */

.blog-page {
	background-color: #f5e9da; /* same outer background as other pages */
}

/* Category cards */

.blog-category-card {
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
	border: 1px solid var(--um-light-brown);
}

.blog-category-card--active {
	border-color: var(--um-coral);
	box-shadow: 0 0 0 2px rgba(233, 128, 116, 0.25);
}

.blog-category-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

/* Category post-count badge */

.badge-post-count {
	background-color: var(--um-coral);
	color: var(--um-light);
	font-weight: 600;
	border-radius: 999px;
}

/* Posts card header already using .um-card-header for colors */

/* Posts list styling */

.blog-posts-list .blog-post-item {
	background-color: var(--um-light);
	border-color: var(--um-light-brown);
}

	.blog-posts-list .blog-post-item:hover {
		background-color: rgba(233, 128, 116, 0.06);
		border-color: var(--um-coral);
	}

.blog-posts-list h6 {
	color: var(--um-black);
	font-weight: 600;
}

.blog-posts-list p.text-muted {
	font-size: 0.95rem;
	line-height: 1.5;
}


/* ============================ */
/* ABOUT PAGE THEME             */
/* ============================ */

.about-page {
	background-color: #f5e9da; /* same outer bg you used elsewhere */
}

/* Top pill badge "About Us" */
.badge-about {
	background-color: rgba(233, 128, 116, 0.12); /* light coral tint */
	color: var(--um-coral);
	border-radius: 999px;
	font-weight: 600;
	padding: 0.35rem 0.9rem;
}

/* Accent text (Unbox Moves) */
.text-um-accent {
	color: var(--um-coral);
}

/* Numbered step circles on the right card */
.step-circle {
	background-color: var(--um-coral);
	color: var(--um-light);
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 0.9rem;
}

/* Icons in "Why choose" and "For removal companies" */
.icon-accent {
	color: var(--um-coral);
}



.about-page .card .card-body {
	padding: 1.5rem;
}


/* ============================ */
/* MOVING ADVICE PAGE           */
/* ============================ */

.moving-advice-page {
	background-color: #f5e9da; /* same outer bg as other pages */
}

/* Step number circles (reuse if you already made something similar) */
.step-circle {
	background-color: var(--um-coral);
	color: var(--um-light);
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 0.9rem;
}

/* Sidebar / checklist icons in coral instead of default colours */
.icon-accent {
	color: var(--um-coral);
}

/* Slightly nicer spacing in um-card on this page */
.moving-advice-page .um-card .card-body {
	padding: 1.25rem 1.5rem;
}

/* ============================ */
/* FAQ PAGE THEME               */
/* ============================ */

/* Page background */
.faq-page {
	background-color: #f5e9da; /* outer bg, matches rest of site */
}

	/* Header link accent */
	.faq-page header a {
		color: var(--um-coral);
		font-weight: 600;
		text-decoration: none;
	}

		.faq-page header a:hover {
			color: var(--um-red);
			text-decoration: underline;
		}

/* Search bar */
.faq-search .input-group-text {
	background-color: var(--um-light);
	border-color: var(--um-light-brown);
}

.faq-search .form-control {
	border-color: var(--um-light-brown);
	background-color: #fffdf8;
}

	.faq-search .form-control:focus {
		border-color: var(--um-coral);
		box-shadow: 0 0 0 0.15rem rgba(233, 128, 116, 0.3);
	}

/* Accordion items */
.faq-accordion .accordion-item {
	border-bottom: 1px solid var(--um-light-brown);
}

/* Question button – default */
.faq-accordion .accordion-button {
	background-color: var(--um-light);
	color: var(--um-black);
	font-weight: 600;
	padding: 0.9rem 1.25rem;
}

	/* Hover */
	.faq-accordion .accordion-button:hover {
		background-color: rgba(233,128,116,0.06);
	}

	/* Active/open state */
	.faq-accordion .accordion-button:not(.collapsed) {
		background-color: rgba(233,128,116,0.12) !important;
		color: var(--um-black);
		box-shadow: none;
		border-left: 4px solid var(--um-coral); /* brand highlight bar */
	}

	/* Chevron colour tweak */
	.faq-accordion .accordion-button::after {
		filter: invert(30%) sepia(20%) saturate(600%) hue-rotate(-20deg) brightness(95%);
	}

/* Question label (icon + text inline) */
.faq-question-label {
	display: inline-flex;
	align-items: center;
}

/* Answer body */
.faq-accordion .accordion-body {
	background-color: var(--um-light);
	color: var(--um-black);
	font-size: 0.96rem;
	line-height: 1.65;
}
/* ============================ */
/* Leave a Review page */
/* ============================ */

.review-start-page {
	background-color: #f5e9da; /* same outer bg as other pages */
}

	.review-start-page .form-control {
		background-color: #fffdf8;
		border-color: var(--um-light-brown);
	}

		.review-start-page .form-control:focus {
			border-color: var(--um-coral);
			box-shadow: 0 0 0 0.15rem rgba(233, 128, 116, 0.3);
		}

/* ============================ */
/* Find Companies Page */
/* ============================ */

/* Find Companies Page */
.find-companies-page {
	background-color: #f5e9da; /* matches theme pages */
}

	.find-companies-page table td {
		vertical-align: middle;
	}
/* ============================ */
/*Review Conformation */
/* ============================ */
.review-thankyou-page {
	background-color: #f5e9da; /* same outer bg as other pages */
}

	.review-thankyou-page dl dd {
		word-break: break-word; /* long comments wrap nicely */
	}

/* ============================ */
/* Edit Review Page Background */
/* ============================ */
.review-edit-page {
	background-color: #f5e9da; /* matches other themed pages */
}

/* Clean star rating control */
.um-rating-stars {
	direction: rtl;
	unicode-bidi: bidi-override;
	display: inline-flex;
	gap: 4px;
}

	.um-rating-stars input {
		display: none;
	}

	.um-rating-stars label {
		font-size: 1.6rem;
		color: #ccc;
		cursor: pointer;
	}

		.um-rating-stars label::before {
			content: "\2605"; /* star */
		}

		.um-rating-stars input:checked ~ label,
		.um-rating-stars label:hover,
		.um-rating-stars label:hover ~ label {
			color: var(--um-coral);
			transition: color .2s ease;
		}


/* ============================ */
/* Register */
/* ============================ */

.partner-register-page {
	background-color: #f5e9da; /* same outer bg as other pages */
}

	.partner-register-page .form-control {
		background-color: #fffdf8;
		border-color: var(--um-light-brown);
	}

		.partner-register-page .form-control:focus {
			border-color: var(--um-coral);
			box-shadow: 0 0 0 0.15rem rgba(233, 128, 116, 0.3);
		}


/* Register page image (fix crop + look premium) */
.partner-register-image {
	height: 100%;
	min-height: 560px; /* controls the column height */
	border-radius: 20px;
	overflow: hidden;
	background: rgba(255,255,255,.45); /* nice panel behind image */
	border: 1px solid var(--um-light-brown);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
}
.register-illus {
	max-width: 88%;
	height: auto;
	object-fit: contain;
}

.partner-register-image__img {
	width: 100%;
	height: 100%;
	object-fit: contain; /* IMPORTANT: no cropping */
	display: block;
}
.partner-register-page .image-panel {
	background: linear-gradient( 180deg, #f5e9da 0%, #fff4e6 55%, #f3dfc7 100% );
	border-radius: 20px;
	padding: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* On smaller screens: reduce height so it doesn’t dominate */
@media (max-width: 991.98px) {
	.partner-register-image {
		min-height: 260px;
		padding: 12px;
	}
}

/* =============================== */
/* LOGIN (SPLIT CARD) — FIXED      */
/* =============================== */
/* PAGE */
.auth-wrapper {
	min-height: calc(100vh - 120px); /* avoids huge height if you have a header */
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f3efe6;
	padding: 28px 16px;
}

/* MAIN CARD */
.auth-card {
	width: 100%;
	max-width: 1100px;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	border-radius: 22px;
	overflow: hidden;
	background: #f8f1e6;
	border: 1px solid rgba(0,0,0,.08);
	box-shadow: 0 20px 55px rgba(0,0,0,.12);
}

/* LEFT */
.auth-visual {
	padding: 44px;
	background: linear-gradient(135deg, #f5e9da 0%, #fff1e3 60%, #f2dcc4 100%);
}

	.auth-visual h1 {
		font-size: 2rem;
		font-weight: 900;
		margin: 0 0 8px 0;
	}

	.auth-visual p {
		margin: 0 0 18px 0;
		color: rgba(0,0,0,.65);
		max-width: 440px;
		line-height: 1.55;
	}

	/* IMAGE “AROUND” COLOR FIX (no white box) */
	.auth-visual img {
		width: 100%;
		max-height: 320px;
		object-fit: contain;
		display: block;
		/* replaces the “white background” */
		background: linear-gradient(180deg, rgba(245,233,218,.55), rgba(255,241,227,.35));
		border: 1px solid rgba(0,0,0,.08);
		border-radius: 18px;
		padding: 16px;
	}

/* RIGHT */
.auth-form {
	background: linear-gradient( 180deg, #f5e9da 0%, #f3e3cf 100% );
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.auth-form {
	border-left: 1px solid rgba(0,0,0,.06);
}
	.auth-form h2 {
		font-weight: 900;
		margin: 0 0 4px 0;
	}

	.auth-form .sub {
		color: rgba(0,0,0,.6);
		margin: 0 0 16px 0;
	}

/* Inputs */
.auth-input {
	background: #fffdf9;
	border: 1px solid #d6c2a8;
	border-radius: 10px;
	padding: 11px 12px;
}

	.auth-input:focus {
		border-color: #ef8577;
		box-shadow: 0 0 0 .15rem rgba(239,133,119,.25);
	}

/* Password row */
.password-wrap {
	display: flex;
	gap: 8px;
	align-items: stretch;
}

.pwd-btn {
	min-width: 46px;
	border-radius: 10px;
	border: 1px solid #d6c2a8;
	background: #fffdf9;
}

/* Primary button */
.btn-um-primary {
	background: #ef8577;
	color: #fff;
	border: none;
	border-radius: 12px;
	padding: 12px 14px;
	font-weight: 800;
}

	.btn-um-primary:hover {
		filter: brightness(0.97);
	}

/* Signup link */
.signup {
	text-align: center;
	margin: 0;
	color: rgba(0,0,0,.65);
}

	.signup a {
		color: #ef8577;
		font-weight: 800;
		text-decoration: none;
	}

		.signup a:hover {
			text-decoration: underline;
		}

/* MOBILE */
@media (max-width: 900px) {
	.auth-card {
		grid-template-columns: 1fr;
	}

	.auth-visual {
		padding: 24px;
	}

	.auth-form {
		padding: 24px;
	}

	.auth-visual img {
		max-height: 220px;
	}
}

/* Toolbar - button inline*/
.um-toolbar-block {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
}

.um-toolbar-stuck {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.button.button-rounded.button-small {
	border-radius: 0.375rem;
}

/* Checklist with icon*/
.um-check-list li {
	list-style: none;
}