@font-face {
  font-family: Gruppo;
  src: url('/fonts/Gruppo-Regular.ttf');
}

@keyframes shine {
	from {
	  mask-position: 150%;
	  -webkit-mask-position: 150%;
	}
	to {
	  mask-position: -50%;
	  -webkit-mask-position: -50%;
	}
}

@keyframes skeleton-loading {
	0% {
		background-color: #ddd;
	}
	50% {
		background-color: #e0e0e0a1;
	}
	100% {
		background-color: #ddd;
	}
}
  
.customBtnShine {
	mask-image: linear-gradient(-75deg, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.93) 50%, rgba(0, 0, 0, 1) 70% );
	mask-size: 200%;
	-webkit-mask-image: linear-gradient(-75deg, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 1) 70% );
	-webkit-mask-size: 200%;
	animation: shine 2s linear infinite;
}
:root {
    --primary: #8c15ea;
    --secondary: #25ddd3;
    --info: #004385;
    --white: #f9f9f9;
	--grey: #efefef;
	--dark-grey: #7b7b7b;
	--radius: 10px;
	--shadow: 0 1px 2px rgba(0,0,0,.3);
}
body{
	font-size: 15px !important;
}

.form-control {
	background-color: #fff;
	border: 1px solid #ccc !important;
	font-size: 12px !important;
	padding-left: 10px !important;
	padding-right: 10px !important;
}
  .form-control::placeholder {
		color: #666 !important;
	}
	input::placeholder,
	textarea::placeholder {
		color: #666 !important;
	}
	/* Select placeholder: color the select grey when the empty-value option is selected */
	select.form-control {
		color: #333;
	}
	select.form-control:has(option[value=""]:checked) {
		color: #666;
	}
.form-control:focus-visible {
	text-shadow: none !important;
}
[contenteditable].form-control:focus, [type="email"].form-control:focus, [type="password"].form-control:focus, [type="tel"].form-control:focus, [type="text"].form-control:focus, input.form-control:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="text"]:focus, textarea.form-control:focus, textarea:focus {
	box-shadow: inset 0 -2px 0 #08719800;
}
select option {
	font-family:Arial, Helvetica, sans-serif
}
.form-control.error {
	border-color: var(--secondary) !important;
}
.btn {
	text-transform: none;
	box-shadow: none;
	max-height: 40px;
	font-size: 14px;
}
.btn-primary:active:hover, .btn-primary:hover, .btn-primary:focus {
	background-color: var(--primary);
}
.btn-secondary, .btn-secondary:focus, .btn-secondary:hover {
	color: #fff;
}
.btn-secondary {
	background-color: var(--secondary);
}
.required-symbol {
	color: var(--primary);
	font-weight: bold;;
}
.info-i, .info-i-mobile {
	color: var(--secondary);
}
.btn-primary.disabled, .btn-primary:disabled {
	background-color: var(--primary) !important;
	border-color: var(--primary) !important;
}
/* Keep the info-i only on desktop and hide on mobile with media query*/
.info-i-mobile {
	display: none;
}
.alert-primary {
	background-color: var(--secondary) !important;
}
.dropdown-item.active, .dropdown-item:active {
	background-color: var(--secondary);
	color: #fff;
}
@media all and (max-width: 991px) {
	.info-i {
		display: none;
	}
	.info-i-mobile {
		display: block;
	}
	main {
		padding-bottom: 40px !important;
	}
}
.btn-primary {
	background-color: var(--primary);
}
.btn-info {
	background-color: var(--primary);
}
.btn-info:hover, .btn-info:focus {
	background-color: var(--primary);
}
.blur-class {
	filter: blur(4px) !important;
}
.modal-header .close {
	/* background-color: var(--grey); */
	outline: none !important;
	color: var(--secondary);
	opacity: 1;
	padding: 10px;
	border-bottom-left-radius: 3px;
}
/* NAVBAR */
.top-bar {
	width: 100%;
	background-color: var(--white);
}
.top-bar a {
	display: block;
	padding: 2px 16px;
	color: var(--secondary);
}
.navbar-logout {
	border-color: var(--primary) !important;
	color: var(--primary) !important;
	border-width: 1px !important;
	font-size: 12px !important;
	height: 30px !important;
	display: flex;
	align-items: center;
	justify-content: center;
}
.navbar-logout:hover {
	background-color: var(--primary) !important;
	color: #fff !important;
}

/* Divider */
.navbar-divider {
	width: 2px;
	background-color: var(--primary);
	opacity: 0.5;
	height: 2rem;
	margin-right: 12px;
	margin-left: 4px;
}

.nav-profile-avatar {
	width: 30px;
	max-width: 30px;
	min-height: 30px;
	max-height: 30px;
	border-radius: 100%;
	border: var(--primary) solid 2px;
	margin-left: 8px;
	background-size: contain;
	display: flex;
	align-items: center;
	justify-content: center;
}
.nav-profile-avatar:hover {
	text-decoration: none;
}
.nav-profile-avatar p {
	font-weight: bold;
	font-size: 12px;
	margin: 0px;
}
#langSwitchBtn {
    max-height: 40px;
	min-height: 40px;
	display: block;
    color: var(--primary);
	font-size: 1.2rem;
}
#langSwitchBtn:hover {
	cursor: pointer;
}
#langSwitchBtn::after {
	display: none;
}
@media all and (max-width: 991px) {
	.langDropDown, .logOut {
		margin: 0px !important;
	}
	#langSwitchBtn {
		margin: 0px !important;
	}
	.dropdown-menu {
		width: 100%;
	}
}

.btn-outline-secondary {
    border: solid 2px var(--secondary);
    color: var(--secondary);
}
.btn-outline-secondary:hover {
    color: #fff;
    background-color: var(--secondary);
}
.brand-logo, .brand-logo-footer {
	font-family: League Spartan;
	font-size: 25px;
	font-weight: normal;
	color: var(--secondary);
	display: block;
	letter-spacing: -2px;
}
.brand-logo:hover, .brand-logo-footer:hover {
	text-decoration: none !important;
	color: var(--secondary) !important;
}

.brand-logo {
	background-color: var(--primary);
	padding: 0px !important;
	margin: 0px !important;
	max-width: 17%;
	flex: 0 0 16.66%;
	width: 100%;
	height: 67px;
	/* margin-left: -1rem !important; */
	/* padding-left: 2rem !important; */
	display: flex;
	align-items: center;
	justify-content: center;
}
.brand-logo img {
	width: 50%;
}

.navbar-light .navbar-nav .nav-link {
	color: var(--primary);
}
.btn-toggle-menu {
	color: var(--primary);
	font-size: 20px;
}
.mobile-menu-nav {
    border: none;
    box-shadow: var(--shadow);
}
/* OFF CANVAS MENU */

body.offcanvas-active{
	overflow:hidden;
}

.offcanvas-header{ display:none; }

.screen-darken{
	height: 100%;
	width:0%;
	z-index: 30;
	position: fixed;
	top: 0;
	right: 0;
	opacity:0;
	visibility:hidden;
	background-color: rgba(34, 34, 34, 0.6);
	transition:opacity .2s linear, visibility 0.2s, width 2s ease-in;
}

.screen-darken.active{
	z-index:10; 
	transition:opacity .3s ease, width 0s;
    opacity:1;
    width:100%;
    visibility:visible;
}
.btn-close-menu {
    float: right;
    color: var(--secondary);
}
.navbar-dark .navbar-nav .nav-link {
    color: var(--primary);
}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:active, .navbar-dark .navbar-nav .nav-link:focus {
    color: var(--secondary);
}
.active > .nav-link {
    color: var(--secondary) !important;
}
/* .mobile-sticky-nav-bottom {
	background-color: var(--primary);
	border-top: solid 1px var(--secondary);
} */
/* ============ mobile view ============ */
@media all and (max-width: 991px) {
	
	.offcanvas-header{ display:block; }

	.mobile-offcanvas{
		visibility: hidden;
		transform:translateX(100%);
	    border-radius:0; 
		display:block;
	    position: fixed;
	    top: 0; right:0;
	    height: 100%;
	    z-index: 1200;
	    width:80%;
	    overflow-y: scroll;
	    overflow-x: hidden;
	    transition: visibility .3s ease-in-out, transform .3s ease-in-out;
        background-color: var(--white);
	}

	.mobile-offcanvas.show{
		visibility: visible;
    	transform: translateX(0);
	}
	.mobile-offcanvas .container, .mobile-offcanvas .container-fluid{
		display: block;
	}

	.profile-side-nav {
		padding: 12px 4px !important;
		display: flex;
		flex-direction: row !important;
		align-items: center;
		justify-content: space-evenly !important;
		gap: 10px;
		overflow-y: auto;
		position: fixed;
		bottom: 0;
		z-index: 200;
		background-color: var(--primary);
		/* border-top: 2px solid var(--secondary); */
		width: 100%;
		margin: 0px;
		text-align: center;
	}
	.profile-side-nav li {
		display: inline-block;
		width: fit-content !important;
		font-size: 14px;
	}
	.profile-side-nav span {
		margin-top: 4px;
		font-size: 11px !important;
	}
	.profile-side-nav a {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	#profileTab {
		display: flex !important;
		flex-direction: row;
		flex-wrap: nowrap !important;
		height: fit-content !important;
		justify-content: flex-start !important;

		/* Fade on both sides */
		/* mask-image: linear-gradient(to right, #7b7b7b20 0%, black 48px, black calc(100% - 48px), #7b7b7b20 100%); */

		/* Fade on left */
		/* mask-image: linear-gradient(to right, transparent 0%, black 48px, black calc(100% - 48px)); */

		/* Horizontal overflow with hidden bar */
		overflow-y: hidden;
		overflow-x: auto;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	#profileTab::-webkit-scrollbar {
		display: none;
	}

	#profileTab li {
		width: fit-content !important;
	}
	#profileTab li button {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 0.5rem;

		/* Prevent text from taking up more than 1 line */
		white-space: nowrap;
	}
	.profileSettings-title {
		text-align: left !important;
	}
	.toggleProfileSettings {
		display: inline-block !important;	
	}

	.account-settings-desc {
		width: 100% !important;
	}

	/* FOOTER */
	.footer-end {
		padding-bottom: 4rem !important;
	}
	@media (max-width: 991px) {
		.footer-end {
			padding-bottom: 0 !important;
		}
	}
	.basic-info-form {
		width: 100% !important;
		overflow: hidden !important;
		display: flex !important;
		flex-wrap: wrap !important;
	}
	.ck-editor__editable_inline {
		flex: 1 1 100% !important;
		min-width: 100% !important;
	}
	/* #footer {
		display: none;
	} */
	body {
		height: 100%;
	}
}	
/* ============ mobile view .end// ============ */

/* FOOTER */
#footer {
	background-color: var(--primary);
	color: #fff;
	overflow: hidden;
	background: linear-gradient(170deg, var(--primary) 50%, #4480bb 300%);
}
.footer-col {
	border-right: 1px solid var(--secondary);
	min-height: 150px;
}
.footer-link-list {
	list-style: none;
}
.footer-link-list > li {
	margin-bottom: 8px;
}
.footer-link-list > li > a {
	color: #fff;
}
.footer-link-list > li > a:hover {
	color: var(--secondary);
	text-decoration: none;
}
.copyright-link-list {
	list-style: none;
	padding: 0;
}
.copyright-link-list > li {
	display: inline-block;
	margin: 0px 4px;
}
.copyright-link-list > li > a {
	color: #fff;
	font-size: 1.2rem;
}
.copyright-link-list > li > a:hover {
	color: var(--secondary);
}
.copyright-text {
	color: #fff;
	font-size: 12px;
}
.copyright-text > a {
	color: var(--secondary);
}
.copyright-text > a:hover {
	text-decoration: none;
}
@media only screen and (max-width: 700px) {
	.footer-col {
		border-right: none;
		border-top: 1px solid var(--secondary);
		min-height: 115px;
	}
	.footer-col > h4 {
		margin-top: 10px;
	}
	.footer-col-border {
		border-bottom: 1px solid var(--secondary);
	}
  }
/* FOOTER */


/* HOME PAGE */
#main-banner {
	background-color: var(--primary);
	min-height: 680px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
/* .employer-first-section {
	margin-top: 160px;
} */
.employer-first-section span {
	color: var(--secondary);
}
.employer-first-section p {
	color: var(--white);
	font-size: 25px;
	margin: 0;
}

/* Employer first section layout for typewriter messages */
.employer-first-section {
	position: relative;
	min-height: 160px;
	padding-bottom: 80px;
}

.employer-first-section h1 {
	margin-bottom: 40px !important;
	position: relative;
	z-index: 2;
	height: 70px;
	font-size: 2.2rem !important;
}

.employer-first-section .btn {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
}

/* Slide messages with typewriting effect */
.slide-msg-1, .slide-msg-2, .slide-msg-3, .slide-msg-4 {
	color: var(--white) !important;
	font-size: 20px !important;
	font-weight: 500;
	margin: 0 !important;
	overflow: hidden;
	white-space: nowrap;
	min-height: 30px;
	height: 30px;
	line-height: 30px;
	position: absolute !important;
	width: 100%;
	top: 100px;
	left: 0;
	display: none;
}

/* Mobile responsive styles */
@media all and (max-width: 991px) {
	.employer-first-section {
		min-height: 120px !important;
		padding-bottom: 0px !important;
		text-align: center;
		/* margin-bottom: 20px; */
	}
	
	.employer-first-section h1 {
		font-size: 24px !important;
		margin-bottom: 40px !important;
		height: auto !important;
	}
	
	.slide-msg-1, .slide-msg-2, .slide-msg-3, .slide-msg-4 {
		font-size: 16px !important;
		top: 70px !important;
		text-align: center;
		white-space: normal !important;
		height: auto !important;
		min-height: 20px !important;
		line-height: 20px !important;
	}
	
	.employer-first-section .btn {
		position: relative !important;
		bottom: auto !important;
		left: auto !important;
		margin-top: 15px;
	}
	
	/* Mobile slider adjustments */
	.homepage-slider-container {
		height: 240px !important;
	}
	
	.homepage-slider-container .swiper-wrapper {
		height: 240px !important;
	}
	
	.home-image-banner {
		padding: 15px !important;
	}
	
	/* Adjust main banner min-height for mobile */
	#main-banner {
		min-height: auto !important;
		padding: 20px 0;
	}
	
	/* Stack columns on mobile */
	.col-md-4, .col-md-6 {
		margin-bottom: 20px;
	}
}

@keyframes blinkCursor {
	from, to { opacity: 1; }
	50% { opacity: 0; }
}

.blinking-cursor {
	color: var(--secondary);
	animation: blinkCursor 1s infinite;
	font-weight: bold;
}

/* Homepage slider container */
.homepage-slider-container {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.homepage-slider-container .homepage-slider {
	width: 100%;
	height: 100%;
	min-height: 480px;
}

.homepage-slider-container .swiper-slide {
	display: flex;
	align-items: center;
	justify-content: center;
}
.input-group-text {
	padding: 0px 10px !important;
	font-size: 18px;;
}

.input-group .form-control {
	padding: 0px 10px;
}

#toggle-pass {
	width: 14px;
}

.input-group-text.toggle-password {
	background: none;
	border: none;
	cursor: pointer;
	font-size: 12px;
	border-radius: 0px .5rem .5rem 0px;
	background-color: #deb5ff !important;
	box-shadow: none;
	border: 1px solid #ccc;
	border-left: none;
	transition: all 0.3s ease;
}
.input-group-text.toggle-password:hover {
	color: #4a4a4a;
}
.input-group-text.toggle-password.auth-form {
	border: none;
}
.form-control {
	border: solid 2px transparent !important;
}
[contenteditable].form-control, [type="email"].form-control, [type="password"].form-control, [type="tel"].form-control, [type="text"].form-control, input.form-control, input[type="email"], input[type="number"], input[type="password"], input[type="text"], textarea, textarea.form-control {
	box-shadow: inset 0 -1px 0 transparent;
}
@media only screen and (max-width: 700px) {
	#main-banner {
		min-height: 250px;
		background-image: none;
	}
	.employer-first-section p {
		font-size: 15px;
	}
}

/* TRUSTED COMPANIES */
#trusted-row {
	background-color: var(--secondary);
	overflow: hidden;
}
.companies-logo img {
	width: 100%;
}
.companies-carousel {
	display: flex;
	white-space: nowrap;
	width: 200%;
	overflow: hidden;
	animation: slideLogos 30s linear infinite;
}

.companies-carousel:hover {
	animation-play-state: paused;
}

.companies-logo {
	flex: 0 0 auto;
	height: fit-content;
	width: 140px;
	transition: all 0.3s ease;
}
.companies-logo:hover {
	transform: scale(1.2);
}

@keyframes slideLogos {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
	}
}

/* WHY SECTION */
#employer-why {
	background-color: var(--grey);
}
.erga-span {
	color: var(--primary);
	font-weight: bold;
}
.step-boxes {
	background-color: var(--primary);
	border-radius: var(--radius);
	min-height: 350px;
	box-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.step-icon {
	display: inline-flex;
    justify-content: center;
    align-items: center;
	background-color: var(--white);
	/* display: block; */
	width: 100px;
	height: 100px;
	border-radius: 50%;
	margin: 0 auto;
	color: var(--primary);
}
.step-icon .fas {
	vertical-align: middle;
}
.step-boxes p {
	color: #fff;
}

/* PACKAGES SECTION */
#employer-packages {
	background-color: var(--grey);
}
.package-box {
	background-color: var(--white);
  	border-radius: var(--radius);
	box-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.col-md-3:nth-child(2) .package-box {
	height: 250px; 
	border: solid 2px var(--secondary);
}
.package-title {
	width: 70%;
	background-color: var(--primary);
	display: block;
	color: #fff;
	text-align: center;
	border-radius: var(--radius);
	padding: 15px;
	font-size: 22px;
	font-weight: bold;
	margin: 0 auto;
	margin-top: -40px;
}
.package-list {
	list-style: none;
	padding: 0;
	text-align: center;
}
.package-list li {
	display: block;
}
/* BLOG SECTION */
#sumboules {
	background-color: var(--white);
}
.img-blog {
	width: 100%;
}
.blog-link {
	color: #000;
}
.blog-link:hover {
	text-decoration: none;
}

