/**
 * wcb/resume-form - single-page comprehensive resume form.
 *
 * Card shell + section title styling matches the .wcb-cp-section
 * pattern used elsewhere in the plugin (company profile, etc.) so the
 * candidate-side resume editor and the public profile pages share one
 * visual language.
 */

/* Block container — card chrome matching `.wcb-card` from `wcb-ui.css` so the
 * Pro resume form reads as part of the same product family as the candidate
 * dashboard and resume-builder. The `--compact` variant (used in dashboard
 * embeds) keeps the card chrome but drops the centered max-width because the
 * surrounding tab panel already supplies it. */
.wcb-resume-form {
	font-family: inherit;
	display: flex;
	flex-direction: column;
	gap: var(--wcb-space-xl, 24px);
	max-width: 960px;
	margin: 0 auto;
	background: var(--wcb-base, #ffffff);
	border: 1px solid var(--wcb-border, #e2e8f0);
	border-radius: var(--wcb-radius-lg, 10px);
	box-shadow: var(--wcb-shadow-sm);
	padding: var(--wcb-space-2xl);
}

.wcb-resume-form--compact {
	max-width: none;
	gap: var(--wcb-space-lg, 16px);
}

@media (max-width: 640px) {
	.wcb-resume-form { padding: var(--wcb-space-lg); border-radius: var(--wcb-radius-md, 8px); }
}

/* -- Header -- */
.wcb-rf-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wcb-space-md, 14px);
	padding-bottom: var(--wcb-space-md, 14px);
	border-bottom: 1px solid var(--wcb-border, #e5e7eb);
}

.wcb-rf-visibility-note {
	margin: var(--wcb-space-sm, 8px) 0 0;
	font-size: var(--wcb-text-sm, 13px);
	line-height: 1.5;
	color: var(--wcb-text-secondary, #64748b);
}

.wcb-rf-visibility-note--private {
	color: #b45309;
}

.wcb-rf-title {
	margin: 0;
	font-size: var(--wcb-text-2xl);
	font-weight: var(--wcb-font-bold, 700);
	color: var(--wcb-contrast, #0f172a);
}

.wcb-rf-public-toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--wcb-space-sm);
	font-size: var(--wcb-text-base);
	color: var(--wcb-contrast, #1f2937);
	cursor: pointer;
}

.wcb-rf-public-toggle input {
	width: 18px;
	height: 18px;
	cursor: pointer;
}

/* -- Section card -- */
.wcb-rf-section {
	background: var(--wcb-base, #fff);
	border: 1px solid var(--wcb-border, #e5e7eb);
	border-radius: var(--wcb-radius-2xl, 16px);
	padding: var(--wcb-space-2xl, 28px) var(--wcb-space-2xl);
}

.wcb-resume-form--compact .wcb-rf-section {
	padding: var(--wcb-space-xl, 20px) var(--wcb-space-xl);
}

.wcb-rf-section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wcb-space-md, 14px);
	margin-bottom: var(--wcb-space-lg, 18px);
	padding-bottom: var(--wcb-space-md, 14px);
	border-bottom: 1px solid var(--wcb-surface, #f3f4f6);
}

.wcb-rf-section-title {
	display: flex;
	align-items: center;
	gap: var(--wcb-space-sm, 10px);
	margin: 0;
	font-size: var(--wcb-text-lg);
	font-weight: var(--wcb-font-bold, 700);
	color: var(--wcb-contrast, #0f172a);
}

.wcb-rf-entry-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 var(--wcb-space-xs);
	background: var(--wcb-surface, #f3f4f6);
	color: var(--wcb-text-muted, #64748b);
	border-radius: var(--wcb-radius-full);
	font-size: var(--wcb-text-xs);
	font-weight: 600;
}

.wcb-rf-add-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--wcb-space-xs);
	min-height: 40px;
	padding: var(--wcb-space-sm) var(--wcb-space-md);
	background: var(--wcb-primary, #4f46e5);
	color: var(--wcb-on-primary, #fff);
	border: 0;
	border-radius: var(--wcb-radius-sm, 6px);
	font-size: var(--wcb-text-base);
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease;
}

.wcb-rf-add-btn:hover,
.wcb-rf-add-btn:focus {
	background: var(--wcb-primary-dark, #4338ca);
}

.wcb-rf-add-btn [data-lucide],
.wcb-rf-add-btn .wcb-icon {
	width: 16px;
	height: 16px;
}

.wcb-rf-section-empty {
	margin: 0;
	padding: var(--wcb-space-md, 14px) 0;
	color: var(--wcb-text-muted, #64748b);
	font-size: var(--wcb-text-base);
	font-style: italic;
}

/* -- Entries inside a section -- */
.wcb-rf-entries {
	display: flex;
	flex-direction: column;
	gap: var(--wcb-space-md, 14px);
}

.wcb-rf-entry {
	background: var(--wcb-surface, #f9fafb);
	border: 1px solid var(--wcb-border, #e5e7eb);
	border-radius: var(--wcb-radius-md, 10px);
	padding: var(--wcb-space-lg, 18px);
}

.wcb-rf-fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--wcb-space-md, 14px);
}

.wcb-rf-field {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.wcb-rf-field--full {
	grid-column: 1 / -1;
}

.wcb-rf-field--check {
	grid-column: 1 / -1;
	margin: var(--wcb-space-sm, 8px) 0 0;
}

.wcb-rf-label {
	display: block;
	margin-bottom: var(--wcb-space-xs);
	font-size: var(--wcb-text-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wcb-text-muted, #64748b);
}

.wcb-rf-input,
.wcb-rf-textarea {
	width: 100%;
	box-sizing: border-box;
	min-height: 40px;
	padding: var(--wcb-space-sm) var(--wcb-space-md);
	background: var(--wcb-base, #fff);
	border: 1px solid var(--wcb-border, #e5e7eb);
	border-radius: var(--wcb-radius-sm, 6px);
	font-size: var(--wcb-text-base);
	color: var(--wcb-contrast, #1f2937);
	font-family: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* No `outline: 0` on plain `:focus` - the browser-default outline is
 * the fallback for non-`:focus-visible` browsers; the keyboard-only
 * indicator below adds an explicit ring for modern browsers. */
.wcb-rf-input:focus,
.wcb-rf-textarea:focus {
	border-color: var(--wcb-primary, #4f46e5);
	box-shadow: var(--wcb-shadow-focus, 0 0 0 3px rgba( 79, 70, 229, 0.15 ));
}

.wcb-rf-input:focus-visible,
.wcb-rf-textarea:focus-visible {
	outline: 2px solid var(--wcb-primary, #4f46e5);
	outline-offset: 2px;
	border-color: var(--wcb-primary, #4f46e5);
	box-shadow: var(--wcb-shadow-focus, 0 0 0 3px rgba( 79, 70, 229, 0.15 ));
}

.wcb-rf-textarea {
	resize: vertical;
	min-height: 80px;
}

.wcb-rf-check-label {
	display: inline-flex;
	align-items: center;
	gap: var(--wcb-space-sm);
	font-size: var(--wcb-text-base);
	color: var(--wcb-contrast, #1f2937);
	cursor: pointer;
}

.wcb-rf-check-label input {
	width: 18px;
	height: 18px;
	cursor: pointer;
}

.wcb-rf-summary {
	min-height: 100px;
}

.wcb-rf-entry-actions {
	display: flex;
	justify-content: flex-end;
	margin-top: var(--wcb-space-md, 14px);
}

.wcb-rf-remove-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--wcb-space-xs);
	padding: var(--wcb-space-xs) var(--wcb-space-md);
	background: transparent;
	color: var(--wcb-danger, #dc2626);
	border: 1px solid transparent;
	border-radius: var(--wcb-radius-sm, 6px);
	font-size: var(--wcb-text-sm);
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s ease;
}

.wcb-rf-remove-btn:hover,
.wcb-rf-remove-btn:focus {
	background: var(--wcb-danger-bg, #fef2f2);
	border-color: var(--wcb-danger, #dc2626);
}

.wcb-rf-remove-btn [data-lucide],
.wcb-rf-remove-btn .wcb-icon {
	width: 14px;
	height: 14px;
}

/* -- Footer / save -- */
.wcb-rf-footer {
	display: flex;
	align-items: center;
	gap: var(--wcb-space-md, 14px);
	padding-top: var(--wcb-space-md, 14px);
	border-top: 1px solid var(--wcb-border, #e5e7eb);
}

.wcb-rf-save-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	min-width: 160px;
	padding: var(--wcb-space-md) var(--wcb-space-2xl);
	background: var(--wcb-primary, #4f46e5);
	color: var(--wcb-on-primary, #fff);
	border: 0;
	border-radius: var(--wcb-radius-md, 10px);
	font-size: var(--wcb-text-md);
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease;
}

.wcb-rf-save-btn:hover:not([disabled]),
.wcb-rf-save-btn:focus:not([disabled]) {
	background: var(--wcb-primary-dark, #4338ca);
}

.wcb-rf-save-btn[disabled] {
	opacity: 0.6;
	cursor: wait;
}

.wcb-rf-saved-message {
	display: inline-flex;
	align-items: center;
	gap: var(--wcb-space-xs);
	color: var(--wcb-success, #059669);
	font-size: var(--wcb-text-base);
	font-weight: 600;
}

.wcb-rf-saved-message [data-lucide],
.wcb-rf-saved-message .wcb-icon {
	width: 16px;
	height: 16px;
}

.wcb-rf-notice {
	padding: var(--wcb-space-lg, 18px);
	background: var(--wcb-warning-bg, #fffbeb);
	border: 1px solid var(--wcb-warning-border, #fde68a);
	border-radius: var(--wcb-radius-md, 10px);
	color: var(--wcb-warning-text, #92400e);
}

/* -- Responsive -- */
@media (max-width: 768px) {
	.wcb-rf-section {
		padding: var(--wcb-space-xl, 20px) var(--wcb-space-lg);
	}

	.wcb-rf-section-header {
		flex-direction: column;
		align-items: stretch;
		gap: var(--wcb-space-sm, 10px);
	}

	.wcb-rf-add-btn {
		width: 100%;
		justify-content: center;
	}

	.wcb-rf-fields {
		grid-template-columns: minmax(0, 1fr);
	}

	.wcb-rf-footer {
		flex-direction: column;
		align-items: stretch;
	}

	.wcb-rf-save-btn {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wcb-rf-input,
	.wcb-rf-textarea,
	.wcb-rf-add-btn,
	.wcb-rf-save-btn,
	.wcb-rf-remove-btn {
		transition: none;
	}
}
