h1.form_overskrift
{
	grid-column: 3 / 21; 
	grid-row:  7/8;
	color:#000;
	font-size:20px;
	text-align: left;
}

.formlink
{
	color:#808080;
	text-decoration:underline;
}

.form_manchet
{
	grid-column: 3 / 20; 
	grid-row:  8/9;
	color:#000;
	font-size:18px;
	text-align: left;

}

.form1_content_1
{
	grid-column: 3/20; 
	grid-row:  9/10;
	padding-top: 30px;
}

.form1_content_2
{
	grid-column: 3/20; 
	grid-row:  10/11;	
	padding-bottom: 10px;                                                                                       
}

.form1_content_3
{
	grid-column: 3/20; 
	grid-row:  11/12;	
}

.form1_content_4
{
	grid-column: 3/20; 
	grid-row:  12/13;	
	padding-bottom: 10px;
}

.form1_content_5
{
	grid-column: 3/20; 
	grid-row:  13/14;	
	margin-bottom: 10px;
}

.form1_content_6
{
	grid-column: 3/20; 
	grid-row:  14/15;	
	margin-bottom: 10px;
}

.form2_content_1
{
	grid-column: 3/20; 
	grid-row:  9/10;
	padding-top: 30px;
}

.form2_content_2
{
	grid-column: 3/20; 
	grid-row:  10/11;	
	padding-bottom: 10px;                                                                                       
}

.form2_content_3
{
	grid-column: 3/20; 
	grid-row:  11/12;	
}

.form2_content_4
{
	grid-column: 3/20; 
	grid-row:  12/13;	
	padding-bottom: 10px;
}

.form2_content_5
{
	grid-column: 3/20;  
	grid-row:  13/14;	
	padding-bottom: 10px;
}

.form2_content_6
{
	grid-column: 3/20; 
	grid-row:  14/15;	
	padding-bottom: 10px;
}

.form2_content_7
{
	grid-column: 3/20;  
	grid-row:  15/16;	
	padding-bottom: 10px;
}

.form2_content_8
{
	grid-column: 3/20; 
	grid-row:  16/17;	
	padding-bottom: 10px;
	}

.form2_content_9
{
	grid-column: 3/20; 
	grid-row:  17/18;	
	padding-bottom: 10px;
	}

.form2_content_10
{
	grid-column: 3/20;  
	grid-row:  18/19;	
	padding-bottom: 10px;
	}

.form2_content_11
{
	grid-column: 3/20; 
	grid-row:  19/20;	
	padding-bottom: 10px;
	}


.form2_content_12
{
	grid-column: 3/20; 
	grid-row:  20/21;	
	padding-bottom: 10px;
	}

.form2_content_13
{
	grid-column: 3/20; 
	grid-row:  21/22;	
	padding-bottom: 10px;
	}

.form2_content_14
{
	grid-column: 3/20; 
	grid-row:  22/23;	
	padding-bottom: 10px;
	}

.form2_content_15
{
	grid-column: 3/20; 
	grid-row:  23/24;	
	padding-bottom: 10px;
	}

.form2_content_16
{
	grid-column: 3/20; 
	grid-row:  24/25;	
	padding-bottom: 10px;
	}

.form3fag1
{
	grid-column: 3/12; 
	grid-row:  9/10;
margin-top: 15px;	

	}
	
.form3fag2
{
	grid-column: 3/12;
	grid-row:  10/11;

	}

.form3fag3
{
	grid-column: 3/12; 
	grid-row:  11/12;

	}


.form3fag4
{
	grid-column: 12/22; 
	grid-row:  9/10;	
margin-top: 15px;
	}
	
.form3fag5
{
	grid-column: 12/22;
	grid-row:  10/11;

	}

.form3fag6
{
	grid-column: 12/22; 
	grid-row:  11/12;
	margin-bottom: 15px;
	}

	
	
	
	
.form_knap_frem
{
	grid-column: 3 / 21; 
	grid-row:  25;	
	text-align: center;	
	margin-top: 15px;
}


.form_knap_logon
{
	grid-column: 3 / 20; 
	grid-row:  24;	
	text-align: center;	
	margin-bottom: 10px;
}



.form_knap_glemt
{
	grid-column: 3 / 20; 
	grid-row:  25;	
	text-align: center;	
	margin-bottom: 10px;
}



.form_knap_opret_privat
{
	grid-column: 3 / 20; 
	grid-row:  26;	
	margin-bottom: 5px;
	}


.form_knap_opret_virk
{
	grid-column: 3 / 20; 
	grid-row:  27;	
}

  /* Privat oprettelse */
.privat_content_1
{
	grid-column: 3/21; 
	grid-row:  9/10;
	padding-top: 30px;
}

