/* ============================================================
   CottonCloud admin surface — premium polish
   Loaded AFTER frontend.css; scoped to .cc-front-admin-shell.
   Fixes: accidental Times serif headings, heavy blue page tint +
   neon-blue sidebar, flat plain cards. Keeps the layout/structure.
   ============================================================ */

.cc-front-admin-shell {
	--ccp-ink: #0f172a;
	--ccp-soft: #475569;
	--ccp-muted: #94a3b8;
	--ccp-line: rgba(15, 23, 42, 0.08);
	--ccp-accent: #2563eb;
	--ccp-bg: #f6f7f9;
	--ccp-radius: 16px;
}

/* ---- 1. Clean sans everywhere (kills the accidental Times serif) ---- */
.cc-front-admin-shell,
.cc-front-admin-shell h1,
.cc-front-admin-shell h2,
.cc-front-admin-shell h3,
.cc-front-admin-shell h4,
.cc-front-admin-shell [class*="title"],
.cc-front-admin-shell [class*="head"],
.cc-front-admin-shell .cc-admin-hero-card,
.cc-front-admin-shell .cc-admin-hero-card * {
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
}
.cc-front-admin-shell h1,
.cc-front-admin-shell h2,
.cc-front-admin-shell h3 {
	letter-spacing: -0.01em !important;
	font-weight: 600 !important;
	color: var(--ccp-ink);
}

/* ---- 2. Calm, neutral page background (was blue tint) ---- */
.cc-front-admin-shell,
.cc-front-admin-shell .cc-admin-app,
.cc-front-admin-shell .cc-admin-page,
.cc-front-admin-shell .cc-admin-main {
	background: var(--ccp-bg) !important;
}

/* ---- 3. Premium slate sidebar (was neon royal-blue gradient) ---- */
.cc-front-admin-shell .cc-admin-sidebar {
	background: #0f172a !important;
	border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
}
.cc-front-admin-shell .cc-admin-brand small {
	color: rgba(226, 232, 240, 0.7) !important;
}

/* ---- 4. Refined cards ---- */
.cc-front-admin-shell .cc-admin-card,
.cc-front-admin-shell .cc-admin-panel {
	background: #fff !important;
	border: 1px solid var(--ccp-line) !important;
	border-radius: var(--ccp-radius) !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 30px rgba(15, 23, 42, 0.05) !important;
}

/* ---- 5. Hero card → refined slate, clean sans heading ---- */
.cc-front-admin-shell .cc-admin-hero-card {
	background: linear-gradient(135deg, #0f172a 0%, #15233b 60%, #122e2c 100%) !important;
	border: 0 !important;
	border-radius: 18px !important;
	box-shadow: 0 18px 50px rgba(15, 23, 42, 0.18) !important;
}
.cc-front-admin-shell .cc-admin-hero-card h1,
.cc-front-admin-shell .cc-admin-hero-card h2 {
	color: #fff !important;
	font-size: 23px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
}

/* ---- 6. KPI / metric cards ---- */
.cc-front-admin-shell .cc-admin-kpis > * {
	background: #fff !important;
	border: 1px solid var(--ccp-line) !important;
	border-radius: 14px !important;
	box-shadow: none !important;
}

/* ---- 7. Tidy pills / control buttons (radius + weight, calmer) ---- */
.cc-front-admin-shell .cc-role-pill,
.cc-front-admin-shell .cc-notification-button,
.cc-front-admin-shell .cc-topbar-toggle,
.cc-front-admin-shell .cc-inbox-view-pills > * {
	border-radius: 10px !important;
	font-weight: 500 !important;
}

/* ---- 7b. Calm the bright-blue top toolbar into subtle pills.
        frontend.css paints these with a double-body-class + :is() rule
        (specificity 0,3,2); we match it and load later to win. ---- */
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-topbar :is(button, a),
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-top-actions :is(button, a),
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-meta :is(button, a) {
	background: #fff !important;
	background-image: none !important;
	color: var(--ccp-ink) !important;
	border: 1px solid var(--ccp-line) !important;
	border-radius: 10px !important;
	font-weight: 500 !important;
	box-shadow: none !important;
	text-shadow: none !important;
}
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-topbar :is(button, a):hover,
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-top-actions :is(button, a):hover,
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-meta :is(button, a):hover {
	background: #f3f6fb !important;
	background-image: none !important;
	border-color: var(--ccp-accent) !important;
	color: var(--ccp-accent) !important;
}
/* keep the two primary actions (Mail AI klient, + E-mail) accented */
body.cc-front-admin-page.cc-front-admin-shell .cc-admin-top-actions :is(button, a):nth-last-child(-n+2) {
	background: var(--ccp-accent) !important;
	background-image: none !important;
	color: #fff !important;
	border-color: var(--ccp-accent) !important;
}

/* ---- 7c. Mobile: stop the toolbar from stacking 10 full-width bars ---- */
@media (max-width: 768px) {
	body.cc-front-admin-shell .cc-admin-top-actions {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 8px !important;
		justify-content: flex-start !important;
	}
	body.cc-front-admin-shell .cc-admin-top-actions button,
	body.cc-front-admin-shell .cc-admin-top-actions > a {
		width: auto !important;
		min-width: 0 !important;
		flex: 0 0 auto !important;
		padding: 8px 12px !important;
		font-size: 13px !important;
	}
}

/* ---- 7d. Hide the internal "0% readiness" gauge from the hero
        (it tracks internal release-certification gates, not site health,
        so it reads as a broken "0%" to the operator). ---- */
body.cc-front-admin-shell .cc-admin-hero-card .cc-admin-score,
body.cc-front-admin-shell .cc-admin-score {
	display: none !important;
}

/* ---- 8. Section heads spacing ---- */
.cc-front-admin-shell .cc-pane-head h1,
.cc-front-admin-shell .cc-pane-head h2,
.cc-front-admin-shell .cc-command-head h2 {
	font-size: 19px !important;
}