/* Alectown Classifieds — Post Ad form */
.alectown-cl {
    --acl-paper: #f5f5f5;
    --acl-card: #e7f0fb;
    --acl-ink: #031b4b;
    --acl-ink-soft: #173766;
    --acl-gold: #032967;
    --acl-gold-deep: #011746;
    --acl-rust: #2057a2;
    --acl-olive: #174b8f;
    --acl-line: #c7d3e3;
	--acl-good: #3f6b44;
	--acl-err: #b23b2e;
	max-width: 760px;
	padding-left: var(--global-content-edge-padding);
    padding-right: var(--global-content-edge-padding);
    width: 100%;
	margin: 0 auto;
	color: var(--acl-ink);
	font-family: inherit;
}

.alectown-cl * { box-sizing: border-box; }

/* Head */
.alectown-cl-head h2 {
	font-size: clamp(26px, 4vw, 34px);
	margin: 0 0 8px;
	line-height: 1.12;
}
.alectown-cl-head {
    margin-bottom: 24px;
}
.alectown-cl-head p {
	margin: 0 0 26px;
	color: var(--acl-ink-soft);
	font-size: 16px;
	line-height: 1.55;
	max-width: 58ch;
}

/* Flow strip */
.alectown-cl-flow {
	display: flex;
	border: 1px solid var(--acl-line);
	border-radius: 10px;
	overflow: hidden;
	background: var(--acl-card);
	margin-bottom: 30px;
}
.alectown-cl-flow div {
	flex: 1;
	padding: 13px 16px;
	font-size: 13px;
	color: var(--acl-ink-soft);
	border-right: 1px solid var(--acl-line);
}
.alectown-cl-flow div:last-child { border-right: none; }
.alectown-cl-flow strong {
	display: block;
	color: var(--acl-ink);
	font-size: 13px;
	margin-bottom: 2px;
}

/* Sections */
.alectown-cl-section {
	background: var(--acl-card);
	border: 1px solid var(--acl-line);
	border-radius: 14px;
	padding: 22px 22px 24px;
	margin-bottom: 16px;
}
.alectown-cl-section.has-error { border-color: rgba(178, 59, 46, 0.55); }
.alectown-cl-section-head {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin-bottom: 16px;
}
.alectown-cl-num { color: var(--acl-gold-deep); font-weight: 700; font-size: 15px; }
.alectown-cl-title { font-size: 19px; font-weight: 600; }
.alectown-cl-hint { color: var(--acl-ink-soft); font-size: 13px; margin: -8px 0 14px; }

/* Fields */
.alectown-cl-field { margin-bottom: 16px; }
.alectown-cl-field:last-child { margin-bottom: 0; }
.alectown-cl label {
	display: block;
	font-size: 13.5px;
	font-weight: 600;
	margin-bottom: 6px;
	color: var(--acl-ink);
}
.alectown-cl input[type="text"],
.alectown-cl input[type="email"],
.alectown-cl input[type="tel"],
.alectown-cl input[type="number"],
.alectown-cl textarea,
.alectown-cl select {
	width: 100%;
	border: 1.5px solid var(--acl-line);
	background-color: #fff;
	border-radius: 8px;
	padding: 11px 13px;
	font-size: 15px;
	font-family: inherit;
	color: var(--acl-ink);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.alectown-cl input:focus,
.alectown-cl textarea:focus,
.alectown-cl select:focus {
	outline: none;
	border-color: var(--acl-gold);
	box-shadow: 0 0 0 3px rgba(192, 138, 40, 0.18);
}
.alectown-cl textarea { resize: vertical; min-height: 110px; line-height: 1.5; }
.alectown-cl-count { font-size: 12px; color: var(--acl-ink-soft); text-align: right; margin-top: 4px; }

.alectown-cl-field.has-error input,
.alectown-cl-field.has-error textarea,
.alectown-cl-field.has-error select { border-color: var(--acl-err); }
.alectown-cl-error { color: var(--acl-err); font-size: 12.5px; margin: 6px 0 0; }

.alectown-cl-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* Toggle */
.alectown-cl-toggle { display: flex; gap: 10px; }
.alectown-cl-toggle button {
	flex: 1;
	padding: 12px;
	border-radius: 9px;
	border: 1.5px solid var(--acl-line);
	background: #fff;
	font: inherit;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--acl-ink-soft);
	cursor: pointer;
	transition: all 0.15s ease;
}
.alectown-cl-toggle button.active {
	border-color: var(--acl-olive);
	background: rgba(87, 99, 63, 0.1);
	color: var(--acl-olive);
}

