/*
** Style sheet for login page
*/
* { box-sizing: border-box; margin: 0; padding: 0; }

body
{
	font-family:     -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	background:      #f0f2f5;
	color:           #1a1a2e;
	min-height:      100vh;
	display:         flex;
	align-items:     center;
	justify-content: center;
	padding:         20px;
}

.login-card
{
	background:    #ffffff;
	border-radius: 12px;
	padding:       40px;
	max-width:     400px;
	width:         100%;
	box-shadow:    0 4px 20px rgba(0,0,0,0.1);
}

.login-header
{
	text-align:    center;
	margin-bottom: 32px;
}

.login-header h1
{
	font-size:     24px;
	font-weight:   700;
	color:         #1a1a2e;
	margin-bottom: 4px;
}

.login-header p
{
	font-size: 14px;
	color:     #6b7280;
}

.form-group
{
	margin-bottom: 16px;
}

.form-group label
{
	display:       block;
	font-size:     14px;
	font-weight:   500;
	color:         #374151;
	margin-bottom: 6px;
}

.form-group input
{
	width:         100%;
	padding:       10px 14px;
	border:        1px solid #d1d5db;
	border-radius: 6px;
	font-size:     16px;
	color:         #1a1a2e;
}

.form-group input:focus
{
	outline:      none;
	border-color: #1a73e8;
}

.btn-login
{
	width:         100%;
	padding:       12px;
	background:    #1a1a2e;
	color:         #ffffff;
	border:        none;
	border-radius: 6px;
	font-size:     16px;
	font-weight:   600;
	cursor:        pointer;
	margin-top:    8px;
}

.btn-login:hover { opacity: 0.85; }

.error
{
	background:    #fee2e2;
	color:         #dc2626;
	padding:       12px 16px;
	border-radius: 6px;
	font-size:     14px;
	margin-bottom: 16px;
}

.powered-by
{
	text-align:  center;
	font-size:   12px;
	color:       #8892b0;
	margin-top:  24px;
}

/*
** Password show/hide button
*/
.btn-show-password
{
  padding:       8px 12px;
  border:        1px solid #d1d5db;
  border-radius: 6px;
  background:    #f3f4f6;
  cursor:        pointer;
  font-size:     13px;
}

.btn-show-password:hover { background: #e5e7eb; }

.password-group
{
  display: flex;
  gap:     8px;
}

.password-group input { flex: 1; }

/*
** Messages
*/
.message-success
{
  background:    #dcfce7;
  color:         #16a34a;
  padding:       12px 16px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-size:     14px;
}

.message-error
{
  background:    #fee2e2;
  color:         #dc2626;
  padding:       12px 16px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-size:     14px;
}