/* ==========================================================================
   DRS gate — the branded passcode / holding screen. Devon's brand: plum,
   Georgia display, system sans UI. Ported structure from Devon's GM Pro
   password gate, recoloured. Rendered by includes/class-access.php.
   ========================================================================== */

body.postpass-drs-gate,
body:has(.drs-gate-overlay) { overflow: hidden; }

.drs-gate-overlay {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background:
		linear-gradient(150deg, rgba(42, 27, 37, 0.94) 0%, rgba(83, 43, 70, 0.9) 100%),
		var(--drs-gate-bg, none) center / cover no-repeat,
		#2A1B25;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2.5rem;
	box-sizing: border-box;
	animation: drsGateFadeIn 0.35s ease-out;
}
@keyframes drsGateFadeIn { from { opacity: 0; } to { opacity: 1; } }

.drs-gate-modal {
	width: 100%;
	max-width: 440px;
	background: #FFFFFF;
	border-radius: 12px;
	padding: 2.75rem 2.25rem;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.85rem;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
}

.drs-gate-logo { display: flex; justify-content: center; margin-bottom: 0.5rem; }
.drs-gate-logo img { height: 48px; width: auto; display: block; }
.drs-gate-logo[data-logoratio="5 / 1"] img { aspect-ratio: 5 / 1; object-fit: contain; }
.drs-gate-logo[data-logoratio="3 / 1"] img { aspect-ratio: 3 / 1; object-fit: contain; }
.drs-gate-logo[data-logoratio="4 / 3"] img { aspect-ratio: 4 / 3; object-fit: contain; height: 56px; }
.drs-gate-logo[data-logoratio="1 / 1"] img { aspect-ratio: 1 / 1; object-fit: contain; height: 60px; }
.drs-gate-logo[data-logobg="plum"] { background: #6B3A5A; padding: 12px 18px; border-radius: 8px; }
.drs-gate-logo[data-logobg="dark"] { background: #2A2A2A; padding: 12px 18px; border-radius: 8px; }
.drs-gate-logo[data-logobg="light"] { background: #F7F4F6; padding: 12px 18px; border-radius: 8px; }

.drs-gate-mark { display: flex; justify-content: center; margin-bottom: 0.4rem; }
.drs-gate-mark-badge {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border: 2px solid #6B3A5A; border-radius: 10px;
	font-family: Georgia, 'Times New Roman', serif; font-weight: 700; font-size: 13px; color: #6B3A5A;
}

.drs-gate-project { font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #6B3A5A; margin: 0; }

.drs-gate-heading {
	font-family: Georgia, 'Times New Roman', serif !important;
	font-size: 1.55rem !important; font-weight: 700 !important;
	color: #2A2A2A !important; line-height: 1.2 !important; text-align: center !important; margin: 0 !important;
}

.drs-gate-desc {
	font-size: 0.94rem !important; font-weight: 400 !important; color: #5C5C5C !important;
	line-height: 1.6 !important; text-align: center !important; margin: 0 0 0.4rem !important;
}

.drs-gate-error {
	width: 100%; font-size: 0.85rem; font-weight: 600; color: #B23A3A;
	background: #F9E8E8; border-left: 4px solid #B23A3A; border-radius: 4px;
	padding: 0.6rem 0.75rem; margin: 0; box-sizing: border-box;
}

.drs-gate-form { width: 100%; display: flex; flex-direction: column; gap: 0.85rem; box-sizing: border-box; }
.drs-gate-form br { display: none; }
.drs-gate-field { width: 100%; }
.drs-gate-label { display: block; font-size: 12px; font-weight: 700; color: #2A2A2A; margin-bottom: 6px; }
.drs-gate-label .opt { color: #8A8A8A; font-weight: 500; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.drs-gate-input {
	width: 100%; padding: 13px 16px; background: #F7F4F6;
	border: 1px solid rgba(107, 58, 90, 0.18); border-radius: 6px;
	color: #2A2A2A !important; font-size: 0.975rem; box-sizing: border-box;
	transition: border-color 0.2s ease, background 0.2s ease; outline: none;
}
.drs-gate-input::placeholder { color: rgba(42, 42, 42, 0.4); }
.drs-gate-input:focus { border-color: #6B3A5A; background: #FFFFFF; outline: 2px solid #6B3A5A; outline-offset: 1px; }

.drs-gate-submit {
	width: 100%; padding: 13px 16px; background: #6B3A5A !important; color: #FFFFFF !important;
	border: none; border-radius: 6px; font-size: 0.85rem !important; font-weight: 700 !important;
	text-align: center !important; letter-spacing: 0.06em !important; text-transform: uppercase !important;
	cursor: pointer; transition: background 0.2s ease; box-shadow: none !important; min-height: 44px;
}
.drs-gate-submit:hover, .drs-gate-submit:focus-visible { background: #532B46 !important; }

@media (max-width: 480px) {
	.drs-gate-overlay { padding: 1rem; }
	.drs-gate-modal { padding: 2rem 1.5rem; }
}