/* NEWSLETTER */
#newsletter {
	background-color: var(--grey);
}
.newsletter-field {
	border: 2px solid var(--secondary);
	border-radius: var(--radius) !important;
}
.newsletter-disclaimer {
	font-size: 12px;
}

/* Skills Panel Styles - Updated from test.html */
.skills-panel, .specialties-panel, .experience-panel {
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
}
.skills-panel.disabled, .specialties-panel.disabled, .experience-panel.disabled {
  opacity: 0.6;
  pointer-events: none;
  background: #f9fafb;
}
.skills-header, .specialties-header, .experience-header {
  display: flex; 
  justify-content: space-between; 
  align-items: center; 
  margin-bottom: 8px;
}
.skills-header .count, .specialties-header .count, .experience-header .count { 
  color: #6b7280; 
  font-size: 12px; 
}

/* Fixed height and scrollable area */
.skills-viewport, .specialties-viewport, .experience-viewport {
  height: 120px;
  overflow: auto;
  border: 1px dashed #e5e7eb; 
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}
.skills-viewport {
  height: 120px;
}

.skill-box, .specialty-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.skill-pill, .specialty-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: #f3f4f6;
  cursor: pointer;
  user-select: none;
  transition: transform .06s ease, background .15s ease, color .15s ease;
  border: 1px solid transparent;
  font-size: 12px;
  white-space: nowrap;
  width: auto;
}
.skill-pill:hover, .specialty-pill:hover { 
  background: #e5e7eb; 
}
.skill-pill:active, .specialty-pill:active { 
  transform: scale(0.97); 
}
.skill-pill.selected, .specialty-pill.selected { 
  background: var(--secondary); 
  color: #fff; 
}
.skill-pill.kb-focus, .specialty-pill.kb-focus { 
  outline: 2px solid #0ea5e9; 
  outline-offset: 2px; 
}

.empty { 
  color: #6b7280; 
  font-size: 14px; 
  padding: 6px 2px; 
}
.error { 
  color: #b91c1c; 
  font-size: 14px; 
  padding: 6px 2px; 
}

.skills-row {
  display: grid;
  
  gap: 16px;
}

.specialty-experience-row {
  display: grid;
  gap: 16px;
  margin-bottom: 24px;
}

.experience-dropdowns {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.experience-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.experience-item label {
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 0;
  color: #374151;
}

.experience-item select {
  font-size: 13px;
  padding: 6px 8px;
  width: 100%;
}

/* Skeleton shimmer */
.skeleton-wrap { 
  display: flex; 
  flex-wrap: wrap; 
  gap: 8px; 
}
.sk-pill {
  height: 30px; 
  width: 100px;
  border-radius: 999px;
  position: relative;
  overflow: hidden;
  background: #eef0f3;
}
.sk-shimmer {
  position: absolute; 
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.6) 50%, rgba(255,255,255,0) 100%);
  animation: shimmer 1.1s infinite;
}
@keyframes shimmer { 
  100% { 
    transform: translateX(100%); 
  } 
}

/* Mobile responsive styles for new panels */
@media (max-width: 768px) {
  .skills-row {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }
  .skills-row .job-input-wrapper {
    margin-bottom: 16px;
  }
  .specialty-experience-row {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }
}

/* AUTH PAGES */
#employer_register_row {
		/* padding: 2rem; */
	  background-repeat: no-repeat;
	  background-size: cover;
	  background-position: center center;
}
.register-box, .login-box {
	background-color: var(--primary);
	border-radius: var(--radius);	
	margin: 60px 0px;
	color: var(--white);
}

.register-check-container {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 4px;
}

.register-check-wrapper {
	display: flex;
	align-items: center;
	gap: 10px;
}

.register-check-wrapper label {
	margin: 0px !important;
}

.forgot-pass-link {
	margin-top: 10px;
	font-size: 11px !important;
}

.register-box h3, .login-box h3 {
	font-size: 20px;
	font-weight: bold;
}

.register-box label, .login-box label {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 4px;
}

.dropdown-item {
	font-size: 12px;
}
.dropdown-item:focus {
	background-color: var(--secondary);
}

/* .no-account-container p {
	font-size: 12px;
} */

.register-box input, .login-box input, .register-box select, .login-box select {
	font-size: 12px !important;
	border: none !important;
	background-color: #deb5ff;
	border-color: transparent !important;
}

.register-box select, .login-box select {
	padding-left: 10px;
	padding-right: 10px;
}

.register-box {
	z-index: 2000;
	position: relative;
	/* position: fixed;
	width: 25rem;
	left: 10rem; */
}
.register-box, .login-box {
	background-color: #ffffff29;
	border-radius: var(--radius);	
	margin: 60px 0px;
	color: var(--white);
	padding: 2.5rem !important;
	width: 75%;
}
@media all and (max-width: 991px) {
.register-box, .login-box {
	width: 100%;
	margin-bottom: 0px;
}
}
.social-login-icons {
	list-style: none;
	padding: 0;
}
.social-login-icons li {
	display: inline-block;
	margin: 0 5px;
}
.social-login-icons li a {
	color: var(--white);
	font-size: 20px;
}
.login-link {
	color: var(--secondary);
}
.forgot-pass-link {
	color: var(--secondary);
	text-align: right;
	display: block;
	font-size: 12px;
}
@media all and (max-width: 991px) {
	#employer_register_row {
		background-image: url('/assets/images/ergazomenos-purple-wide.webp') !important;
		min-height: 65vh;
		background-position: top left;
	}
	.homepage-slider-container .homepage-slider {
		min-height: 280px;
	}
}

#navbarCollapse {
	background-color: var(--grey);
	margin-right: -1rem;
	padding-right: 3rem;
}

.navbar-light {
	background-color: var(--grey) !important;
}

/*
* CV PAGE
*/
/* Container */
.container-cv {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

/* Title */
.container-cv-title {
	font-size: 20px;
	font-weight: 500;
	margin-bottom: 12px;
}

.filter-sidebar {
	padding: 1.5rem;
	z-index: 0 !important;
	padding-top: 4rem;
	background-color: var(--primary) !important;
	left: 0;
	top: 0;
	width: 100%;
	position: sticky !important;
	height: fit-content;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/* Clear filters btn */
.clear-all-btn {
	transition: all 0.3s ease;
}
.clear-all-btn .btn {
	font-size: 13px !important;
	background-color: transparent;
	border: 1px solid var(--white);
	/* color: var(--secondary); */
	width: 100%;
	margin-top: 12px;
	gap: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.clear-all-btn .btn:hover, .loadMoreCv {
	background-color: var(--secondary);
	border-color: var(--secondary);
	color: var(--white);
}
.clear-all-btn .btn svg {
	font-size: 12px;
}
.clear-all-btn-disabled {
	opacity: 0.5;
	pointer-events: none;
}

/* PROFILE SECTION STYLES */

.profile-side-col {
	background-color: var(--primary) !important;
	height: auto;
	z-index: 20;
	left: 0;
	padding: 2rem !important;
}
.profile-side-nav {
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
	align-items: center;
	list-style: none !important;
	width: 100%;
	margin-bottom: 2rem;
}
.profile-side-nav li {
	position: relative;
	/* width: fit-content; */
	width: 100%;
	max-width: 60%;
}
.nav-indicator {
	position: absolute;
	top: 2px;
	/* right: -18px; */
	left: 108%;
	color: var(--white);
	font-size: 10px;
	background-color: var(--secondary);
	padding: 4px;
	height: 16px;
	min-width: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	border-radius: 10px;
}

/* Main container */
.main-container-content {
	margin: 0px !important;
	padding: 2rem !important;
}

/* Title Row */
.title-row {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 2rem;
}
.title-row .btn {
	font-size: 12px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.title-row h3 {
	font-size: 24px;
	font-weight: 500;
	margin: 0px !important;
}

/* Job action button */
.job-action-btn {
	font-size: 12px;
	width: 100px;
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
}

.profile-main-col {
	display: flex;
	flex-direction: column;
	/* padding-left: 14rem; */
}

/* Sidenav widget */
.sidenav-widget-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 4px;
}
.sidenav-widget-text {
	margin: 0px;
	font-size: 12px;
	opacity: 0.8;
}

/* Expiring Ad */
.sidenav-expiring-ad {
	display: flex;
	flex-direction: column;
	background-color: rgba(255, 255, 255, 0.18);
	width: 75%;
	z-index: 10;
	position: absolute;
	/* margin-top: -20px; */
	padding: 10px;
	padding-top: 20px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	padding-top: 0px !important;
	color: var(--white);
}

.sidenav-expiring-ad a {
	font-size: 12px !important;
	margin-top: 0.5rem;
}

.sidenav-widget-progress {
	margin-top: 6px;
	border-radius: 6px;
	overflow: hidden;
	height: 16px;
	font-size: 10px;
}
.sidenav-widget-progress > div {
	height: 100%;
}

.profile-side-nav li a {
	color: #ccc;
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 500;
}
.profile-side-nav li a:hover {
	color: #fff;
	text-decoration: none;
}
.active-link {
	color: #fff !important;
}
  /* dashboard */
.profile-top-boxes {
	position: relative;
	background-color: var(--grey);
	border-radius: var(--radius);
	padding: 20px;
}
.profile-top-boxes::before
{
    position: absolute;
    font-family: 'FontAwesome';
    bottom: 0;
	  right: 20px;
    top: 0;
    font-size: 2.5rem;
		transform: translateY(25%);
		color: var(--dark-grey);
}
.top-boxes-eye::before {
    content: "\f06e";
}
.top-boxes-bookmark::before {
    content: "\f02e";
}
.top-boxes-bell::before {
    content: "\f0f3";
}
.top-boxes-title {
    font-weight: bold;
}
.top-boxes-counter {
    font-weight: bold;
    font-size: 25px;
    margin: 0px;
}

/* Profile edit content */
.profile-edit-content {
	margin: 0px !important;
	padding: 2rem;
	display: flex;
	flex-direction: column;
	/* justify-content: space-between; */
	/* min-height: 50vh; */
}

.profile-edit-content.bns-details {
	display: flex;
	background-color: #f0f !important;
}

/* Button container */
.profile-edit-btn-container {
	display: flex;
	justify-content: flex-end;
	width: 61.5%;
	min-width: 40rem;
	align-items: center;
}

.account-settings-title {
	font-weight: 500;
	font-size: 16px;
	margin: 0px;
}
.account-settings-desc {
	font-size: 12px;
	width: 50%;
	opacity: 0.8;
	margin-bottom: 2rem;
	margin-top: 4px;
}

/* Delete account button */
.delete-account-btn {
	padding: 8px;
	background-color: transparent;
	border: none;
	color: var(--red);
	font-size: 12px;
	margin-right: 0.6rem;
	display: none;
	align-items: center;
	gap: 8px;
	text-decoration: underline;
	outline: none !important;
	transition: all 0.3s ease;
}
.delete-account-btn:hover {
	opacity: 0.6;
}
.delete-account-btn.show {
	display: flex;
}

#profileTab {
	background-color: var(--grey);
	border-radius: var(--radius);
}
#profileTab .nav-link.active:focus:hover, #profileTab .nav-link.active:hover {
	border: none;
	color: var(--secondary);
}
#profileTab .nav-link:focus:hover, #profileTab .nav-link:hover {
	box-shadow: none;
	color: var(--secondary);
}
#profileTab .nav-link.active, #profileTab .nav-link.active:focus {
	box-shadow: none;
	color: var(--secondary);
}
#profileTab .nav-link, .nav-tabs .nav-link:focus {
	box-shadow: none;
}
#profileTab .nav-item.show .nav-link, #profileTab .nav-link.active {
	background-color: transparent;
}
#profileTab button {
	outline: none;
}
.profile-image-upload-wrap {
	background-color: var(--grey);
	border-radius: var(--radius);
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 80px;
	width: 80px;
	position: relative !important;
	box-shadow: var(--shadow);
}
#profile_image {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0;
	cursor: pointer;
}
#cover_image {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0;
	cursor: pointer;
}
.remove-image-btn {
	z-index: 999;
	position: absolute;
	top: -11px;
	right: -11px;
	background-color: var(--grey);
	padding: 5px;
	border-radius: 5px;
	width: 25px;
	height: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--secondary);
	transition: all 0.3s ease;
}
.remove-image-btn svg {
	height: 12px !important;
}
.remove-image-btn:hover {
	cursor: pointer;
	transform: scale(1.2);
}
.profile-image-text {
	text-align: center;
}
.profile-image-text p {
	color: var(--dark-grey);
	font-size: 9px;
 	margin: 0px !important;
}
.profile-image-text .fa-circle-plus {
	font-size: 20px;
	color: var(--secondary);
	margin: 0px !important;
}

/* Max size */
.profile-image-max-size {
	font-size: 10px;
	width: fit-content !important;
	color: var(--dark-grey);
	margin: 0px !important;
}

@media all and (max-width: 991px) {
	/* .profile-image-upload-wrap {
		height: 100px;
		width: 100px;
	} */
	.profile-image-text p {
		font-size: 7px;
	}
}

.cover-image-upload-wrap {
	background-color: var(--grey);
	border-radius: var(--radius);
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 80px;
	width: 465px;
	position: relative !important;
	box-shadow: var(--shadow);
}
.resume-file-upload-wrap {
	background-color: var(--grey);
	border: 2px solid var(--secondary);
	border-radius: var(--radius);
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100px;
	width: 200px;
	position: relative !important;
	box-shadow: var(--shadow);
}
@media all and (max-width: 991px) {
	.cover-image-upload-wrap {
		/* height: 75px;*/
		width: 80vw; 
	}
	#aitiseisSearch {
		width: 70% !important;
	}
	.profileView-buttons {
		text-align: center;
	}
	.bns-details-container {
		width: 100% !important;
	}
	.imagecroppers-mobile {
		flex-direction: column !important;
	}
}

#questions-section p, #apply-form-section p {
	font-size: 12px;
	margin: 0px;
}

.basic-info-form {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	/* padding: 2rem !important; */
}
.basic-info-form.bns-details {
	flex-direction: row;
}

.basic-info-form-company {
	padding: 0.5rem !important;
	padding-bottom: 2rem !important;
}

.basic-info-form-col {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
.basic-info-form-col.row {
	flex-direction: row;
	margin-bottom: 14px !important;
	margin: 0px;
}

.basic-info-form-col .row-wrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1rem;
}

@media all and (max-width: 991px) {
	.basic-info-form-col {
		width: 100%;
	}
	.basic-info-form {
		padding: 0px !important;
	}
	/* .basic-info-form .input-row.double-width input {
		width: 100% !important;
	} */
}

.row-wrapper .input-row {
	width: fit-content;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.input-row label {
	margin: 0px;
	font-size: 13px;
}

/* .free_text_wrap {
	width: 40rem !important;
} */

.input-group-label-container {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	margin-top: 1rem;
	margin-bottom: 8px;
}

.input-group-label {
	font-size: 12px;
	margin: 0px;
	font-weight: 500;
	margin-bottom: 4px;
	position: relative;
	display: inline-block;
	flex-shrink: 0;
}

.input-group-label-divider {
	display: flex;
	width: 50%;
	height: 1px;
	background: linear-gradient(to right, var(--secondary), rgba(252, 163, 17, 0));
}

.custom-divider {
	display: flex;
	width: 100%;
	height: 1px;
	background: linear-gradient(to right, var(--secondary), rgba(252, 163, 17, 0));
}
.custom-divider.half {
	width: 50%;
}
.custom-divider.no-flex-shrink {
	flex-shrink: 0;
}
.custom-divider.gray {
	background: linear-gradient(to right, #ccc, rgba(252, 163, 17, 0));
}
.custom-divider.gray.no-fade {
	background: #cccccc;
}
.custom-divider.no-fade {
	background: var(--secondary);
}

.modal-profile-divider {
	display: flex;
	width: 100%;
	height: 1px;
	background-color: var(--secondary);
}
.modal-profile-divider.gray {
	background-color: #cccccc;
}
.modal-profile-divider.top {
	margin-top: 12px;
	margin-bottom: 12px;
}
.modal-profile-divider.mobile {
	margin-top: 10px;
	margin-bottom: 10px;
}

.basic-info-form input, .basic-info-form textarea {
	font-size: 12px !important;
	padding: 0px 10px;
	width: 210px;
	border: none;
	/* box-shadow: var(--shadow); */
	background-color: #ffffff5c !important;
	color: #000;
	display: flex;
	align-items: center;
	border: 1px solid #ccc !important;
}
.basic-info-form input:focus, .basic-info-form textarea:focus {
	box-shadow: none;
	border-color: var(--primary);
}
.basic-info-form select {
	width: 210px;
	border: none;
	background-color: #ffffff5c !important;
	font-size: 12px !important;
	box-shadow: none !important;
	color: #000 !important;
	padding: 0px 10px;
	border: 1px solid #ccc !important;
}
.select, select.form-control {
	background-position-x: 96%;
}
.basic-info-form select:focus {
	box-shadow: none !important;
	border-color: var(--primary);
}
.select2-search textarea {
	border: none !important;
}
.ck-editor__editable_inline {
	max-height: 250px !important;
	min-height: 250px !important;
}
.ck-balloon-panel {
	display: none !important;
}
.free_text_wrap {
	display: block;
	width: calc(870px + 1rem) !important;
	/* border: solid 2px var(--primary); */
	background-color: #fff;
	border-radius: 10px;
	font-size: 13px !important;
	overflow: hidden;
}
#cropperImagePreview {
    max-width: 100%; /* Adjust this as needed */
    max-height: 400px; /* Adjust this based on your modal's size */
    object-fit: contain;
}
.cropper-container {
    max-width: 100%; /* Limit the width to the modal's width */
    max-height: 100%; /* Limit the height to the modal's height */
    overflow: hidden; /* Add this if you want to clip the overflow */
}
.croppedImagePreview{
	position: absolute;
	max-width: 100%;
	border-radius: calc(var(--radius) - 2px);
	height: auto;
	width: 100%;
	object-fit: cover;
}
.experienceModalBtn, .educationModalBtn {
	display: block;
	width: 100%;
}

.clear-btn {
	background-color: transparent !important;
	border: none;
	outline: none !important;
	text-decoration: none !important;
	color: var(--primary);
	transition: all 0.3s ease;
}
.clear-btn:hover {
	opacity: 0.8;
}

.clear-btn.disabled {
	opacity: 0.5;
	pointer-events: none;
}

.clickable-row.disabled td:not(.btns) {
	opacity: 0.5;
}

/* Custom styling for table */
#jobs-listing-table, #education-data, #favoriteProfilesTable, #interviewsTable {
	width: 100% !important;
	border-collapse: separate;
	border-spacing: 0 10px; /* This creates space between rows */
}

