/**
 * Aepto WordPress admin — instrument panel (navy, no notice-stripe chrome).
 */

.aepto-wrap {
	--aepto-ink: #0b1f33;
	--aepto-ink-soft: #243b53;
	--aepto-line: #d9e2ec;
	--aepto-paper: #ffffff;
	--aepto-wash: #f5f7fa;
	--aepto-ok: #0f766e;
	--aepto-warn: #b45309;
	--aepto-bad: #b91c1c;
	--aepto-muted: #627d98;
	max-width: 960px;
	color: var(--aepto-ink);
}

/* —— Hero —— */
.aepto-hero {
	padding: 0.25rem 0 1.5rem;
	border-bottom: 1px solid var(--aepto-line);
	margin-bottom: 1.5rem;
}

.aepto-what-list {
	margin: 0.75rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.45rem 1.25rem;
}

.aepto-what-list-stacked {
	grid-template-columns: 1fr;
	max-width: 40rem;
}

.aepto-what-list li {
	position: relative;
	padding: 0.2rem 0 0.2rem 0.95rem;
	font-size: 13px;
	line-height: 1.45;
	color: var(--aepto-ink-soft);
}

.aepto-what-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55rem;
	width: 0.4rem;
	height: 0.4rem;
	background: var(--aepto-ink);
}

.aepto-about-block {
	margin-bottom: 1rem;
}

.aepto-hero-brand {
	display: flex;
	align-items: baseline;
	gap: 0.65rem;
	margin-bottom: 0.85rem;
}

.aepto-mark {
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: var(--aepto-ink);
	line-height: 1;
}

.aepto-mark-sub {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--aepto-muted);
}

.aepto-hero-domain {
	margin: 0 0 0.5rem;
	font-size: clamp(1.75rem, 3vw, 2.35rem);
	font-weight: 700;
	letter-spacing: -0.035em;
	line-height: 1.15;
	color: var(--aepto-ink);
	word-break: break-word;
}

.aepto-hero-lead {
	margin: 0 0 1.1rem;
	max-width: 40rem;
	font-size: 15px;
	line-height: 1.5;
	color: var(--aepto-ink-soft);
}

.aepto-hero-actions,
.aepto-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem;
}

.aepto-checked {
	font-size: 12px;
	color: var(--aepto-muted);
}

.aepto-btn-primary.button-primary,
.aepto-wrap .button-primary.aepto-btn-primary {
	background: var(--aepto-ink);
	border-color: var(--aepto-ink);
	color: #fff;
	text-shadow: none;
	box-shadow: none;
	border-radius: 4px;
	padding: 0 14px;
	height: 36px;
	line-height: 34px;
}

.aepto-btn-primary.button-primary:hover,
.aepto-wrap .button-primary.aepto-btn-primary:hover {
	background: var(--aepto-ink-soft);
	border-color: var(--aepto-ink-soft);
	color: #fff;
}

.aepto-btn-ghost.button {
	border-radius: 4px;
	border-color: var(--aepto-line);
	color: var(--aepto-ink);
	background: #fff;
	height: 36px;
	line-height: 34px;
}

/* —— Countdown strip —— */
.aepto-countdown {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-paper);
	margin-bottom: 1.25rem;
}

@media (max-width: 1100px) {
	.aepto-countdown {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.aepto-countdown-cell:nth-child(2n) {
		border-right: none;
	}

	.aepto-countdown-cell:nth-child(-n+2) {
		border-bottom: 1px solid var(--aepto-line);
	}
}

.aepto-countdown-cell {
	padding: 1.25rem 1.35rem 1.15rem;
	border-right: 1px solid var(--aepto-line);
	min-height: 132px;
}

.aepto-countdown-cell:last-child {
	border-right: none;
}

.aepto-countdown-label {
	display: block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--aepto-muted);
	margin-bottom: 0.45rem;
}

.aepto-countdown-value {
	display: block;
	font-size: 2.5rem;
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1;
	color: var(--aepto-ink);
	margin-bottom: 0.55rem;
	font-variant-numeric: tabular-nums;
}

.aepto-countdown-value-text {
	font-size: 1.65rem;
	letter-spacing: -0.03em;
	padding-top: 0.35rem;
}

.aepto-countdown-meta {
	display: block;
	font-size: 12px;
	line-height: 1.4;
	color: var(--aepto-muted);
}

.aepto-tone-ok .aepto-countdown-value {
	color: var(--aepto-ok);
}

.aepto-tone-warn .aepto-countdown-value {
	color: var(--aepto-warn);
}

.aepto-tone-bad .aepto-countdown-value {
	color: var(--aepto-bad);
}

.aepto-tone-muted .aepto-countdown-value {
	color: #9fb3c8;
}

