/* ------------------------------------------
	Theme Name:   AndreBothma
	Theme URI:    https://www.elementor.com/
	Description:  AndreBothma.com - Default Theme (Elementor Hello Child).
	Author:       MyVeryOwnWebSite
	Author URI:   https://www.MyVeryOwnWebSite.co.za
	Template:     hello-elementor
	Version:      2.0.0
	License:      GNU General Public License v2 or later
	License URI:  http://www.gnu.org/licenses/gpl-2.0.html
	Tags:         AndreBoth, Default
	Text Domain:  Hello_Child
-------------------------------------------*/
 

 /*-------------------------------------------
TABLE OF CONTENTS
----------------------------------------------

	NORMALISE
	VARIABLES
	FONTFACE
		Serve SegoeUI font locally
	RICH TEXT EDITOR
	GENERAL
	HEADER
		Dropdown Menu
	FOOTER
	A11Y
	BRANDA
		Website Mode
		Front-end
			Login Screen
			Signup Screen
			Lost Password
			DB Error Page
			Cookie Notice
				Privacy Policy (Page)
	PAGES
		Privacy Policy
		Accessibility Policy
	FORMINTOR FORMS
		General
		Invalid Password
		Password Prompt
	HUSTLE
		Pop-ups
			General

-------------------------------------------*/

/* NORMALISE - Set all browsers to display elements the same - Enqued with Functions.php */

/* VARIABLES */

:root {
  --bg-color: #1a1a1d;
  --bg-color-80: #1a1a1dcc;
  --bg-color-60: #1a1a1d99;
  --surface-color: #2c2c2cd9;	/* Pop-ups bacground color, 85% opacity */
  --primary-red: #e11d48;
  --secondary-red: #be3144; 	/* pop-ups border color */
  --text-main: #f1f1f1;
  --border-main: 3px solid var(--secondary-red);
  --border-radius: 15px;
  --font-stack: 'SegoeUI', sans-serif;
}

/* FONTFACE */

	/* Serve SegoeUI font locally */

		@font-face {
		  font-family: 'SegoeUI';
		  src: url('fonts/SegoeUI.woff2') format('woff2');
		  font-weight: 400;
		  font-style: normal;
		  font-display: swap;
		}

/* RICH TEXT EDITOR - .mce-container */

	.mce-top-part * {
	  border-top-color: var(--text-main) !important;
    color: var(--text-main) !important;
    font-family: dashicons !important;
	}

	.mce-top-part .mce-btn:hover {
    box-shadow: 0 0 0 2px var(--bg-color) !important;
	}

	.mce-menu-item {
    color: var(--bg-color) !important;
	}

	.mce-i-resize {
    font-family: tinymce !important;
	}

/* GENERAL */

	body * {
		font-family: var(--font-stack) !important;
		text-underline-offset: 5px !important;
		transition: 0.3s !important;
		letter-spacing: normal !important;
	}

	*:focus,
	*:focus-visible {
		box-shadow: 0 0 0 2px #00000000 !important;
		outline: 2px solid #00000000 !important;
		outline-offset: 0 !important;
	}

	body {
		background-color: var(--bg-color) !important;
		color: var(--text-main) !important;
	}

	.current-menu-item a {
		color: var(--secondary-red) !important;
	  pointer-events: none !important;
	  text-decoration: underline 2px solid var(--text-main) !important;
	}

	.button {
		background-color: var(--primary-red) !important;
	}

	h2 {
		text-decoration: underline 3px var(--secondary-red) !important;
	}

	a:not(#header a, #footer a) {
		text-decoration: underline 1px  var(--text-main) !important;
	}

	a:not(#header a, #footer a):hover {
		color:var(--primary-red) !important;
		text-decoration: none !important;
		cursor: pointer !important;
	}

	.error404_home_button a:hover {
		color:var(--text-main) !important;
	}

	@media screen and (max-width: 409px) {
	  body::before {
	    position: relative !important;
	    z-index: 10000 !important;
	    display: flex !important;
	    align-items: center !important;
	    content: "This site is best viewed on devices with a screen resolution (width) of at least 410px. Preferably make use of a larger device, or try turning your current device landscape." !important;
		  visibility: visible !important;
		  width: 80% !important;
		  margin: 40px auto !important;
		  border: var(--border-main) !important;
		  border-radius: 15px !important;
		  background-color: var(--bg-color) !important;
		  padding: 20px 15px !important;
		  text-align: center !important;
		  color: var(--text-main) !important;
	  }
	}

/* HEADER - .elementor-location-header */

	#header #cv_password_prompt p {
	  margin: 0 !important;
	  padding: 5px 15px !important;
	  background-color: var(--secondary-red) !important;
	  border: 2px solid var(--secondary-red) !important;
	}

	#header #cv_password_prompt p:hover {
	  background-color: var(--secondary-red) !important;
	  border-color: var(--text-main) !important;
	  cursor: pointer !important;
	}

	#header #cv_password_prompt:not(.page-portfolio #header #cv_password_prompt) {
	  visibility: hidden !important;
	}

	/* Dropdow Menu - .elementor-nav-menu--dropdown */

		#header .elementor-nav-menu--dropdown {
		  width: fit-content !important;
			border: 2px solid var(--primary-red) !important;
			top: 60px !important;
			left: -15px !important;
		}

		#header .elementor-nav-menu--dropdown .menu-item .elementor-item,
		#header .elementor-nav-menu--dropdown .menu-item .elementor-item-active {
			padding: 10px 25px !important;
		  background-color: var(--bg-color) !important;
		}

		#header .elementor-nav-menu--dropdown .menu-item .elementor-item:not(#header_nav .elementor-nav-menu--dropdown .menu-item .elementor-item-active):hover {
			background-color: var(--surface-color) !important;
		}

		@media screen and (max-width: 590px) {
			#header #header_icon,
			#header #header_nav_menu,
			#header #cv_password_prompt {
				max-width: fit-content !important;
			}
		}

/* FOOTER - .elementor-location-footer */

	html:not(.wp-admin),
	body:not(.wp-admin) {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
	}

	.page-template-default {
		flex-grow: 1 !important;
	}

	.elementor-location-footer {
		margin-top: auto !important;
	}

	.footer_privacy_policy a {
	  font-size: 13px !important;
	}

	.page-privacy-policy .footer_privacy_policy a {
	  color: var(--secondary-red) !important;
	  pointer-events: none !important;
	}

	.page-contact .footer_social_icons span:last-of-type:hover,
	.page-contact .footer_social_icons span:last-of-type a {
	  pointer-events: none !important;
	  cursor: initial !important;
	}

	.page-contact .footer_social_icons span:last-of-type svg {
	  width: 18px !important;
	  height: 18px !important;
	}

/* A11Y - Elementor Accesabilty Widget */

	.ea11y-widget-link {
		dispaly: none !important;
	}

/* BRANDA */

	/* Website Mode - .branda-maintenance*/

		.branda-maintenance .page {
			border: var(--border-main) !important;
			background-color: var(--surface-color) !important;
		}

	/* Font-end */

		/* Login Screen - .login-action-login - Check Branda > Front-end > Login Screen > Custom CSS */

		/* Signup Screen - .login-action-register - Check Branda > Front-end > Login Screen > Custom CSS */

		/* Lost Password - .login-action-lostpassword - Check Branda > Front-end > Login Screen > Custom CSS */

		/* DB Error Page - .ultimate-branding-settings-db-error-page - Check Branda > Front-end > Login Screen > Custom CSS */

		/* Cookie Notice - #branda-cookie-notice*/

			#branda-cookie-notice {
			  min-width: 520px !important;
			  margin: 0 0 25px 25px !important;
			  border: var(--border-main) !important;
			  border-radius: var(--border-radius) !important;
			  background-color: var(--surface-color) !important;
			}

			#branda-cookie-notice .cookie-notice-container {
			  max-width: 520px !important;
			  margin: 25px 32px 32px !important;
			}

			#branda-cookie-notice .branda-cn-container {
			  display: grid !important;
			  padding: 0 !important;
			}

			#branda-cookie-notice .branda-cn-container::before {
			  content: url(/wp-content/uploads/2026/04/Andre_Bothma-Icon-Transparent-White_Drop_Shadow-1024x1024-1.svg) !important;
			  width: 160px !important;
			  margin: 0 auto !important;
			}

			#branda-cookie-notice #ub-cn-notice-text p {
				margin: 0 !important;
			  padding: 12px 24px !important;
			  font-family: var(--font-stack) !important;
			  font-size: 16px !important;
			  font-weight: 400 !important;
			  line-height: 1.5 !important;
			}

			#branda-cookie-notice .branda-cn-column {
			  background-color: var(--bg-color-80) !important;
			  padding: 20px 0 10px !important;
			}

			#branda-cookie-notice .ub-cn-set-cookie {
				text-decoration: none !important;
			}

			#branda-cookie-notice .branda-cn-column:nth-of-type(3) {
			  padding-top: 32px !important;
			}

			#branda-cookie-notice .button.ub-cn-set-cookie {
			  display: inline-block !important;
			  width: fit-content !important;
			  padding: 5px 15px !important;
			  color: var(--text-main) !important;
			  font-size: 20px !important;
			}

			.ub-cn-privacy-policy {
			  font: normal 13px/1.5em "SegoeUI", sans-serif !important;
			}

				/* Privacy Policy (Page) - .privacy-policy */

					.privacy-policy #branda-cookie-notice-wrap {
					  display: none !important;
					}

