.cce-widget{
	/* Accent / background / card / border colors come from an admin-controlled
	   :root{...} rule injected by PHP (see CCE_Shortcode::enqueue()) — NOT
	   redeclared here, so the WordPress color picker settings always win. */
	--cce-text: #eef2ff;
	--cce-muted: #9aa4c0;
	--cce-green: #7be3a3;
	--cce-red: #ef8b8b;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	background: var(--cce-bg, #0a0e1a);
	color: var(--cce-text);
	padding: 40px 24px;
	border-radius: 12px;
	box-sizing: border-box;
}
.cce-widget *{ box-sizing: border-box; }
.cce-header{ max-width: 900px; margin: 0 auto 28px; }
.cce-title{ font-size: 34px; font-weight: 800; margin: 0 0 10px; letter-spacing: -0.01em; }
.cce-subtitle{ color: var(--cce-muted); font-size: 16px; margin: 0; }



.cce-card{
	max-width: 1200px;
	margin: 0 auto;
	background: var(--cce-card, #131b2e);
	border: 1px solid var(--cce-border, #2a3550);
	border-radius: 16px;
	padding: 36px;
}

/* Step indicator */
.cce-steps{ display:flex; align-items:center; margin-bottom: 34px; flex-wrap: wrap; gap: 6px; }
.cce-step-indicator{ display:flex; align-items:center; gap:10px; color: var(--cce-muted); font-weight:600; }
.cce-step-indicator .cce-dot{
	width: 30px; height:30px; border-radius:50%;
	display:flex; align-items:center; justify-content:center;
	background: #202a44; color: var(--cce-muted); font-size: 14px; font-weight:700;
	border: 1px solid var(--cce-border, #2a3550);
}
.cce-step-indicator.is-active .cce-dot,
.cce-step-indicator.is-done .cce-dot{ background: var(--cce-accent, #e8b84b); color:#1a1608; border-color: var(--cce-accent, #e8b84b); }
.cce-step-indicator.is-active span:last-child,
.cce-step-indicator.is-done span:last-child{ color: var(--cce-text); }
.cce-step-line{ flex: 1 0 24px; max-width: 60px; height: 1px; background: var(--cce-border, #2a3550); margin: 0 6px; }

/* Fields */
.cce-grid-2{ display:grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; }
@media (max-width: 640px){ .cce-grid-2{ grid-template-columns: 1fr; } }
.cce-field label{
	display:block; font-size: 12px; font-weight: 700; letter-spacing: .05em;
	text-transform: uppercase; color: var(--cce-muted); margin-bottom: 8px;
}
.cce-field input, .cce-field select{
	width: 100%; background: #1a2338; border: 1px solid var(--cce-border, #2a3550);
	color: var(--cce-text); padding: 13px 16px; border-radius: 10px; font-size: 15px;
}
.cce-field input:focus, .cce-field select:focus{ outline: none; border-color: var(--cce-accent, #e8b84b); }

/* Buttons */
.cce-actions{ display:flex; justify-content: space-between; align-items:center; margin-top: 32px; }
.cce-actions-end{ justify-content: flex-end; }
.cce-btn{
	border-radius: 999px; padding: 14px 26px; font-weight: 700; font-size: 15px;
	cursor: pointer; border: 1px solid transparent; display:inline-flex; align-items:center; gap:8px;
	text-decoration: none;
}
.cce-btn-primary{ background: var(--cce-accent, #e8b84b); color: #1a1608; }
.cce-btn-primary:hover{ filter: brightness(1.06); }
.cce-btn-ghost{ background: transparent; color: var(--cce-text); border-color: var(--cce-border, #2a3550); }
.cce-btn-ghost:hover{ border-color: var(--cce-accent, #e8b84b); }
.cce-btn[disabled]{ opacity:.6; cursor: not-allowed; }

/* Results */
.cce-results{ margin-top: 28px; }
.cce-results-header{ display:flex; justify-content: space-between; align-items:flex-start; gap: 20px; flex-wrap: wrap; }
.cce-results-heading{ font-size: 26px; margin: 0 0 6px; }
.cce-results-subtext{ color: var(--cce-muted); margin: 0; }
.cce-results-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 28px; }
@media (max-width: 720px){ .cce-results-grid{ grid-template-columns: 1fr; } }

.cce-result-card{
	border: 1px solid var(--cce-border, #2a3550); border-radius: 12px; padding: 20px;
	background: linear-gradient(180deg, rgba(255,255,255,0.015), transparent);
}
.cce-result-top{ display:flex; justify-content: space-between; align-items:center; margin-bottom: 10px; gap: 10px; }
.cce-result-name{ font-size: 18px; font-weight: 700; margin:0; }
.cce-badge{ font-size: 12px; font-weight: 800; letter-spacing:.03em; white-space:nowrap; }
.cce-badge-yes{ color: var(--cce-green); }
.cce-badge-no{ color: var(--cce-red); }
.cce-result-line{ color: var(--cce-muted); font-size: 14px; line-height: 1.55; margin: 4px 0; }
.cce-result-line strong{ color: #c7cee6; }

.cce-results-footer{ display:flex; gap: 14px; margin-top: 30px; flex-wrap: wrap; }
.cce-disclaimer{ color: var(--cce-muted); font-size: 13px; margin-top: 18px; }

.cce-loading{ text-align:center; padding: 40px; color: var(--cce-muted); }
.cce-error{ color: var(--cce-red); font-size: 14px; margin-top: 14px; }