#jobs-listing-table td, #interviewsTable td {
	font-size: 14px !important;
	/* border: none !important; */
	height: 35px !important;
	box-shadow: none !important;
	border: 1px solid #ccc;
	border-left-width: 0px;
	border-right-width: 0px;
}
#interviewsTable td p {
	margin: 0px;
}
#interviewsTable td .btn {
	font-size: 12px;
	width: 34px;
	height: 34px;
	box-shadow: none;
}
#interviewsTable td .btn:hover {
	opacity: 0.5;
}
#interviewsTable tr.unread td {
	background-color: #08719815;
}

.interview-modal-last-updated {
	margin-top: -1.5rem;
}

.interview-notes {
	width: 100% !important;
	min-height: 6rem;
}

#add-notes-container {
	width: 100%;
}

.add-note-btn-container {
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Label */
.edit-interview-label {
	margin: 0px;
	font-size: 12px;
	margin-bottom: 2px;
}

.edit-interview-checkbox-wrapper {
	display: flex;
	align-items: center;
	/* justify-content: center; */
	padding: 1rem;
	padding-bottom: 0px;
	padding-top: 0px;
	gap: 1rem;
	width: 100%;
}
.edit-interview-checkbox-wrapper .edit-interview-label {
	margin: 0px;
}
.edit-interview-checkbox-wrapper input {
	width: fit-content;
}

.edit-interview-modal-btns-container, .custom-btn-container {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
}

.custom-btn-container {
	background-color: var(--primary);
	width: calc(100% + 4rem);
	margin-left: -2rem;
	margin-bottom: -3rem !important;
	padding-bottom: 1rem;
	padding-top: 1rem;
}

/* Interview Button */
.interview-btn, .custom-btn {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	margin: 0px;
	background-color: var(--white);
	box-shadow: none !important;
	border: 1px solid #ccc;
	transition: all 0.3s ease;
}
.interview-btn:hover, .custom-btn:hover {
	opacity: 0.7;
}
.interview-btn.action, .custom-btn.action {
	background-color: var(--secondary);
	color: #fff;
	border: none;
}
.custom-btn.secondary {
	background-color: var(--primary);
	color: #fff;
	border: none;
}
.custom-btn.full-width {
	width: 100%;
	margin-left: 2rem;
	margin-right: 2rem;
	justify-content: center;
}
.custom-btn.no-flex-shrink {
	flex-shrink: 0;
}
.custom-btn.fit-content {
	width: fit-content;
}

.main-content-container {
	display: flex;
	width: 100%;
	overflow: hidden;
}

/*
* New/Edit Job
*/
#jobListingTabContent {
	width: 99%;
}

.job-inputs-container {
	display: flex;
	flex-direction: column !important;
	gap: 10px !important;
}
.job-inputs-container.active {
	display: flex !important;
}

.job-input-row {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.job-input-container {
	display: flex;
	flex-direction: column;
	margin: 0px;
}
.job-input-container.row {
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-end;
	gap: 10px;
	width: 100%;
}

.job-input-wrapper {
	display: flex;
	flex-direction: column;
	margin: 0px !important;
	gap: 4px;
}

.job-input-wrapper input, .job-input-wrapper select, .job-input-wrapper textarea {
	box-shadow: none !important;
}

.tooltip-inner {
	font-size: 12px !important;
	background-color: rgba(240, 240, 240) !important;
	backdrop-filter: blur(20px) !important;
	-webkit-backdrop-filter: blur(20px) !important;
	border: 1px solid rgba(255, 255, 255, 0.98) !important;
	box-shadow: 0 2px 30px rgba(0, 0, 0, 0.1) !important;
	color: #000 !important;
}

/* Label wrapper */
.job-input-label-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
}
.job-input-label-wrapper.ai {
	display: flex;
	align-items: flex-start;
	gap: 3px;
	flex-direction: column !important;
}
.job-input-label-wrapper.external-url {
	flex-direction: column !important;
}
.form-paragraph {
	font-size: 12px;
	margin: 0px !important;
	font-weight: 500;
}

/* Label */
.job-input-wrapper label {
	font-size: 12px;
	margin: 0px;
	font-weight: 500;
}

.job-btns-container {
	display: flex;
	align-items: center;
	/* justify-content: flex-end; */
	gap: 12px;
}
.job-btns-container .btn {
	font-size: 14px;
}

@media all and (max-width: 991px) {
	.job-btns-container {
		flex-direction: column;
		gap: 0px;
	}
}

.jobs-listing-table-total-applications {
	cursor: pointer;
	position: relative;
	color: #000;
	text-decoration: none !important;
	transition: all 0.3s ease;
}
.jobs-listing-table-total-applications:hover {
	color: var(--secondary);
	opacity: 0.6;
}
.jobs-listing-table-total-applications-unread {
	position: absolute;
	left: 80%;
	top: -8px;
	background-color: var(--secondary);
	color: #fff;
	border-radius: 100%;
	padding: 1px 5px;
	font-size: 8px;
}

#jobs-listing-table thead th {
	text-align: start !important;
}

/* Custom styling for table rows */
#jobs-listing-table tbody tr, #education-data tbody tr, #favoriteProfilesTable tbody tr, #interviewsTable tbody tr {
	border-radius: var(--radius) !important; /* Border radius for each row */
	overflow: hidden !important;
	/* cursor: pointer; */
	transition: all 0.3s ease;
}
#education-data tbody tr, #favoriteProfilesTable tbody tr, #interviewsTable tbody tr {
	cursor: pointer;
}
#jobs-listing-table tbody tr:hover, #education-data tbody tr:hover, #favoriteProfilesTable tbody tr:hover,
#interviewsTable tbody tr:hover {
	transform: scale(1.02);
}

/* Styling for first and last cells in each row for rounded corners */
#jobs-listing-table tbody tr td:first-child, #education-data tbody tr td:first-child, #interviewsTable tbody tr td:first-child {
	border-top-left-radius: var(--radius) !important;
	border-bottom-left-radius: var(--radius) !important;
	border-left-width: 1px;
	overflow: hidden !important;
}

#jobs-listing-table tbody tr td:last-child, #education-data tbody tr td:last-child, #interviewsTable tbody tr td:last-child {
	border-top-right-radius: var(--radius) !important;
	border-bottom-right-radius: var(--radius) !important;
	border-right-width: 1px;
	overflow: hidden !important;
}
/* Align to center the fourth cell of the header and each fourth cell of the body */
#jobs-listing-table tbody tr td:nth-child(4), #jobs-listing-table thead th:nth-child(4) {
	text-align: center !important;
}
table.dataTable.nowrap th, table.dataTable.nowrap td {
	padding: 10px !important;
}
table.dataTable > thead > tr > th, table.dataTable > thead > tr > td {
	padding: 10px;
	border-bottom: 1px solid var(--secondary);
  }

.js-skills-select {
	width: 100% !important;
}
.select2-container {
	border-radius: 7px;
}
.select2-container--default.select2-container--focus .select2-selection--multiple, 
.select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--multiple {
	border: none;
	padding: 5px;
	padding-bottom: 10px !important;
	background-color: var(--grey);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
	border: solid 1px var(--secondary);
	background-color: var(--white);
}
.job-draft {
	color: var(--dark-grey);
}
.job-published {
	color: var(--green);
}
.job-expires-soon {
	color: var(--green);
}
.job-expired {
	color: var(--red);
}

.job-expires-wrapper {
	display: flex;
	flex-direction: column;
	width: fit-content;
	/* background-color: #f0f; */
}
.job-expires-soon-desc {
	font-size: 11px;
	margin-top: -4px;
	opacity: 0.7;
}

/* hide title from the table from the last li (buttons) */
ul.dtr-details > li:last-child > span.dtr-title { 
    display: none !important;
}

/* JOB APPLICATION PAGE */
@media all and (max-width: 991px) {
	.job-application-wrap {
		max-height: 45vh !important;
		min-height: 45vh !important;
	}
}

.job-application-wrap {
	max-height: 65vh;
	min-height: 65vh;
	border: solid 2px var(--primary);
	border-radius: var(--radius);
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0px !important;
	min-width: 16rem;
	box-shadow: 0px 10px 12px 0px #00000020;
}

#job-applications-groups {
	display: flex;
	width: 100%;
	gap: 2rem;
}

.drag-backdrop {
	backdrop-filter: blur(8px);
	background-color: #00000030;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2000;
	/* display: none; */
	pointer-events: none;
	transition: all 0.3s ease;
}
.drag-backdrop.show {
	opacity: 1 !important;
	display: flex !important;
}

.job-application-wrap {
	position: relative;
	background-color: var(--white);
	z-index: 2005;
	transition: all 0.5s ease;
}
.job-application-wrap.dragging {
	transform: scale(1.02);
}

/* JOB APPLICATION PAGE */
.application-col {
	padding: 0px !important;
	min-height: 98% !important;
	max-height: 98% !important;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
	overflow-y: auto;
	/* padding-top: 2rem !important; */
	position: relative;
	scrollbar-width: none;
}
.application-col::-webkit-scrollbar {
	display: none;
}

.show-more-applications {
	background-color: transparent;
	box-shadow: none;
	text-decoration: underline 1px solid;
}

.applied-cv {
	/* background-color: var(--grey); */
	border-radius: var(--radius);
	border: 1px solid #cccccc;
	/* box-shadow: 0px 6px 6px 0px #00000020; */
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	margin: 10px;
	margin-bottom: 2px;
	height: 65px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	/* width: 100%; */
}
.drag-class {
	background-color: var(--white) !important;
	border: 1px solid #cccccc !important;
}
.applied-cv.last-seen, .applied-cv.read {
	opacity: 0.6 !important;
}
.applied-cv.perfect-match {
	border-color: #fbbd06 !important;
}
.applied-cv-rejected {
	cursor: default !important;
}
.applied-cv img {
	width: 40px;
	border-radius: 100%;
	display: inline-block;
	vertical-align: top;
}
.applied-applicant-data {
	display: inline-block;
}
.applied-cv:hover {
	cursor: pointer;
}
.applied-cv button {
	display: block;
	margin: 0 auto;
}
@media all and (max-width: 991px) {
	.viewProfileMobile {
		display: block;
		float: right;
		background-color: var(--secondary);
		padding: 5px 7px;
		border-radius: var(--radius);
		box-shadow: var(--shadow);
	}
}
.application-col-title h5, .application-col-title p {
	display: inline-block;
	color: var(--white);
	margin: 0px !important;
}
.application-col-title h5 {
	font-size: 15px;
	font-weight: bold;
}

/* Data container */
.applicant-data-container {
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: space-between;
	line-height: 16px;
}

.applicant-data-container .updated-profile-txt {
	font-size: 9px;
	position: absolute;
	top: -6px;
	right: 6px;
	padding: 1px;
	padding-left: 4px;
	padding-right: 4px;
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--primary);
	color: var(--white);
	border-radius: 4px;
	width: fit-content;
	transition: all 0.3s ease;
}

.applicant-image-container {
	position: relative;
}

/* Status */
.applicant-status {
	height: 10px;
	width: 10px;
	position: absolute;
	right: 0;
	bottom: 0;
	background-color: var(--dark-grey);
	border-radius: 100%;
}
.applicant-status.available {
	background-color: var(--green);
}
.applicant-status.unavailable {
	background-color: var(--red);
}

/* No image container */
.no-image-container {
	min-width: 40px;
	width: 40px;
	height: 40px;
	background-color: var(--white);
	border-radius: 100%;
	border: 1px solid #ccc;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* Initials */
.no-image-initals {
	margin: 0px;
	font-weight: 500;
	opacity: 0.8;
}

/* Applied title (name) */
.applied-title {
	margin: 0px !important;
	font-size: 14px !important;
	font-weight: 600;
}
/* Profession */
.applied-profession {
	margin: 0px !important;
	font-size: 12px;
	font-weight: 300;
	opacity: 0.8;
}

.application-col-count {
	font-size: 12px;
	opacity: 0.8;
}

.application-col-title {
	background-color: var(--primary);
	padding: 10px;
	display: flex;
	position: sticky;
	top: 0;
	z-index: 20;
	flex-direction: column;
	box-shadow: 0px 4px 8px 0px #00000020;
}

.application-col-title span {
	float: right;
	font-weight: bold;
	font-size: 20px;
	line-height: 15px;
}

/* Application column content */
.application-col-content {
	padding: 10px;
	overflow-x: hidden;
	overflow-y: auto;
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.applied-applicant-data-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0px;
}

/* Group options */
.application-col-options {
	transition: all 0.3s ease;
	display: flex;
	gap: 4px;
	position: absolute;
	right: 10px;
	bottom: 7px;
}
.application-col-options .btn {
	background-color: transparent !important;
	height: 25px;
	width: 25px;
	padding: 0px;
	font-size: 12px;
	color: var(--white);
}
.application-col-options .delete-application-col {
	color: var(--red);
}
.application-col-options .btn:hover {
	opacity: 0.7;
}

/* Floating delete button */
.del-btn {
	box-shadow: var(--shadow) !important;
}
.del-btn:hover {
	background-color: var(--white);
	color: var(--red);
}
.del-btn.show {
	background-color: var(--red);
	color: var(--white);
	z-index: 2005;
}

.del-btn.hover {
	opacity: 0.5;
}

.grab-handle {
	color: var(--gray);
	font-size: 12px;
	cursor: grab;
	opacity: 0.7;
	padding: 8px;
}

/* Clear rejected btn */
.clear-rejected-cv-btn {
	background-color: var(--red);
	color: var(--white);
	border: none;
	cursor: pointer;
	font-size: 13px;
	padding: 6px;
	padding-left: 10px;	
	padding-right: 10px;
	border-radius: 10px;
	transition: all 0.3s ease;
}
.clear-rejected-cv-btn:hover {
	opacity: 0.7;
}
.clear-rejected-cv-btn.disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

/* Restore application btn */
.restore-btn {
	font-size: 12px;
	/* background-color: #f0f; */
	padding: 10px;
	cursor: pointer;
	transition: all 0.3s ease;
}
.restore-btn:hover {
	opacity: 0.7;
}

.show-more-applications {
	font-size: 12px;
	margin-top: 0.5rem;
}

/* Ghost class styles: Applied to the placeholder of the item being dragged */
.ghost-class {
    opacity: 0.6; /* Make the placeholder semi-transparent */
    background-color: #f0f0f0; /* Light grey background */
    border: 2px dashed #cccccc; /* Dashed grey border */
}

/* Chosen class styles: Applied to the item when it has been picked up for dragging */
.chosen-class {
	background-color: transparent;
	border: none;
	/* box-shadow: var(--shadow); */
}

/* Drag class styles: Applied to the item while it is being dragged */
/* .drag-class {
	background-color: var(--primary);
	border: 2px solid var(--secondary);
	color: white;
	box-shadow: var(--shadow); 
} */
.profileview-social {
	list-style: none;
	padding: 0px;
	margin-top: 6px;
}
.profileview-social li:first-child {
	margin-left: 0px;
}
.profileview-social li {
	display: inline-block;
	margin: 0px 5px;
}
.profileview-custom-table-header {
	border-bottom: solid 2px var(--secondary);
}
.profileview-custom-table-content {
	background-color: var(--grey);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	font-size: 12px;
}
.profileview-skills-container {
	background-color: var(--grey);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border: solid 2px var(--secondary);
}
.profileview-info-container {
	background-color: var(--white);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border: solid 2px var(--secondary);
}
.profileview-cover-image {
	border: none;
	min-height: 20vh;
	max-height: 20vh;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.view-skill {
	background-color: var(--white);
	border-radius: var(--radius);
	border: solid 2px var(--secondary);
	display: block;
	margin-bottom: 5px;
}
.profileview-info-container p {
	margin-bottom: 0px;
	font-size: 12px;
}
.profileview-info-container span {
	font-weight: bold;
	font-size: 14px;
}

/* AGAPIMENA */
.savedprofile-company-img {
	min-width: 45px;
	height: 45px;
	display: inline-block;
	border-radius: 100%;
}

.savedprofile-img-container {
	position: relative;
}

.savedprofile-img-indicator {
	position: absolute;
	bottom: 0px;
	right: 0px;
	background-color: var(--grey);
	width: 12px;
	height: 12px;
	border-radius: 100%;
}
.savedprofile-img-indicator.available {
	background-color: var(--green);
}
.savedprofile-img-indicator.unavailable {
	background-color: var(--red);
}

.savedprofile-company-data {
	display: inline-block;
	margin-left: 15px;
}
.savedprofile-company-data p {
	margin: 0px;
	font-size: 12px;
}
.savedprofile-company-data p:first-child {
	font-weight: bold;
	font-size: 14px;
}
.savedprofile-company-data p:nth-of-type(2)
{
	opacity: 0.7;
	font-size: 12px;
}
#favoriteProfilesTable_filter {
	display: none;
}
.search-container {
	position: relative;
	width: 40%;
}

.favorite-img-container {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
}

#aitiseisSearch, #interviewSearch, .searchInput {
	border: solid 1px #ccc !important;
	width: 100%;
	padding-left: 28px !important; /* Adjust padding to make space for the icon */
}

.search-container::before {
	content: "\f002";
	font-family: FontAwesome;
	position: absolute;
	font-size: 12px;
	left: 10px;
	top: 48%;
	transform: translateY(-50%);
	color: var(--gray);
	transition: all 0.3s ease;
}

.search-container:focus-within::before {
	color: var(--primary);
}

.dataTables_info {
	font-size: 11px;
	opacity: 0.7;
}

/* AGAPIMENA */
#favoriteProfilesTable_filter {
	display: none;
}

.favorite-row {
	background-color: transparent !important;
}
.favorite-row.mobile {
	border: 1px solid #ccc;
	display: flex;
	align-items: center;
	padding: 10px;
	border-radius: 10px;
}

