﻿/* Kun Type 20 */
.tab-content_virk.active {
	grid-column: 1; 
	grid-row: 1; 
    display: grid;
	grid-template-columns: 20px repeat(20, minmax(15px, 50px)) 20px;
	grid-template-rows: 5px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 40px auto 50px;
background-color: white; 
color: black; 	
}

.tab-button_virk {
    flex: 1;
    padding: 15px 30px;
    border: none;
    cursor: pointer;
    transition: 0.3s;
    text-align: center;
    max-width: 200px; /* Ensures buttons don’t stretch too much */
	 font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	     font-size: .875rem;
    line-height: 1.25rem;
	    padding-top: .375rem;
    padding-bottom: .375rem;
	padding-left: .75rem;
    padding-right: .75rem;
	color: #020817;
	font-weight: 500;
	background-color: white !important; 
	display: none; 
	
	
	
}

.tab-button_virk.active {
 font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

 
 
}



.tab-content-container-grid-employer {
    grid-column: 1 / -1;
    grid-row: 4;
	display: grid; 
	grid-template-columns: 1fr;
	grid-template-rows: 1fr ;
    padding: 20px;
    background: #fff;
    width: 100%;
    margin: 0 auto; 
}

.tab-content_virk {
    display: none;
}

.tab-content_virk.active {
	grid-column: 1; 
	grid-row: 1; 
    display: grid;
	grid-template-columns: auto 20px repeat(20, minmax(15px, 50px)) 20px auto;
	grid-template-rows: 5px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px auto 5px auto 40px auto 5px auto 20px auto 5px auto 20px auto 5px auto 20px;
background-color: white; 
color: black; 	
}

.opret_V_title
{
	grid-column: 1/-1; 
	grid-row: 2;
	text-align: center; 
    font-size: 1.875rem;
    line-height: 2.25rem;
	font-weight: 700; 
    --tw-gradient-to: #E5DEFF var(--tw-gradient-to-position);
	--tw-gradient-from: #403E43 var(--tw-gradient-from-position);
}

.employer_profile_page_pic
{
	grid-column: 1/-1; 
	grid-row: 2;
        border-radius: 50%;
        background-color: #fff;
		display: none; 
	
}

.profile_page_name
{
	grid-column: 1/-1; 
	grid-row: 4;
	text-align: center; 
    font-size: 1.875rem;
    line-height: 2.25rem;
	font-weight: 700; 
    --tw-gradient-to: #E5DEFF var(--tw-gradient-to-position);
	--tw-gradient-from: #403E43 var(--tw-gradient-from-position);
}


h1.employer_company_name
{
	grid-column: 4/11; 
	grid-row:  2;
	color:#000;
	font-size:30px;
	text-align: left;
	display:none;
}

h1.profil_ret_overskrift_20
{
	grid-column: 1/-1; 
	grid-row:  4;
	color:#000;
	font-size:30px;
	text-align: left;
}

h3.employer_navn
{
	grid-column: 6/20; 
	grid-row:  2;
}

.employer_navn_text
{
	grid-column: 6/20; 
	grid-row:  4;	                                                                      
}

h3.profil_ret_NIP
{
	grid-column: 2/17; 
	grid-row:  10/11;	                                                                      
}

.profil_ret_NIP_text
{
	grid-column: 2/20; 
	grid-row:  11/12;	                                                                      
}

h3.employer_adresse
{
	grid-column: 6/12; 
	grid-row:  6;	
}

.employer_ret_adresse_text
{
	grid-column: 6/12; 
	grid-row:  8;	
}

h3.employer_ret_postnummer
{
	grid-column: 13/20; 
	grid-row:  6;	
}

.employer_ret_postnummer_text
{
	grid-column: 13/20; 
	grid-row:  8;	
}

h3.employer_ret_by
{
	grid-column: 6/12; 
	grid-row:  10;	
}

.employer_ret_by_text
{
	grid-column: 6/12; 
	grid-row:  12;	
	}

h3.employer_ret_land
{
	grid-column: 13/20; 
	grid-row:  10;	
}

.employer_ret_land_text
{
	grid-column: 13/20; 
	grid-row:  12;	
	}
	
.employer_ret_region
{
	grid-column: 2/17; 
	grid-row: 21/22;
	display: none;
		}

.employer_ret_region_dropdown
{
	grid-column: 2/17; 
	grid-row:  22/23;	
	display: none; 
	}

h3.employer_ret_telefon
{
	grid-column: 6/12; 
	grid-row:  14;	
	}

.employer_ret_telefon_text
{
	grid-column: 6/12; 
	grid-row:  16;	
	}
	
h3.employer_ret_website
{
	grid-column: 13/20; 
	grid-row:  14;	
	}

.employer_ret_website_text
{
	grid-column: 13/20; 
	grid-row:  16;
}	
	

h3.employer_ret_email
{
	grid-column: 6/12; 
	grid-row:  18;	
	}




.employer_ret_email_text
{
	grid-column: 6/12; 
	grid-row:  20;	
	}
	
