<?php
session_start();
define("APPURL", "http://localhost/hotel-booking/");
define("ADMINURL", "http://localhost/hotel-booking/admin/");
require "config/config.php";

// Multiple-login support:
// Both $_SESSION['username'] (guest) and $_SESSION['admin_username'] (admin)
// are independent keys and can coexist in the same session.
// We do NOT redirect away â€” the user can sign in as the other role at any time.
$already_guest = isset($_SESSION['username']);
$already_admin = isset($_SESSION['admin_username']);

$login_error    = '';
$register_error = '';
$register_ok    = false;
$active_tab     = 'login';

/* â”€â”€â”€ HANDLE LOGIN â”€â”€â”€ */
if (isset($_POST['action']) && $_POST['action'] === 'login') {
	$active_tab = 'login';
	$email      = trim($_POST['email']   ?? '');
	$password   = trim($_POST['password'] ?? '');
	$role       = $_POST['role'] ?? 'user';

	if (empty($email) || empty($password)) {
		$login_error = 'Please enter your email and password.';
	} else {
		if ($role === 'admin') {
			$stmt = $conn->prepare("SELECT * FROM admins WHERE email = :email");
			$stmt->bindParam(':email', $email);
			$stmt->execute();
			if ($stmt->rowCount() > 0) {
				$row = $stmt->fetch(PDO::FETCH_ASSOC);
				if (password_verify($password, $row['mypassword'])) {
					$_SESSION['admin_username'] = $row['username'];
					$_SESSION['admin_id']       = $row['id'];
					header("location: " . ADMINURL . "index.php");
					exit;
				} else {
					$login_error = 'Incorrect email or password.';
				}
			} else {
				$login_error = 'No administrator account found with that email.';
			}
		} else {
			$stmt = $conn->prepare("SELECT * FROM users WHERE email = :email");
			$stmt->bindParam(':email', $email);
			$stmt->execute();
			if ($stmt->rowCount() > 0) {
				$row = $stmt->fetch(PDO::FETCH_ASSOC);
				if (password_verify($password, $row['mypassword'])) {
					$_SESSION['username'] = $row['username'];
					$_SESSION['id']       = $row['id'];
					header("location: " . APPURL . "home.php");
					exit;
				} else {
					$login_error = 'Incorrect email or password.';
				}
			} else {
				$login_error = 'No guest account found with that email.';
			}
		}
	}
}