/* —— PHP security —— */
.aepto-php-security {
	margin-bottom: 1.25rem;
}

.aepto-php-security-bad {
	background: #fff8f7;
}

.aepto-php-version {
	margin: 0 0 0.35rem;
	font-size: 15px;
	font-weight: 600;
	color: var(--aepto-ink);
}

.aepto-host-ticket-title {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--aepto-ink);
}

.aepto-host-ticket-text {
	width: 100%;
	max-width: 100%;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12px;
	line-height: 1.45;
	padding: 0.75rem 0.85rem;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-wash);
	color: var(--aepto-ink-soft);
	box-sizing: border-box;
	resize: vertical;
}

/* —— Panels —— */
.aepto-split {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.aepto-panel,
.aepto-card {
	background: var(--aepto-paper);
	border: 1px solid var(--aepto-line);
	padding: 1.15rem 1.25rem;
	border-radius: 0;
	box-shadow: none;
}

.aepto-panel-quiet {
	background: var(--aepto-wash);
}

.aepto-panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-bottom: 0.85rem;
}

.aepto-panel h2,
.aepto-card h2 {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 650;
	letter-spacing: -0.01em;
	color: var(--aepto-ink);
}

.aepto-panel-note,
.aepto-muted {
	color: var(--aepto-muted);
	font-size: 13px;
	line-height: 1.45;
	margin: 0.75rem 0 0;
}

.aepto-kv {
	margin: 0;
}

.aepto-kv > div {
	display: grid;
	grid-template-columns: 3.5rem 1fr;
	gap: 0.75rem;
	padding: 0.55rem 0;
	border-top: 1px solid var(--aepto-line);
}

.aepto-kv > div:first-child {
	border-top: none;
	padding-top: 0;
}

.aepto-kv dt {
	margin: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--aepto-muted);
	padding-top: 0.15rem;
}

.aepto-kv dd {
	margin: 0;
	font-size: 13px;
	color: var(--aepto-ink);
	word-break: break-word;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.aepto-checklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.45rem 1rem;
}

.aepto-checklist li {
	position: relative;
	padding: 0.4rem 0.5rem 0.4rem 1.55rem;
	font-size: 13px;
	font-weight: 600;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-wash);
	color: var(--aepto-ink);
}

.aepto-checklist li::before {
	content: "";
	position: absolute;
	left: 0.55rem;
	top: 50%;
	width: 0.55rem;
	height: 0.55rem;
	margin-top: -0.275rem;
	border-radius: 50%;
	background: #bcccdc;
}

.aepto-checklist li.is-on::before {
	background: var(--aepto-ok);
}

.aepto-checklist li.is-off {
	color: var(--aepto-muted);
	font-weight: 500;
}

.aepto-flag {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 0.2rem 0.45rem;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-wash);
	color: var(--aepto-ink-soft);
	border-radius: 0;
}

.aepto-flag-ok {
	border-color: #99f6e4;
	background: #f0fdfa;
	color: var(--aepto-ok);
}

.aepto-flag-warn {
	border-color: #fcd34d;
	background: #fffbeb;
	color: var(--aepto-warn);
}

.aepto-flag-bad {
	border-color: #fecaca;
	background: #fef2f2;
	color: var(--aepto-bad);
}

/* Legacy chip classes (Protection / dashboard) — squared, not pills */
.aepto-chip {
	display: inline-block;
	padding: 0.15rem 0.45rem;
	border-radius: 0;
	font-size: 12px;
	font-weight: 650;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-wash);
	color: var(--aepto-ink);
}

.aepto-chip-ok {
	border-color: #99f6e4;
	background: #f0fdfa;
	color: var(--aepto-ok);
}

.aepto-chip-warn {
	border-color: #fcd34d;
	background: #fffbeb;
	color: var(--aepto-warn);
}

.aepto-chip-bad {
	border-color: #fecaca;
	background: #fef2f2;
	color: var(--aepto-bad);
}

.aepto-pre {
	background: var(--aepto-wash);
	border: 1px solid var(--aepto-line);
	border-radius: 0;
	padding: 0.75rem;
	font-size: 12px;
	overflow: auto;
	max-height: 220px;
	margin: 0.75rem 0 0;
}

.aepto-alert {
	padding: 0.75rem 1rem;
	margin: 1rem 0;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-wash);
	border-radius: 0;
}

.aepto-alert-warn {
	background: #fffbeb;
	border-color: #fcd34d;
}

.aepto-alert-ok {
	background: #f0fdfa;
	border-color: #99f6e4;
	color: #115e59;
}

/* —— Outside uptime board (Connect) —— */
.aepto-uptime-board {
	padding-top: 1.25rem;
}

