/* Breeze AI Scoring – Frontend Styles */

/* ── Wrapper ─────────────────────────────────── */
.bais-wrapper {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0;
	/*font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;*/
	color: #1a1a2e;

}

.bais-wrapper *,
.bais-wrapper *::before,
.bais-wrapper *::after {
	box-sizing: inherit;
}

/* ── Progress bar ────────────────────────────── */
.bais-progress-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    max-width: 1017px;
    margin: 0 auto 60px;
}
.bais-progress-step:last-child {
    width: auto;
}

.bais-progress-step {
    display: flex;
    align-items: center;
    width: 100%;
}.bais-progress-step {
	display: flex;
	align-items: center;
}

.bais-step-circle {
	   width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #C8C8C8;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 500;
    color: #4A4A4A;
    position: relative;
    z-index: 2;
    transition: all 0.3s 
ease;
}

.bais-progress-step.active .bais-step-circle {
	border-color: #FF4800;
    color: #FF4800;
    box-shadow: 0 0 0 5px rgba(255, 72, 0, 0.10);
}

.bais-progress-step.completed .bais-step-circle {
    font-size: 0;
    border-color: #FF4800;
    color: transparent;
    background: linear-gradient(180deg, #FF4800 0%, #FF7037 100%);
    box-shadow: 0 4.95px 4.95px 0 rgba(255, 72, 0, 0.30), 0 -9.552px 19.105px 0 rgba(0, 0, 0, 0.10) inset;
}   

.bais-progress-step.completed .bais-step-circle::after {
	    content: '';
    position: absolute;
    width: 20px;
    height: 14px;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12' fill='none'%3E%3Cpath d='M15.6282 0.387378C15.1332 -0.129289 14.3293 -0.128963 13.8336 0.387378L5.75659 8.80632L2.1667 5.06464C1.671 4.54797 0.867479 4.54797 0.371777 5.06464C-0.123926 5.58131 -0.123926 6.41881 0.371777 6.93548L4.85894 11.6124C5.10663 11.8706 5.43143 12 5.75625 12C6.08107 12 6.40617 11.8709 6.65387 11.6124L15.6282 2.25819C16.1239 1.74188 16.1239 0.904012 15.6282 0.387378Z' fill='white'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.bais-step-line {
    width: 80px;
    transition: background-image 0.3s ease;
    flex: 1;
    border-top: 2px dashed #4a4a4a;
    margin: 0 15px;
    z-index: 1;
    position: relative;
}
.bais-progress-step.active .bais-step-line {
    border-top: 2px dashed #f2542d;
}

.bais-progress-step.completed + .bais-progress-step .bais-step-line,
.bais-progress-step.completed .bais-step-line {
	background-image: repeating-linear-gradient(
		to right,
		#e8541a 0,
		#e8541a 5px,
		transparent 5px,
		transparent 11px
	);
}

/* ── Step layout ─────────────────────────────── */
/*.bais-step-inner {*/
/*	display: flex;*/
/*	gap: 36px;*/
/*	align-items: flex-start;*/
/*}*/

.bais-questions-sidebar {
    padding: 30px;
    background: #F8F5EE;
    border-radius: 30px;
    display: flex;
}

.bais-questions-col {
	flex: 1;
	min-width: 0;
}

.bais-sidebar-col {
    width: 407px;
    flex-shrink: 0;
}

/* ── Step header ─────────────────────────────── */
.bais-step-header {
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.bais-wrapper .bais-step-header h2, .bais-wrapper .bais-step-header h1 {
    font-size: 42px;
    font-weight: 700;
    line-height: 120%;
    margin: 0;
    text-align:center;
}

.bais-wrapper .bais-highlight {
	color: #FF4800;
}

.bais-wrapper .bais-step-subtitle {
	color: #4A4A4A;
    font-size: 18px;
    font-weight: 500;
    line-height: 140%;
}

/* ── Question blocks ─────────────────────────── */
.bais-wrapper .bais-question {
    margin-bottom: 30px;
}

.bais-wrapper .bais-question-text {
    font-weight: 700;
    margin: 0 0 20px;
}

/* ── Options (radio) ─────────────────────────── */
.bais-radios {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Options (checkbox) ──────────────────────── */
.bais-checkboxes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

/* ── Option label ────────────────────────────── */
.bais-option-label {
    display: flex;
    align-items: center;
    gap: 15px;
    cursor: pointer;
    font-size: 16px;
    color: #152638;
    line-height: 120%;
    font-weight: 400;
    transition: color 0.15s ease;
}

.bais-option-label:hover {
	color: #1a1a2e;
}

/* ── Custom input wrapper ────────────────────── */
.bais-custom-input {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

/* Hide native input */
.bais-custom-input input[type="radio"],
.bais-custom-input input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	margin: 0;
}

/* Visible UI */
.bais-input-ui {
    display: block;
    width: 22px;
    height: 22px;
    border: 1px solid #4A4A4A;
    background: #fff;
    transition: border-color 0.2s ease, background 0.2s ease;
    position: relative;
}

.bais-custom-radio .bais-input-ui {
	border-radius: 50%;
}

.bais-custom-checkbox .bais-input-ui {
	border-radius: 4px;
}
.bais-custom-checkbox input:checked ~ .bais-input-ui {
    background: #FF4800;
    border-color: #FF4800;
}
/* Checked state */
.bais-custom-radio input:checked ~ .bais-input-ui {
    background: transparent;
    border-color: #FF4800;
}

/* Radio dot */
.bais-custom-radio input:checked ~ .bais-input-ui::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #FF4800;
}
.bais-custom-checkbox input:checked ~ .bais-input-ui::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FF4800;
    border: 1px solid #FF4800;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12' fill='none'%3E%3Cpath d='M15.6282 0.387378C15.1332 -0.129289 14.3293 -0.128963 13.8336 0.387378L5.75659 8.80632L2.1667 5.06464C1.671 4.54797 0.867479 4.54797 0.371777 5.06464C-0.123926 5.58131 -0.123926 6.41881 0.371777 6.93548L4.85894 11.6124C5.10663 11.8706 5.43143 12 5.75625 12C6.08107 12 6.40617 11.8709 6.65387 11.6124L15.6282 2.25819C16.1239 1.74188 16.1239 0.904012 15.6282 0.387378Z' fill='white'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}
/* Checkbox tick */
/*.bais-custom-checkbox input:checked ~ .bais-input-ui::after {*/
/*	content: '';*/
/*	position: absolute;*/
/*	top: 47%;*/
/*	left: 50%;*/
/*	transform: translate(-50%, -50%) rotate(45deg);*/
/*	width: 4px;*/
/*	height: 8px;*/
/*	border: 2px solid #fff;*/
/*	border-top: none;*/
/*	border-left: none;*/
/*}*/

/* ── Validation error ────────────────────────── */
.bais-validation-error {
	display: none;
	color: #c0392b;
	font-size: 13px;
	font-weight: 500;
	margin: 8px 0 0;
	padding: 8px 12px;
	background: #fff0ee;
	border-left: 3px solid #c0392b;
	border-radius: 0 4px 4px 0;
}

/* ── Navigation buttons ──────────────────────── */
.bais-step-nav {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.bais-next-btn,
.bais-submit-btn {
	background: #1a1a2e;
	color: #fff;
	border: none;
	padding: 13px 28px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.1s ease;
	letter-spacing: 0.3px;
}

.bais-next-btn:hover,
.bais-submit-btn:hover {
	background: #e8541a;
}

.bais-next-btn:active,
.bais-submit-btn:active {
	transform: scale(0.98);
}

.bais-prev-btn {
	background: transparent;
	color: #888;
	border: 1px solid #d0cfc9;
	padding: 12px 20px;
	border-radius: 8px;
	font-size: 14px;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.bais-prev-btn:hover {
	border-color: #e8541a;
	color: #e8541a;
}

/* ── Coming soon placeholder ─────────────────── */
.bais-coming-soon {
	color: #999;
	font-style: italic;
	padding: 20px 0;
	text-align: center;
}

/* ── Sidebar ─────────────────────────────────── */
.bais-sidebar-card {
    background: #fff;
    border-radius: 20px;
    padding: 25px;
    position: sticky;
    top: 30px;
}

.bais-sidebar-image {
	text-align: center;
	margin-bottom: 18px;
}

.bais-sidebar-image img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

.bais-sidebar-title {
	font-size: 16px;
	font-weight: 700;
	color: #1a1a2e;
	margin: 0 0 10px;
	line-height: 1.3;
}

.bais-sidebar-content {
	font-size: 13px;
	color: #666;
	line-height: 1.65;
	margin: 0;
}

/* ── Loading spinner ─────────────────────────── */
.bais-loading {
	text-align: center;
	padding: 60px 20px;
	color: #888;
	font-size: 15px;
}

.bais-loading::before {
	content: '';
	display: block;
	width: 36px;
	height: 36px;
	border: 3px solid #e8e8e8;
	border-top-color: #e8541a;
	border-radius: 50%;
	animation: baisSpinner 0.8s linear infinite;
	margin: 0 auto 14px;
}

@keyframes baisSpinner {
	to { transform: rotate(360deg); }
}

/* ── Contact / CF7 step ──────────────────────── */
.bais-contact-layout {
	max-width: 700px;
	margin: 0 auto;
}

.bais-contact-header {
	text-align: center;
	margin-bottom: 32px;
}

.bais-contact-header .bais-step-title {
	font-size: 28px;
}

.bais-contact-header .bais-step-subtitle {
	font-size: 14px;
}

/* CF7 form wrapper */
.bais-cf7-wrapper {
	background: #fff;
	border: 1px solid #ebebeb;
	border-radius: 12px;
	padding: 32px 36px;
}

/* Two-column grid inside CF7 form */
.bais-cf7-wrapper .bais-cf7-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-bottom: 16px;
}

/* All CF7 inputs */
.bais-cf7-wrapper .wpcf7-form-control-wrap,
.bais-cf7-wrapper p {
	display: block;
	margin: 0;
}

.bais-cf7-wrapper input[type="text"],
.bais-cf7-wrapper input[type="email"],
.bais-cf7-wrapper input[type="tel"],
.bais-cf7-wrapper input[type="url"],
.bais-cf7-wrapper textarea,
.bais-cf7-wrapper select {
	width: 100%;
	padding: 13px 16px;
	border: 1px solid #d8d8d8;
	border-radius: 8px;
	font-size: 14px;
	color: #1a1a2e;
	background: #fff;
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	font-family: inherit;
	margin-bottom: 16px;
}

.bais-cf7-wrapper input:focus,
.bais-cf7-wrapper textarea:focus {
	border-color: #e8541a;
	box-shadow: 0 0 0 3px rgba(232, 84, 26, 0.12);
}

.bais-cf7-wrapper input::placeholder,
.bais-cf7-wrapper textarea::placeholder {
	color: #aaa;
}

/* Submit button */
.bais-cf7-wrapper .wpcf7-submit,
.bais-cf7-wrapper input[type="submit"],
.bais-cf7-wrapper .bais-cf7-submit {
	width: 100%;
	background: #1a1a2e;
	color: #fff;
	border: none;
	padding: 16px 28px;
	border-radius: 8px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.2s ease;
	letter-spacing: 0.3px;
	margin-top: 4px;
	font-family: inherit;
}

.bais-cf7-wrapper .wpcf7-submit:hover,
.bais-cf7-wrapper input[type="submit"]:hover,
.bais-cf7-wrapper .bais-cf7-submit:hover {
	background: #e8541a;
}

/* CF7 validation errors */
.bais-cf7-wrapper .wpcf7-not-valid-tip {
	color: #c0392b;
	font-size: 12px;
	margin-top: -12px;
	margin-bottom: 8px;
	display: block;
}

/* Hide CF7 response output — we show our own results */
.bais-step-contact .wpcf7-response-output {
	display: none !important;
}

/* CF7 notice (no shortcode configured) */
.bais-cf7-notice {
	text-align: center;
	color: #999;
	font-style: italic;
	padding: 20px 0;
}

/* Back link below CF7 form */
.bais-contact-back {
	text-align: center;
	margin-top: 16px;
}

.bais-prev-link {
	background: transparent;
	border: none;
	padding: 8px 0;
	color: #999;
	font-size: 13px;
	cursor: pointer;
	text-decoration: underline;
	transition: color 0.2s ease;
}

.bais-prev-link:hover {
	color: #e8541a;
	border: none;
}

/* ── Results page ────────────────────────────── */
.bais-results {
	padding: 4px 0 16px;
}

/* ① Header */
.bais-results-header {
	text-align: center;
	margin-bottom: 36px;
}

.bais-results-title {
	font-size: 30px;
	font-weight: 800;
	color: #1a1a2e;
	margin: 0 0 10px;
	line-height: 1.25;
}

.bais-results-subtitle {
	font-size: 14px;
	color: #777;
	margin: 0;
}

/* ② Score card */
.bais-score-card {
	display: flex;
	align-items: center;
	gap: 32px;
	background: #fff;
	border: 1px solid #ebebeb;
	border-radius: 14px;
	padding: 32px 36px;
	margin-bottom: 40px;
}

.bais-score-card-text {
	flex: 1;
}

.bais-score-level-title {
	font-size: 20px;
	font-weight: 800;
	color: #1a1a2e;
	margin: 0 0 12px;
	line-height: 1.3;
}

.bais-score-level-desc {
	font-size: 14px;
	color: #555;
	line-height: 1.65;
	margin: 0;
}

.bais-score-card-right {
	flex-shrink: 0;
	text-align: center;
	min-width: 160px;
}

/* Score percentage number */
.bais-score-pct-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 160px;
	height: 100px;
}

.bais-score-pct {
	font-size: 52px;
	font-weight: 800;
	color: #e8541a;
	line-height: 1;
	letter-spacing: -1px;
}

.bais-gauge-label {
	font-size: 12px;
	color: #888;
	margin-top: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}

.bais-gauge-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #e8541a;
	flex-shrink: 0;
}

/* ③ Breakdown section */
.bais-breakdown-section {
	text-align: center;
	margin-bottom: 32px;
}

.bais-breakdown-title {
	font-size: 26px;
	font-weight: 800;
	color: #1a1a2e;
	margin: 0 0 10px;
}

.bais-breakdown-subtitle {
	font-size: 14px;
	color: #777;
	margin: 0 0 28px;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

/* Insight cards grid */
.bais-insight-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	text-align: left;
}

.bais-insight-card {
	background: #fff;
	border: 1px solid #ebebeb;
	border-radius: 12px;
	padding: 24px 22px;
}

.bais-insight-icon {
	font-size: 28px;
	margin-bottom: 14px;
	display: block;
	width: 52px;
	height: 52px;
	background: rgba(232, 84, 26, 0.1);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.bais-insight-title {
	font-size: 15px;
	font-weight: 700;
	color: #1a1a2e;
	margin: 0 0 10px;
}

.bais-insight-desc {
	font-size: 13px;
	color: #666;
	line-height: 1.6;
	margin: 0;
}

/* ④ Footer text */
.bais-results-footer {
	text-align: center;
	font-size: 14px;
	color: #666;
	margin: 32px 0 20px;
}

/* ⑤ CTA button */
.bais-cta-wrap {
	text-align: center;
	margin-bottom: 24px;
}
.bais-validation-error {
    font-size: 16px;
}

.bais-cta-btn {
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: auto;
    white-space: normal;
    padding: 12px 25px;
    color: #fff;
    border: none;
    color: var(--White, #FFF);
    font-family: "Inter", Sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
    cursor: pointer;
    transition: 0.3s all;
    border-radius: 100px;
    background-color: var(--Blue, #152638);
    box-shadow: 0 10px 25px 0 rgba(21, 39, 56, 0.22);
    margin-inline: auto;
    position: relative;
}

.bais-cta-btn:hover {
	background: #e8541a;
	color: #fff;
}

/* Restart */
.bais-restart-wrap {
	text-align: center;
}

.bais-restart-btn {
	background: transparent;
	border: 2px solid #d0d0d0;
	color: #999;
	padding: 10px 22px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
}

.bais-restart-btn:hover {
	border-color: #1a1a2e;
	color: #1a1a2e;
}


/* ── Responsive ──────────────────────────────── */

@media (max-width: 1024px) {
.bais-wrapper .bais-step-header h2, .bais-wrapper .bais-step-header h1 {
    font-size: 38px;
}
}

@media (max-width: 1024px) {
.bais-progress-bar {
    margin: 0 auto 40px;
}
}


@media (max-width: 767px) {
    .bais-wrapper .bais-step-header h2, .bais-wrapper .bais-step-header h1 {
    font-size: 38px;
}
.bais-wrapper .bais-step-subtitle {
    font-size: 16px;
}
    .bais-step-header {
    margin-bottom: 30px;
}
    .bais-step-circle {
    width: 24px;
    height: 24px;
    font-size: 14px;
}
    .bais-progress-bar {
    margin: 0 auto 30px;
}
	.bais-wrapper {
		padding: 32px 16px;
	}

	/*.bais-step-inner {*/
	/*	flex-direction: column;*/
	/*}*/

	.bais-sidebar-col {
		width: 100%;
	}

	.bais-sidebar-card {
		position: static;
	}

	.bais-checkboxes {
		grid-template-columns: 1fr;
	}

	.bais-step-title {
		font-size: 22px;
	}

	.bais-step-line {
		width: 36px;
	}

	/* Results page responsive */
	.bais-score-card {
		flex-direction: column;
		gap: 24px;
		padding: 24px;
		text-align: center;
	}

	.bais-score-card-text {
		text-align: left;
	}

	.bais-score-card-right {
		min-width: unset;
	}

	.bais-score-pct-wrap {
		width: auto;
		height: auto;
	}

	.bais-insight-cards {
		grid-template-columns: 1fr;
	}

	.bais-results-title {
		font-size: 22px;
	}

	.bais-breakdown-title {
		font-size: 20px;
	}

	.bais-cf7-wrapper .bais-cf7-row {
		grid-template-columns: 1fr;
	}
}