/* PAGES */

	/* Common */

		.privacy-policy .privacy_policy_container a,
		.page-accessibility-policy .accessibility_policy_email_address a {
		  text-decoration: underline !important;
		  text-decoration-color: var(--text-main) !important;
		}

		.privacy-policy .privacy_policy_container a:hover,
		.page-accessibility-policy .accessibilty_policy_container a:hover {
		  text-decoration: none !important;
		}

		.privacy-policy .privacy_policy_container .e-con-inner,
		.page-accessibility-policy .accessibilty_policy_container .e-con-inner {
		  background-color: var(--bg-color-80) !important;
		  padding: 25px 32px 41px !important;
		  margin: 41px auto !important;
		}

	/* Privacy Policy - .privacy-policy */

		.privacy-policy #privacy_policy_cloudflare u,
		.privacy-policy #privacy_policy_google u,
		.privacy-policy #privacy_policy_statcounter u {
			text-decoration: underline 1px var(--primary-red) !important;
		}

		#privacy_policy_cloudflare ul,
		#privacy_policy_google ul,
		#privacy_policy_statcounter ul,
		.data_rights ul {
			margin-bottom: 15px !important;
		}

	/* Accessibility Policy - .page-accessibility-statement */

	.page-accessibility-policy .h2_title {
	  font-size: 36px !important;
	  text-decoration: underline 2px var(--secondary-red) !important;
	  line-height: 1.5em;
	}

