:root{
	--bg-1:#f6f8ff;
	--bg-2:#f7fbf9;
	--card:#ffffff;
	--muted:#6b7280;
	--accent:#2563eb;
	--accent-2:#06b6d4;
	--danger:#fca5a5;
}
*{box-sizing:border-box}
body{
	font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
	background: linear-gradient(135deg,var(--bg-1),var(--bg-2));
	color:#0f172a;
	margin:0;
	min-height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:24px;
}
.container{
	width:100%;
	max-width:540px;
	padding:0 16px;
}
.card{
	background:var(--card);
	border-radius:12px;
	padding:28px;
	box-shadow:0 6px 18px rgba(15,23,42,0.08);
	border:1px solid rgba(2,6,23,0.04);
}
.auth-card{display:flex;flex-direction:column;gap:8px}
h1{margin:0 0 6px 0;font-size:1.6rem}
.subtitle{color:var(--muted);margin:0 0 14px 0;font-size:0.95rem}
label{display:block;margin-top:12px;font-weight:600;font-size:0.9rem}
input[type="text"],input[type="email"],input[type="password"],select,textarea{
	width:100%;
	padding:12px 14px;
	margin-top:8px;
	border:1px solid #e6eef8;
	border-radius:8px;
	background:#fbfeff;
	transition:box-shadow .12s,transform .08s;
}
input:focus{outline:none;box-shadow:0 4px 12px rgba(37,99,235,0.12);transform:translateY(-1px)}
.row{display:flex;gap:12px}
.btn{display:inline-block;padding:10px 14px;border-radius:8px;border:none;cursor:pointer;font-weight:600}
.btn-primary{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#fff}
.btn-ghost{background:transparent;color:var(--accent);border:1px solid rgba(37,99,235,0.12)}
.meta{margin-top:12px;color:var(--muted);font-size:0.95rem}
.meta a{color:var(--accent);text-decoration:none}
.errors{background:linear-gradient(180deg,#fff0f0,#fff2f2);color:#7f1d1d;padding:12px;border-radius:8px;border:1px solid rgba(124,58,52,0.08)}
.errors ul{margin:0;padding-left:18px}
.alert{background:linear-gradient(180deg,#f0fff4,#ecfdf5);color:#065f46;padding:12px;border-radius:8px;border:1px solid rgba(6,95,70,0.08)}

@media (max-width:520px){
	.card{padding:20px;border-radius:10px}
	h1{font-size:1.4rem}
}

/* Auth card variants to match uploaded design */
.auth-outer{display:flex;align-items:stretch;gap:28px;justify-content:center}
.auth-card{flex:1;max-width:420px;border-radius:12px;overflow:hidden}
.card-head{padding:28px 24px;color:#fff;text-align:center}
.card-head .title{font-size:1.5rem;font-weight:700;margin:0}
.card-head .lead{opacity:0.95;margin:6px 0 0;font-size:0.95rem}
.card-body{background:#fff;padding:22px 22px 28px}

.card-head.register{background:linear-gradient(90deg,#1e6de6,#2a9df4)}
.card-head.login{background:linear-gradient(90deg,#7b2ff7,#ff6bb1)}

.input-wrap{position:relative;margin-top:12px}
.input-wrap input{width:100%;padding-right:36px}
.input-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:#64748b}
.input-icon svg{width:12px;height:12px}

.no-underline{text-decoration:none;color:var(--accent);font-weight:600}

.checkbox-row{display:flex;align-items:center;gap:8px;margin-top:12px}
.checkbox-row input{width:16px;height:16px}

.cta{margin-top:18px}
.cta .btn{width:100%;padding:12px;border-radius:8px;font-size:1.05rem}

.divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:#94a3b8}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:#e6eef8}
.social-btn{display:flex;gap:10px;flex-direction:column}
.social-btn a{display:flex;align-items:center;gap:10px;padding:10px;border-radius:8px;border:1px solid #e6eef8;text-decoration:none;color:#0f172a;background:#fff}
.social-btn .google{border-color:transparent}
.social-btn .facebook{background:linear-gradient(90deg,#2b67b7,#2a54b2);color:#fff;border:none}

@media (max-width:920px){
	.auth-outer{flex-direction:column;padding:0 12px}
}

/* General responsive tweaks for all pages */
@media (max-width:720px){
	.container{padding:12px}
	.card{padding:18px}
	.card-head{padding:18px}
	.card-body{padding:18px}
	.title{font-size:1.25rem}
	.lead{font-size:0.9rem}
	.btn{font-size:0.95rem}
	.social-btn a{padding:10px}
}

@media (max-width:420px){
	body{padding:12px}
	.auth-outer{gap:14px}
	.input-wrap input{padding:10px}
	.input-icon{right:8px;width:20px;height:20px}
}

body.with-navbar{
	display:block;
	align-items:stretch;
	justify-content:flex-start;
	padding:0;
	background:#f6f8fb;
}

body.with-navbar .container{
	max-width:1080px;
	margin:120px auto 24px;
	padding:0 16px;
}

body.dark{
	background:#0f172a;
	color:#e2e8f0;
}

body.dark.with-navbar{
	background:#0b1220;
}

body.dark .card{
	background:#111827;
	border-color:#1f2937;
	color:#e2e8f0;
}

body.dark .subtitle,
body.dark .meta,
body.dark .status,
body.dark .profile-row,
body.dark .property-meta,
body.dark .property-description,
body.dark .property-date{
	color:#cbd5e1;
}

body.dark input[type="text"],
body.dark input[type="email"],
body.dark input[type="password"],
body.dark input[type="number"],
body.dark select,
body.dark textarea{
	background:#0f172a;
	border-color:#334155;
	color:#e2e8f0;
}

body.dark .btn-ghost{
	color:#93c5fd;
	border-color:#334155;
}

body.dark .card-body{
	background:#111827;
}

body.dark .divider{
	color:#94a3b8;
}

body.dark .divider:before,
body.dark .divider:after{
	background:#334155;
}

body.dark .social-btn a{
	background:#0f172a;
	color:#e2e8f0;
	border-color:#334155;
}

body.dark .social-btn .google{
	border-color:#334155;
}

body.dark .social-btn .facebook{
	background:#0f172a;
	color:#e2e8f0;
	border:1px solid #334155;
}

body.dark .errors{
	background:#2a1515;
	color:#fecaca;
	border-color:#7f1d1d;
}

body.dark .alert{
	background:#052e24;
	color:#bbf7d0;
	border-color:#166534;
}

/* Cross-page dark theme consistency */
body.dark h1,
body.dark h2,
body.dark h3,
body.dark .title,
body.dark .section-title{
	color:#f1f5f9;
}

body.dark .page,
body.dark .page-wrap,
body.dark .main-body{
	background:transparent;
	color:#e2e8f0;
}

body.dark .property-card,
body.dark .details-card,
body.dark .notify-item{
	background:#111827 !important;
	border-color:#334155 !important;
	color:#e2e8f0;
}

body.dark .property-body,
body.dark .details-content{
	color:#e2e8f0;
}

body.dark .property-name,
body.dark .property-title{
	color:#f8fafc !important;
}

body.dark .property-text,
body.dark .desc,
body.dark .notify-text{
	color:#cbd5e1 !important;
}

body.dark .property-date,
body.dark .notify-meta,
body.dark .meta,
body.dark .status-text{
	color:#94a3b8 !important;
}

body.dark .gallery-wrap{
	background:#0f172a !important;
	border-color:#334155 !important;
}

body.dark .gallery-empty{
	color:#94a3b8;
}

/* Shared responsive layouts for navbar pages */
.page,
.page-wrap,
.main-body{
	width:100%;
}

@media (max-width:900px){
	body.with-navbar .container{
		margin:108px auto 20px;
		padding:0 14px;
	}

	.page,
	.page-wrap{
		padding-left:14px !important;
		padding-right:14px !important;
	}

	.main-body{
		padding:20px 14px 24px !important;
	}
}

@media (max-width:520px){
	body.with-navbar .container{
		margin:100px auto 16px;
		padding:0 12px;
	}

	.page,
	.page-wrap{
		padding-left:12px !important;
		padding-right:12px !important;
	}

	.btn{
		font-size:0.92rem;
	}
}