/* â”€â”€â”€ HANDLE REGISTER â”€â”€â”€ */
if (isset($_POST['action']) && $_POST['action'] === 'register') {
	$active_tab = 'register';
	$username   = trim($_POST['reg_username'] ?? '');
	$email      = trim($_POST['reg_email']    ?? '');
	$password   = trim($_POST['reg_password'] ?? '');
	$confirm    = trim($_POST['reg_confirm']  ?? '');

	if (empty($username) || empty($email) || empty($password) || empty($confirm)) {
		$register_error = 'All fields are required.';
	} elseif ($password !== $confirm) {
		$register_error = 'Passwords do not match.';
	} elseif (strlen($password) < 6) {
		$register_error = 'Password must be at least 6 characters.';
	} else {
		$chk = $conn->prepare("SELECT id FROM users WHERE email = :email");
		$chk->execute([':email' => $email]);
		if ($chk->rowCount() > 0) {
			$register_error = 'An account with this email already exists.';
		} else {
			$hash = password_hash($password, PASSWORD_DEFAULT);
			$ins  = $conn->prepare("INSERT INTO users (username, email, mypassword) VALUES (:u,:e,:p)");
			$ins->execute([':u' => $username, ':e' => $email, ':p' => $hash]);
			$register_ok = true;
			$active_tab  = 'login';
		}
	}
}
?>
<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>ShiaStay Hotels — Sign In</title>
	<meta name="description" content="Sign in or create your ShiaStay Hotels guest account to manage reservations and access exclusive offers.">
	<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400&family=DM+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
	<style>
		*,
		*::before,
		*::after {
			box-sizing: border-box;
			margin: 0;
			padding: 0;
		}

		:root {
			--milk: #E5DED2;
			--oat: #DCD5C9;
			--taupe: #A39382;
			--taupe-light: #C8BDB0;
			--taupe-dark: #7C6E5E;
			--mocha: #685D54;
			--mocha-dark: #494039;
			--charcoal: #232323;
			--white: #E8E2D8;
			--text-body: #232323;

			/* Theme compatibility maps */
			--navy: #232323;
			--navy-mid: #302B27;
			--navy-light: #685D54;
			--gold: #A39382;
			--gold-light: #E5DED2;
			--gold-dark: #685D54;
			--pearl: #E5DED2;
			--pearl-d: #DCD5C9;
			--slate: #232323;
		}

		html,
		body {
			height: 100%;
			font-family: 'DM Sans', sans-serif;
		}

		/* ── Layout ── */
		.page-wrapper {
			min-height: 100vh;
			display: flex;
		}

		/* ── Left Hero Panel ── */
		.hero-panel {
			flex: 1;
			background:
				linear-gradient(160deg, rgba(35, 35, 35, 0.94) 0%, rgba(73, 64, 57, 0.88) 50%, rgba(35, 35, 35, 0.94) 100%),
				url('images/hotel-bg.jpg') center/cover no-repeat;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
			padding: 64px 72px;
			position: relative;
			overflow: hidden;
		}

		.hero-panel::before {
			content: '';
			position: absolute;
			inset: 0;
			background: radial-gradient(ellipse at 20% 60%, rgba(163, 147, 130, 0.18) 0%, transparent 65%);
			pointer-events: none;
		}

		/* Taupe corner accent line */
		.hero-panel::after {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 4px;
			height: 100%;
			background: linear-gradient(to bottom, var(--taupe) 0%, transparent 100%);
		}

		.brand-logo {
			display: flex;
			align-items: center;
			gap: 12px;
			margin-bottom: 56px;
			position: relative;
		}

		.brand-logo .logo-icon {
			width: 48px;
			height: 48px;
			background: var(--taupe);
			border-radius: 2px;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.brand-logo .logo-icon i {
			color: var(--charcoal);
			font-size: 20px;
		}

		.brand-logo .logo-text {
			font-family: 'Cormorant Garamond', serif;
			font-size: 28px;
			font-weight: 700;
			color: var(--white);
		}

		.brand-logo .logo-text span {
			color: var(--taupe-light);
		}

		.hero-eyebrow {
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 4px;
			text-transform: uppercase;
			color: var(--taupe-light);
			margin-bottom: 16px;
			position: relative;
		}

		.hero-title {
			font-family: 'Cormorant Garamond', serif;
			font-size: 58px;
			font-weight: 700;
			color: var(--white);
			line-height: 1.15;
			margin-bottom: 24px;
			position: relative;
		}

		.hero-subtitle {
			font-size: 16px;
			color: rgba(255, 255, 255, 0.75);
			line-height: 1.75;
			max-width: 460px;
			margin-bottom: 48px;
			position: relative;
		}

		.hero-features {
			display: flex;
			flex-direction: column;
			gap: 18px;
			position: relative;
		}

		.hero-feature {
			display: flex;
			align-items: center;
			gap: 14px;
			color: rgba(255, 255, 255, 0.85);
			font-size: 14px;
		}

		.hero-feature .feat-icon {
			width: 40px;
			height: 40px;
			border-radius: 2px;
			background: rgba(163, 147, 130, 0.20);
			border: 1px solid rgba(163, 147, 130, 0.40);
			display: flex;
			align-items: center;
			justify-content: center;
			color: var(--oat);
			font-size: 16px;
			flex-shrink: 0;
		}

		.hero-feature strong {
			color: var(--white);
		}

		/* Taupe divider line */
		.gold-line {
			width: 60px;
			height: 2px;
			background: var(--taupe);
			margin-bottom: 40px;
			position: relative;
		}

		/* ── Right Auth Panel ── */
		.auth-panel {
			width: 500px;
			min-width: 420px;
			background: var(--milk);
			display: flex;
			flex-direction: column;
			justify-content: center;
			padding: 56px 52px;
			overflow-y: auto;
			position: relative;
		}

		.auth-panel::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			height: 4px;
			background: linear-gradient(90deg, var(--mocha) 0%, var(--taupe) 50%, var(--mocha) 100%);
		}

		/* Tab switcher */
		.tab-switcher {
			display: flex;
			background: var(--oat);
			border-radius: 3px;
			padding: 5px;
			margin-bottom: 36px;
			gap: 4px;
		}

		.tab-btn {
			flex: 1;
			padding: 12px;
			border: none;
			border-radius: 2px;
			font-family: 'DM Sans', sans-serif;
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 1px;
			text-transform: uppercase;
			cursor: pointer;
			transition: all 0.25s;
			background: transparent;
			color: var(--mocha);
		}

		.tab-btn.active {
			background: var(--mocha);
			color: var(--milk);
			box-shadow: 0 4px 16px rgba(35, 35, 35, 0.2);
		}

		.tab-btn:hover:not(.active) {
			color: var(--charcoal);
			background: rgba(163, 147, 130, 0.15);
		}

		/* Form panels */
		.form-panel {
			display: none;
		}

		.form-panel.active {
			display: block;
		}

		.panel-title {
			font-family: 'Cormorant Garamond', serif;
			font-size: 34px;
			font-weight: 700;
			color: var(--mocha);
			margin-bottom: 6px;
		}

		.panel-subtitle {
			font-size: 14px;
			color: var(--mocha-dark);
			margin-bottom: 30px;
		}

		/* Role selector */
		.role-selector {
			display: flex;
			gap: 10px;
			margin-bottom: 24px;
		}

		.role-card {
			flex: 1;
			padding: 16px 12px;
			border: 2px solid var(--oat);
			border-radius: 2px;
			text-align: center;
			cursor: pointer;
			transition: all 0.2s;
			background: var(--white);
			position: relative;
		}

		.role-card input[type="radio"] {
			position: absolute;
			opacity: 0;
			pointer-events: none;
		}

		.role-card .role-icon {
			font-size: 22px;
			color: var(--taupe);
			margin-bottom: 8px;
			display: block;
			transition: color 0.2s;
		}

		.role-card .role-label {
			font-family: 'DM Sans', sans-serif;
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 1px;
			text-transform: uppercase;
			color: var(--mocha);
			transition: color 0.2s;
		}

		.role-card.selected {
			border-color: var(--taupe);
			background: var(--oat);
			box-shadow: 0 0 0 3px rgba(163, 147, 130, 0.25);
		}

		.role-card.selected .role-icon {
			color: var(--mocha);
		}

		.role-card.selected .role-label {
			color: var(--charcoal);
		}

		/* Alerts */
		.alert-box {
			padding: 13px 16px;
			border-radius: 2px;
			font-size: 13px;
			margin-bottom: 20px;
			display: flex;
			align-items: center;
			gap: 10px;
		}

		.alert-error {
			background: rgba(220, 53, 69, 0.08);
			border: 1px solid rgba(220, 53, 69, 0.2);
			color: #8b1a1a;
			border-left: 3px solid #dc3545;
		}

		.alert-success {
			background: rgba(163, 147, 130, 0.12);
			border: 1px solid rgba(163, 147, 130, 0.3);
			color: var(--charcoal);
			border-left: 3px solid var(--taupe);
		}

		/* Active session pills */
		.session-status {
			background: var(--oat);
			border: 1px solid rgba(163, 147, 130, 0.3);
			border-radius: 2px;
			padding: 14px 16px;
			margin-bottom: 22px;
		}

		.session-status .ss-title {
			font-size: 10px;
			font-weight: 700;
			text-transform: uppercase;
			letter-spacing: 1.5px;
			color: var(--mocha);
			margin-bottom: 10px;
		}

		.session-pill {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			background: var(--mocha);
			color: var(--milk);
			border-radius: 50px;
			padding: 6px 14px;
			font-size: 12px;
			font-weight: 700;
			text-decoration: none;
			margin-right: 6px;
			margin-bottom: 4px;
			transition: all 0.2s;
		}

		.session-pill:hover {
			background: var(--taupe);
			color: var(--white);
			text-decoration: none;
		}

		.session-pill i {
			font-size: 12px;
		}

		.session-pill .pill-tag {
			background: rgba(255, 255, 255, 0.20);
			border-radius: 50px;
			padding: 2px 8px;
			font-size: 10px;
			margin-left: 4px;
		}

		/* Form controls */
		.form-group {
			margin-bottom: 20px;
		}

		.form-group label {
			display: block;
			font-size: 11px;
			font-weight: 700;
			text-transform: uppercase;
			letter-spacing: 1px;
			color: var(--mocha);
			margin-bottom: 8px;
		}

		.input-wrap {
			position: relative;
		}

		.input-wrap i {
			position: absolute;
			left: 15px;
			top: 50%;
			transform: translateY(-50%);
			color: var(--taupe);
			font-size: 13px;
		}

		.input-wrap input {
			width: 100%;
			padding: 14px 16px 14px 44px;
			border: 2px solid var(--oat);
			border-radius: 2px;
			font-size: 14px;
			color: var(--charcoal);
			background: var(--white);
			outline: none;
			transition: border-color 0.2s, box-shadow 0.2s;
			font-family: 'DM Sans', sans-serif;
		}

		.input-wrap input::placeholder {
			color: var(--taupe-dark);
		}

		.input-wrap input:focus {
			border-color: var(--taupe);
			box-shadow: 0 0 0 3px rgba(163, 147, 130, 0.2);
		}

		/* Submit button */
		.btn-submit {
			width: 100%;
			padding: 16px;
			background: var(--mocha);
			color: var(--milk);
			border: 2px solid var(--mocha);
			border-radius: 2px;
			font-family: 'DM Sans', sans-serif;
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 2px;
			text-transform: uppercase;
			cursor: pointer;
			transition: all 0.3s;
			margin-top: 4px;
		}

		.btn-submit:hover {
			background: var(--taupe);
			color: var(--white);
			border-color: var(--taupe);
			transform: translateY(-2px);
			box-shadow: 0 8px 24px rgba(163, 147, 130, 0.35);
		}

		/* Switch link */
		.switch-link {
			text-align: center;
			font-size: 13px;
			color: var(--mocha);
			margin-top: 24px;
		}

		.switch-link a {
			color: var(--taupe-dark);
			font-weight: 700;
			text-decoration: none;
			cursor: pointer;
		}

		.switch-link a:hover {
			color: var(--mocha-dark);
			text-decoration: underline;
		}

		/* Password strength */
		.strength-bar {
			height: 3px;
			border-radius: 2px;
			background: var(--oat);
			margin-top: 8px;
			overflow: hidden;
		}

		.strength-fill {
			height: 100%;
			border-radius: 2px;
			width: 0%;
			transition: width 0.3s, background 0.3s;
		}

		/* Divider */
		.form-divider {
			display: flex;
			align-items: center;
			gap: 12px;
			color: var(--taupe);
			font-size: 12px;
			margin: 20px 0;
		}

		.form-divider::before,
		.form-divider::after {
			content: '';
			flex: 1;
			height: 1px;
			background: var(--oat);
		}

		/* Responsive */
		@media (max-width: 820px) {
			.page-wrapper {
				flex-direction: column;
			}

			.hero-panel {
				min-height: 300px;
				padding: 40px 32px;
			}

			.hero-title {
				font-size: 36px;
			}

			.hero-features {
				display: none;
			}

			.auth-panel {
				width: 100%;
				min-width: unset;
				padding: 40px 28px;
			}
		}
	</style>
