.input-with-icon {
	position: relative;
	display: inline-block;
	width: 100%;
}
.copy-icon {
	position: absolute;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #999;
	transition: color 0.2s ease;
	display: inline-block;
	line-height: normal;
}
.copy-icon:hover {
	color: #e91e63;
}
.input-with-icon input {
	padding-right: 50px;
}

/* ---- Header fixes (2026-10-20 audit) ---- */

/* The global footer section had z-index 99999 (style.css), so on scroll it painted over the
   fixed header (#header-outer is 9999) and the mobile menu. Keep it above content, below those. */
body .nectar-global-section.nectar_hook_global_section_footer {
	z-index: 9990;
}

/* Transparent header: Salient renders links, cart and buttons at 75% opacity, which washes them out. */
#header-outer.transparent #top nav > ul > li > a,
#header-outer.transparent .nectar-header-text-content {
	opacity: 1 !important;
}

/* Desktop logo: transparent-header pages show it at 120px wide (style.css), solid-header pages at
   ~240px. Use the same size everywhere. */
@media only screen and (min-width: 1000px) {
	#header-outer #logo img.stnd,
	#header-outer #logo img.starting-logo {
		width: 120px !important;
		object-fit: contain;
	}
}

/* About page: the transparent header sits on the purple hero, where the lavender logo and links
   have too little contrast. Use a white logo, white links and a white "Log in" button there. */
body.page-id-562 #header-outer.transparent #logo img {
	filter: brightness(0) invert(1);
}
body.page-id-562 #header-outer.transparent #top nav > ul > li > a,
body.page-id-562 #header-outer.transparent #top nav > ul > li > a .menu-title-text {
	color: #fff !important;
}
body.page-id-562 #header-outer.transparent #top nav > ul > li > a .menu-title-text:after {
	border-color: #fff !important;
}
body.page-id-562 #header-outer.transparent .cart-icon img {
	filter: brightness(0) invert(1);
}
body.page-id-562 #header-outer.transparent a.login {
	background-color: transparent !important;
	box-shadow: inset 0 0 0 1px #fff;
	color: #fff !important;
}

/* Footer spacing: tighter, so the whole footer fits below the fixed header on laptop screens. */
.nectar_hook_global_section_footer > .container > .wpb_row:nth-child(1) {
	padding-top: 28px !important;
	padding-bottom: 24px !important;
}
.nectar_hook_global_section_footer > .container > .wpb_row:nth-child(2) {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.nectar_hook_global_section_footer > .container > .wpb_row:nth-child(2) > .row_col_wrap_12 {
	padding-top: 32px !important;
}
.nectar_hook_global_section_footer > .container > .wpb_row:nth-child(3) {
	padding-top: 24px !important;
	padding-bottom: 20px !important;
}

/* Login / Register (my-account, also where checkout sends logged-out visitors) */
/* The inactive tab was 25% opacity grey and nearly invisible. */
.nectar-form-controls .control:not(.active) {
	opacity: 1 !important;
	color: #6f5f96 !important;
}
.nectar-form-controls .control:not(.active):hover {
	color: #352157 !important;
}
#customer_login input[type=radio],
#customer_login input[type=checkbox] {
	accent-color: #352157;
}
/* Match the 3px inset of the form rows so the Google button lines up with the fields. */
.wp_google_login,
#customer_login .woocommerce-privacy-policy-text {
	padding: 0 3px;
}
/* The page row is full-width, so on mobile the form touched the screen edges. */
@media only screen and (max-width: 999px) {
	body.woocommerce-account .woocommerce > #customer_login {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* Sidebar panel for logged-out visitors (search page, company/individual/development pages) */
.arkivre-guest-panel {
	background: #f4effe;
	border: 1px solid #e4dafb;
	border-radius: 8px;
	padding: 24px 20px;
	margin: 0 24px 24px;
}
.arkivre-guest-panel .arkivre-guest-panel__title {
	margin: 0 0 8px;
	padding: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: #352157;
}
.arkivre-guest-panel .arkivre-guest-panel__text {
	margin: 0 0 16px;
	padding: 0;
	font-size: 14px;
	line-height: 1.5;
	color: #4a3d66;
}
.arkivre-guest-panel .arkivre-guest-panel__btn {
	display: block;
	margin-top: 8px;
	padding: 10px 16px;
	border: 1px solid #352157;
	border-radius: 5px;
	background: #fff;
	color: #352157 !important;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
}
.arkivre-guest-panel .arkivre-guest-panel__btn--primary {
	background: #352157;
	color: #fff !important;
}
.arkivre-guest-panel .arkivre-guest-panel__btn:hover {
	opacity: 0.9;
}

/* ---- Polish (2026-10-20 audit) ---- */

/* FAQ: question titles had a line-height equal to their font size, so wrapped lines touched. */
.toggle h3 a {
	line-height: 1.4 !important;
}

/* Footer: legal links, copyright and the newsletter field were mid-purple (or white) on lavender,
   about 3:1 contrast or worse. The address typed into the newsletter field was white on lavender. */
.nectar_hook_global_section_footer #menu-footer-bottom a {
	color: #352157 !important;
}
.nectar_hook_global_section_footer #menu-footer-bottom a:hover {
	text-decoration: underline;
}
.nectar_hook_global_section_footer > .container > .wpb_row:nth-child(3) .nectar-responsive-text p {
	color: #4a3d66 !important;
}
.nectar_hook_global_section_footer input.forminator-input {
	color: #352157 !important;
}
.nectar_hook_global_section_footer input.forminator-input::placeholder {
	color: #4a3d66 !important;
	opacity: 1;
}