.aepto-uptime-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.1rem;
}

.aepto-uptime-title {
	margin: 0.15rem 0 0;
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: var(--aepto-ink);
}

.aepto-uptime-live {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.95rem;
}

.aepto-uptime-live-dot {
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	background: #9fb3c8;
}

.aepto-tone-ok .aepto-uptime-live-dot {
	background: var(--aepto-ok);
}

.aepto-tone-bad .aepto-uptime-live-dot {
	background: var(--aepto-bad);
}

.aepto-uptime-metrics {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	border: 1px solid var(--aepto-line);
	margin-bottom: 1rem;
}

.aepto-uptime-metric {
	padding: 1rem 1.1rem;
	border-right: 1px solid var(--aepto-line);
}

.aepto-uptime-metric:last-child {
	border-right: none;
}

.aepto-uptime-metric-value {
	display: block;
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -0.03em;
	margin: 0.35rem 0;
	color: var(--aepto-ink);
}

.aepto-uptime-metric-value.aepto-tone-ok {
	color: var(--aepto-ok);
}

.aepto-uptime-metric-value.aepto-tone-warn {
	color: var(--aepto-warn);
}

.aepto-uptime-metric-value.aepto-tone-bad {
	color: var(--aepto-bad);
}

.aepto-uptime-periods {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.65rem;
	margin-bottom: 1rem;
}

.aepto-uptime-period {
	border: 1px solid var(--aepto-line);
	padding: 0.85rem 0.9rem;
	background: var(--aepto-wash);
}

.aepto-uptime-pct {
	display: block;
	margin-top: 0.35rem;
	font-size: 1.45rem;
	font-weight: 700;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
}

.aepto-uptime-period.aepto-tone-ok .aepto-uptime-pct {
	color: var(--aepto-ok);
}

.aepto-uptime-period.aepto-tone-warn .aepto-uptime-pct {
	color: var(--aepto-warn);
}

.aepto-uptime-period.aepto-tone-bad .aepto-uptime-pct {
	color: var(--aepto-bad);
}

.aepto-spark {
	display: flex;
	align-items: flex-end;
	gap: 2px;
	height: 36px;
	margin: 0.25rem 0 0.35rem;
}

.aepto-spark-bar {
	flex: 1 1 0;
	min-width: 3px;
	max-width: 10px;
	height: 40%;
	background: var(--aepto-bad);
}

.aepto-spark-bar.is-up {
	height: 100%;
	background: var(--aepto-ok);
}

.aepto-spark-caption {
	margin: 0 0 1rem;
	font-size: 12px;
}

.aepto-uptime-incidents h3 {
	margin: 0 0 0.65rem;
	font-size: 0.95rem;
	color: var(--aepto-ink);
}

.aepto-incident-list {
	margin: 0 0 1rem;
	padding: 0;
	list-style: none;
}

.aepto-incident-list li {
	display: grid;
	grid-template-columns: 5.5rem 5.5rem 1fr auto;
	gap: 0.65rem;
	align-items: baseline;
	padding: 0.55rem 0;
	border-top: 1px solid var(--aepto-line);
	font-size: 13px;
}

.aepto-incident-list li.is-ongoing .aepto-incident-status {
	color: var(--aepto-bad);
	font-weight: 650;
}

.aepto-incident-dur {
	font-weight: 650;
	font-variant-numeric: tabular-nums;
}

.aepto-incident-when {
	color: var(--aepto-ink-soft);
}

@media (max-width: 782px) {
	.aepto-uptime-metrics,
	.aepto-uptime-periods {
		grid-template-columns: 1fr 1fr;
	}

	.aepto-uptime-metric {
		border-right: none;
		border-bottom: 1px solid var(--aepto-line);
	}

	.aepto-incident-list li {
		grid-template-columns: 1fr 1fr;
	}
}

/* —— Connect CTA (no left stripe, no gradient) —— */
.aepto-connect-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem;
	margin-top: 1.75rem;
	padding: 1.35rem 0 0;
	border-top: 1px solid var(--aepto-line);
}

.aepto-connect-copy {
	flex: 1 1 280px;
	max-width: 34rem;
}

.aepto-connect-copy h2 {
	margin: 0 0 0.4rem;
	font-size: 1.05rem;
	font-weight: 650;
	letter-spacing: -0.02em;
	color: var(--aepto-ink);
}

.aepto-connect-copy p {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--aepto-ink-soft);
}

.aepto-connect-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35rem;
}

.aepto-connect-meta {
	font-size: 12px;
	color: var(--aepto-muted);
}

/* Kill old vibe-coded upsell chrome if any leftover markup */
.aepto-upsell,
.aepto-upsell-connect {
	margin-top: 1.75rem;
	padding: 0;
	border: none;
	border-left: none;
	background: none;
	border-radius: 0;
}