a.employer_ret_email
{
	grid-column: 13/20; 
	grid-row:  20;
font-size: 20px !important;
        font-weight: 500 !important;
        font-size: 0.875rem !important;
        line-height: 1.25rem !important;
        background-color: rgb(229, 222, 255) !important;
        border-radius: 12px !important;
        white-space: nowrap !important;
        display: inline-flex !important
;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important;
        color: rgb(64, 62, 67) !important;
        text-shadow: none !important;
        cursor: pointer !important;
}	

h3.employer_ret_kontakt_fornavn
{
	grid-column: 6/12; 
	grid-row:  22;	
	}

.employer_ret_kontakt_fornavn_text
{
	grid-column: 6/12; 
	grid-row:  24;	
	}

h3.employer_ret_kontakt_efternavn
{
	grid-column: 13/20; 
	grid-row:  22;	
	}

.employer_ret_kontakt_efternavn_text
{
	grid-column: 13/20; 
	grid-row:  24;	
	}


	

.employer_knap_ret_gem_bottom
{
	grid-column: 6/20; 
	grid-row: 28/29;
    font-size: 20px !important;

    /* Matching styles */
    padding: 0.5rem 1rem !important; /* .py-2 and .px-4 */
    font-weight: 500 !important; /* .font-medium */
    font-size: 0.875rem !important; /* .text-sm */
    line-height: 1.25rem !important;
    background-color: rgb(229, 222, 255) !important; /* .bg-primary */
    border-radius: 12px !important; /* .rounded-md */
    white-space: nowrap !important; /* .whitespace-nowrap */
    display: inline-flex !important; /* .inline-flex */
    align-items: center !important; /* .items-center */
    justify-content: center !important; /* .justify-center */
    width: 50% !important; /* .w-full */
    height: 2.5rem !important; /* .h-10 */
    transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important, 
                background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important; /* .transition-colors */
    color: rgb(64, 62, 67) !important; /* .text-primary-foreground */
    text-shadow: none !important; /* Removes text shadow */
    cursor: pointer !important;
        font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
		margin: 0 auto; 
	}

.employer_knap_ret_gem_top
{
	grid-column: 18/22;
	grid-row: 9/10;
	font-size: 25px;
	display:none;
	}
	
.virk_upload-container {
	grid-column: 9/16;
	grid-row: 6;
	width: 90%;
    text-align: center;
    border: 2px dashed #ccc;
    border-radius: 10px;
    padding: 20px;
    margin-top: 20px;
    background-color: #f9f9f9;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
margin: 0 auto; 
    /* Add these properties to center it */



}


.virk_upload-container:hover {
  background-color: #f1f1f1;
}


.virk_picture_upload_subtext
{ 
	grid-column: 1/-1;
	grid-row: 8;
	text-align: center;
	color: rgb(107 114 128 / var(--tw-text-opacity));
    font-size: .875rem;
    line-height: 1.25rem;
	font-weight: 500;
}

.employer_knap_image_gem {
    grid-column: 9/ 16 !important;
    grid-row: 10 !important;
    font-size: 20px !important;
	margin-top: 20px; 

    /* Matching styles */
    padding: 0.5rem 1rem !important; /* .py-2 and .px-4 */
    font-weight: 500 !important; /* .font-medium */
    font-size: 0.875rem !important; /* .text-sm */
    line-height: 1.25rem !important;
    background-color: rgb(229, 222, 255) !important; /* .bg-primary */
    border-radius: 12px !important; /* .rounded-md */
    white-space: nowrap !important; /* .whitespace-nowrap */
    display: inline-flex !important; /* .inline-flex */
    align-items: center !important; /* .items-center */
    justify-content: center !important; /* .justify-center */
    width: 100% !important; /* .w-full */
    height: 2.5rem !important; /* .h-10 */
    transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important, 
                background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important; /* .transition-colors */
    color: rgb(64, 62, 67) !important; /* .text-primary-foreground */
    text-shadow: none !important; /* Removes text shadow */
    cursor: pointer !important;
	margin: 0 auto; 
        font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;

}

/* Hover Styles */
.employer_knap_image_gem:hover {
    background-color: rgb(210, 202, 240) !important; /* Slightly darker background */
    color: #000 !important; /* Slightly darker text */
    transform: scale(1.02) !important; /* Subtle zoom effect */
    transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Smooth zoom transition */
	
}


/* Jobloop V profil */

.job_loop_profile {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        justify-content: center;
        /* text-shadow: 2px 2px 4px black; */
        font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    }


.profile_job_card {
	display: grid; 
	grid-template-columns: auto 10px auto 10px auto 10px auto; 
	grid-template-rows: 5px auto 5px auto 5px auto 5px auto 5px auto 5px auto 5px auto 5px; 
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    padding: 24px;
    width: 340px;
    position: relative;
    transition: 0.3s;
    min-height: 250px;
    margin-bottom: 10px;

    /* Apply animation */
    opacity: 0;
    animation: fadeIn 0.5s ease-out forwards;
}




.profile_job_card:hover {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}


.profile_job_type_loop {
    grid-column: 1/-1;
    grid-row: 4; 
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    align-items: center; /* Ensures all items align vertically */
}

