/* ==========================================================================
   Lanyard Configurator – Flat / Minimal Style
   Light colors, smooth system fonts, no rounded corners.
   Industry-standard flat design. Load when configurator_style = flat.
   Customizable via Settings > Flat / Minimal Theme (CSS variables).
   ========================================================================== */

.lc-configurator[data-lc-style="flat"] {
	font-family: var(--lc-flat-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
	background: var(--lc-flat-bg, #fafafa);
	color: var(--lc-flat-color, #2c3e50);
}

/* Preview */
.lc-configurator[data-lc-style="flat"] .lc-preview-placeholder {
	background: #fff;
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-preview-placeholder p {
	color: var(--lc-flat-muted, #6c757d);
	font-weight: 400;
}

.lc-configurator[data-lc-style="flat"] .lc-preview-image-wrap {
	background: #fff;
}

/* Step panel */
.lc-configurator[data-lc-style="flat"] .lc-step-panel {
	background: #fff;
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
	box-shadow: none;
}

/* Step nav */
.lc-configurator[data-lc-style="flat"] .lc-step-nav {
	background: #f5f5f5;
	border-bottom: 1px solid var(--lc-flat-border, #e0e0e0);
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn {
	color: var(--lc-flat-muted, #6c757d);
	font-weight: 500;
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn:hover {
	color: var(--lc-flat-hover-text, #2c3e50);
	background: var(--lc-flat-hover-bg, #eee);
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn--active {
	color: var(--lc-flat-color, #2c3e50);
	background: #fff;
	border-bottom-color: var(--lc-flat-accent, #4a90d9);
	font-weight: 600;
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn--done {
	color: var(--lc-flat-success, #2e7d32);
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__number {
	background: var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
	color: var(--lc-flat-muted, #6c757d);
	font-weight: 600;
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn--active .lc-step-nav__number {
	background: var(--lc-flat-accent, #4a90d9);
	color: #fff;
}

.lc-configurator[data-lc-style="flat"] .lc-step-nav__btn--done .lc-step-nav__number {
	background: var(--lc-flat-success, #2e7d32);
	color: #fff;
}

/* Step content */
.lc-configurator[data-lc-style="flat"] .lc-step__title {
	color: var(--lc-flat-color, #2c3e50);
	font-weight: 600;
}

.lc-configurator[data-lc-style="flat"] .lc-step__subtitle,
.lc-configurator[data-lc-style="flat"] .lc-step__desc {
	color: var(--lc-flat-muted, #6c757d);
}

.lc-configurator[data-lc-style="flat"] .lc-step__required-hint {
	background: #e3f2fd;
	border: 1px solid #90caf9;
	border-radius: 0;
	color: #1565c0;
}

/* Option cards */
.lc-configurator[data-lc-style="flat"] .lc-option-card {
	background: #fff;
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
	box-shadow: none;
}

.lc-configurator[data-lc-style="flat"] .lc-option-card:hover {
	border-color: var(--lc-flat-hover-border, #bdbdbd);
	box-shadow: none;
}

.lc-configurator[data-lc-style="flat"] .lc-option-card--selected {
	border-color: var(--lc-flat-accent, #4a90d9);
	box-shadow: none;
}

.lc-configurator[data-lc-style="flat"] .lc-option-card__image {
	background: var(--lc-flat-bg, #fafafa);
}

.lc-configurator[data-lc-style="flat"] .lc-option-card__title {
	color: var(--lc-flat-color, #2c3e50);
}

.lc-configurator[data-lc-style="flat"] .lc-option-card__price {
	color: var(--lc-flat-accent, #4a90d9);
}

.lc-configurator[data-lc-style="flat"] .lc-option-card__check {
	background: var(--lc-flat-accent, #4a90d9);
	border-radius: 0;
}

/* Colour section */
.lc-configurator[data-lc-style="flat"] .lc-colour-item {
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-colour-item:hover {
	border-color: var(--lc-flat-hover-border, #bdbdbd);
}

.lc-configurator[data-lc-style="flat"] .lc-colour-item--selected {
	border-color: var(--lc-flat-accent, #4a90d9);
}

.lc-configurator[data-lc-style="flat"] .lc-colour-swatch {
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-colour-item--selected .lc-colour-swatch {
	border-color: var(--lc-flat-color, #2c3e50);
	box-shadow: 0 0 0 1px #fff, 0 0 0 2px var(--lc-flat-color, #2c3e50);
}

.lc-configurator[data-lc-style="flat"] .lc-colour-label {
	color: var(--lc-flat-muted, #6c757d);
}

/* Slider nav */
.lc-configurator[data-lc-style="flat"] .lc-colour-slider__nav {
	color: var(--lc-flat-muted, #6c757d);
}

.lc-configurator[data-lc-style="flat"] .lc-colour-slider__nav:hover {
	color: var(--lc-flat-accent, #4a90d9);
}

/* Inputs */
.lc-configurator[data-lc-style="flat"] .lc-input-col__heading {
	border-bottom-color: var(--lc-flat-accent, #4a90d9);
	color: var(--lc-flat-color, #2c3e50);
}

.lc-configurator[data-lc-style="flat"] .lc-input,
.lc-configurator[data-lc-style="flat"] .lc-textarea,
.lc-configurator[data-lc-style="flat"] .lc-select,
.lc-configurator[data-lc-style="flat"] .lc-pantone-search-input {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0;
	background: #fff;
}

.lc-configurator[data-lc-style="flat"] .lc-input:focus,
.lc-configurator[data-lc-style="flat"] .lc-textarea:focus,
.lc-configurator[data-lc-style="flat"] .lc-pantone-search-input:focus {
	border-color: var(--lc-flat-accent, #4a90d9);
	box-shadow: 0 0 0 1px var(--lc-flat-accent, #4a90d9);
}

/* Text/logo blocks */
.lc-configurator[data-lc-style="flat"] .lc-text-block,
.lc-configurator[data-lc-style="flat"] .lc-logo-block {
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0;
	background: var(--lc-flat-bg, #fafafa);
}

.lc-configurator[data-lc-style="flat"] .lc-text-block:hover,
.lc-configurator[data-lc-style="flat"] .lc-logo-block:hover {
	border-color: var(--lc-flat-border-input, #d0d5dd);
}

.lc-configurator[data-lc-style="flat"] .lc-style-btn,
.lc-configurator[data-lc-style="flat"] .lc-stepper-btn,
.lc-configurator[data-lc-style="flat"] .lc-nudge-btn {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0;
	background: #fff;
}

.lc-configurator[data-lc-style="flat"] .lc-style-btn:hover,
.lc-configurator[data-lc-style="flat"] .lc-stepper-btn:hover {
	background: var(--lc-flat-hover-bg, #f5f5f5);
	border-color: var(--lc-flat-hover-border, #bdbdbd);
	color: var(--lc-flat-hover-text, #2c3e50);
}

.lc-configurator[data-lc-style="flat"] .lc-style-btn--on {
	background: var(--lc-flat-accent, #4a90d9);
	border-color: var(--lc-flat-accent, #4a90d9);
}

.lc-configurator[data-lc-style="flat"] .lc-nudge-btn:hover {
	background: var(--lc-flat-accent, #4a90d9);
	border-color: var(--lc-flat-accent, #4a90d9);
	color: #fff;
}

.lc-configurator[data-lc-style="flat"] .lc-btn--add:hover {
	background: var(--lc-flat-accent, #4a90d9);
	border-color: var(--lc-flat-accent, #4a90d9);
}

/* Pricing table */
.lc-configurator[data-lc-style="flat"] .lc-pricing-table th,
.lc-configurator[data-lc-style="flat"] .lc-pricing-table td {
	border: 1px solid var(--lc-flat-border, #e0e0e0);
}

.lc-configurator[data-lc-style="flat"] .lc-pricing-table th {
	background: #f5f5f5;
}

/* Buttons */
.lc-configurator[data-lc-style="flat"] .lc-btn--primary,
.lc-configurator[data-lc-style="flat"] .lc-btn--cart,
.lc-configurator[data-lc-style="flat"] .lc-btn--save,
.lc-configurator[data-lc-style="flat"] .lc-btn--upload {
	background: var(--lc-flat-accent, #4a90d9);
	border-color: var(--lc-flat-accent, #4a90d9);
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-btn--primary:hover:not(:disabled),
.lc-configurator[data-lc-style="flat"] .lc-btn--cart:hover:not(:disabled),
.lc-configurator[data-lc-style="flat"] .lc-btn--save:hover:not(:disabled),
.lc-configurator[data-lc-style="flat"] .lc-btn--upload:hover {
	background: var(--lc-flat-accent-hover, #357abd);
	border-color: var(--lc-flat-accent-hover, #357abd);
	color: var(--lc-flat-accent-hover-text, #fff);
}

.lc-configurator[data-lc-style="flat"] .lc-btn--outline {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-btn--outline:hover:not(:disabled) {
	border-color: var(--lc-flat-hover-border, #bdbdbd);
	color: var(--lc-flat-hover-text, #2c3e50);
}

.lc-configurator[data-lc-style="flat"] .lc-btn--link {
	color: var(--lc-flat-accent, #4a90d9);
}

.lc-configurator[data-lc-style="flat"] .lc-btn--link:hover {
	color: var(--lc-flat-accent-hover, #357abd);
}

.lc-configurator[data-lc-style="flat"] .lc-link-small {
	color: var(--lc-flat-accent, #4a90d9);
}

.lc-configurator[data-lc-style="flat"] .lc-qty-btn,
.lc-configurator[data-lc-style="flat"] .lc-qty-input {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0;
}

.lc-configurator[data-lc-style="flat"] .lc-enquire-btn {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0;
}

/* Modals (teleported to body; target via body class since modals are outside configurator) */
body.lc-configurator-flat .lc-modal-overlay .lc-modal {
	font-family: var(--lc-flat-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
	background: #fff;
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0 !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	overflow: hidden;
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__accent {
	height: 4px;
	background: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__accent--notice {
	background: linear-gradient(90deg, var(--lc-flat-accent, #4a90d9) 0%, var(--lc-flat-accent-hover, #357abd) 100%);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__accent--confirm {
	background: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__accent--alert {
	background: var(--lc-flat-muted, #6c757d);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__accent--pdf-quote {
	background: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__icon {
	border-radius: 0 !important;
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal--notice .lc-modal__icon {
	background: rgba(74, 144, 217, 0.15);
	color: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal--confirm .lc-modal__icon {
	background: rgba(74, 144, 217, 0.15);
	color: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal--alert .lc-modal__icon {
	background: rgba(108, 117, 125, 0.15);
	color: var(--lc-flat-muted, #6c757d);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__title {
	color: var(--lc-flat-color, #2c3e50);
	font-weight: 600;
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal__message {
	color: var(--lc-flat-color, #2c3e50);
}

body.lc-configurator-flat .lc-modal-overlay .lc-modal--notice .lc-modal__message {
	color: var(--lc-flat-muted, #6c757d);
}

body.lc-configurator-flat .lc-modal-overlay .lc-pdf-quote-form .lc-modal__footer {
	border-top-color: var(--lc-flat-border, #e0e0e0);
}

body.lc-configurator-flat .lc-modal-overlay .lc-pdf-quote-preview__img {
	border: 1px solid var(--lc-flat-border, #e0e0e0);
	border-radius: 0 !important;
}

/* Modal buttons (outside .lc-configurator when teleported) */
body.lc-configurator-flat .lc-modal-overlay .lc-modal__btn,
body.lc-configurator-flat .lc-modal-overlay .lc-btn,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--primary,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--cart,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--save,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--upload {
	border-radius: 0 !important;
}

body.lc-configurator-flat .lc-modal-overlay .lc-btn--primary,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--cart,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--save,
body.lc-configurator-flat .lc-modal-overlay .lc-btn--upload {
	background: var(--lc-flat-accent, #4a90d9);
	border-color: var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-btn--primary:hover:not(:disabled),
body.lc-configurator-flat .lc-modal-overlay .lc-btn--cart:hover:not(:disabled),
body.lc-configurator-flat .lc-modal-overlay .lc-btn--save:hover:not(:disabled),
body.lc-configurator-flat .lc-modal-overlay .lc-btn--upload:hover:not(:disabled) {
	background: var(--lc-flat-accent-hover, #357abd);
	border-color: var(--lc-flat-accent-hover, #357abd);
	color: var(--lc-flat-accent-hover-text, #fff);
}

body.lc-configurator-flat .lc-modal-overlay .lc-btn--secondary {
	background: #f9fafb;
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	color: var(--lc-flat-color, #2c3e50);
	border-radius: 0 !important;
}

body.lc-configurator-flat .lc-modal-overlay .lc-btn--secondary:hover:not(:disabled) {
	background: var(--lc-flat-hover-bg, #eeeeee);
	border-color: var(--lc-flat-hover-border, #bdbdbd);
	color: var(--lc-flat-hover-text, #2c3e50);
}

body.lc-configurator-flat .lc-modal-overlay .lc-input,
body.lc-configurator-flat .lc-modal-overlay .lc-textarea {
	border: 1px solid var(--lc-flat-border-input, #d0d5dd);
	border-radius: 0 !important;
}

body.lc-configurator-flat .lc-modal-overlay .lc-input:focus,
body.lc-configurator-flat .lc-modal-overlay .lc-textarea:focus {
	border-color: var(--lc-flat-accent, #4a90d9);
	box-shadow: 0 0 0 1px var(--lc-flat-accent, #4a90d9);
}

body.lc-configurator-flat .lc-modal-overlay .lc-label {
	color: var(--lc-flat-color, #2c3e50);
}

/* Notices */
.lc-configurator[data-lc-style="flat"] .lc-step__notice--notice {
	background: #e3f2fd;
	border: 1px solid #90caf9;
	border-radius: 0;
	color: #1565c0;
}

.lc-configurator[data-lc-style="flat"] .lc-step__notice--warning {
	background: #fff8e1;
	border: 1px solid #ffe082;
	border-radius: 0;
	color: #f57f17;
}

.lc-configurator[data-lc-style="flat"] .lc-step__notice--info {
	background: #e8eaf6;
	border: 1px solid #9fa8da;
	border-radius: 0;
	color: #3949ab;
}