/* Empty cart: the heading was small grey text and "Browse Documents" a plain link. */
.wp-block-woocommerce-empty-cart-block {
	padding: 40px 20px 60px;
}
.wp-block-woocommerce-empty-cart-block p:first-child strong {
	display: block;
	font-size: 28px;
	line-height: 1.3;
	color: #352157;
}
.wp-block-woocommerce-empty-cart-block p:last-child {
	color: #4a3d66;
}
.wp-block-woocommerce-empty-cart-block p:last-child br {
	display: none;
}
.wp-block-woocommerce-empty-cart-block a {
	display: table;
	margin: 24px auto 0;
	padding: 12px 28px;
	border-radius: 5px;
	background: #352157;
	color: #fff !important;
	font-weight: 600;
}

/* Pricing, "Got a Question?" card: white text on light purple was about 2.9:1 contrast. */
.page-id-650 .custom-shadow:has(a[href*="contact"]) .column-bg-overlay {
	background-color: #6a50a3 !important;
}
.page-id-650 .custom-shadow:has(a[href*="contact"]) p {
	color: #fff !important;
}

/* 404 page (content from arkivre_404_content() in functions.php) */
.arkivre-404 {
	max-width: 640px;
	margin: 0 auto;
	padding: 60px 20px 80px;
	text-align: center;
}
.arkivre-404 .arkivre-404__code {
	margin: 0;
	padding: 0; /* Salient gives every p padding-bottom: 1.5em, i.e. 144px at this size */
	font-size: 96px;
	font-weight: 700;
	line-height: 1;
	color: #b07ff9;
}
.arkivre-404 h1 {
	margin: 16px 0 12px;
	font-size: 32px;
	line-height: 1.25;
	color: #352157;
}
.arkivre-404 p {
	color: #4a3d66;
}
.arkivre-404 .arkivre-404__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 28px;
}
.arkivre-404 .arkivre-404__actions a {
	padding: 12px 24px;
	border: 1px solid #352157;
	border-radius: 5px;
	color: #352157 !important;
	font-weight: 600;
}
.arkivre-404 .arkivre-404__actions a.is-primary {
	background: #352157;
	color: #fff !important;
}

/* Logged-in header search: the Company / Individual / Development list was pale purple on lavender. */
.search__header select option {
	background-color: #fff;
	color: #352157;
}

/* Confirmation after "Add To Cart" (see custom-script.js) */
.arkivre-toast {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 100000;
	max-width: calc(100vw - 48px);
	padding: 14px 20px;
	border-radius: 8px;
	background: #352157;
	color: #fff;
	font-size: 15px;
	box-shadow: 0 8px 24px rgba(53, 33, 87, 0.25);
	opacity: 0;
	transform: translateY(12px);
	pointer-events: none;
	transition: opacity 0.2s, transform 0.2s;
}
.arkivre-toast.is-visible {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}
.arkivre-toast a {
	margin-left: 8px;
	color: #c9b5ff !important;
	font-weight: 700;
	text-decoration: underline;
}

/* Slim footer on app pages (body class from arkivre_is_app_page() in functions.php):
   keep only the logo / copyright / legal links row. */
body.arkivre-app-page .nectar_hook_global_section_footer > .container > .wpb_row:nth-child(1),
body.arkivre-app-page .nectar_hook_global_section_footer > .container > .wpb_row:nth-child(2) {
	display: none !important;
}
body.arkivre-app-page .nectar_hook_global_section_footer > .container > .wpb_row:nth-child(3) {
	padding-top: 28px !important;
	padding-bottom: 24px !important;
}