.favorite-cell {
	border: 1px solid #ccc;
	border-left-width: 0px;
	border-right-width: 0px;
	background-color: var(--white);
	border-top: 1px solid #ccc !important;
	box-shadow: none !important;
}
.favorite-cell:first-child {
	border-left-width: 1px;
}
.favorite-cell:last-child {
	border-right-width: 1px;
}
.favorite-cell p, .favorite-cell a {
	margin: 0px;
	font-size: 12px;
}

/* PACKAGES */
.package-card {
	border: solid 2px var(--primary);
	background-color: var(--grey);
	border-radius: 16px;
}
.package-price {
	font-weight: bold;
}
.package-price span {
	font-size: 24px;
	font-weight: bold;
	color: var(--secondary);
}
.package-list-features {
	border:none !important;
	font-size: 12px; 
}
.package-list-features li {
	background-color: var(--grey);
}
.packageSelectElement {
	border: solid 2px var(--primary);
	padding: 5px !important;
}
.packageSelectElement:focus {
	border: solid 2px var(--primary);
}
.payment-card {
	border: solid 1px #ccc;
	box-shadow: none;
}

.payment-card.error {
	border-color: var(--red);
}
.payment-card.error .payment-icon {
	color: var(--red);
}

.payment-card .btns-container {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.card-header-payment {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.card-title.payment {
	font-size: 16px;
	font-weight: bold;
	margin: 0px;
}

.card-desc.payment {
	font-size: 12px;
	opacity: 0.8;
	margin: 0px;
	/* margin-top: -10px; */
}

.payment-icon {
	font-size: 20px;
	color: var(--primary);
	margin: 0px;
}
/* BIOGRAFIKA */
.filter-col {
	background-color: var(--primary);
	padding: 0px;
}
.biografika-categories {
	border: 2px solid var(--white);
	box-shadow: inset 0 0px 0 transparent !important;
	cursor: pointer;
	transition: all 0.3s ease;
	background-position-x: 97%;
	font-size: 12px !important;
	background-color: #deb5ff !important;
}
.biografika-categories:focus {
	box-shadow: none !important;
	border: none !important;
}
.box-filter-title {
	color: var(--white);
	font-size: 13px;
}
.filter-icon {
	margin-right: 4px;
}
.clear-field {
	float: right;
	transition: all 0.3s ease;
}
.clear-field-disabled {
	opacity: 0.5;
	pointer-events: none;
}
.clear-field:hover {
	cursor: pointer;
}
.filters-separator {
	width: 100%;
	height: 1px;
	background-color: var(--dark-grey);
	/* margin-top: 1rem;
	margin-bottom: 1rem; */
	flex-shrink: 0;
	opacity: 0.8;
	border: none;
}
.filter-checkbox {
	accent-color: var(--secondary);
}
.filter-checkbox-title {
	color: #fff;
}

/* THOMAS */
.mobile-filters-btn {
	background-color: var(--secondary);
	width: fit-content;
	height: 45px;
	width: 45px;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease;
	position: fixed;
	z-index: 200;
	left: 2rem;
	bottom: 4rem;
	border: 0;
}

.mobile-filters-btn > .fa-filter {
	color: var(--white);
}

#mobileFiltersModal .modal-header {
	display: flex;
	flex-direction: row;
	align-items: center;
}

#mobileFiltersModal .modal-title {
	color: var(--white);
}

.modal-title {
	font-size: 18px !important;
	font-weight: 500;
}

.modal-desc {
	font-size: 14px;
}

.modal-content {
	border-radius: 10px !important;
	overflow: hidden;
	border-color: #e9e9e9 !important;
	border-width: 1px !important;
}

#viewprofile_image {
	box-shadow: 0px 10px 10px 0px #00000020;
}

#mobileFiltersModal .modal-content {
	background-color: var(--primary);
	border: 0px;
	padding: 10px;
	border-radius: var(--radius);
}

#mobileFiltersModal .btn-close {
	background-color: var(--primary);
	border: 0px;
	transition: all 0.4s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}
#mobileFiltersModal .btn-close:hover {
	opacity: 0.7;
}

#mobileFiltersModal .btn-close .fa-x {
	color: var(--white);
}

#mobileFiltersModal .show-res-btn {
	background-color: var(--secondary);
	border: 0px;
	width: 100%;
	border-radius: var(--radius);
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 50px;
}
#mobileFiltersModal .show-res-btn:hover {
	opacity: 0.8;
}

#mobileFiltersModal .show-res-btn p {
	color: var(--white);
	font-weight: bold;
	margin: 0px;
}

#mobileFiltersModal h6 {
	font-size: 14px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

/* Bottom navbar - mobile */
.mobile-bottom-navbar {
	padding: 30px;
	padding-bottom: 4px;
	padding-top: 20px;
	background-color: var(--primary);
	border-top: 2px solid var(--secondary);
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 200;
	margin: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}

.mobile-bottom-navbar > .nav-col {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	border: 0px;
	width: fit-content;
	cursor: pointer;
}

.mobile-bottom-navbar > .col-selected > svg {
	color: var(--secondary) !important;
}
.mobile-bottom-navbar > .col-selected > p {
	color: var(--secondary) !important;
}

.mobile-bottom-navbar > .nav-col > p {
	color: var(--white);
	font-size: 13px;
	transition: all 0.4s ease;
}

.mobile-bottom-navbar > .nav-col > svg {
	color: var(--white);
	transition: all 0.4s ease;
}

.mobile-bottom-navbar > .nav-col:hover > svg {
	color: var(--secondary);
}
.mobile-bottom-navbar > .nav-col:hover > p {
	color: var(--secondary);
}

/* Employer/employee switch */
.employer-switch svg {
	color: var(--secondary);
	height: 18px;
}

.employer-switch-option a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	padding-left: 20px;
	text-decoration: none;
}
.employer-switch-option svg {
	color: var(--primary);
	transition: all 0.2s ease;
}
.employer-switch-option p {
	color: var(--primary);
	margin: 0;
	transition: all 0.2s ease;
	font-size: 14px;
}

.employer-switch-option:hover svg, .employer-switch-option:hover p {
	opacity: 0.7;
}

/* SHARE PAGE */
.pin-box {
	width: 50%;
	margin: 0 auto;
	background-color: var(--primary);
	border-radius: var(--radius);
}
.pin-box label {
	color: var(--white);
}

/* =========<  THOMAS  >========= */

/* Cropper modal */
#imageModal .zoom-range {
	width: 100%;
	-webkit-appearance: none;
	width: 100%;
	height: 24px;
	background: var(--primary);
	border-radius: 20px;
	outline: none;
	opacity: 0.7;
	-webkit-transition: .2s;
	transition: opacity .2s;
}

#imageModal .zoom-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 24px;
	height: 24px;
	border-radius: 100%;
	background: var(--secondary);
	border: 0px;
	cursor: pointer;
}

#imageModal .zoom-range::-moz-range-thumb {
	width: 24px;
	height: 24px;
	border-radius: 100%;
	background: var(--secondary);
	border: 0px;
	cursor: pointer;
}

#imageModal .range-wrapper {
	margin-top: 12px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
}

.resume-file-upload-desc {
	padding: 10px;
	padding-left: 0px;
}

.resume-file-upload-desc p {
	font-size: 12px;
	color: var(--dark-grey);
}

.with-resumeViewer {
	position: fixed;
	top: 1rem;
	z-index: 9000;
	left: 1rem;
	background-color: var(--white);
	border-radius: 20px;
	width: 40%;
	max-width: 40%;
	max-height: 95vh;
	min-height: 95vh;
	opacity: 0;
	pointer-events: none;
	overflow: auto;
	transition: all 0.3s ease;
}
.with-resumeViewer.open {
	opacity: 1;
	pointer-events: all;
}

.headerFlexContainer {
	display: flex;
	gap: 1rem;
}


/*
*	+------------------------+
* |    EMPLOYER PROFILE    |
* +------------------------+
*/
/* Cover */
.profileCover {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 12rem;
	border-radius: 10px;
}

/* Data wrapper -- Image, name, socials */
.dataWrapper {
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	gap: 0.8rem;
}

/* Image */
.profileImg {
	height: 6rem;
	width: 6rem;
	border-radius: 10px;
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	margin-top: -2.5rem;
}

/* Name */
.profileName {
	font-weight: 600;
	font-size: 16px;
	margin: 0;
}

/* Industry */

/* Applicants Counter Styles */
.applicants-counter-container {
	margin-top: 3rem;
}
.applicants-counter-wrapper {
    display: flex;
    align-items: center;
    gap: 20px;
}

.users-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.users-icon {
    font-size: 2rem;
    color: var(--secondary);
}

.counter-section {
    flex: 1;
}

.counter-number {
    font-size: 1.8rem;
    font-weight: bold;
    color: #fff;
    line-height: 1;
}

.counter-message {
    font-size: 1rem;
    color: #fff;
    margin-top: 5px;
    opacity: 0.9;
}

/* Trusted Customers Styles */
.trusted-customers-container {
    margin-top: 3rem;
}

.trusted-customers-title {
    font-size: 1.2rem;
    color: #fff;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.trusted-logos-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 15px;
    max-width: 100%;
}

.trusted-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    /* background: rgba(255, 255, 255, 0.05); */
    border-radius: 8px;
    /* border: 1px solid rgba(255, 255, 255, 0.1); */
    transition: all 0.3s ease;
    height: 60px;
}

.trusted-logo:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

.trusted-logo img {
    max-width: 100%;
    max-height: 40px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

.trusted-logo:hover img {
    opacity: 1;
}
.hide-on-desktop {
	display: none;
}

@media (max-width: 768px) {
	.hide-on-desktop {
		display: block;
		text-align: center;
	}
	.applicants-counter-container {
		margin-top: 0rem;
	}
	.applicants-counter-wrapper {
		justify-content: center;
		gap: 15px;
		width: 75%;
		margin: 0 auto;
	}
	.counter-number {
		font-size: 1.2rem;
		opacity: 0.8;
	}
	.counter-message {
		font-size: 0.9rem;
		opacity: 0.8;
	}
	.users-icon {
		display: none;
	}
	.trusted-customers-container {
		margin-top: 1rem;
	}
	.trusted-customers-title {
		display: none;
	}

	/* Mobile Marquee Effect */
	.trusted-customers-container.hide-on-desktop .trusted-logos-grid {
		display: flex;
		overflow: hidden;
		position: relative;
		width: 100%;
		height: 60px;
	}
	
	.trusted-customers-container.hide-on-desktop .trusted-logos-grid::before,
	.trusted-customers-container.hide-on-desktop .trusted-logos-grid::after {
		content: '';
		position: absolute;
		top: 0;
		width: 30px;
		height: 100%;
		z-index: 2;
		pointer-events: none;
	}
	
	/* .trusted-customers-container.hide-on-desktop .trusted-logos-grid::before {
		left: 0;
		background: linear-gradient(to right, rgba(0,0,0,0.8), transparent);
	}
	
	.trusted-customers-container.hide-on-desktop .trusted-logos-grid::after {
		right: 0;
		background: linear-gradient(to left, rgba(0,0,0,0.8), transparent);
	} */
	
	.trusted-customers-container.hide-on-desktop .trusted-logos-marquee {
		display: flex;
		animation: marquee 30s linear infinite;
		gap: 5px;
		width: calc(200% + 40px);
	}
	
	.trusted-customers-container.hide-on-desktop .trusted-logo {
		flex-shrink: 0;
		width: 80px;
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		/* background: rgba(255, 255, 255, 0.05); */
		border-radius: 6px;
		/* border: 1px solid rgba(255, 255, 255, 0.1); */
	}
	
	.trusted-customers-container.hide-on-desktop .trusted-logo img {
		max-width: 60px;
		max-height: 30px;
		filter: brightness(0) invert(1);
		opacity: 0.6;
	}
	
	@keyframes marquee {
		0% { transform: translateX(0); }
		100% { transform: translateX(calc(-50% - 10px)); }
	}

    .trusted-logos-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
    }
    
    .trusted-logo {
        height: 50px;
    }
    
    .trusted-logo img {
        max-height: 30px;
    }
}
.profile-industry-name {
	opacity: 0.8;
	font-size: 12px;
}

/* Socials container */
.profileSocialsContainer {
	display: flex;
	flex-direction: row;
	gap: 0.5rem;
}
/* Disable blue link decoration on icons */
.profileSocialsContainer a {
	color: #000 !important;
}
.profileSocialsContainer a svg {
	height: 18px;
}

/* About */
.profileAbout p {
	font-size: 12px;
	color: #7b7b7b;
}

/*
*	More Jobs
*/
/* Container */
.profileJobsContainer {
	gap: 1rem;
}

/* Job wrapper */
.profileJobWrapper {
	background-color: var(--grey);
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	border-radius: 10px;
	width: 50%;
	padding: 1rem;
}

/* Aggelies card */
.aggelia-foryou {
	border: solid 2px var(--secondary);
	/* height: 360px; */
	background-color: var(--grey);
}

/* Card body */
.aggelia-card .card-body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	scroll-snap-align: center;
	max-width: none;
  object-fit: contain;
}

.card-title {
	font-size: 14px;
	font-weight: 400;
}

/* CVs container */
.cvs-container {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-items: center;
	gap: 8px;
	/* background-color: #f0f; */
	transition: all 0.3s ease;
}

.cv-count-result {
	display: none;
}

/*
* CV Card
*/
.single-cv-card {
	position: relative;
}

.single-cv-card:hover {
	cursor: pointer;
}
.single-cv-card:hover .card-preview-overlay {
	opacity: 1;
}
.single-cv-card:hover .card-preview-overlay svg {
	transform: rotateY(0deg);
}

/* Initials (fallback) */
.cv-initials {
	font-weight: 600;
	position: absolute;
	top: 50%;
	left: 50%;
	opacity: 0.7;
	transform: translate(-50%, -50%);
}

.preview-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	text-decoration: none;
	text-decoration: none !important;
	gap: 2px;
	width: 100%;
	height: 100%;
}

.cv-availability-text {
	/* color: #fff; */
	font-size: 11px;
}

/* Preview overlay */
.card-preview-overlay {
	position: absolute;
	top: 0;
	z-index: 60;
	width: 100%;
	height: 100%;

	opacity: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(20px);
	background-color: #ffffff75;
	border: 1px solid #ccc;
	border-radius: var(--radius);

	transition: all 0.3s ease;
}
.card-preview-overlay svg {
	color: var(--primary);
	font-size: 16px;
	transform: rotateX(90deg) translateZ(-10px);
	transition: all 0.3s ease;
}

.cv-card {
	background-color: var(--white);
	border: 1px solid #ccc;
	box-shadow: none;
	max-height: 108px;
	width: 100%;
	width: 15rem;
	margin: 0px !important;
	border-radius: 12px;
	z-index: 50;
	padding: 0px !important;
}
.cv-card .card-body {
	padding: 1rem !important;
}
.cv-img-box {
	min-width: 60px;
	min-height: 60px;
	height: 60px;
	width: 60px;

	position: relative;
	background-repeat: no-repeat;
	background-size: 100%;
	background-color: #fff;
	background-position: center center;
	border-radius: 100%;
	margin-bottom: 15px;
	/* display: inline-block; */
	float: left;
}
.cv-img-box-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: fit-content;
	gap: 12px;
}
/* Title and company wrapper */
.cv-title-company-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.cv-company {
	font-weight: 600;
	color: #000 !important;
	font-size: 14px;
}
.cv-title {
	word-break: break-word;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 12px;
	font-weight: 400;
}
.cv-availability {
	width: 15px;
	height: 15px;
	background-color: var(--red);
	border-radius: 100%;
	position: absolute;
	bottom: 0px;
	right: 0px;
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
}
.cv-data {
	display: inline-block;
	width: 100%;
}
.cv-data > .badge {
	background-color: #fff;
	padding: 5px 10px;
}
.cv-buttons > .btn-secondary {
	border: solid 2px var(--secondary);
}

.cv-card .card-body {
	display: flex;
	width: 100%;
}


.aggelia-company {
	font-size: 14px;
}
.aggelia-title {
	word-break: break-word;
	/* overflow: hidden; */
	text-overflow: ellipsis;
	font-size: 14px;
}
.aggelia-data {
	display: grid;
	width: 100%;
	gap: 10px;
}
.aggelia-data > .badge {
	background-color: #fff;
	padding: 10px 10px;
}

.aggelia-buttons {
	display: inline-flex;
	height: fit-content;
	gap: 8px;
}

.aggelia-buttons > .btn-secondary {
	border: solid 2px var(--secondary);
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.aggelia-buttons > .btn-secondary > svg {
	height: 12px;
}

.aggelia-buttons > .btn-outline-secondary {
	border: solid 2px var(--secondary);
	background-color: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.aggelia-img-box {
	height: 76px;
	width: 76px;
	background-repeat: no-repeat;
	background-size: 100%;
	background-color: #fff;
	background-position: center center;
	border-radius: var(--radius);
	/* display: inline-block; */
}


/*
* INFO
*/
.profileInfoText {
	font-weight: 500;
	font-size: 18px;
}

/* Info wrapper */
.profileInfoWrapper {
	border: solid 2px var(--secondary);
	min-height: 10rem;
	border-radius: 10px;
	background-color: var(--white);
}

/* Info text key */
.profileInfoKey {
	margin: 0 !important;
	color: var(--dark-grey);
	font-size: 12px;
}

/* Info text value */
.profileInfoValue {
	margin: 0 !important;
	font-weight: 500;
}

.single-aggelia-share-top {
	padding: 0px;
	list-style: none;
	text-align: left;
	padding-right: 8px;
	margin: 0px;
}
.single-aggelia-share-top li {
	display: inline-block;
	margin: 0px 3px;
}
.single-aggelia-share-top a {
	color: var(--primary);
	font-size: 20px;
}
#gen-ai-default-icon, #gen-ai-spinner {
    transition: opacity 0.3s ease;
}

#generate-ai-ad:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* business details page */
.business-details-steps a{
	font-size: 18px !important;
}
.business-details-steps .page-item.active .page-link {
	background-color: var(--primary);
	border-color: var(--primary);
}
.business-details-steps .pagination-lg .page-item:first-child .page-link {
	border-top-left-radius: var(--radius);
	border-bottom-left-radius: var(--radius);
}
.business-details-steps .page-link {
	color: var(--primary);
}
/* Rotation animation -- used for customBtn border anim */
@keyframes rotate {
	to {
	  --angle: 360deg;
	}
  }
  
/* Angle property */
@property --angle {
	syntax: "<angle>";
	initial-value: 0deg;
	inherits: false;
}
.selected-package {
	border: solid 5px #0000;
	background: linear-gradient(#ebeaea, #ebeaea) padding-box, linear-gradient(
	  var(--angle),
	  var(--primary),
	  var(--secondary)
	) border-box;
	animation: 5s rotate linear infinite;
}
@media all and (max-width: 991px) {
	.business-details-steps a{
		font-size: 15px !important;
	}
}


/* Profile sidebar widget */
.side-widget {
	background-color: rgba(255, 255, 255, 0.18);
	/* width: 100%; */
	border-radius: var(--radius);
	/* box-shadow: 0px 10px 10px 0px #00000015; */
	width: 75%;
	position: relative;
	z-index: 20;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	padding-bottom: 0px !important;
	color: var(--white);
}
.progress {
	background-color: var(--dark-grey);
}

/* NOTIFICATIONS */
.notifications-dropdown .dropdown-toggle::after {
	display: none;
}
#notificationDropdownBtn {
	max-height: 40px;
	min-height: 40px;
	display: block;
	color: var(--primary);
	font-size: 1.2rem;
}
#notificationDropdownBtn:hover {
	cursor: pointer;
}
.notifications-badge {
	position: absolute;
	left: 20px;
	top: 5px;
	font-size: 10px;
	background-color: var(--secondary);
}

