/* Page-specific styles for index.php (login page)
   Base styles (font, reset, background, .bg-img) are now in main.css */

.container{
	max-width: 430px;
	width: 100%;
	background: var(--color-bg);
	border-radius: var(--border-radius);
	box-shadow: 0 5px 10px rgba(0,0,0,0.3);
	z-index: 1000;
}
.container .registration{
	display: none;
}
#check:checked ~ .registration{
	display: block;
}
#check:checked ~ .login{
	display: none;
}
#check{
	display: none;
}

/* Override shared layout for login pages */
.page-shell {
    padding: 0 var(--gap) 0 var(--gap);
    gap: 0;
}
.page-shell .logged-bar {
    display: none;
}
.page-shell .page-main {
    height: calc(100vh - 120px); /* 80px header + 40px footer */
    justify-content: center;
    align-items: center;
}
.page-shell .panel {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    overflow: visible;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container .form{
	padding: 2rem;
}
.form header{
	font-size: 2rem;
	font-weight: 500;
	text-align: center;
	margin-bottom: 1.5rem;
}
 .form input{
	 height: 60px;
	 width: 100%;
	 padding: 0 15px;
	 font-size: 17px;
	 margin-bottom: 1.3rem;
	 border: 1px solid var(--color-gray-250);
	 border-radius: var(--border-radius);
	 outline: none;
 }
 .form input:focus{
	 box-shadow: 0 1px 0 rgba(0,0,0,0.2);
 }
.form a{
	font-size: 16px;
	color: var(--color-primary);
	text-decoration: none;
}
.form a:hover{
	text-decoration: underline;
}
.form input.button{
	/* Uses .btn class from main.css - only login-specific spacing here */
	margin-top: 1.7rem;
}

.form p {
	padding: 10px;
	font-size: 17px;
	margin-bottom: 1.3rem;
	text-align: center;
}

.form p.error {
	color: var(--color-error-bright);
}
.signup{
	font-size: 17px;
	text-align: center;
}
.signup label {
	color: var(--color-primary);
	cursor: pointer;
}
.signup label:hover {
	text-decoration: underline;
}

/* Hide burger and keep menu visible on all viewports for login */
.navbar-toggle {
	display: none !important;
}
.navbar-container .navbar-menu {
	display: flex !important;
	position: static;
	height: auto;
	max-height: none;
	width: auto;
	padding: 0;
	box-shadow: none;
	border: none;
	backdrop-filter: none;
}