/* Photos */
.alectown-cl-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.alectown-cl-tile {
	position: relative;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	overflow: hidden;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	color: var(--acl-ink-soft);
}
.alectown-cl-tile.empty {
	border: 1.5px dashed var(--acl-line);
	background: var(--acl-paper);
	transition: border-color 0.15s ease, background 0.15s ease;
}
.alectown-cl-tile.empty:hover { border-color: var(--acl-gold); background: #fff; }
.alectown-cl-tile.locked {
	border: 1.5px dashed var(--acl-line);
	background: var(--acl-paper);
	opacity: 0.4;
	cursor: not-allowed;
}
.alectown-cl-tile.locked svg { opacity: 0.7; }
.alectown-cl-tile svg { width: 22px; height: 22px; stroke: var(--acl-ink-soft); }
.alectown-cl-tile span { font-size: 11.5px; font-weight: 600; }
.alectown-cl-tile img { width: 100%; height: 100%; object-fit: cover; }
.alectown-cl-cover {
	position: absolute; top: 6px; left: 6px;
	background: var(--acl-gold-deep); color: #fff;
	font-size: 10px; font-weight: 700; padding: 3px 7px; border-radius: 5px;
}
.alectown-cl-remove {
	position: absolute; top: 6px; right: 6px;
	width: 22px; height: 22px; border-radius: 50%; border: none;
	background: rgba(43, 33, 24, 0.75); color: #fff;
	font-size: 20px; line-height: 1; cursor: pointer;
	padding: 0;
	display: flex; align-items: center; justify-content: center;
}
.alectown-cl-photonote { font-size: 12.5px; color: var(--acl-ink-soft); margin: 12px 0 0; }

/* Price */
.alectown-cl-price { position: relative; }
.alectown-cl-cur {
	position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
	color: var(--acl-ink-soft); font-weight: 600;
}
.alectown-cl-price input { padding-left: 26px; }
.alectown-cl-price input#alectown-price {
    padding-left: 26px;
}
.alectown-cl-check {
	display: flex !important; align-items: center; gap: 8px;
	margin-top: 12px; font-size: 14px; font-weight: 400 !important; color: var(--acl-ink-soft);
	cursor: pointer;
}
.alectown-cl-check input { width: 16px; height: 16px; accent-color: var(--acl-olive); margin: 0; }

/* Review notice */
.alectown-cl-review {
	display: flex; gap: 12px;
	background: rgba(163, 78, 42, 0.07);
	border: 1px solid rgba(163, 78, 42, 0.25);
	border-radius: 10px; padding: 14px 16px; margin-top: 18px;
}
.alectown-cl-review svg { width: 20px; height: 20px; stroke: var(--acl-rust); flex-shrink: 0; margin-top: 1px; }
.alectown-cl-review p { margin: 0; font-size: 13.5px; color: var(--acl-ink-soft); line-height: 1.5; }
.alectown-cl-review strong { color: var(--acl-ink); }

/* Submit */
.alectown-cl-submit { margin-top: 6px; }
.alectown-cl-btn {
	width: 100%; border: none; border-radius: 10px;
	background: var(--acl-gold-deep); color: #fff;
	padding: 16px; font: inherit; font-size: 17px; font-weight: 600; cursor: pointer;
	box-shadow: 0 8px 20px rgba(150, 105, 28, 0.35);
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.alectown-cl-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(150, 105, 28, 0.42); }
.alectown-cl-submitsub { text-align: center; font-size: 12.5px; color: var(--acl-ink-soft); margin: 9px 0 0; }

/* Success + notices */
.alectown-cl-success {
	display: flex; gap: 14px;
	background: rgba(63, 107, 68, 0.08);
	border: 1px solid rgba(63, 107, 68, 0.35);
	border-radius: 14px; padding: 22px; margin-bottom: 24px;
}
.alectown-cl-success-icon {
	width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
	background: rgba(63, 107, 68, 0.15);
	display: flex; align-items: center; justify-content: center;
}
.alectown-cl-success-icon svg { width: 22px; height: 22px; stroke: var(--acl-good); }
.alectown-cl-success h3 { margin: 0 0 6px; font-size: 19px; }
.alectown-cl-success p { margin: 0 0 12px; color: var(--acl-ink-soft); font-size: 14.5px; line-height: 1.55; }
.alectown-cl-btn-ghost {
	display: inline-block; text-decoration: none;
	border: 1.5px solid var(--acl-olive); color: var(--acl-olive);
	border-radius: 8px; padding: 8px 16px; font-size: 13.5px; font-weight: 600;
}
.alectown-cl-notice-error {
	background: rgba(178, 59, 46, 0.08);
	border: 1px solid rgba(178, 59, 46, 0.35);
	color: var(--acl-err);
	border-radius: 10px; padding: 13px 16px; margin-bottom: 20px; font-size: 14px;
}

/* Honeypot */
.alectown-cl-hp { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }

/* Responsive */
@media (max-width: 560px) {
	.alectown-cl-section {padding: 16px;}
	.alectown-cl-grid2 { grid-template-columns: 1fr; }
	.alectown-cl-flow { flex-direction: column; }
	.alectown-cl-flow div { border-right: none; border-bottom: 1px solid var(--acl-line); }
	.alectown-cl-flow div:last-child { border-bottom: none; }
	.alectown-cl-field {margin-bottom: 0px;}
	.alectown-cl-grid2 + .alectown-cl-field{
		margin-top: 16px;
	}
}
@media (max-width: 480px) {
	.alectown-cl-photos { grid-template-columns: repeat(2, 1fr); }
}