/* "Become an uploader" panel on My Account (dokan/account/become-a-vendor-section.php override) */
.arkivre-become-uploader {
	margin: 32px 24px 56px;
	padding: 0;
	list-style: none;
}
.arkivre-become-uploader > li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 24px;
	border: 1px solid #e4dafb;
	border-radius: 8px;
	background: #f4effe;
}
.arkivre-become-uploader .left-content {
	flex: 1 1 320px;
}
.arkivre-become-uploader .arkivre-become-uploader__title {
	margin: 0 0 6px;
	padding: 0;
	font-size: 18px;
	font-weight: 700;
	color: #352157;
}
.arkivre-become-uploader .arkivre-become-uploader__text {
	margin: 0;
	padding: 0;
	color: #4a3d66;
}
.arkivre-become-uploader .arkivre-become-uploader__btn {
	display: inline-block;
	padding: 12px 24px;
	border-radius: 5px;
	background: #352157;
	color: #fff !important;
	font-weight: 600;
	white-space: nowrap;
}

/* "Become an uploader" form (dokan/account/update-customer-to-vendor.php override) */
.arkivre-become-uploader-form {
	max-width: 640px;
	padding: 32px 0 48px 32px;
}
.arkivre-become-uploader-form h2 {
	margin-bottom: 8px;
	color: #352157;
}
.arkivre-become-uploader-form .arkivre-become-uploader-form__intro {
	margin-bottom: 24px;
	color: #4a3d66;
}
.arkivre-become-uploader-form input.arkivre-become-uploader__submit {
	padding: 12px 28px !important;
	border: 0 !important;
	border-radius: 5px !important;
	background: #352157 !important;
	color: #fff !important;
	font-weight: 600 !important;
	cursor: pointer;
}
@media only screen and (max-width: 999px) {
	.arkivre-become-uploader-form {
		padding: 24px 20px 40px;
	}
}

/* Salient 18 compatibility (theme 17.2 -> 18.4.2, Salient Core 3.0.6 -> 3.1.9, 20 Oct 2026). */

/* Salient 18 stopped giving the LAST row in a column its column-margin bottom spacing
   (":not(:last-child)" was added in class-nectar-element-styles.php). The pages were designed
   with it, e.g. the 4-column "how it works" rows on For Companies and For Notaries. */
body .container-wrap .wpb_row[data-column-margin="5px"]:not(.full-width-section):not(.full-width-content):last-child { margin-bottom: 5px; }
body .container-wrap .wpb_row[data-column-margin="10px"]:not(.full-width-section):not(.full-width-content):last-child { margin-bottom: 10px; }
body .container-wrap .wpb_row[data-column-margin="20px"]:not(.full-width-section):not(.full-width-content):last-child { margin-bottom: 20px; }
body .container-wrap .wpb_row[data-column-margin="30px"]:not(.full-width-section):not(.full-width-content):last-child { margin-bottom: 30px; }
body .container-wrap .wpb_row[data-column-margin="40px"]:not(.full-width-section):not(.full-width-content):last-child { margin-bottom: 40px; }

/* Salient Core 3.1 renders the closed FAQ toggle icon as .fa-plus (was .fa-plus-circle), so the
   purple icon rules in kamal.css stopped matching and the icons fell back to Salient's grey.
   Same values as kamal.css; the open state is still styled there. */
.toggles.accordion .toggle:not(.open) > .toggle-title i.fa {
	width: 25px !important;
	height: 25px !important;
	border-color: #6a50a3;
}
.toggles.accordion .toggle:not(.open) > .toggle-title i.fa:before {
	width: 10px !important;
	top: 12px !important;
	background-color: #6a50a3 !important;
	border-color: #6a50a3 !important;
}
.toggles.accordion .toggle:not(.open) > .toggle-title i.fa:after {
	height: 10px !important;
	left: 12px !important;
	background-color: #6a50a3 !important;
}

/* My Account sub-pages (Purchased Documents, Billing, Account Settings, order view).
   WooCommerce renders these straight into .woocommerce-MyAccount-content, which had no padding, so
   text sat on the sidebar border and the filters ran into the right edge. The Account Management
   dashboard (body.woocommerce-dashboard) has its own padded layout and is left alone. */
body.woocommerce-account:not(.woocommerce-dashboard) .woocommerce-MyAccount-content {
	box-sizing: border-box !important;
	min-width: 0;
	padding: 40px 48px 64px !important;
}