.notifications-drop-container {
	right: 0 !important;
	left: auto;
}
.notif-divider {
	width: 85%;
	margin: 0 auto;
}
.notif-row-unread {
	border-left: solid 2px var(--secondary);
}
.notif-color-read {
	/* background-color: transparent; */
	color: #0000008c;
}
.notif-title {
	font-weight: bold;
	font-size: 15px;
}
.notif-text {
	font-size: 13px;
}
.notif-date {
	font-size: 12px;
}
.notif-more-btn {
	font-size: 13px;
}
@media (max-width: 768px) {
	.notifications-drop-container {
		width: auto !important;
		right: 10px !important;
		left: auto !important;
		min-width: 280px !important;
		max-width: calc(100vw - 20px) !important;
		transform: translateX(0) !important;
	}
	.notifications-dropdown {
		position: relative;
	}
	
	/* Fix notification table responsiveness */
	.notif-table {
		width: 100% !important;
		table-layout: auto !important;
	}
	.notif-table td {
		width: auto !important;
		min-width: auto !important;
		max-width: none !important;
		padding: 4px !important;
	}
	.notif-table td:first-child {
		width: 40px !important;
		min-width: 40px !important;
		max-width: 40px !important;
	}
	.notif-table td:last-child {
		width: 50px !important;
		min-width: 50px !important;
		max-width: 50px !important;
		text-align: right !important;
	}
	.notif-profile-image {
		width: 32px !important;
		height: 32px !important;
	}
	.notif-title {
		font-size: 11px !important;
		line-height: 1.2 !important;
	}
	.notif-text {
		font-size: 10px !important;
		line-height: 1.2 !important;
	}
	.notif-date {
		font-size: 9px !important;
	}
}


/* Calendar */


#calendar {
	max-width: 100%;
	margin: 0 auto;
}
.fc-button {
	background-color: var(--primary) !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
	.fc-toolbar {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.fc-button-group {
		margin-top: 5px;
	}

	.fc-toolbar-title {
		font-size: 18px;
	}

	.fc-view-harness {
		max-height: 400px; /* Prevents scrolling issues */
	}
}

/* Contact modal */
.contact-modal-close {
	font-size: 20px;
	color: #fff;
}
.contact-modal-close:hover {
	cursor: pointer;
}
.contact-modal-form input, .contact-modal-form select, .contact-modal-form textarea {
	border: solid 2px var(--secondary);
	padding: 3px;

}


.accordion-button:not(.collapsed) {
	color: var(--white);
	background-color: var(--primary);
}
.accordion-button:focus {
	box-shadow: none;
}

#footer {
	padding-top: 5rem;
	padding-bottom: 2rem;
}
@media (max-width: 991px) {
	#footer {
		padding-top: 0;
		padding-bottom: 30px;
	}
}

.loadMoreCv {
    background-color: transparent;
    border-color: transparent;
    color: var(--primary);
}
.loadMoreCv:hover {
	color: var(--primary);
	opacity: 0.7;
}

/* Profile Settings container */
.profile-settings-container {
	display: flex;
	background-color: var(--grey);
}

/*
* Profile sidebar
*/
/* Container */
.profile-sidebar-container {
	transition: all 1s ease;
	display: flex;
	flex-direction: column;
	position: relative;
	width: fit-content;
	left: -1rem;
	height: fit-content;
	padding-top: 2rem;
	gap: 0px;
	background-color: var(--grey);
	margin-left: -12rem;
	z-index: 0;
	animation: slideIn 1s forwards;
	animation-delay: 0.5s;
}
.profile-sidebar-container.job {
	display: none;
}

@keyframes slideIn {
	from {
		margin-left: -12rem;
	}
	to {
		margin-left: 0;
	}
}

.profile-sidebar-item, .job-sidebar-item {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	padding: 10px;
	padding-left: 2rem;
	padding-right: 2rem;
	user-select: none;
	transition: all 0.3s ease;
	position: relative;
}
.profile-sidebar-item:hover, .profile-sidebar-item-active, .job-sidebar-item:hover, .job-sidebar-item-active {
	color: var(--white);
}

.profile-sidebar-item::before, .job-sidebar-item::before {
	background-color: transparent;
	left: 0;
	top: 0;
	content: "";
	width: 90%;
	position: absolute;
	height: 100%;
	z-index: -1;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	transition: all 0.4s ease;
}
.profile-sidebar-item-active::before, .profile-sidebar-item:hover::before, .job-sidebar-item:hover::before, .job-sidebar-item-active::before {
	background-color: var(--primary) !important;
}
.profile-sidebar-icon {
	height: 14px;
	width: 14px;
}

.profile-sidebar-label {
	font-size: 12px;
	margin-bottom: 0px;
}

.profile-sidebar-title {
	font-size: 16px;
	margin-top: -2px;
	font-weight: 600;
	margin-bottom: 10px;
	padding-left: 2rem;
}


/* Job usage */
.job-usage-wrapper {
	display: flex;
	flex-direction: column;
	gap: 0px;
	background-color: var(--grey);
	padding: 10px;
	border-radius: 10px;
	width: 100%;
	align-items: center;
	margin-top: -1rem;
}

.job-usage-wrapper h5, .job-usage-wrapper p {
	margin: 0px;
}
.job-usage-wrapper h5 {
	margin-bottom: 4px;
	font-weight: 500;
	font-size: 14px;
}
.job-usage-wrapper p {
	font-size: 12px;
	font-weight: 300;
}


/*
* Appointments
*/
/* Header */
.appointments-header {
	display: flex;
	align-items: center;
	gap: 2rem;
}
.header-title {
	font-size: 24px;
	font-weight: 600;
	margin: 0px;
}

.appointment-name-container {
	display: flex;
	flex-direction: column;
	gap: 0px;
}

.appointment-name {
	font-size: 14px;
	font-weight: 600;
	margin: 0px;
}
.appointment-prof {
	font-size: 12px;
	opacity: 0.8;
	margin-top: -2px !important;
}

/* Remove the border from the modal */
.no-modal-border .modal-content {
	border: none !important;
}

/*
* PROFILE VIEW MODAL
*/
/* Container */
.modal-profile-view-container {
	position: fixed;
	right: 0;
	top: 0;
	height: 100%;
	z-index: 9000;
	outline: none !important;
	transition: all 0.4s ease;
	min-width: 36rem;
	max-width: 36rem;
	transform: translateX(100%);
	background-color: var(--white);
	box-shadow: -10px 10px 10px 0px #00000015;
	border-radius: 20px 0px 0px 20px;
	overflow: hidden;
}
.modal-profile-view-container.open {
	transform: translateX(0);
}

.modal-profile-view-container.search {
	z-index: 7000;
}

/* Backdrop */
.modal-profile-view-backdrop {
	position: fixed;
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s ease;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(4px);
	background-color: #00000050;
	z-index: 8000;
}
.modal-profile-view-backdrop.open {
	opacity: 1;
	pointer-events: all;
}

.modal-profile-view-backdrop.search {
	z-index: 6000;
}

/* Header */
.modal-profile-view-header {
	height: 6rem;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	z-index: 40;
}

/* Wrapper */
.modal-profile-wrapper {
	display: flex;
	height: 90%;
	flex-direction: column;
	justify-content: space-between;
}

/* Content wrapper */
.modal-profile-view {
	height: fit-content;
	position: relative;
	padding: 2rem;
	height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	scrollbar-width: none;
	display: flex;
  flex-direction: column;
  padding-bottom: 0px;
}
.modal-profile-view::-webkit-scrollbar {
	display: none;
}

.modal-profile-btns-container {
	display: flex;
  height: fit-content;
  padding-bottom: 1rem;
}

/* Action btns container */
.modal-profile-btns {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: 1rem;
	align-items: center;
	padding: 1rem;
	width: 100%;
	background-color: var(--primary);
	margin-bottom: -1rem; /* //! DEBUG */
}

.modal-profile-btns.notes {
	flex-direction: column;
	gap: 10px;
}

.modal-profile-note-title {
	margin-bottom: 0px;
	color: var(--white);
	align-self: flex-start;
	font-weight: 500;
	font-size: 14px;
}

.notes-input {
	border: none;
	height: 8rem !important;
	font-size: 12px !important;
}

.modal-profile-view-btn-action {
	background-color: var(--white);
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px;
	height: 40px;
	width: fit-content;
	color: var(--white);
	border: none;
	font-size: 14px;
	border-radius: 10px;
	box-shadow: 0px 4px 5px 0px #00000020;
	cursor: pointer;
	transition: all 0.3s ease;
}
.modal-profile-view-btn-action.accept {
	background-color: var(--white);
	color: var(--green);
}
.modal-profile-view-btn-action.reject {
	background-color: var(--white);
	color: var(--red);
}
.modal-profile-view-btn-action:hover {
	opacity: 0.7;
}

.modal-profile-view-btn-action p {
	margin: 0;
	font-size: 12px;
	font-weight: 500;
}

.modal-profile-view-img-container {
	position: absolute;
	bottom: -3.5rem;
	left: 1rem;
	z-index: 50;
}
.modal-profile-view-img-container.mobile {
	position: relative;
	bottom: auto;
	left: auto;
	width: fit-content;
}

/* Profile Img */
.modal-profile-view-img, .modal-profile-view-no-image-container {
	border-radius: 100%;
	height: 6rem;
	min-width: 6rem;
}
.modal-profile-view-img.mobile, .modal-profile-view-no-image-container.mobile {
	height: 3.5rem;
	min-width: 3.5rem;
}

.modal-profile-view-no-image-container {
	background-color: var(--white);
	border: 1px solid #ccc;
	display: flex;
	align-items: center;
	justify-content: center;
}

.modal-profile-no-image-initials {
	margin: 0px;
	font-size: 22px;
	font-weight: 500;
}
.modal-profile-no-image-initials.mobile {
	font-size: 18px;
}

/* Availablity indicator */
.modal-profile-view-img-indicator {
	width: 1rem;
	height: 1rem;
	background-color: var(--dark-grey);
	border-radius: 100%;
	position: absolute;
	bottom: 5px;
	right: 5px;
}
.modal-profile-view-img-indicator.mobile {
	bottom: 0px;
	right: 0px;
}
.modal-profile-view-img-indicator.unavailable {
	background-color: var(--red);
}
.modal-profile-view-img-indicator.available {
	background-color: var(--green);
}

/* Availability text */
.modal-profile-view-availability {
	font-size: 11px;
}
.modal-profile-view-availability.unavailable {
	color: var(--red);
}
.modal-profile-view-availability.available {
	color: var(--green);
}

.modal-profile-view-updated {
	font-size: 11px;
	opacity: 0.8;
}


.modal-profile-view-info-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	left: 5.8rem;
	top: -2.3rem;
	position: relative;
}
.modal-profile-view-info-wrapper p {
	margin: 0px;
}

/* Buttons */
.modal-profile-view-buttons {
	margin-right: 4rem;
	display: flex;
	flex-direction: row;
	gap: 5px;
}

.modal-profile-view-btn-filled {
	background-color: var(--primary);
	color: var(--white);
	border: none;
	padding: 8px;
	border-radius: 8px;
	font-size: 11px;
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	transition: all 0.3s ease;
}
.modal-profile-view-btn-filled:hover {
	opacity: 0.7;
}
.modal-profile-view-btn-filled.disabled {
	opacity: 0.5 !important;
	cursor: default !important;
}

.modal-profile-view-btn {
	background-color: transparent;
	border: none;
	color: var(--primary);
	height: 30px;
	width: 30px;
	font-size: 18px;
	outline: none !important;
	transition: all 0.3s ease;
}
.modal-profile-view-btn:hover {
	opacity: 0.7;
}
.modal-profile-view-btn.mobile {
	font-size: 22px;
	margin-right: 4px;
}

/* Info wrapper (name && prof) */
.modal-profile-view-info {
	display: flex;
	flex-direction: column;
	position: relative;
}

.modal-profile-view-name {
	font-size: 18px;
	font-weight: 600;
}
.modal-profile-view-prof {
	font-size: 14px;
	opacity: 0.8;
	margin-top: -3px !important;
}

/* Bio */
.modal-profile-view-bio {
	font-size: 12px;
	opacity: 0.8;
}

/* Tabs Container */
.modal-profile-view-tabs-container {
	display: flex;
	flex-direction: row;
	/* gap: 10px; */
	width: 100%;
}
.modal-profile-view-tabs-container .nav-item.disabled {
	opacity: 0.5;
	pointer-events: none;
}
.modal-profile-view-tabs-container .nav-item.disabled {
	opacity: 0.5;
	pointer-events: none;
}

.modal-profile-view-tabs-content {
	padding-top: 1rem;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-width: none;
}
.modal-profile-view-tabs-content::-webkit-scrollbar {
	display: none;
}

/* Tab */
.modal-profile-view-tabs-container a {
	color: var(--white);
	margin: 0px;
	opacity: 0.8;
	font-size: 12px;
}
.modal-profile-view-tab.active, .modal-profile-view-tab:hover {
	opacity: 1;
}
.modal-profile-view-tabs-container .nav-link.active {
	font-weight: 500;
	opacity: 1;
	color: var(--primary) !important;
	box-shadow: inset 0 -2px 0 var(--primary);
}

/* Info container */
.modal-profile-info-container {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-bottom: 1rem;
}

/* Info item wrapper */
.modal-profile-info-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid #cccccc;
	padding: 12px;
	border-radius: 10px;
}
.modal-profile-info-wrapper.action {
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	transition: all 0.3s ease;
}
.modal-profile-info-wrapper.action:hover .modal-profile-info-action {
	color: var(--secondary);
}

/* Action */
.modal-profile-info-action {
	color: #c4c4c4;
	font-size: 14px;
	margin-right: 4px;
	transition: all 0.3s ease;
}
.modal-profile-info-action:hover {
	opacity: 0.7;
}

.modal-profile-info-text-wrapper {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

/* Row */
.modal-profile-info-row {
	display: flex;
	width: 100%;
	gap: 10px;
	justify-content: space-between;
}

/* Label */
.modal-profile-info-wrapper p {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
}
.modal-profile-info-wrapper span {
	font-weight: 400;
	opacity: 0.8;
	font-size: 12px;
}

/* Experience container */
.modal-profile-exp-container {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	padding-bottom: 1rem;
}

.modal-profile-exp-container #working_experiences, .modal-profile-exp-container #education_records,
.modal-profile-exp-container #working_experiences_mobile, .modal-profile-exp-container #education_records_mobile {
	display: none;
}

/* Experience wrapper */
.modal-profile-exp-wrapper {
	display: flex;
	flex-direction: column;
	width: fit-content;
	border: 1px solid #cccccc;
	width: calc(100%/2 - 1rem);
	padding: 12px;
	border-radius: 10px;
}
.modal-profile-exp-wrapper p {
	margin: 0;
}

/* Job title */
.modal-profile-exp-job {
	font-size: 14px;
	font-weight: 500;
	line-height: 18px;
}

/* Company */
.modal-profile-exp-comp {
	font-size: 12px;
}

/* Date */
.modal-profile-exp-date {
	font-size: 11px;
	opacity: 0.8;
}

/* Skills container */
.modal-profile-skills-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

/* Skill item */
.modal-profile-skills-item-wrapper {
	border: 1px solid #cccccc;
	padding: 6px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 10px;
}
.modal-profile-skills-item-wrapper.lang {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.modal-profile-answ-row-container {
	padding-bottom: 1rem;
}

.modal-profile-answ-row-background {
	background-color: var(--grey);
	padding-bottom: 1rem;
}

/* Answers container */
.modal-profile-answ-container {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.modal-profile-answ-container.interview {
	gap: 6px;
	max-height: 14rem;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-width: none;
}
.modal-profile-answ-container.interview::-webkit-scrollbar {
	display: none;
}

/* Hide the first child */
#answer_records {
	display: none;
}

.modal-profile-answ-speech-wrapper {
	display: flex;
	gap: 5px;
	justify-content: flex-start;
}
.modal-profile-answ-speech-wrapper.answer {
	justify-content: flex-end;
}
.modal-profile-answ-speech-avatar {
	height: 40px;
	min-width: 40px;
	max-width: 40px;
	border-radius: 100%;
	background-color: #ccc;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
}
.modal-profile-answ-speech-avatar-initials {
	font-size: 14px;
	font-weight: 500;
	margin: 0px;
}
.modal-profile-answ-speech-text-wrapper {
	min-height: 40px;
	border: 1px solid #ccc;
	border-radius: 10px;
	padding: 10px;
	max-width: 100%;
}
.modal-profile-answ-speech-text {
	font-size: 12px;
	margin: 0px;
}
.modal-profile-answ-speech-text.no-answer {
	color: var(--red);
}


/* Label */
.modal-profile-skills-item-label {
	font-size: 12px;
}
.modal-profile-skills-item-label.lang {
	font-weight: 500;
}
.modal-profile-skills-item-label.sub {
	font-weight: 300;
}
#languages, #skills {
	margin-top: 10px;
}