/* FORMINTOR FORMS */

	/* General */

		.forminator-custom-form {
		  display: grid !important;
		}

		.forminator-custom-form .forminator-label {
			padding-bottom: 5px !important;
			font-size: 16px !important;
			font-weight: 400 !important;
			text-transform: none !important;
			}

		.forminator-custom-form .forminator-input {
			border-radius: 0 !important;
			font-size: 16px !important;
			line-height: 1 !important;
			padding: 9px 12px !important;
		}

		.forminator-custom-form .forminator-input:focus-visible {
			outline: unset !important;
		}

		.forminator-custom-form .contact_number_field .iti__selected-dial-code {
			color: var(--bg-color) !important;
			font-size: 16px !important;
		}

		.forminator-custom-form .contact_number_field #iti-0__dropdown-content {
			width: 350px !important;
		}

		.forminator-custom-form .contact_number_field .iti__search-input:focus:focus-visible {
			border: 0 !important;
			outline: none !important;
			border-bottom: 1px solid var(--secondary-red) !important;
			border-radius: 0 !important;
		}

		.forminator-custom-form .contact_number_field .iti__country-name {
			color: var(--bg-color) !important;
			font-size: 14px !important;
		}

		.forminator-custom-form .contact_number_field .iti__tel-input {
			padding-left: 80px !important;
		}

		.forminator-custom-form .contact_number_field .iti__search-input {
			padding-left: 10px !important;
		}

		.forminator-custom-form .contact_number_field input::placeholder {
			color: #1a1a1d99 !important;
			opacity: 0.6 !important;
		}

		.forminator-custom-form .message_field .forminator-field {
			display: inline-grid !important;
		}

		.forminator-custom-form .message_field label {
			order: 1 !important;
		}

		.forminator-custom-form .message_field .wp-editor-wrap {
			order: 2 !important;
		}

		.forminator-custom-form .wp-switch-editor {
			border-radius: 0 !important;
			top: -5px !important;
		}

		.forminator-custom-form .message_field .forminator-description {
			order: 3 !important;
		}

		.forminator-custom-form .message_field .forminator-error-message {
			order: 4 !important;
		}

		.forminator-custom-form .forminator-description span {
			font-size: 14px !important;
		}

		.forminator-custom-form .forminator-row:nth-of-type(6) {
			height: 135px !important;
		}

		.forminator-custom-form .cloudflare_turnstile {
			padding-top: 10px !important;
		}

		.forminator-custom-form .cloudflare_turnstile::before {
			content: "Human Verification *" !important;
			top: -12px !important;
			position: relative !important;
			font-size: 16px !important;
			color: #f1f1f1 !important;
		}

		.forminator-custom-form .required p {
			font-size: 16px !important;
			margin-bottom: 46px !important;
		}

		.forminator-custom-form .submit_button {
			padding: 5px 15px !important;
			border: 2px solid var(--secondary-red) !important;
			border-radius: 0 !important;
			font-size: 20px !important;
			line-height: 1.5 !important;
			letter-spacing: 1px !important;
		}

		.forminator-custom-form .submit_button:hover {
			border-color: var(--text-main) !important;
		}

		.forminator-custom-form .forminator-row-last .forminator-col {
			text-align: center;
		}

		.forminator-custom-form .forminator-row:nth-last-of-type(2) {
		  order: 15 !important;
		  margin: 0 !important;
		}

		.forminator-custom-form .privacy_policy_link,
		.forminator-custom-form .request_password_link {
		  text-align: center !important;
		}

		.forminator-custom-form .privacy_policy_link p,
		.forminator-custom-form .request_password_link p {
			margin: 0 !important;
		}

		.forminator-custom-form .privacy_policy_link a,
		.forminator-custom-form .request_password_link a,
		.forminator-custom-form .privacy_policy_link a:hover,
		.forminator-custom-form .request_password_link a:hover {
			font: normal 13px/1.5em SegoeUI, sans-serif; !important;
		}

		.forminator-custom-form .forminator-error-message {
			border-left: 3px solid #e11d48 !important;
			font-size: 16px !important;
		}

		.forminator-custom-form .forminator-response-message {
			background-color: #00000000 !important;
			box-shadow: none !important;
			margin: 0 !important;
			padidng-left: 0 !important;
		}

		.forminator-custom-form .forminator-response-message * {
			font-size: 16px !important;
			line-height: 1.5 !important;
			text-transform: none !important;
		}

		.forminator-custom-form:not(#forminator-module-237) .forminator-error label::before {
			content: "ERROR: " !important;
			padding-right: 5px !important;
			color: #e11d48 !important;
			font-size: 16px !important;
		}

		.forminator-custom-form .forminator-loading {
			background-color: #00000000 !important;
			color: var(--text-main) !important;
		}

	/* Invalid Password - #forminator-module-509 */

		#forminator-module-509.forminator-custom-form .forminator-row:nth-of-type(6) {
			height: fit-content !important;
		}

		#forminator-module-509.forminator-custom-form .forminator-row:nth-of-type(7) {
			height: 135px !important;
		}

	/* Password Prompt - #forminator-module-237 */

		#forminator-module-237.forminator-custom-form .forminator-row:nth-of-type(6) {
			height: fit-content !important;
		}

/* HUSTLE */

	/* Pop-ups */

		/* General */

			.hustle-popup-content {
				margin-top: 105px !important;
			}

			.hustle-content-wrap {
				padding: 10px 0 0 !important;
			}

			.hustle-button-close {
				top: 10px !important;
				right: 10px !important;
			}

			.hustle-icon-close {
				color: #f1f1f1 !important;
			}

			.hustle-icon-close:hover {
				color: #e11d48 !important;
			}

			.hustle-image img {
				width: 160px !important;
			}

			.hustle-title {
				font-size: 32px !important;
				text-decoration: underline 3px solid var(--secondary-red) !important;
				padding-bottom: 12px !important;
			}

			.hustle-popup a,
			.hustle-popup a:hover,
			.hustle-popup a:focus,
			.hustle-popup a:visited {
				font-weight: 400 !important;
			}

			@media screen and (min-width: 783px) {
				.hustle-layout {
					display: grid !important;
				}
			    
				.hustle-image {
					max-width:100% !important;
				}
			}