.aepto-paid-panel {
	margin: 1.5rem 0;
	padding-top: 1.25rem;
	border-top: 1px solid var(--aepto-line);
}

.aepto-paid-panel > h2,
.aepto-paid-panel > h3 {
	margin: 0 0 1rem;
	font-size: 1.05rem;
	color: var(--aepto-ink);
}

.aepto-paid-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.85rem;
}

.aepto-upsell-paid {
	background: var(--aepto-paper);
	border: 1px solid var(--aepto-line);
	border-radius: 0;
	padding: 1rem 1.1rem;
}

.aepto-upsell-paid h3,
.aepto-upsell-paid h4 {
	margin: 0 0 0.45rem;
	font-size: 0.95rem;
	color: var(--aepto-ink);
}

.aepto-upsell-paid p {
	margin: 0 0 0.85rem;
	font-size: 13px;
	color: var(--aepto-ink-soft);
	line-height: 1.45;
}

.aepto-header h1 {
	color: var(--aepto-ink);
	font-weight: 700;
	letter-spacing: -0.025em;
	margin-bottom: 0.35rem;
}

.aepto-lead {
	color: var(--aepto-ink-soft);
	font-size: 14px;
	max-width: 40rem;
	margin-top: 0;
}

.aepto-account-chip {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
}

.aepto-account-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
}

.aepto-danger-zone {
	border-color: #fecaca;
}

.aepto-soft-line {
	margin-top: 1.5rem;
	padding-top: 1rem;
	border-top: 1px solid var(--aepto-line);
	color: var(--aepto-muted);
	font-size: 13px;
}

.aepto-admin-bar-item .aepto-ab-urgent {
	color: #fecaca;
	font-weight: 600;
}

.aepto-admin-bar-item .aepto-ab-ok {
	color: #bbf7d0;
}

.aepto-toggle-row {
	margin: 0.75rem 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
}

.aepto-protection-actions .button-primary {
	background: var(--aepto-ink);
	border-color: var(--aepto-ink);
}

.aepto-protection-actions .button-primary:hover {
	background: var(--aepto-ink-soft);
	border-color: var(--aepto-ink-soft);
}

.aepto-status-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.45rem 0;
	border-bottom: 1px solid var(--aepto-line);
}

.aepto-status-row:last-of-type {
	margin-bottom: 0.75rem;
}

.aepto-site-domain {
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--aepto-ink);
}

.aepto-attention-list {
	margin: 0;
	padding-left: 1.25rem;
}

.aepto-attention-list li {
	margin: 0.35rem 0;
}

.aepto-content-toggle label {
	display: flex;
	gap: 0.5rem;
	align-items: flex-start;
	font-weight: 500;
}

.aepto-empty p {
	margin: 0;
	color: var(--aepto-ink-soft);
}

/* First-visit welcome — grounded panel, not floating notice text */
.aepto-welcome {
	--aepto-ink: #0b1f33;
	--aepto-ink-soft: #243b53;
	--aepto-line: #d9e2ec;
	--aepto-paper: #ffffff;
	--aepto-wash: #f5f7fa;
	--aepto-muted: #627d98;
	max-width: 960px;
	margin: 0 0 1.25rem;
	padding: 0;
	border: 1px solid var(--aepto-line);
	background: var(--aepto-paper);
	box-shadow: none;
}

.aepto-welcome-inner {
	padding: 1.15rem 1.35rem 1.25rem;
	border-top: 3px solid var(--aepto-ink);
}

.aepto-welcome-kicker {
	margin: 0 0 0.35rem;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--aepto-muted);
}

.aepto-welcome-title {
	margin: 0 0 0.45rem;
	font-size: 1.15rem;
	font-weight: 650;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: var(--aepto-ink);
}

.aepto-welcome-text {
	margin: 0 0 1rem;
	max-width: 38rem;
	font-size: 13px;
	line-height: 1.5;
	color: var(--aepto-ink-soft);
}

.aepto-welcome-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
}

.aepto-welcome-dismiss {
	color: var(--aepto-muted) !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

.aepto-welcome-dismiss:hover {
	color: var(--aepto-ink) !important;
}

/* Legacy alias if old markup appears */
.aepto-inline-note {
	display: none;
}

@media (max-width: 782px) {
	.aepto-countdown,
	.aepto-split,
	.aepto-paid-grid,
	.aepto-what-list {
		grid-template-columns: 1fr;
	}

	.aepto-countdown-cell {
		border-right: none;
		border-bottom: 1px solid var(--aepto-line);
	}

	.aepto-countdown-cell:last-child {
		border-bottom: none;
	}
}