/* Skill match symbol for modal profile view */
.modal-profile-skills-item-wrapper {
	position: relative;
}

.skill-match-symbol {
	position: absolute;
	top: -8px;
	right: -8px;
	background-color: var(--primary);
	color: var(--white);
	border-radius: 50%;
	width: 18px;
	height: 18px;
	font-size: 12px;
	text-align: center;
	line-height: 18px;
	font-weight: bold;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
	z-index: 1;
}

.skill-match-symbol.required {
	/* background-color: var(--success, #198754); */
}

.skill-match-symbol.optional {
	/* background-color: var(--info, #0dcaf0); */
}

.skill-matched {
	border-color: transparent;
	/* background-color: rgba(25, 135, 84, 0.1); */
}

.nav-skills-container {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.modal-profile-lang-title {
	margin: 0px;
	font-size: 16px;
	font-weight: 500;
}

.navbar {
	z-index: 3030;
	box-shadow: none;
}


/* Socials container */
.modal-profile-view-socials {
	position: absolute;
	right: 1rem;
	top: 1rem;
	display: flex;
	flex-direction: row;
	gap: 0.8rem;
	font-size: 18px;
	text-decoration: none;
}
.modal-profile-view-socials a {
	color: var(--primary);
	transition: all 0.3s ease;
}
.modal-profile-view-socials a:hover {
	opacity: 0.6;
}
.modal-profile-view-socials.mobile {
	position: relative;
	top: 0;
	left: 0;
	margin-bottom: -0.5rem;
	gap: 1rem;
}


@media (max-width: 768px) {
	.text-homepage-title {
		width: 100%;
		margin-left: -2rem;
		margin-right: -2rem;
	}
	.homepage-features-container {
		margin-left: -2rem;
		margin-right: -2rem;
	}
	.homepage-feature-wrapper {
		width: 100%;
		padding: 1rem;
		padding-left: 2rem;
		padding-right: 2rem;
		height: fit-content;
	}
	.homepage-feature-icon-wrapper {
		width: 8rem;
		height: 8rem;
		top: -4rem;
		right: -4rem;
	}
	.homepage-feature-icon {
		font-size: 20px;
		left: 1.7rem;
		bottom: 1.7rem;
	}
	.homepage-feature-subtitle {
		font-size: 12px;
	}
	.homepage-feature-title {
		font-size: 16px;
		width: 90%;
	}


	#main-banner {
		margin-top: -10px;
		/* max-height: 480px;
		min-height: 480px; */
		/* background-image: url('/assets/images/employer_mobile_banner.jpg') !important; */
		background-position: bottom center;
		background-size: cover;
	}
	.search-form-wrap {
		margin-top: 4rem;
	}

	#search-job {
		margin: 0px !important;
	}
	#search-job .homepage-text {
		min-height: 200px !important;
		margin-bottom: 0px !important;
		margin-top: 80px;
	}

	.homepage-title {
		font-size: 20px !important;
	}
	.homepage-subtitle {
		font-size: 14px !important;
		margin-top: 4px !important;
		margin-bottom: 4px !important;
	}

	#langSwitchBtn {
	  max-height: 40px;
	  min-height: 40px;
	  display: block;
	  /* color: var(--secondary) !important; */
	  font-size: 16px;
  }
	#notificationDropdownBtn {
		font-size: 16px !important;
	}

	.brand-logo {
		font-size: 20px;
		margin-left: 1rem !important;
		padding-left: 0px !important;
		justify-content: unset;
		flex: 0 0 40%;
		max-width: 40%;
	}
	.brand-logo img {
		width: 100%;
	}
	.navbar {
		z-index: 2004 !important;
		/* background-color: var(--primary) !important; */
	}
	.navbar-light {
		background-color: var(--primary) !important;
	}
	.headerFlexContainer {
		color: var(--white) !important;
	}
	#langSwitchBtn {
		color: var(--secondary);
	}
	.profile-side-nav {
		margin-bottom: 0px !important;
	}

	.nav-indicator {
		left: auto;
		right: 10px;
		top: -10px;
	}

	.mobile-sticky-nav-bottom {
		z-index: 2004 !important;
	}

	.notifications-badge {
		font-size: 10px;
	}
}


/*
* Profile options mobile sheet
*/
/* Backdrop */
.modal-mobile-application-options-backdrop, .mobile-sheet-backdrop, .modal-mobile-profile-preview-backdrop {
	position: fixed;
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s ease;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(8px);
	background-color: #00000040;
	z-index: 8000;
}
.modal-mobile-application-options-backdrop.open, .mobile-sheet-backdrop.open, .modal-mobile-profile-preview-backdrop.open {
	opacity: 1;
	pointer-events: all;
}

/* Container */
.modal-mobile-application-options, .mobile-sheet {
	position: fixed;
	right: 0;
	bottom: 0;
	height: fit-content;
	z-index: 9000;
	outline: none !important;
	transition: all 0.4s ease;
	width: 100%;
	transform: translateY(100%);
	background-color: var(--white);
	box-shadow: 0px -10px 20px 0px #00000015;
	border-radius: 20px 20px 0px 0px;
	padding: 1rem;
	padding-bottom: 3rem;
	overflow: hidden;
}
.modal-mobile-application-options.open, .mobile-sheet.open {
	transform: translateY(0);
}

.mobile-sheet-close {
	height: 40px;
	width: 40px;
	position: absolute;
	top: 10px;
	right: 8px;
	outline: none !important;
}

.modal-mobile-application-options-header-wrapper {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

/* Header */
.modal-mobile-application-options-header {
	display: flex;
	gap: 14px;
}

.modal-mobile-application-options-header-info p {
	margin: 0px;
}

.modal-mobile-application-options-title {
	font-size: 14px;
	font-weight: 500;
}
.modal-mobile-application-options-prof {
	font-size: 13px;
}
.modal-mobile-application-options-avail {
	font-size: 12px;
}

.mobile-still-working {
	font-size: 11px;
	margin: 0px;
	margin-left: 4.4rem;
}

/* Action buttons */
.mobile-action-buttons-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 100%;
}

.modal-action-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 10px;
	padding-left: 30px;
	padding-right: 30px;
	width: fit-content;
	min-width: 50%;
	background-color: var(--primary);
	color: var(--white);
	box-shadow: 0px 4px 5px 0px #00000020;
	border: none;
	border-radius: 10px;
	font-size: 12px;
}
.modal-action-button.profile {
	width: 100%;
	min-width: auto;
}
.modal-action-button.disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}
.modal-action-button.outlined {
	background-color: var(--white);
	color: var(--primary);
	border: solid 1px #ccc;
	box-shadow: none;
}
.mobile-group-select {
	min-width: 50%;
	width: fit-content;
	padding: 0px !important;
	padding-left: 30px !important;
	padding-right: 30px !important;
	background-color: var(--white);
	box-shadow: none !important;
	border: solid 1px #ccc !important;
	color: var(--primary) !important;
	font-size: 12px !important;
}


/* Profile preview modal mobile */
.modal-mobile-profile-preview {
	position: fixed;
	right: 0;
	bottom: 0;
	height: fit-content;
	max-height: 90%;
	z-index: 9001;
	outline: none !important;
	transition: all 0.4s ease;
	width: 100%;
	transform: translateY(100%);
	background-color: var(--white);
	box-shadow: 0px -10px 20px 0px #00000015;
	border-radius: 20px 20px 0px 0px;
	padding: 1rem;
	/* padding-bottom: 3rem; */
	display: flex;
	flex-direction: column;
	gap: 1rem;
	height: 90% !important;
}
.modal-mobile-profile-preview.open {
	transform: translateY(0);
}

.modal-mobile-profile-container {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	height: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
	scrollbar-width: none;
}
.modal-mobile-profile-container::-webkit-scrollbar {
	display: none;
}

.modal-mobile-prof-header-btns-container {
	display: flex;
	align-items: center;
	gap: 10px;
}

.modal-mobile-prof-bio {
	font-size: 12px;
	margin: 0px;
	margin-bottom: -0.5rem;
	transition: max-height 0.5s ease;
	/* overflow: hidden; */
	cursor: pointer;
}

/* Mobile Tabs */
.modal-profile-view-tabs-container.mobile {
	display: flex;
	flex-direction: row;
	gap: 10px;
	flex-shrink: 0;
	width: 100%;
	border: none;
	overflow-x: auto;
	overflow-y: hidden;
	flex-wrap: nowrap;
	user-select: none;
	scrollbar-width: none;
}
.modal-profile-view-tabs-container.mobile::-webkit-scrollbar {
	display: none;
}
.modal-profile-view-tabs-container.mobile a {
	box-shadow: none !important;
	background-color: var(--primary);
	color: var(--white);
	border-radius: 10px;
	user-select: none;
}

.modal-profile-view-tabs-container.mobile a.active, .modal-profile-view-tabs-container.mobile .nav-link {
	box-shadow: none !important;
	background-color: var(--primary) !important;
	color: var(--white) !important;
	border-radius: 10px;
}

.modal-profile-view-tabs-content.mobile {
	height: 100%;
	overflow: initial;
	padding-top: 0px;
	margin-top: -1rem;
	min-height: 25rem !important;
}

.modal-mobile-profile-preview {
	overflow-y: auto;
}

.modal-profile-view-tabs-container.mobile {
	position: -webkit-sticky; /* For Safari */
	position: sticky;
	top: -1rem;
	padding-top: 1rem;
	z-index: 10;
	background-color: var(--white);
	padding-bottom: 2rem;
}

.modal-profile-view-action-btns {
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	gap: 12px;
	padding-bottom: 1rem;
	margin-bottom: -1rem;
	margin-top: -1rem;
	padding-top: 1rem;
	background-color: var(--primary);
	width: calc(100% + 2rem);
	position: relative;
}

.modal-profile-no-data {
	font-size: 12px;
	margin: 0px;
}


.modal {
	z-index: 8001 !important;
}
.modal-backdrop {
	z-index: 7000;
}

.swal2-container {
	z-index: 8005 !important;
}

.display-mobile {
	display: none;
}

.no-applications-container p {
	font-size: 12px;
	margin: 0px;
	margin-top: -1rem;
}

.question-input {
	width: 35rem !important;
}

/*
* Saved CVs Page
*/
/* Container -- mobile */
.favorite-cvs-container {
	flex-direction: column;
	gap: 10px;
	width: 100%;
	margin-top: 1rem;
}

/* Availability text */
.favorite-avail-text.available {
	color: var(--green);
}
.favorite-avail-text.unavailable {
	color: var(--red);
}

/* Notes */
.favorite-note {
	opacity: 0.8;
	max-width: 160px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.select2-selection__choice, .select2-results__option {
	font-size: 12px;
}

.select2-selection {
	background-color: #f5f5f5 !important;
	/* width: 24rem; */
	min-height: 34px;
	max-height: 5rem;
	overflow-x: hidden;
	overflow-y: auto;
	border: none;
	border-radius: var(--radius);
}

.basic-info-form input[type="checkbox"]  {
	position: relative;
	width: fit-content;
}
.job-input-wrapper.row {
	flex-direction: row;
}

#noResultsMessage p {
	font-size: 12px;
	margin: 0px;
}

#shareGroupForm p, #shareGroupForm label {
	font-size: 12px;

}

.share-row {
	display: flex;
	align-items: center;
	gap: 10px;

}

.share-row label {
	margin: 0px;
}

@media all and (max-width: 991px) {

	.profile_updated_explanation {
		display: none !important;
	}

	.appointments-header {
		flex-direction: column;
		align-items: start;
		gap: 6px;
		margin-bottom: 12px;
	}

	.question-input {
		width: 100% !important;
	}

	.display-mobile {
		display: unset;
	}
	.display-mobile.fixed {
		position: fixed;
		bottom: 0;
		margin-bottom: 62px;
		width: 100%;
		left: 0;
	}

	.select2-selection {
		width: 100%;
	}

	.favorite-cvs-container {
		display: flex !important;
	}

	.display-desktop {
		display: none;
	}

	.job-application-wrap {
		display: none !important;
	}
	#job-applications-groups {
		display: none !important;
	}
	.applied-cv {
		display: flex !important;
		width: 100% !important;
		margin: 0px;
		margin-bottom: 10px;
	}

	.grab-handle.groups {
		width: fit-content;
		flex-shrink: 0;
	}
	.grab-handle.groups p {
		margin: 0px;
	}

	.job-input-label-wrapper.ai {
		justify-content: space-between;
	}

	.input-row {
		width: 100% !important;
	}
	.input-row select {
		width: 100%;
	}

	.basic-info-form input{
		width: 100%;
	}
	.basic-info-form input[type="checkbox"]  {
		position: relative;
		width: fit-content;
	}

	.modal-profile-answ-container.interview {
		max-height: 10rem;
	}
	.disclaimer-row p {
		font-size: 10px !important;
	}

	.interview-notes {
		min-height: 4rem !important;
		max-height: 4rem !important;
		height: 4rem !important;
	}

	.search-container {
		width: 100%;
	}

	.header-title {
		flex-shrink: 0;
	}

	.favorite-avail-text {
		font-size: 10px !important;
	}

	.notes-input {
		height: 5rem !important;
	}

	.modal-profile-view-action-btns.saved {
		padding-top: 0px;
	}

	/*
	* Profile sidebar
	*/
	/* Container */
	.profile-sidebar-container {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		/* margin-top: -120px; */
		height: fit-content;
		width: 100%;
		left: 0;
		gap: 0px;
		background-color: var(--primary);
		z-index: 99999;
		animation: none !important;
		margin-left: 0px;
		padding-top: 0px;
		padding: 10px !important;
		transition: none !important;
	}

	.profile-sidebar-item-container {
		display: flex;
		width: 100%;
		border-radius: 10px;
		overflow: hidden;
		align-items: center;
		justify-content: space-between;
	}

	.profile-sidebar-item, .job-sidebar-item {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		cursor: pointer;
		padding: 10px;
		padding-left: 5px;
		padding-right: 5px;
		width: 100%;
		user-select: none;
		transition: all 0.3s ease;
		background-color: var(--grey);
	}


	.profile-sidebar-item svg, .job-sidebar-item svg {
		display: none;
	}
	.profile-sidebar-item:hover, .profile-sidebar-item-active, .job-sidebar-item:hover, .job-sidebar-item-active {
		background-color: var(--grey);
	}
	.profile-sidebar-icon {
		height: 14px;
		width: 14px;
	}

	.job-input-row {
		flex-direction: column;
		width: 100%;
		align-items: flex-start;
	}
	
	.job-input-wrapper {
		width: 100%;
	}

	.job-input-wrapper select {
		width: 100%;
	}

	.jobs-row {
		display: flex;
		align-items: center;
		gap: 1rem;
		margin-bottom: 1rem;
	}
	.jobs-row h3 {
		margin-bottom: 0px !important;
	}

	.profile-sidebar-label {
		font-size: 12px;
		margin-bottom: 0px;
		color: #2a2a2a !important;
		position: relative;
		z-index: 20;
		width: 100%;
		text-align: center;
	}

	.profile-sidebar-title {
		display: none;
	}

	.profile-sidebar-track, .job-sidebar-track {
		display: flex !important;
		position: absolute;
		top: 14px;
		left: 0;
		min-width: 80px;
		height: 30px;
		border-radius: 10px;
		transition: all 0.4s cubic-bezier(0.68, -0.15, 0.27, 1.10);
		background-color: var(--secondary);
		z-index: 19;
	}

	.basic-info-form {
		width: 100% !important;
		overflow: hidden;
		display: flex !important;
		flex-wrap: wrap !important;
		margin: 0px;
	}

	.free_text_wrap {
		width: unset !important;
	}

	.profile-edit-btn-container {
		display: flex;
		justify-content: flex-end;
		width: 100%;
		min-width: unset;
		align-items: center;
		margin: 0px;
	}
	.profile-edit-btn-container.del {
		flex-direction: column;
	}

	.delete-account-btn {
		margin-right: 0px;
	}

	.submit-button {
		width: 100%;
		justify-content: center;
	}

	.interview-link-row {
		width: 80% !important;
	}

	.interview-link-row input, .interview-link-row select, .interview-link-row textarea {
		width: 100% !important;
	}

	.interview-link-row label {
		font-size: 12px !important;
		margin-bottom: 2px;
	}
	
	.interview-link-row textarea {
		height: 5rem;
	}

	.modal-profile-answ-row-container {
		padding-left: 1rem;
		margin-left: -1rem;
		width: calc(100% + 1rem);
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.modal-profile-answ-row-background {
		width: 100%;
		border-radius: 10px;
	}

	.cvs-container {
		width: 100% !important;
		gap: 5px !important;
	}

	.single-cv-card .card-body {
		padding: 7px !important;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.single-cv-card {
		width: 49% !important;
	}
	
	.cv-card {
		max-height: 5rem;
		min-height: 5rem;
		width: 100%;
		margin: 0px !important;
		border-radius: 12px;
		z-index: 50;
	}
	.cv-img-box {
		min-width: 40px;
		min-height: 40px;
		height: 40px;
		width: 40px;
	
		position: relative;
		background-repeat: no-repeat;
		background-size: 100%;
		background-color: #fff;
		background-position: center center;
		border-radius: 100%;
		margin-bottom: 15px;
		/* display: inline-block; */
		float: left;
	}
	.cv-company {
		font-size: 13px;
	}
	.initials-box {
		border: 1px solid #ccc;
	}

	.cv-img-box-wrapper {
		justify-content: flex-start;
	}

	.cv-availability {
		height: 12px;
		width: 12px;
	}

	.cv-title-company-wrapper {
		width: fit-content;
	}
	.cv-title {
		margin: 0px;
	}

	#notificationDropdownBtn {
		color: var(--secondary);
	}

}

.disclaimer-row p {
	opacity: 0.8;
}

.interview-item {
	border: 1px solid #ccc;
	border-radius: 10px;
	padding: 10px;
	margin-bottom: 14px;
	box-shadow: 0 1px 4px rgba(0,0,0,.1);
}

.interview-item-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.interview-item-participants {
	margin-bottom: 14px;
	display: flex;
	align-items: center;
}