.privat_content_2
{
	grid-column: 3/21; 
	grid-row:  10/11;
	padding-bottom: 10px;                                                                                       
}

.privat_content_3
{
	grid-column: 3/21; 
	grid-row:  11/12;	
}

.privat_content_4
{
	grid-column: 3/21; 
	grid-row:  12/13;	
	padding-bottom: 10px;
}

.privat_content_5
{
	grid-column: 3/21; 
	grid-row:  13/14;	
	margin-bottom: 10px;
}
  
.privat_content_6
{
	grid-column: 3/21; 
	grid-row:  14/15;	
	margin-bottom: 10px;
}

.privat_content_7
{
	grid-column: 3/21; 
	grid-row:  15/16;	
	margin-bottom: 10px;
}

.privat_content_8
{
	grid-column: 3/21; 
	grid-row:  16/17;	
	margin-bottom: 10px;
}





  /* Glemt password */

.email_genskab
{
	grid-column: 3 / 21; 
	grid-row:  9/10;	
}
	
/* Existing CSS */
h1.valg_profil_title {
    grid-column: 1; 
    grid-row: 2/3;
    text-align: center;
	margin: 0 auto;
		font-size: 2.5rem;
		line-height: 1;
		font-weight: 700;
		color: rgb(64 62 67 / var(--tw-text-opacity));
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	width: 80%;
	
}

/* Parent Containers */
a.valg_profil_type_1 {
    grid-column: 1;
	grid-row: 4/5;
    display: flex;
    flex-direction: column;
    align-items: center; /* Center items vertically */
    justify-content: center; /* Center items horizontally */
    padding: 0.5rem;
    border: 1px solid hsl(var(--border, 214.3 31.8% 91.4%));
    border-radius: 16px;
    box-shadow: var(--tw-shadow, 0 1px 2px 0 rgb(0 0 0 / 0.05));
    transition: box-shadow 0.15s cubic-bezier(.4, 0, .2, 1);
    width: 90%;
    margin: 0 auto;
    text-align: center; /* Ensure text alignment is centered */
}

a.valg_profil_type_2 {
	    grid-column: 1;
		grid-row: 6/7;
    display: flex;
    flex-direction: column;
    align-items: center; /* Center items vertically */
    justify-content: center; /* Center items horizontally */
    padding: 0.5rem;
    border: 1px solid hsl(var(--border, 214.3 31.8% 91.4%));
    border-radius: 16px;
    box-shadow: var(--tw-shadow, 0 1px 2px 0 rgb(0 0 0 / 0.05));
    transition: box-shadow 0.15s cubic-bezier(.4, 0, .2, 1);
    width: 90%;
    margin: 0 auto;
    text-align: center; /* Ensure text alignment is centered */
	
}

/* General Button Styling */
.valg_type_btn {
    display: inline-block;
    background-color: rgb(64 62 67);
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 12px;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 500;
    cursor: pointer;
    text-align: center;
    margin-top: 15px;
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.valg_type_btn:hover {
  background-color: #555;
  
    color: white; /* Optional: Changes the text color */
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1); /* Applies hover shadow */
    transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1), 
                background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1), 
                box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1); /* Smooth transition */
}

.valg_type_subtext {
    grid-column: 1/-1;
grid-row: 8/9;
text-align: center; 
margin:0 auto;  

}

/* New CSS for Cards */
.valg_1_description, .valg_2_description {
    margin-top: 20px;
    text-align: center;
}

.card {
    margin: 0 auto;
    padding: 20px;
    text-align: center;
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
border: 1px solid red;
}

a.valg_profil_type_1 h2 {
    font-size: 1.5rem; /* Larger font for the title */
    font-weight: 600;
	line-height: 2rem;
    text-align: center;
    color: hsl(var(--foreground, 222.2 84% 4.9%));
    margin-bottom: 0.5rem;
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
width: 90%;
}

a.valg_profil_type_2 h2 {
    font-size: 1.5rem; /* Larger font for the title */
    font-weight: 600;
	line-height: 2rem;
    text-align: center;
    color: hsl(var(--foreground, 222.2 84% 4.9%));
    margin-bottom: 0.5rem;
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
width: 90%;
}

a.valg_profil_type_1 p {
    font-size: 1rem; /* Regular size for paragraph text */
    text-align: center;
    color: hsl(var(--foreground, 222.2 84% 4.9%));
    margin: 0;
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	text-align:center;
	margin: 0 auto;
	width: 90%;
}

a.valg_profil_type_2 p {
    font-size: 1rem; /* Regular size for paragraph text */
    text-align: center;
    color: hsl(var(--foreground, 222.2 84% 4.9%));
    margin: 0;
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	text-align:center;
	margin: 0 auto;
	width: 90%;
}
	
	
/* Login form per 01.12.2025 */