/* Purchased Documents: wrap the search and filters instead of overflowing on narrower screens */
body.woocommerce-account .woocommerce-MyAccount-content .bookmarks-controls {
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 48px;
}
body.woocommerce-account .woocommerce-MyAccount-content .bookmarks-filters {
	flex-wrap: wrap;
}

/* Billing: address cards */
body.woocommerce-edit-address .woocommerce-MyAccount-content > p:first-of-type {
	margin: 0 0 24px;
	color: #4a3d66;
}
body.woocommerce-edit-address .woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
	width: 100%;
	margin: 0;
}
/* WooCommerce's clearfix pseudo-elements would become grid/flex items */
body.woocommerce-edit-address .woocommerce-Addresses::before,
body.woocommerce-edit-address .woocommerce-Addresses::after {
	display: none !important;
}
body.woocommerce-edit-address .woocommerce-Addresses .woocommerce-Address {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 24px;
	border: 1px solid #e4dafb;
	border-radius: 8px;
	background: #fff;
}
body.woocommerce-edit-address .woocommerce-Address-title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	margin-bottom: 12px;
}
body.woocommerce-edit-address .woocommerce-Address-title::before,
body.woocommerce-edit-address .woocommerce-Address-title::after {
	display: none !important;
}
body.woocommerce-edit-address .woocommerce-Address-title h2,
body.woocommerce-edit-address .woocommerce-MyAccount-content > form h2 {
	margin: 0 !important;
	padding: 0;
	font-size: 20px !important;
	line-height: 1.3 !important;
	color: #352157;
}
body.woocommerce-edit-address .woocommerce-Address-title .edit {
	float: none !important;
	padding: 8px 16px;
	border: 1px solid #352157;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	color: #352157 !important;
	white-space: nowrap;
}
body.woocommerce-edit-address .woocommerce-Address-title .edit:hover {
	background: #352157;
	color: #fff !important;
}
body.woocommerce-edit-address .woocommerce-Address address {
	margin: 0;
	font-style: normal;
	color: #4a3d66;
}

/* Account Settings and the edit-address form */
body.woocommerce-edit-account .woocommerce-EditAccountForm,
body.woocommerce-edit-address .woocommerce-MyAccount-content > form {
	max-width: 760px;
}
body.woocommerce-edit-address .woocommerce-MyAccount-content > form h2 {
	margin-bottom: 24px !important;
}
body.woocommerce-edit-account .woocommerce-EditAccountForm .form-row,
body.woocommerce-edit-address .woocommerce-address-fields .form-row {
	margin: 0 0 20px !important;
	padding: 0 !important;
}
body.woocommerce-account .woocommerce-MyAccount-content .form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
	color: #352157;
}
body.woocommerce-account .woocommerce-MyAccount-content .form-row .input-text,
body.woocommerce-account .woocommerce-MyAccount-content .form-row select {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: 10px 14px !important;
	border: 1px solid #d6cbef !important;
	border-radius: 6px !important;
	background: #fff !important;
	font-size: 15px;
	color: #232d42;
}
body.woocommerce-account .woocommerce-MyAccount-content .form-row .input-text:focus,
body.woocommerce-account .woocommerce-MyAccount-content .form-row select:focus {
	border-color: #6a50a3 !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(106, 80, 163, 0.15);
}
body.woocommerce-edit-account #account_display_name_description em {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: #6b5f85;
}
body.woocommerce-edit-account .woocommerce-EditAccountForm fieldset {
	margin: 12px 0 24px;
	padding: 20px 24px 4px;
	border: 1px solid #e4dafb;
	border-radius: 8px;
	background: #fff;
}
body.woocommerce-edit-account .woocommerce-EditAccountForm legend {
	padding: 0 8px;
	font-size: 16px;
	font-weight: 700;
	color: #352157;
}
/* "Full Name: …" line from display_full_name_in_account() in functions.php */
body.woocommerce-edit-account .woocommerce-EditAccountForm fieldset ~ p:has(> strong:first-child) {
	margin: 0 0 24px;
	padding: 12px 16px;
	border-radius: 6px;
	background: #f4effe;
	color: #4a3d66;
}

@media only screen and (max-width: 767px) {
	body.woocommerce-account:not(.woocommerce-dashboard) .woocommerce-MyAccount-content {
		padding: 24px 16px 40px !important;
	}
	body.woocommerce-edit-account .woocommerce-EditAccountForm .form-row-first,
	body.woocommerce-edit-account .woocommerce-EditAccountForm .form-row-last {
		float: none !important;
		width: 100% !important;
	}
}