.interview-item-avatar {
	min-width: 30px;
	height: 30px;
	border-radius: 100%;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	background-color: #D0D0D0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.interview-item-avatar.employer {
	margin-left: -10px;
}

.interview-item-initials {
	margin: 0px;
	font-size: 12px;
	font-weight: 500;
}

.interview-item-info-container {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.interview-item-info {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
}
.interview-item-info p {
	margin: 0px;
}


/*
* Job Items (mobile)
*/
/* Container */
#jobs-container {
	display: flex !important;
	flex-direction: column;
	gap: 10px;
	width: 100%;
}

.job-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	border: 1px solid #ccc;
	width: 100%;
	border-radius: 10px;
	padding: 10px;
}

.job-item-title {
	font-size: 14px;
	font-weight: 500;
	margin: 0px;
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

/* Applications wrapper */
.job-item-appl-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 12px;
}
.job-item-appl {
	margin: 0px;
}

/* Modal sheet */
.job-appl-modal {
	position: fixed;
	right: 0;
	bottom: 0;
	height: fit-content;
	z-index: 9000;
	outline: none !important;
	transition: all 0.4s ease;
	width: 100%;
	transform: translateY(100%);
	background-color: var(--white);
	box-shadow: 0px -10px 20px 0px #00000015;
	border-radius: 20px 20px 0px 0px;
	padding: 1rem;
	overflow: hidden;
}

.job-appl-modal.open {
	transform: translateY(0);
}

.job-appl-modal-backdrop {
	position: fixed;
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s ease;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(8px);
	background-color: #00000040;
	z-index: 8000;
}

.job-appl-modal-backdrop.open {
	opacity: 1;
	pointer-events: all;
}

/* Header */
.job-appl-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}
.job-appl-modal-header p {
	margin: 0px;
}

.job-appl-modal-title-wrapper {
	display: flex;
	flex-direction: column;
}
.job-appl-modal-title {
	font-size: 14px;
	font-weight: 500;
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.job-appl-modal-status {
	font-size: 12px;
}

.job-appl-modal-dates-container {
	display: flex;
	flex-direction: column;
	gap: 0px;
}
.job-appl-modal-dates-container p {
	margin: 0px;
	font-size: 12px;
}

.job-appl-modal-dates-wrapper {
	display: flex;
	align-items: center;
	gap: 4px;
}
.job-appl-modal-dates {
	font-weight: 500;
}

/* Applications */
.job-appl-modal-applications-wrapper {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
}

/* Ensure the body overflow is hidden when the modal is open */
.modal-mobile-profile-preview.open, .modal-mobile-application-options-backdrop.open {
    overflow: hidden;
}


@media all and (max-width: 991px) {

	.external-url-container {
		width: 100% !important;
	}

	.plan-tables-container {
		/* overflow-y: auto; */
		/* margin-left: 0rem; */
		justify-content: flex-start !important;
		/* Snap scroll */
		scroll-snap-type: x mandatory;
	}

	.plan-table-wrapper {
		flex-shrink: 0;
		/* Snap scroll */
		width: 100% !important;
		scroll-snap-align: center;
		scroll-snap-stop: always;
		transform: none !important;
	}

	.purchases-history-content-container {
		width: 100%;
		/* overflow-x: auto; */
		flex-wrap: wrap;
	}

	.purchase-history-row {
		width: 100% !important;
	}

	.purchase-history-row p {
		font-size: 12px;
	}

	.purchase-history-cell {
		
	}


	.mobile-bottom-padding {
		padding-bottom: 8rem;
	}

}


/*
* Plan Tables
*/
/* Title container */
.plan-tables-title-container {
	display: flex;
	width: 100%;
	margin-bottom: 1rem;
}

/* Title */
.plan-tables-title-container p, .plan-tables-title {
	margin: 0px;
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 1rem;
}

/* Plan tables container */
.plan-tables-container {
	display: flex;
	/* align-items: center; */
	/* justify-content: center; */
	gap: 2rem;
	width: 100%;
	padding-bottom: 5rem !important;
}

.plan-tables-container.homepage {
	justify-content: center;
	gap: 4rem;
}

/* Plan wrapper */
.plan-table-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1rem;
	position: relative;
	background-color: var(--white);
	width: 17rem;
	height: 32.2rem;
	border: 1px solid #ccc;
	border-radius: 10px;
	transition: all 0.4s ease;
}
.plan-table-wrapper:hover {
	box-shadow: 0px 4px 10px 0px #00000015;
	transform: scale(1.02);
}
.plan-table-wrapper.best {
	transform: scale(1.03);
}

.plan-table-wrapper .best-value {
	position: absolute;
	top: -16px;
	right: -16px;
	padding: 6px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 6px;
	background-color: var(--secondary);
	z-index: 20;
}
.plan-table-wrapper .best-value p {
	color: #fff;
	margin: 0px;
	font-size: 12px;
	font-weight: 500;
}

.plan-table-wrapper .custom-divider {
	width: 80%;
	align-self: center;
}

.plan-subtitle {
	font-size: 12px;
	margin: 0px;
	margin-top: 8px;
	margin-bottom: -0.5rem;
	text-align: center;
	font-weight: 500;
}

.plan-table-wrapper .btn {
	animation: none;
	mask-size: 300%;
}
.plan-table-wrapper:hover .btn {
	mask-size: 200%;
	animation: shine 2s linear infinite;
}

.plan-table-content-wrapper {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.plan-table-header {
	display: flex;
	position: relative;
	flex-direction: column;
	gap: 0.5rem;
	height: 5.5rem;
	align-items: center;
	justify-content: center;
	padding-top: 1rem;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	background-color: var(--primary);
	margin-bottom: -1rem;
	/* border-radius: 10px; */
	padding: 8px;
}

.plan-title {
	color: #fff;
	/* background-color: var(--primary); */
	width: fit-content;
	/* padding: 8px; */
	padding-left: 12px;
	padding-right: 12px;
	margin: 0px;
	font-size: 14px;
	border-radius: 10px;
	/* position: absolute; */
	/* top: 0;
	left: 0; */
}
.plan-title.best_value {
	/* color: var(--primary);
	background-color: #fff;
	border: 1px solid #ccc; */
}

.plan-price {
	font-size: 18px;
	font-weight: 600;
	margin: 0px;
	text-align: center;
	color: #fff;
}

.plan-duration {
	font-size: 10px;
	color: #fff;
	margin: 0px;
	margin-top: -4px;
	text-align: center;
}

/* Features container */
.plan-features-container {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 1rem;
}

.plan-feature {
	font-size: 12px;
	margin: 0px;
	opacity: 0.8;
}

.plan-feature::before {
	content: '\f00c';
	font-family: FontAwesome;
	margin-right: 6px;
}

.plan-input-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 1rem;
	padding-top: 0px;
	padding-bottom: 0px;
}

.plan-input-label {
	margin: 0px;
	font-size: 12px;
	flex-shrink: 0;
}

.plan-input {
	width: 65px;
	height: 30px;
	border-radius: 6px;
	background-color: #fff;
	font-size: 12px;
	padding: 8px;
	border: 1px solid #ccc;
	outline: none;
	box-shadow: none;
}

.purchases-history-content-container {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
	align-items: center;
}

.purchase-history-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	background-color: #fff;
	border: 1px solid #ccc;
	padding: 10px;
	border-radius: 10px;
	width: 80%;
}
.purchase-history-row.header {
	background-color: var(--white);
	border: none !important;
}

.purchase-history-cell {
	width: 100%;
}

.purchase-history-data {
	margin: 0px;
	font-size: 14px;
}


/*
* BNS DETAILS
*/

.bns-details-sidebar {
	background-color: var(--primary);
	padding: 2rem !important;
}

.bns-details-warning {
	font-size: 12px;
	color: var(--white);
	background-color: var(--red);
	padding: 10px;
	border-radius: 10px;
	text-align: center;
}
.bns-details-warning.soft {
	background-color: var(--secondary) !important;
}

.bns-details-nav-container {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.bns-details-nav-item {
	cursor: pointer;
	transition: all 0.3s ease;
}
.bns-details-nav-item:hover {
	opacity: 0.6;
}
.bns-details-nav-item.active .bns-details-nav-item-text {
	color: var(--secondary);
}
.bns-details-nav-item.disabled {
	opacity: 0.5;
	cursor: default;
	pointer-events: none;
}

.bns-details-nav-item-text {
	margin: 0px;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	user-select: none;
	text-decoration: none !important;
}
.bns-details-nav-item-text:hover {
	color: #fff;
}

.bns-details-container {
	display: flex;
	flex-direction: column;
	padding: 2rem;
	width: fit-content;
}

.bns-details {
	display: flex !important;
	flex-direction: column !important;
}
.bns-details label {
	font-size: 13px;
}

/* Expiring Ad Slider */
.expiring-ad-slider-container {
	position: relative;
	overflow: hidden;
}

.expiring-ad-slider {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	gap: 10px;
}

.expiring-ad-slide {
	flex: 0 0 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	scroll-snap-align: center;
	box-sizing: border-box;
}

.expiring-ad-arrow {
	outline: none !important;
	position: absolute;
	bottom: 0;
	background-color: #ffffff80;
	border-radius: 100%;
	backdrop-filter: blur(8px);
	height: 20px;
	width: 20px;
	font-size: 10px;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
}
.expiring-ad-arrow:hover {
	opacity: 0.8;
}

.left-arrow {
	left: 0;
}

.right-arrow {
	right: 0;
}
.expiring-ad-slider::-webkit-scrollbar {
	display: none;
}
.expiring-ad-slider {
	-ms-overflow-style: none; /* for IE & Edge */
	scrollbar-width: none;    /* for Firefox */
}
.expiring-ad-pagination {
	text-align: center;
	margin-top: 8px;
}
.expiring-ad-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: #ccc;
	border-radius: 50%;
	margin: 0 4px;
	cursor: pointer;
	transition: all 0.3s ease;
}
.expiring-ad-dot.selected {
	background-color: var(--primary);
}

.interviewNotesModal-close, .modal-close {
	color: #ccc !important;
	font-weight: 400 !important;
}

.external-url-container {
	display: flex;
	width: fit-content;
	gap: 10px;
	margin-bottom: 10px;
}
.external-url-container p, .job-input-wrapper p {
	font-size: 12px;
	margin: 0px;
}

.external-url-title {
	margin-bottom: -4px !important;
	font-weight: 500;
	font-size: 14px !important;
}

.job-external-modal-desc {
	font-size: 12px;
	margin: 0px;
}

.external-url-modal-input {
	height: 34px;
	width: 100% !important;
	min-width: 22rem !important;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	background-color: #fff !important;
	border-radius: 6px;
	padding: 4px;
	margin-top: 1rem;
}
#job_apply_form-section p{
	width: calc(870px + 1rem);
}
@media all and (max-width: 991px) {
	.external-url-modal-input {
		width: 100% !important;
		min-width: unset !important;
	}
	#job_apply_form-section p{
		width: 100%;
	}
}

.job-external-modal-body {
	display: flex;
	flex-direction: column;
	width: 100%;
}

#externalUrlForm {
	display: flex;
	align-items: center;
	width: 100%;
}

.page-title {
	font-size: 20px;
	font-weight: 600 !important;
	margin: 0px;
}

.info-i {
	color: var(--primary) !important;
}

.modal-header .close {
	color: #000 !important;
	font-weight: 400 !important;
	text-shadow: none !important;
}

.dropdown-menu.show {
	/* min-width: 0px !important; */
	/* width: 100% !important; */
}

#contactPopup.minimized .modal-dialog {
	position: fixed !important;
	bottom: 2rem !important;
	border-radius: 10px !important;
	right: 20px !important;
	width: 350px !important;
	height: 50px !important;
	overflow: hidden !important;
	width: 250px !important;
	transition: all 0.3s ease;
}

@media all and (max-width: 991px) {
	#contactPopup.minimized .modal-dialog {
		bottom: 5rem !important;
		right: 10px !important;
	}
}

#contactPopup {
	width: fit-content;
	height: fit-content;
}

#contactPopup .modal-header {
	display: flex;
	align-items: center;
	padding: 0px;
	height: 50px;
	padding-left: 10px;
	padding-right: 10px;
	cursor: pointer;
}

#contactPopup .modal-header .modal-title {
	font-size: 16px !important;
	margin: 0px;
}

#contactPopupChevron {
	font-size: 14px;
}

#contactPopup .modal-dialog-bottom-right {
	transition: max-height 0.4s ease-in-out;
	max-height: 500px;
}

#contactPopup.minimized .modal-dialog-bottom-right {
	max-height: 50px;
	overflow: hidden;
}

.submit-button {
	margin-top: 1rem !important;
}

.nav-profile-avatar {
	cursor: pointer;
}

/* Profile avatar wrapper */
.nav-profile-avatar-wrapper {
	position: relative;
	transition: all 0.3s ease;
}

/* Profile menu */
.nav-profile-avatar-menu {
	position: absolute;
	z-index: 8001;
	top: 100%;
	right: 0;
	min-width: 8rem;
	margin-top: 1rem;
	border-radius: 10px;
	background-color: var(--white);
	border: 1px solid #ccc;
	transition: all 0.3s ease;
	opacity: 0;
	transform: scale(0.8);
	pointer-events: none;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.nav-profile-avatar-menu.open {
	opacity: 1;
	transform: scale(1);
	pointer-events: all;
}

/* Item */
.nav-profile-avatar-menu-item {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #000;
	padding: 0.5rem;
	padding-left: 0.8rem;
	padding-right: 0.8rem;
	margin: 0px;
	font-size: 12px;
	text-decoration: none !important;
	cursor: pointer;
	transition: all 0.3s ease;
}
.nav-profile-avatar-menu-item:hover {
	opacity: 0.7;
}

.nav-profile-avatar-menu-item.mobile {
	color: var(--white);
	gap: 12px;
	padding: 0.8rem;
}

/* Backdrop */
.nav-profile-avatar-menu-backdrop {
	position: fixed;
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s ease;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* background-color: #00000040; */
	z-index: 8000;
}
.nav-profile-avatar-menu-backdrop.open {
	opacity: 1;
	pointer-events: all;
}

/* Mobile */
.mobile-profile-menu-wrapper {
	background-color: var(--primary);
	border: 1px solid #ccc;
	border-left-width: 0px;
	border-right-width: 0px;
	height: 0px;
	transition: all 0.3s ease;
}

.mobile-profile-menu-wrapper.open {
	margin-bottom: 4px;
	height: fit-content;
}

.mobile-profile-menu-trigger {
	cursor: pointer;
}


.job-questions-container {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.job-questions-container .job-input-wrapper {
	position: relative;
	width: fit-content;
}

.job-questions-container input[type="text"] {
	padding-right: 30px !important;
}

.remove-question-btn {
	position: absolute;
	right: 4px;
	top: 27px;
	color: var(--red);
	background-color: #fff;
	font-size: 12px;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
}
.remove-question-btn:hover {
	opacity: 0.7;
}

#changes-after-submission-mobile {
	bottom: 0;
	padding: 8px;
	margin-top: 10px;
	margin-bottom: -2rem;
}

.biografika-title-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	gap: 8px;
}

body {
	background-color: var(--grey);
}

.job-input-wrapper.double-width input, .input-row.double-width input, .job-input-wrapper.double-width select, .job-input-wrapper.double-width .select2 {
	width: calc(420px + 1rem) !important;
}

@media all and (max-width: 991px)
{
	/* footer {
		display: none !important;
	} */
	
	.job-input-wrapper.double-width input, 
	.input-row.double-width input, 
	.job-input-wrapper.double-width select, 
	.job-input-wrapper.double-width .select2 {
		width: unset !important;
	}
}

.perfect-match-badge {
	/* display: none; */
	position: absolute;
	top: -10px;
	left: 8px;
	background-color: var(--white);
	padding: 4px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 10px;
	font-weight: 500;
}
.perfect-match-badge-mobile {
	position: absolute;
	top: -10px;
	left: 8px;
	background-color: var(--grey);
	padding: 4px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 10px;
	font-weight: 500;
}
.perfect-match-badge.gradient {
	background: linear-gradient(to bottom, var(--grey), var(--white));
}
.perfect-match-badge.profile-view {
	position: relative;
	top: unset;
	left: unset;
	padding: 0px;
	font-size: 14px;
}

.perfect-match-desc {
	font-size: 11px;
	width: 80%;
	margin: 0px;
	margin-bottom: 4px !important;
	/* color: var(--secondary); */
	opacity: 0.8;
}

.job-star-filled, .job-star-empty {
	color: #ffc107;
}

.jobs-listing-open-link-icon {
	font-size: 12px;
	margin-left: 4px;
}

.jobs-listing-title {
	color: #000;
	text-decoration: none !important;
}

.side-nav-add-btn {
	display: flex !important;
	justify-content: center;
	align-items: center;
	width: 100%;
}

/* Custom styling for table */
.custom-table-row {
	width: 100% !important;
	position: relative;
	border-collapse: separate;
	box-shadow: none;
	border-spacing: 0 10px; /* This creates space between rows */
}

.custom-table-row td {
	font-size: 12px !important;
	/* border: none !important; */
	/* background-color: var(--white); */
	background-color: transparent;
	height: 35px !important;
	box-shadow: none !important;
	border: 1px solid #ccc;
	border-top: 1px solid #ccc !important;
	border-left-width: 0px;
	border-right-width: 0px;
}
.custom-table-row td p {
	margin: 0px;
}
.custom-table-row td .btn {
	font-size: 12px;
	width: 34px;
	height: 34px;
	box-shadow: none;
}
.custom-table-row td .btn:hover {
	opacity: 0.5;
}
.custom-table-row tr.unread td {
	background-color: #08719815;
}
.custom-table-row.perfect-match td {
	border-color: var(--secondary) !important;
}

/* Styling for first and last cells in each row for rounded corners */
.custom-table-row td:first-child {
	border-top-left-radius: var(--radius) !important;
	border-bottom-left-radius: var(--radius) !important;
	border-left-width: 1px;
	overflow: hidden !important;
}

.custom-table-row td:last-child {
	border-top-right-radius: var(--radius) !important;
	border-bottom-right-radius: var(--radius) !important;
	border-right-width: 1px;
	overflow: hidden !important;
}

.custom-table {
	border-spacing: 0px 10px !important;
}
.custom-table > thead > tr > th {
	border: none !important;
}
.custom-table.no-footer {
	border-bottom: none !important;
}

