/*
 * VapeIran Wholesale – structural styles for the login / access-request
 * forms. No brand colors here on purpose: this file only lays things out
 * (spacing, grid, flex) so the two Elementor widgets ("فرم ورود",
 * "فرم درخواست دسترسی") start from a plain, readable baseline and are then
 * fully colored/typed from Elementor's own Style tab (see includes/elementor).
 * The ready-made dark look used by the [vapeiran_gate] shortcode and the
 * built-in template lives in gate.css, loaded on top of this file.
 */

.vw-el-login, .vw-el-request,
.vw-el-login *, .vw-el-request *,
.vw-el-login *::before, .vw-el-request *::before,
.vw-el-login *::after, .vw-el-request *::after {
	box-sizing: border-box;
}

.vw-el-heading { margin: 0 0 14px; font-size: 1.15rem; font-weight: 700; }

.vw-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
@media (max-width: 480px) { .vw-grid { grid-template-columns: 1fr; } }

.vw-field { display: block; margin-bottom: 14px; }
.vw-field > span { display: block; margin-bottom: 6px; font-size: .85rem; }

.vw-el-login input[type="text"],
.vw-el-login input[type="password"],
.vw-el-request input[type="text"],
.vw-el-request input[type="tel"],
.vw-el-request input[type="email"],
.vw-el-request textarea {
	width: 100%;
	padding: 12px 14px;
	font: inherit;
	font-size: .95rem;
	color: inherit;
	background: rgba(127, 127, 127, .08);
	border: 1px solid rgba(127, 127, 127, .35);
	border-radius: 8px;
	outline: none;
	transition: border-color .15s, box-shadow .15s;
}
.vw-el-request textarea { resize: vertical; }
.vw-el-login input:focus,
.vw-el-request input:focus,
.vw-el-request textarea:focus {
	border-color: currentColor;
	box-shadow: 0 0 0 3px rgba(127, 127, 127, .18);
}

.vw-check-row { display: flex; align-items: flex-start; gap: 10px; margin: 4px 0 16px; font-size: .85rem; cursor: pointer; }
.vw-check-row input { margin-top: 5px; accent-color: currentColor; }

.vw-btn {
	display: block;
	width: 100%;
	padding: 13px 16px;
	font: inherit;
	font-weight: 700;
	color: #fff;
	background: #2b2b2e;
	border: 0;
	border-radius: 9px;
	cursor: pointer;
	transition: filter .15s, transform .05s;
}
.vw-btn:hover { filter: brightness(1.15); }
.vw-btn:active { transform: translateY(1px); }
.vw-btn[disabled] { opacity: .6; cursor: wait; }

.vw-hint { margin: 16px 0 0; text-align: center; font-size: .85rem; }
.vw-hint a { text-decoration: underline; }

.vw-alert {
	margin-bottom: 16px;
	padding: 11px 14px;
	font-size: .9rem;
	color: #b91c1c;
	background: rgba(220, 38, 38, .08);
	border: 1px solid rgba(220, 38, 38, .3);
	border-radius: 8px;
}

.vw-success { text-align: center; padding: 12px 0; }
.vw-success h3 { margin: 12px 0 6px; font-size: 1.15rem; }
.vw-success p { margin: 0 0 18px; }
.vw-check {
	width: 52px; height: 52px; margin: 0 auto;
	display: grid; place-items: center;
	font-size: 1.5rem; color: #fff;
	background: #2b2b2e; border-radius: 50%;
}

/* Honeypot: invisible to people, tempting to bots. */
.vw-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }