/* Elko Local Accounts — same design system */
.ela-wrap {
	--ela-navy: #1B2A4A;
	--ela-navy-deep: #14213C;
	--ela-navy-soft: #2A3D66;
	--ela-orange: #E87722;
	--ela-orange-deep: #C2600F;
	--ela-brick: #9C2F1E;
	--ela-cream: #F6EFE1;
	--ela-pine: #2C4A33;
	--ela-ink: #232A3B;
	--ela-ink-soft: #5A6274;
	--ela-line: #E2DACA;
	--ela-shadow-1: 0 1px 2px rgba(20,33,60,.06), 0 1px 6px rgba(20,33,60,.05);
	--ela-shadow-2: 0 2px 4px rgba(20,33,60,.07), 0 8px 20px rgba(20,33,60,.10);
	--ela-display: "Bitter", "Iowan Old Style", "Georgia", serif;
	color: var(--ela-ink);
	max-width: 480px;
	margin: 0 auto;
}
.ela-wrap-wide { max-width: 720px; }
.ela-wrap h2, .ela-wrap h3 { font-family: var(--ela-display); color: var(--ela-navy); letter-spacing: -.01em; }

.ela-card {
	position: relative; overflow: hidden;
	background: #fff;
	border: 1px solid var(--ela-line);
	border-radius: 14px;
	padding: 1.7rem 1.8rem 1.9rem;
	box-shadow: var(--ela-shadow-2);
}
.ela-card::before {
	content: "";
	position: absolute; top: 0; left: 0; right: 0; height: 5px;
	background: linear-gradient(90deg, var(--ela-navy) 0 62%, var(--ela-orange) 62% 84%, var(--ela-brick) 84% 100%);
}
.ela-card h2 { margin-top: .2rem; }

.ela-form label { display: block; margin-bottom: 1rem; font-weight: 600; font-size: .95rem; color: var(--ela-navy); }
.ela-form input {
	display: block; width: 100%; margin-top: .35rem;
	padding: .62rem .8rem;
	border: 1px solid var(--ela-line);
	border-radius: 6px;
	font-size: 1rem; font-weight: 400;
	background: #fff; color: var(--ela-ink);
	box-shadow: inset 0 1px 2px rgba(20,33,60,.05);
	transition: border-color .15s, box-shadow .15s;
}
.ela-form input:focus {
	outline: none; border-color: var(--ela-orange);
	box-shadow: inset 0 1px 2px rgba(20,33,60,.05), 0 0 0 3px rgba(232,119,34,.28);
}
.ela-form .ela-check { display: flex; align-items: center; gap: .5rem; font-weight: 500; }
.ela-form .ela-check input { display: inline; width: auto; margin: 0; }
.ela-form-row { display: grid; gap: 0 1.1rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .ela-form-row { grid-template-columns: 1fr 1fr; } }
.ela-hp { position: absolute !important; left: -9999px !important; }

.ela-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: .7rem 1.45rem; border-radius: 999px;
	font-weight: 700; font-size: .97rem; line-height: 1.2;
	text-decoration: none; cursor: pointer;
	border: 2px solid var(--ela-navy);
	transition: background .18s, color .18s, transform .12s, box-shadow .18s;
}
.ela-btn:active { transform: translateY(1px); }
.ela-btn-solid {
	background: linear-gradient(180deg, #F2853A 0%, var(--ela-orange) 45%, var(--ela-orange-deep) 100%);
	border-color: var(--ela-orange-deep); color: #fff;
	box-shadow: var(--ela-shadow-1), inset 0 1px 0 rgba(255,255,255,.28);
	width: 100%;
}
.ela-btn-solid:hover, .ela-btn-solid:focus {
	background: linear-gradient(180deg, var(--ela-orange) 0%, var(--ela-orange-deep) 100%);
	color: #fff; box-shadow: var(--ela-shadow-2);
}
.ela-btn-outline { background: #fff; color: var(--ela-navy); }
.ela-btn-outline:hover, .ela-btn-outline:focus { background: var(--ela-navy); color: #fff; }
.ela-btn:focus-visible { outline: 3px solid var(--ela-orange); outline-offset: 2px; }

.ela-alt { margin: .9rem 0 0; font-size: .92rem; color: var(--ela-ink-soft); }
.ela-alt a { color: var(--ela-brick); font-weight: 600; }
.ela-hint { font-size: .85rem; font-weight: 400; color: var(--ela-ink-soft); }

.ela-notice { padding: .85rem 1.15rem; border-radius: 6px; margin-bottom: 1.1rem; box-shadow: var(--ela-shadow-1); background: #fff; }
.ela-notice-ok { background: #EAF2EA; border-left: 4px solid var(--ela-pine); }
.ela-notice-err { background: #F8E9E5; border-left: 4px solid var(--ela-brick); }

.ela-account-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem; }
.ela-account-head h2 { margin: 0; }
.ela-quicklinks { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 1.3rem; }
.ela-quicklink {
	display: block; text-align: center;
	background: linear-gradient(170deg, var(--ela-navy-soft) 0%, var(--ela-navy) 55%, var(--ela-navy-deep) 100%);
	color: #fff; font-weight: 700; text-decoration: none;
	padding: 1rem .9rem; border-radius: 10px;
	box-shadow: var(--ela-shadow-1);
	transition: transform .18s, box-shadow .18s;
}
.ela-quicklink:hover { transform: translateY(-3px); box-shadow: var(--ela-shadow-2); color: #fff; }

@media (prefers-reduced-motion: reduce) {
	.ela-wrap * { transition: none !important; }
	.ela-quicklink:hover { transform: none; }
}