.dataTables_info {
	display: none;
}


/*
* Homepage
*/

/* Features container */
.homepage-features-employer-container {
	min-height: 10rem;
	display: flex;
	gap: 2rem;
	justify-content: center;
	margin-top: 1.5rem;
	margin-bottom: 4rem;
}

.homepage-features-employer {
	width: 60%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3rem;
}

.homepage-feature-employer-content-box {
}

.homepage-feature-employer-title.short {
	font-size: 14px;
	font-weight: 500;
	margin: 0px;
}

.homepage-feature-employer-content-inner {
	display: flex;
	width: 100%;
	justify-content: space-between;
	gap: 5rem;
}

.homepage-feature-employer-title {
	font-size: 20px;
	font-weight: 600;
	color: var(--primary);
}

.homepage-feature-employer-desc {
	font-size: 12px;
	opacity: 0.8;
}

.homepage-feature-employer-content-text {
	width: 60%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.homepage-feature-employer-content {
	width: 70%;
}

.homepage-feature-employer-text.nav-link.active .homepage-feature-employer-title {
	color: var(--white) !important;
}
.homepage-feature-employer-text.nav-link.active {
	background-color: var(--primary) !important;
	border-radius: 10px;
	color: var(--white) !important;
}

.homepage-video-container {
	border-radius: 16px;
	overflow: hidden;
	width: 640px;
	position: relative;
	box-shadow: 0px 4px 10px 4px #00000020;
}

.homepage-video-container::before {
	content: "";
	display: block;
	padding-top: 56.25%; /* 16:9 aspect ratio */
}

.homepage-video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

#featuresTab, #featuresTab .nav-item, #featuresTab .nav-link, #featuresTab .nav-link.active, #featuresTab .nav-link button {
	box-shadow: none !important;
	border: none !important;
	outline: none !important;
}


@media all and (max-width: 991px) {
	.homepage-features-employer-container {
		flex-direction: column;
	}
	.homepage-features-employer {
		width: 100%;
	}
	.homepage-video-container {
		width: 100%;
	}

	#employer-why {
		padding: 0px !important;
	}

	.homepage-features-employer-header {
		width: 100%;
		display: flex;
		/* flex-wrap: nowrap; */
		align-items: center;
		justify-content: center;
		overflow-x: auto;
		scrollbar-width: none; /* For Firefox */
	}
	.homepage-features-employer-header::-webkit-scrollbar {
		display: none; /* For Chrome, Safari, and Edge */
	}

	.homepage-feature-employer {
		flex-shrink: 0;
	}
	
	.homepage-feature-employer-content-inner {
		flex-direction: column;
		width: 100%;
		gap: 1rem;
	}

	.homepage-feature-employer-content  {
		padding: 3rem;
		padding-top: 0px;
	}

	.homepage-text {
		margin-bottom: 10rem;
	}

	.homepage-feature-employer-content-text, .feature-ai-container, .homepage-feature-employer-content {
		width: 100% !important;
	}

	.feature-cv-groups {
		width: 100% !important;
		margin-left: 0px !important;
	}

	.side-nav-add-btn {
		display: none !important;
	}

	.job-inputs-container {
		width: 100% !important;
	}
}

.feature-ai-title {
	margin: 0px;
	font-size: 12px;
	font-weight: 500;
}

.feature-ai-container {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 50%;
	/* border: 1px solid #ccc; */
	box-shadow: 0px 6px 10px 0px #00000005;
	background-color: var(--white);
	border-radius: 10px;
	padding: 1.2rem;
	gap: 8px;
}

.feature-ai-element-container {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	gap: 4px;
}

.feature-ai-element {
	background-color: #ddd;
	height: 14px;
	border-radius: 6px;
	animation: skeleton-loading 2s infinite ease-in-out;
}

.feature-pm-prof {
	height: 40px;
	width: 40px;
	min-width: 40px;
	object-fit: cover;
	border-radius: 100%;
}

.feature-pm-prof-container {
	display: flex;
	align-items: center;
	gap: 10px;
	position: relative;
	width: 13rem;
	border: 1px solid #ccc;
	border-radius: 12px;
	padding: 12px;
	/* padding-left: 18px; */
	padding-right: 1.8rem;
	background-color: var(--white);
	box-shadow: 0px 4px 10px 0px #00000005;
}
.feature-pm-prof-container.pm {
	border-color: #fbbd06;
}

.feature-pm-prof-name-wrapper p {
	margin: 0px;
}

.feature-pm-prof-name-wrapper {
	display: flex;
	flex-direction: column;
}

.feature-pm-prof-name {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: -2px !important;
}

.feature-pm-prof-job {
	font-size: 12px;
	opacity: 0.8;
}

.feature-pm-container {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: fit-content;
	position: relative;
}

.feature-pm-container::after {
	content: "";
	position: absolute;
	bottom: -20px;
	left: 0;
	width: 100%;
	height: 120px; /* Adjust the height as needed */
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--grey) 80%);
	pointer-events: none;
}

.recomm-job-listing-badge {
	display: none;
	position: absolute;
	top: -8px;
	left: 12px;
	background: linear-gradient(to bottom, var(--grey), var(--white));
	padding: 4px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 11px;
	font-weight: 500;
}

.job-star-filled, .job-star-empty {
	color: #ffc107;
}

.job-star-empty {
	color: #000;
}

.feature-ai-badge {
	position: absolute;
	background-color: var(--primary);
	font-size: 12px;
	padding: 4px;
	width: 50px;
	text-align: center;
	color: var(--white);
	border-radius: 6px;
	top: -12px;
	right: 12px;
}

.feature-ai-badge svg {
	height: 10px;
	width: 12px;
	margin-left: 3px;
}

.feature-cv-groups {
	width: 420px;
	margin-left: -2rem;
	height: 100%;
	position: relative;
	user-select: none;
	object-fit: cover;
	mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
	-webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

.why-us-header {
	text-align: center;
	font-weight: 600;
	font-size: 28px;
	color: var(--primary);
	margin-top: 2rem;
}


/*
* Shared CVs
*/
.cv-card.shared-cv {
	max-height: none !important;
}

.cv-card.shared-cv .cv-buttons {
	margin-top: 14px;
	display: flex;
	justify-content: flex-end;
}

.cv-card.shared-cv .card-body {
	flex-direction: column;
}
.cv-card.shared-cv .card-body-content {
	display: flex;
	gap: 10px;
}

.basic-info-form.interview-mobile .col {
	padding: 0px;
}
.basic-info-form.interview-mobile .interview-link-row {
	width: 100% !important;
	margin: 0px;
}

/* Job listing select2 */
.select2-container--default .select2-results__options {
    display: flex;
    flex-wrap: wrap;
}

.select2-container--default .select2-results__option[role="group"] {
    width: 100%;
    padding-right: 10px;
    box-sizing: border-box;
}

.select2-container--default .select2-results__option .select2-results__group {
    font-weight: bold;
    margin-top: 10px;
}

.select2-container--default .select2-results__option ul.select2-results__options {
    padding-left: 5px;
}
.select2-container--default .select2-results > .select2-results__options {
	max-height: 300px !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background-color: #25ddd3 !important;
	color: #000 !important;
	border-radius: 6px !important;
}
.select2-container--default .select2-results__option--selected {
	background-color: #25ddd3 !important;
	color: #000 !important;
	border-radius: 6px !important;
}
.select2-results__option {
	transition: all 0.2s ease !important;
}
.select2-results__option {
	margin: 3px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
	background-color: #25ddd3 !important;
	color: #000 !important;
	border-radius: 6px !important;
	border: 1px solid transparent !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
	background-color: #25ddd3 !important;
	color: #000 !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	border-right: 1px solid transparent !important;
	color: #555 !important;
}
#employerContactSend:hover {
	background-color: var(--primary) !important;
	color: var(--white) !important;
}

.btn-clear-filters {
	/* box-shadow: inset 0 -1px 0 #ddd;
	background-color: #fff;
	border: solid 1px #ccc; */
	color: var(--secondary);
	padding: 0.4rem 0.7rem;
	border-radius: 0.5rem;
}
.btn-clear-filters:focus {
	box-shadow: none !important;
}
.filter-group select:focus {
	box-shadow: none !important;
}
.filter-disabled {
	color: #000;
}
.btn-toggle-filters {
	background-color: #ffffff5c !important;
	padding: 0.5rem;
	border-radius: 0.5rem;
	border: solid 1px #ccc;
	/* box-shadow: inset 0 -1px 0 #ddd; */
}
.btn-toggle-filters:focus {
	box-shadow: inset 0 -1px 0 transparent !important;
}
.matching-profile-sortable-wrapper {
	width: calc(420px + 1rem);
}
@media all and (max-width: 991px) {
	.language-select-dropdown{
		width: 100% !important;
	}
	.matching-profile-sortable-wrapper {
		width: 100% !important;
	}
}
.g-recaptcha {
	transform: scale(0.82);
	transform-origin: 0 0;
}
.home-image-banner {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	/* background-color: #ff0; */
}
.nav-tabs .nav-link.active, .nav-tabs .nav-link.active:focus, .nav-tabs .nav-link:focus:hover, .nav-tabs .nav-link:hover {
	box-shadow: inset 0 -2px 0 var(--primary) !important;
	/* color: var(--primary) !important; */
}
.filters-wrapper select {
	background-color: #ffffff5c !important;
	border: 1px solid #ccc !important;
	box-shadow: none !important;
}
.promotion-section {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: start;
	height: 90vh;
	padding: 2rem;
	text-align: left;
}

.promotion-section h2 {
	font-size: 2.5rem;
	font-weight: bold;
	color: var(--white);
	margin-bottom: 1rem;
	line-height: 1.3;
}

.promotion-section p {
	font-size: 1.2rem;
	color: var(--white);
	margin-bottom: 0;
	max-width: 600px;
}
.promo-blue-letters {
	color: var(--secondary);
}
.promo-mobile {
	display: none;
}

@media all and (max-width: 991px) {
	.promotion-section {
		height: auto;
		padding: 1rem;
	}
	
	.promotion-section h2 {
		font-size: 1.4rem;
		text-align: center;
		padding-top: 20px;
		margin-bottom: 0px;
	}
	
	.promotion-section p {
		font-size: 1rem;
	}
	.promo-desktop {
		display: none !important;
	}
	.promo-mobile {
		margin-top: 30px;
		display: inline !important;
	}
	.register-box-promotion {
		margin-top: 0px !important;
	}
}

/* Job Specialty Blocks Functionality */
.specialty-hidden {
	display: none !important;
}

.specialty-title-wrapper {
	margin-bottom: 10px;
}

.remove-specialty-btn {
	font-size: 12px;
	padding: 4px 8px;
	border-radius: 4px;
}

.add-specialty-container {
	text-align: center;
}

#add-specialty-btn {
	min-width: 120px;
	font-size: 14px;
}

/* Education and Experience Description Styles */
.education-read-more,
.experience-read-more {
    color: var(--secondary);
    cursor: pointer;
    font-size: 12px;
    text-decoration: underline;
    margin-top: 5px;
    display: inline-block;
    transition: color 0.3s ease;
	text-transform: capitalize;
}

.education-read-more:hover,
.experience-read-more:hover {
    text-decoration: none;
}

/* Education and Experience Description Overlay */
.education-description-overlay,
.experience-description-overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    min-height: 400px;
    max-height: 70vh;
    background: #ffffff;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.15);
    z-index: 10000;
    transform: translateY(100%);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.education-description-overlay.show,
.experience-description-overlay.show {
    transform: translateY(0);
    opacity: 1;
}

.education-description-header,
.experience-description-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 25px 15px;
    border-bottom: 2px solid #f1f3f4;
    background: var(--primary);
    color: white;
    flex-shrink: 0;
}

.education-description-title,
.experience-description-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: white;
}

.education-description-close,
.experience-description-close {
    background: transparent;
    border: none;
    color: white;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 17px;
}

.education-description-close:hover,
.experience-description-close:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

.education-description-content,
.experience-description-content {
    padding: 25px;
    overflow-y: auto;
    flex: 1;
    background: #fafbfc;
}

.education-description-content h6,
.experience-description-content h6 {
    color: #000;
    font-weight: 700;
    margin-bottom: 8px;
    font-size: 20px;
    line-height: 1.3;
}

.education-description-content .education-field,
.experience-description-content .experience-company,
.experience-description-content .experience-position,
.experience-description-content .experience-period {
    color: #000;
    margin-bottom: 4px;
    font-size: 16px;
    font-weight: 500;
}

.education-description-content .education-description-text,
.experience-description-content .experience-description-text {
    color: #34495e;
    line-height: 1.8;
    margin-bottom: 0;
    font-size: 15px;
    text-align: justify;
}

/* Relative positioning for tab containers */
.tab-pane {
    position: relative;
    min-height: 400px;
}

/* Mobile responsive styles for description overlays */
@media (max-width: 768px) {
    .education-description-overlay.mobile,
    .experience-description-overlay.mobile {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        min-height: 400px;
        max-height: 80vh;
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
        z-index: 10001;
    }

    .education-description-header,
    .experience-description-header {
        padding: 15px 20px 12px;
    }

    .education-description-title,
    .experience-description-title {
        font-size: 16px;
    }

    .education-description-close,
    .experience-description-close {
        width: 30px;
        height: 30px;
        font-size: 12px;
    }

    .education-description-content,
    .experience-description-content {
        padding: 20px;
    }

    .education-description-content h6,
    .experience-description-content h6 {
        font-size: 18px;
    }

    .education-description-content .education-field,
    .experience-description-content .experience-company,
    .experience-description-content .experience-position,
    .experience-description-content .experience-period {
        font-size: 14px;
        margin-bottom: 15px;
    }

    .education-description-content .education-description-text,
    .experience-description-content .experience-description-text {
        font-size: 14px;
        line-height: 1.6;
    }

    .education-read-more,
    .experience-read-more {
        font-size: 11px;
    }

    .tab-pane {
        min-height: 350px;
    }
}

/* Animation keyframes */
@keyframes slideUpIn {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideDownOut {
    from {
        transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(100%);
        opacity: 0;
    }
}

/* Interview Restriction Styles */
.interview-restriction-message {
	font-size: 14px;
	color: #000;
	background: none;
	padding: 12px 16px;
	text-align: center;
	margin: 10px 0;
}

.interview-restriction-message.pending {
	color: #000;
}

.interview-restriction-message.scheduled {
	color: #000;
}

.interview-historical {
	opacity: 0.7;
	background-color: var(--grey);
	border-left: 4px solid var(--dark-grey);
}

.interview-historical .interview-status {
	color: var(--dark-grey);
}

/* Disabled form elements styling when interview is rejected */
.form-control.disabled,
.form-control:disabled {
	background-color: var(--grey) !important;
	color: var(--dark-grey) !important;
	cursor: not-allowed !important;
	opacity: 0.7 !important;
}

select.form-control.disabled,
select.form-control:disabled {
	pointer-events: none;
}

/* Style restriction message in modal footer */
.modal-footer .interview-restriction-message,
.custom-btn-container .interview-restriction-message {
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	color: #000;
	background: none;
}

@media all and (max-width: 991px) {
	.interview-restriction-message {
		font-size: 13px;
		padding: 10px 14px;
		margin: 8px 0;
		color: #000;
		background: none;
	}
	
	.modal-footer .interview-restriction-message,
	.custom-btn-container .interview-restriction-message {
		margin: 0;
		min-height: 45px;
		color: #000;
		background: none;
	}
}
.freeAd_notification {
	width: 45%;
}
@media all and (max-width: 991px) {
	.freeAd_notification {
		width: 100% !important;
	}
}

/* =============================================
   JOB LISTING FORM ACCORDION (jf-)
   ============================================= */

.jf-form-accordion {
	width: 100%;
}

.jf-accordion-item {
	border: 1px solid #e4e9f0 !important;
	border-radius: 10px !important;
	margin-bottom: 10px;
	overflow: hidden;
	transition: box-shadow 0.2s ease;
	width: 60rem;
}
@media all and (max-width: 991px) {
	.jf-accordion-item {
		width: 100%;
	}
}
/* Header button */
.jf-accordion-btn {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 20px;
	background-color: #fff !important;
	color: var(--dark, #222) !important;
	box-shadow: none !important;
	border: none;
	width: 100%;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.jf-accordion-btn:not(.collapsed) {
	background-color: #faf8ff !important;
}

.jf-accordion-btn::after {
	margin-left: auto;
	flex-shrink: 0;
}

/* Step number circle */
.jf-step-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	min-width: 34px;
	border-radius: 50%;
	background: var(--purple, #8c15ea);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	flex-shrink: 0;
	transition: background-color 0.25s ease;
}

.jf-accordion-item.jf-complete .jf-step-number {
	background: #22c55e;
}

/* Step text */
.jf-step-info {
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.jf-step-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--dark, #222);
}

.jf-step-desc {
	font-size: 12px;
	font-weight: 400;
	color: #7a8494;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Check icon */
.jf-step-status {
	font-size: 20px;
	color: #22c55e;
	flex-shrink: 0;
	margin-right: 6px;
}

/* Accordion body */
.jf-form-accordion .accordion-body {
	padding: 1.25rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Error flash animation */
@keyframes jf-error-flash {
	0%, 100% { box-shadow: none; }
	25%, 75% { box-shadow: inset 0 0 0 3px rgba(220, 53, 69, 0.5); }
}

.jf-step-error-flash {
	animation: jf-error-flash 0.35s ease 2;
}

/* Focused input / select highlight inside the accordion form */
.jf-form-accordion .form-control:focus,
.jf-form-accordion select:focus {
	border-color: var(--purple, #8c15ea) !important;
	box-shadow: 0 0 0 3px rgba(140, 21, 234, 0.12) !important;
	outline: none;
}

/* Mobile */
@media all and (max-width: 991px) {
	.jf-accordion-btn {
		padding: 12px 14px;
		gap: 10px;
	}
	.jf-step-number {
		width: 28px;
		height: 28px;
		min-width: 28px;
		font-size: 13px;
	}
	.jf-step-title {
		font-size: 14px;
	}
	.jf-step-desc {
		display: none;
	}
	.jf-form-accordion .accordion-body {
		padding: 1rem;
	}
}