</head>

<body>

	<div class="page-wrapper">

		<!-- â”€â”€ LEFT HERO PANEL â”€â”€ -->
		<div class="hero-panel">

			<div class="brand-logo">
				<div class="logo-icon"><i class="fa fa-hotel"></i></div>
				<div class="logo-text">ShiaStay<span> Hotels</span></div>
			</div>

			<div class="hero-eyebrow">Premium Hospitality Since 2010</div>
			<h1 class="hero-title">Your Luxury<br>Experience<br>Begins Here</h1>
			<div class="gold-line"></div>
			<p class="hero-subtitle">
				Sign in to access your reservations, explore our world-class rooms, and enjoy exclusive guest privileges at ShiaStay Hotels across Ghana.
			</p>

			<div class="hero-features">
				<div class="hero-feature">
					<div class="feat-icon"><i class="fa fa-shield"></i></div>
					<div><strong>Secure Reservations</strong><br>Your booking data is safe and encrypted</div>
				</div>
				<div class="hero-feature">
					<div class="feat-icon"><i class="fa fa-calendar-check-o"></i></div>
					<div><strong>Instant Confirmation</strong><br>Receive your booking confirmation immediately</div>
				</div>
				<div class="hero-feature">
					<div class="feat-icon"><i class="fa fa-bell"></i></div>
					<div><strong>24/7 Concierge Access</strong><br>Guest support available any time</div>
				</div>
			</div>

		</div>

		<!-- ── RIGHT AUTH PANEL ── -->
		<div class="auth-panel">

			<!-- Tab switcher -->
			<div class="tab-switcher">
				<button class="tab-btn <?php echo $active_tab === 'login' ? 'active' : ''; ?>"
					id="tab-login-btn" onclick="switchTab('login')">
					<i class="fa fa-sign-in" style="margin-right:6px;"></i>Sign In
				</button>
				<button class="tab-btn <?php echo $active_tab === 'register' ? 'active' : ''; ?>"
					id="tab-register-btn" onclick="switchTab('register')">
					<i class="fa fa-user-plus" style="margin-right:6px;"></i>Create Account
				</button>
			</div>

			<!-- ── ACTIVE SESSION STATUS ── -->
			<?php if ($already_guest || $already_admin): ?>
				<div class="session-status">
					<div class="ss-title"><i class="fa fa-check-circle" style="color:#A39382; margin-right:4px;"></i> Currently Signed In As</div>
					<?php if ($already_guest): ?>
						<a href="<?php echo APPURL; ?>home.php" class="session-pill">
							<i class="fa fa-user"></i>
							<?php echo htmlspecialchars($_SESSION['username']); ?>
							<span class="pill-tag">Guest</span>
						</a>
					<?php endif; ?>
					<?php if ($already_admin): ?>
						<a href="<?php echo ADMINURL; ?>index.php" class="session-pill">
							<i class="fa fa-shield"></i>
							<?php echo htmlspecialchars($_SESSION['admin_username']); ?>
							<span class="pill-tag">Admin</span>
						</a>
					<?php endif; ?>
					<p style="font-size:12px; color:#8a9ab0; margin:10px 0 0;">You can sign in below to also access the <?php echo $already_admin ? 'guest' : 'admin'; ?> account.</p>
				</div>
			<?php endif; ?>

			<!-- ── LOGIN PANEL ── -->
			<div class="form-panel <?php echo $active_tab === 'login' ? 'active' : ''; ?>" id="panel-login">

				<h2 class="panel-title">Welcome Back</h2>
				<p class="panel-subtitle">Access your ShiaStay guest account</p>

				<?php if ($login_error): ?>
					<div class="alert-box alert-error">
						<i class="fa fa-exclamation-circle"></i> <?php echo htmlspecialchars($login_error); ?>
					</div>
				<?php endif; ?>
				<?php if ($register_ok): ?>
					<div class="alert-box alert-success">
						<i class="fa fa-check-circle"></i> Account created successfully. Please sign in.
					</div>
				<?php endif; ?>

				<!-- Role selector -->
				<div class="role-selector">
					<label class="role-card selected" id="card-user" onclick="selectRole('user')">
						<input type="radio" name="role_display" value="user" checked>
						<span class="role-icon"><i class="fa fa-user"></i></span>
						<span class="role-label">Guest</span>
					</label>
					<label class="role-card" id="card-admin" onclick="selectRole('admin')">
						<input type="radio" name="role_display" value="admin">
						<span class="role-icon"><i class="fa fa-shield"></i></span>
						<span class="role-label">Administrator</span>
					</label>
				</div>

				<form method="POST" action="index.php" id="login-form">
					<input type="hidden" name="action" value="login">
					<input type="hidden" name="role" id="role-hidden" value="user">

					<div class="form-group">
						<label>Email Address</label>
						<div class="input-wrap">
							<i class="fa fa-envelope"></i>
							<input type="email" name="email" placeholder="guest@email.com"
								value="<?php echo isset($_POST['email']) ? htmlspecialchars($_POST['email']) : ''; ?>"
								required autocomplete="email">
						</div>
					</div>

					<div class="form-group">
						<label>Password</label>
						<div class="input-wrap">
							<i class="fa fa-lock"></i>
							<input type="password" name="password" placeholder="••••••••"
								required autocomplete="current-password">
						</div>
					</div>

					<button type="submit" class="btn-submit" id="login-btn">
						<i class="fa fa-sign-in" style="margin-right:8px;"></i>
						<span id="login-btn-text">Sign In as Guest</span>
					</button>
				</form>

				<div class="switch-link">
					New to ShiaStay? <a onclick="switchTab('register')">Create your guest account &rarr;</a>
				</div>
			</div>

			<!-- ── REGISTER PANEL ── -->
			<div class="form-panel <?php echo $active_tab === 'register' ? 'active' : ''; ?>" id="panel-register">

				<h2 class="panel-title">Create Account</h2>
				<p class="panel-subtitle">Join ShiaStay and start booking premium stays</p>

				<?php if ($register_error): ?>
					<div class="alert-box alert-error">
						<i class="fa fa-exclamation-circle"></i> <?php echo htmlspecialchars($register_error); ?>
					</div>
				<?php endif; ?>

				<form method="POST" action="index.php">
					<input type="hidden" name="action" value="register">

					<div class="form-group">
						<label>Full Name</label>
						<div class="input-wrap">
							<i class="fa fa-user"></i>
							<input type="text" name="reg_username" placeholder="e.g. Kwame Mensah"
								value="<?php echo isset($_POST['reg_username']) ? htmlspecialchars($_POST['reg_username']) : ''; ?>"
								required autocomplete="name">
						</div>
					</div>

					<div class="form-group">
						<label>Email Address</label>
						<div class="input-wrap">
							<i class="fa fa-envelope"></i>
							<input type="email" name="reg_email" placeholder="you@email.com"
								value="<?php echo isset($_POST['reg_email']) ? htmlspecialchars($_POST['reg_email']) : ''; ?>"
								required autocomplete="email">
						</div>
					</div>

					<div class="form-group">
						<label>Password</label>
						<div class="input-wrap">
							<i class="fa fa-lock"></i>
							<input type="password" name="reg_password" placeholder="Minimum 6 characters"
								id="reg-password" oninput="updateStrength(this.value)" required>
						</div>
						<div class="strength-bar">
							<div class="strength-fill" id="strength-fill"></div>
						</div>
					</div>

					<div class="form-group">
						<label>Confirm Password</label>
						<div class="input-wrap">
							<i class="fa fa-lock"></i>
							<input type="password" name="reg_confirm" placeholder="Repeat your password" required>
						</div>
					</div>

					<button type="submit" class="btn-submit">
						<i class="fa fa-hotel" style="margin-right:8px;"></i>Create Guest Account
					</button>
				</form>

				<div class="switch-link">
					Already have an account? <a onclick="switchTab('login')">Sign in &rarr;</a>
				</div>
			</div>

		</div><!-- /.auth-panel -->

	</div><!-- /.page-wrapper -->

	<script>
		function switchTab(tab) {
			['login', 'register'].forEach(function(t) {
				document.getElementById('panel-' + t).classList.toggle('active', t === tab);
				document.getElementById('tab-' + t + '-btn').classList.toggle('active', t === tab);
			});
		}
		var currentRole = 'user';

		function selectRole(role) {
			currentRole = role;
			document.getElementById('role-hidden').value = role;
			document.getElementById('card-user').classList.toggle('selected', role === 'user');
			document.getElementById('card-admin').classList.toggle('selected', role === 'admin');
			document.getElementById('login-btn-text').textContent =
				role === 'admin' ? 'Sign In as Administrator' : 'Sign In as Guest';
		}

		function updateStrength(val) {
			var fill = document.getElementById('strength-fill');
			var score = 0;
			if (val.length >= 6) score++;
			if (val.length >= 10) score++;
			if (/[A-Z]/.test(val)) score++;
			if (/[0-9]/.test(val)) score++;
			if (/[^a-zA-Z0-9]/.test(val)) score++;
			var colors = ['#e74c3c', '#e67e22', '#f1c40f', '#38a169', '#A39382'];
			var widths = ['20%', '40%', '60%', '80%', '100%'];
			fill.style.width = widths[score - 1] || '0%';
			fill.style.background = colors[score - 1] || '#E5DED2';
		}
		<?php if ($active_tab === 'register'): ?>
			switchTab('register');
		<?php endif; ?>
	</script>
</body>

</html>