/* General Container */
.login-container {
	grid-column: 1/-1;
	grid-row: 2/3;
  max-width: 800px; /* Maximum width of the container */
  width: calc(100% - 40px); /* Ensures a 20px margin on each side */
  margin: 0 auto; /* Center horizontally */
  border-radius: 15px; /* Rounded corners */
  
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow effect */
  text-align: center; /* Center text content */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  /* Flexbox for vertical centering */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  /* Centering adjustments */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding-left: 20px; /* Ensure padding from left */
  padding-right: 20px; /* Ensure padding from right */
  box-sizing: border-box; /* Include padding in width */
}



/* Header */
.login-header {
  margin-bottom: 20px;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.login-title {
  font-size: 28px;
  font-weight: 700;
  color: #333333;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.login-subtitle {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight:400;
  color: hsl(222.2, 84%, 4.9%);
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Input Fields */
.login-field {
  margin-bottom: 15px;
  text-align: left;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   width: 90%;
}

.login-label {
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.25rem;
  color: #020817;
  margin-bottom: 5px;
  display: block;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.login-input {
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-feature-settings: inherit !important;
    font-variation-settings: inherit !important;
    font-size: 1rem !important; /* Matches the base font size */
    font-weight: inherit !important;
    line-height: 1.5rem !important; /* Matches the line-height */
    letter-spacing: inherit !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    appearance: auto !important; /* Default browser appearance */
    background-color: inherit !important; /* Matches background variable */
	border: 0.5px solid #eee !important;

    padding-top: 0.5rem !important; /* Matches top padding */
    padding-bottom: 0.5rem !important; /* Matches bottom padding */
    padding-left: 0.75rem !important; /* Matches left padding */
    padding-right: 0.75rem !important; /* Matches right padding */
    display: block !important; /* Ensures block-level behavior */
    text-align: start !important; /* Aligns the text to the start */
    cursor: text !important; /* Cursor for text input */
    box-sizing: border-box !important; /* Includes padding and border in width/height */
    border-radius: 12px !important; /* Matches the border radius */
    width: 100% !important; /* Matches button width */
    height: 3rem !important; /* Fixed height */
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important; /* Smooth transitions */
}




/* Focus Style */

.login-input:focus {
    outline: none !important; /* Remove browser's default outline */
    box-shadow: none !important; /* Remove browser's default shadow or focus glow */
    border-color: #000 !important; /* Optional: Add custom border color */
    background-color: inherit; /* Ensure consistent background */
    -webkit-box-shadow: none !important; /* Remove WebKit-specific shadow */
    -moz-box-shadow: none !important; /* Remove Mozilla-specific shadow */
}




/* Hover Style */
.login-input:hover {
    border-color: #000 !important; /* Slightly darker border on hover */
}

.login-input::placeholder {
    font-family: inherit !important; /* Match the font settings */
    font-size: 1rem !important; /* Matches .text-base size */
    line-height: 1.5rem !important; /* Matches .text-base line height */
    color: hsl(var(--muted-foreground)) !important; /* Placeholder color */
    letter-spacing: inherit !important; /* Match letter-spacing */
    opacity: 1 !important; /* Ensure placeholder is fully visible */
	font-weight: 300;
}

/* Optional: Add hover/focus styles for placeholder */
.login-input:focus::placeholder {
    color: hsl(var(--input-hover)) !important; /* Change color on focus */
    opacity: 0.75 !important; /* Slightly reduce visibility on focus */
	font-weight: 400;
}




/* Button */
.login-button {
 display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem; /* Top/Bottom: 8px, Left/Right: 16px */
    font-size: 1.125rem; /* 18px */
    font-weight: 500;
    color: rgba(255, 255, 255, 1); /* White text */
    background-color: rgba(64, 62, 67, 1); /* Accent background */
    border-radius: 12px; /* Rounded corners */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); /* Shadow */
    white-space: nowrap;
    width: 90%;
    height: 3rem; /* 48px */
    transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.login-button:hover {
background-color: rgba(85, 85, 90, 1); /* Slightly darker on hover */
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

/* Links */
.login-links {
  margin-top: 20px;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.forgot-password-link {
  font-size: 14px;
  color: #7a5fff;
  text-decoration: none;
  display: block;
  margin-bottom: 10px;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.forgot-password-link:hover {
  text-decoration: underline;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.signup-text {
  font-size: 14px;
  color: #777777;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.signup-link {
  color: #7a5fff;
  text-decoration: none;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.signup-link:hover {
  text-decoration: underline;
   font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}