/* Mloun Site Offline — admin bar notice + settings page styles. */

/* ---- Admin bar notice ---- */
#wpadminbar .mlsso-admin-bar-active {
	background: #b32d2e !important;
	color: #fff !important;
}
#wpadminbar .mlsso-admin-bar-active:hover {
	background: #8c1d1e !important;
}
#wpadminbar .mlsso-admin-bar-active .mlsso-ab-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 6px;
	border-radius: 50%;
	background: #ffd23f;
	box-shadow: 0 0 0 3px rgba(255, 210, 63, 0.35);
	animation: mlsso-pulse 1.4s infinite;
	vertical-align: middle;
}
@keyframes mlsso-pulse {
	0%, 100% { box-shadow: 0 0 0 3px rgba(255, 210, 63, 0.35); }
	50% { box-shadow: 0 0 0 6px rgba(255, 210, 63, 0.05); }
}

/* ---- Settings page ---- */
.mlsso-settings .mlsso-page-head {
	margin-bottom: 6px;
}
.mlsso-settings .mlsso-page-head h1 {
	font-size: 23px;
	margin-bottom: 6px;
}
.mlsso-card {
	background: #fff;
	border: 1px solid #e6eaf2;
	border-radius: 14px;
	padding: 8px 26px 18px;
	margin: 18px 0;
	box-shadow: 0 4px 18px rgba(20, 30, 60, 0.06);
	max-width: 820px;
}
.mlsso-card-title {
	margin: 18px 0 14px;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #2b3658;
	border-bottom: 2px solid #eef1f6;
	padding-bottom: 10px;
}
.mlsso-row {
	display: grid;
	grid-template-columns: 230px 1fr;
	gap: 18px;
	padding: 14px 0;
	border-bottom: 1px solid #f1f3f8;
	align-items: start;
}
.mlsso-row:last-child { border-bottom: none; }
.mlsso-row-label {
	font-weight: 600;
	color: #2b3658;
	padding-top: 4px;
}
.mlsso-row-hint {
	font-weight: 400;
	font-size: 12px;
	color: #8a93a8;
	margin-top: 4px;
	line-height: 1.5;
}
.mlsso-row-control .regular-text,
.mlsso-row-control .large-text {
	max-width: 100%;
}
.mlsso-row-control select {
	min-width: 260px;
}
.mlsso-row-control textarea.code {
	font-family: ui-monospace, Menlo, monospace;
}
/* Toggle switch */
.mlsso-switch {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	cursor: pointer;
	user-select: none;
}
.mlsso-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.mlsso-switch-track {
	position: relative;
	width: 50px;
	height: 28px;
	border-radius: 999px;
	background: #cdd3e0;
	transition: background 0.2s ease;
	flex: 0 0 auto;
}
.mlsso-switch-thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.25);
	transition: transform 0.2s ease;
}
.mlsso-switch input:checked + .mlsso-switch-track { background: #1a7f37; }
.mlsso-switch input:checked + .mlsso-switch-track .mlsso-switch-thumb { transform: translateX(22px); }
.mlsso-switch-state {
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: #8a93a8;
}
.mlsso-switch input:checked ~ .mlsso-switch-state { color: #1a7f37; }
.mlsso-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
}
.mlsso-status-pill {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	font-weight: 700;
	font-size: 12px;
}
.mlsso-status-pill.on { background: #fdecec; color: #b32d2e; }
.mlsso-status-pill.off { background: #e9f7ef; color: #1a7f37; }
.mlsso-banner {
	padding: 14px 18px;
	border-radius: 10px;
	font-weight: 600;
	margin: 14px 0;
	max-width: 820px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.mlsso-b-dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex: 0 0 auto;
}
.mlsso-banner.warn .mlsso-b-dot { background: #ff4d4f; }
.mlsso-banner.ok .mlsso-b-dot { background: #1a7f37; }
.mlsso-banner.warn { background: #fff7e6; border: 1px solid #ffd591; color: #874d00; }
.mlsso-banner.ok { background: #e9f7ef; border: 1px solid #95de64; color: #135200; }