.profile_job_tag {
    background: #e0e0ff;
    color: #5a5aad;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 15px;
    font-weight: bold;
    line-height: 1; /* Ensures consistent line height */
}

.profile_fulltime { background: #ece1ff; color: #5a5aad; }
.profile_parttime {background: #ffe0e0;
color: #ad5a5a;}
.profile_remote { background: #e0f7ff; color: #007acc; }
.profile_hybrid { background: #e5ffe0; color: #4caf50; }


.profile_job_title {
	grid-column: 1/-1;
	grid-row: 6; 
    font-size: 1.125rem;
	line-height: 1.75rem;
    font-weight: 600;
	--tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity));
    margin-bottom: 5px;
		/*text-shadow: 2px 2px 4px black;*/
		font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.profile_company_name {
	grid-column: 1/-1;
	grid-row: 6; 
	    --tw-text-opacity: 1;
color: rgb(126 105 171 / var(--tw-text-opacity));
    font-size: 0.875rem;
    line-height: 1.25rem;
	margin-top: 0.25rem;
		/*text-shadow: 2px 2px 4px black;*/
		font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
		display: none; 

}

.profile_job_description {
	grid-column: 1/-1;
	grid-row: 8; 
    --tw-text-opacity: 1;
    color: rgb(75 85 99 / var(--tw-text-opacity));
    font-size: 0.875rem;
    line-height: 1.25rem;
	margin-bottom: 1rem;
		/*text-shadow: 2px 2px 4px black;*/
		font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}

.profile_job_details {
        grid-column: 1 / -1;
        grid-row: 10;
        display: flex;
        gap: 0.5rem;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        color: rgb(107 114 128 / var(--tw-text-opacity));
        font-size: 0.875rem;
        line-height: 1.25rem;
        font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.profile_job_details span {
    display: flex;
    align-items: center;
}

.profile_location {
    order: 1; /* Location is always first */
	margin-right: 30px; 
}

.profile_salary {
    order: 2; /* Salary comes second */
	margin-right: 30px; 
	
}

.profile_post_time {
    order: 3; /* Date comes last */
}

.profile_job_details span i {
    margin-right: 5px;
}

.profile_job_details > :not(.location) {
    margin-right: auto; /* Push salary and date to the right when location is missing */
}



.profile_view_details {
		grid-column: 1/-1;
	grid-row: 14; 
    display: inline-block;
    text-decoration: none;
    --tw-text-opacity: 1;
    color: rgb(155 135 245 / var(--tw-text-opacity));
font-weight: 500;
gap: 0.5rem;
    transition: 0.3s;
		/*text-shadow: 2px 2px 4px black;*/
		font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
		margin-top: 20px;

}

.view_details:hover {
    color: #4b49ac;
}

.profile_edit_icon {
    background: none;
    border: none;
    cursor: pointer;
    /* Add any additional styling you need */
}

.profile_edit_icon .fas {
    font-size: 16px; /* Adjust this value as needed */
}



.profile_location_icon {
	display: none; 
	
}

.profile_salary_icon {
	display: none; 
	
	
}


/* General Styling for Action Icons */
/* Action Icons Container */
.profile_action_icons {
    grid-column: 7;
    grid-row: 2;
    display: flex;
    margin-top: 10px;
    position: relative;
}

/* Favorite Icon */
.profile_favorite_icon {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 18px;
}

.profile_favorite_icon i {
    color: #6c757d; /* Neutral gray */
	display: none;
}

/* Hover Effect for Favorite Icon */
.profile_favorite_icon:hover i {
    color: #007bff; /* Blue on hover */
}

/* Share Icon */
.profile_share_icon {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 18px;
}

.profile_share_icon i {
    color: #6c757d; /* Neutral gray */
}

/* Hover Effect for Share Icon */
.profile_share_icon:hover i {
    color: #007bff; /* Blue on hover */
}

/* Share Dropdown */
.profile_share_dropdown {
    position: relative;
}

.profile_share_links {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 30px; /* Moves dropdown below the share icon */
    right: 0;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

/* Ensure Dropdown Stays Visible When Hovering Over It */
.profile_share_dropdown:hover .profile_share_links {
    visibility: visible;
    opacity: 1;
}

/* Share Links Styling */
.profile_share_links a {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
}

/* Hover Effect */
.profile_share_links a:hover {
    color: #007bff;
}

.profile_share_links a i {
    font-size: 16px;
}


	
h3.loop_duration_title {
        grid-column: 5 / 20;
        grid-row: 9 / 10;
        font-size: 18px;
        margin-top: 15px;
		display: none; 
    }
	
.loop_duration {
        grid-column: 7 / 20;
        grid-row: 9 / 10;
        font-size: 18px;
        margin-top: 15px;
		display:none;
    }
	
h3.loop_deadline_title {
        grid-column: 5 / 20;
        grid-row: 10 / 11;
        font-size: 18px;
        margin-top: 15px;
		display:none; 
    }

.loop_deadline {
        grid-column: 9 / 20;
        grid-row: 10 / 11;
        font-size: 18px;
        margin-top: 15px;
		display:none; 
    }