/* =========================================================================
   Rock Consignments — AuctionForge dark skin
   AuctionForge ships a light-theme stylesheet (libs.css) whose forms and cards
   read poorly on a black site. This re-skins its .bp-* / .bpw-* output to the
   gold-on-black palette. Enqueued AFTER the plugin CSS; !important is used only
   where the plugin sets inline / high-specificity light values.
   Forms are verified live; cards are pre-skinned for when the feed connects.
   ========================================================================= */

/* ---------- Forms: login / register / submission ---------- */
.bp-from { max-width: 32rem; margin-inline: auto; }

.bp-form-control,
.bp-from input[type="text"],
.bp-from input[type="email"],
.bp-from input[type="password"],
.bp-from input[type="tel"],
.bp-from select,
.bp-from textarea {
	background: var(--slate) !important;
	border: 1px solid var(--mist) !important;
	color: var(--bone) !important;
	border-radius: 3px !important;
}
.bp-form-control::placeholder { color: var(--bone-dim) !important; }
.bp-form-control:focus,
.bp-from input:focus,
.bp-from select:focus,
.bp-from textarea:focus {
	border-color: var(--gold) !important;
	outline: none !important;
	box-shadow: 0 0 0 1px var(--gold) !important;
}

.bp-form-check-label,
.bp-from label,
.bp-form-group label,
.bp-from .bp-form-group label,
.bp-from .bp-form-group .bp-label,
.bp-from .bp-form-group .bp-form-group__inner label,
.bp-from .bp-form-group input.bp-form-check-input + label,
.bp-from .bp-form-group input.bp-form-radio-input + label,
.modal__content .bp-from .bp-form-group label { color: var(--bone-dim) !important; }

.bp-from a { color: var(--gold-soft) !important; }
.bp-from a:hover { color: var(--gold) !important; }
.bp-form-group__link,
.doForgotten { color: var(--bone-dim) !important; }
.bp-form-group__link:hover,
.doForgotten:hover { color: var(--gold) !important; }

/* password "eye" toggle */
.bp-form-control_eye ~ .icon-eye,
.icon-eye, .bp-eye, .bp-show-pass { color: var(--bone-dim) !important; }

/* primary submit button → gold */
.bp-btn.bp-btn-black,
.bp-btn-black,
.bp-from button[type="submit"],
.bp-btn-primary {
	background: var(--gold) !important;
	color: var(--ink) !important;
	border: 1px solid var(--gold) !important;
	border-radius: 2px !important;
	font-family: var(--font-display) !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
}
.bp-btn.bp-btn-black:hover,
.bp-btn-black:hover,
.bp-from button[type="submit"]:hover { background: var(--gold-soft) !important; border-color: var(--gold-soft) !important; }

/* ---------- Lot cards (bp_lot_list / grids / sliders) ---------- */
.bt-wi-lots_wrp { background: transparent !important; }
.bp-lots { color: var(--bone); }
.bp-lot {
	background: var(--paper) !important;
	border: 1px solid var(--mist) !important;
	border-radius: var(--radius) !important;
	overflow: hidden;
	transition: transform .5s var(--ease-lux), border-color .5s var(--ease-lux), box-shadow .5s var(--ease-lux);
}
.bp-lot:hover { transform: translateY(-4px); border-color: var(--hairline) !important; box-shadow: 0 24px 50px -28px rgba(0,0,0,.8); }
.bp-lot__content { background: transparent !important; }
.bp-lot__title a, .bp-title { color: var(--bone) !important; }
.bp-lot__title a:hover, .bp-title:hover { color: var(--gold) !important; }
.bp-subtitle, .bp-text-grey, .bp-lot__message-inner { color: var(--bone-dim) !important; }
.bp-price, .bp-lead { color: var(--gold) !important; }
.bp-lot__tool.bp-bg-blue, .bp-bg-blue { background: var(--slate) !important; }

.bt-wi-lots_more .btn,
.bp-load-more .btn {
	background: transparent !important;
	border: 1px solid var(--gold) !important;
	color: var(--bone) !important;
	border-radius: 2px !important;
	font-family: var(--font-display) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.12em !important;
}
.bt-wi-lots_more .btn:hover { background: var(--gold) !important; color: var(--ink) !important; }

/* ---------- Auction cards (bp_auction_list / bp_upcoming_wide) ---------- */
.bpw-auction-card,
.bp-auction-card {
	background: var(--paper) !important;
	border: 1px solid var(--mist) !important;
	border-radius: 10px !important;
	color: var(--bone) !important;
}
.bpw-title, .bpw-title a, .bp-auction-card h3 { color: var(--bone) !important; }
.bpw-desc, .bpw-date, .bp-auction-start-date { color: var(--bone-dim) !important; }
.bpw-countdown-label, .bpw-cd-unit { color: var(--gold) !important; }
.bpw-cd-num, .bp-days, .bp-hours, .bp-minutes, .bp-seconds { color: var(--bone) !important; }
.bpw-btn-primary, .bpw-live-btn {
	background: var(--gold) !important; color: var(--ink) !important; border: 1px solid var(--gold) !important;
	font-family: var(--font-display) !important; text-transform: uppercase !important; letter-spacing: 0.12em !important;
}
.bpw-btn-primary:hover, .bpw-live-btn:hover { background: var(--gold-soft) !important; }
.bpw-btn-secondary {
	background: transparent !important; color: var(--gold) !important; border: 1px solid var(--gold) !important;
	font-family: var(--font-display) !important; text-transform: uppercase !important; letter-spacing: 0.12em !important;
}
.bpw-btn-secondary:hover { background: var(--gold) !important; color: var(--ink) !important; }
.bpw-status-text, .bpw-btn-disabled { color: var(--bone-dim) !important; }

/* ---------- Category filter dropdown ---------- */
.bp-categories-filter select,
.categories-filter select { background: var(--slate) !important; color: var(--bone) !important; border: 1px solid var(--mist) !important; }

/* ---------- Profile / My Account ---------- */
.bp-header__content-profile-page, .bp-single-lot__body { color: var(--bone); }
.bp-back-to-catalog-button { color: var(--gold) !important; }

/* ---------- Forminator forms (consignment + contact) — WHITE CARD light skin ---------- */
.forminator-ui.forminator-custom-form {
	background: #ffffff !important;
	color: var(--ink) !important;
	padding: clamp(1.5rem, 4vw, 2.5rem) !important;
	border: 1px solid #e6e1d6 !important;
	border-radius: 8px !important;
	box-shadow: 0 8px 30px rgba(22, 22, 22, 0.08) !important;
}
/* Inputs / textarea / select — light fields */
.forminator-ui.forminator-custom-form input[type=text],
.forminator-ui.forminator-custom-form input[type=email],
.forminator-ui.forminator-custom-form input[type=tel],
.forminator-ui.forminator-custom-form input[type=url],
.forminator-ui.forminator-custom-form input[type=number],
.forminator-ui.forminator-custom-form input[type=date],
.forminator-ui.forminator-custom-form .forminator-input,
.forminator-ui.forminator-custom-form .forminator-textarea,
.forminator-ui.forminator-custom-form textarea,
.forminator-ui.forminator-custom-form select {
	background: #f5f5f5 !important;
	border: 1px solid #d8d2c4 !important;
	color: var(--ink) !important;
	border-radius: 3px !important;
	font-family: var(--font-body) !important;
}
.forminator-ui.forminator-custom-form input::placeholder,
.forminator-ui.forminator-custom-form textarea::placeholder { color: #888 !important; }
.forminator-ui.forminator-custom-form input:focus,
.forminator-ui.forminator-custom-form .forminator-input:focus,
.forminator-ui.forminator-custom-form .forminator-textarea:focus,
.forminator-ui.forminator-custom-form textarea:focus,
.forminator-ui.forminator-custom-form select:focus {
	border-color: var(--gold) !important;
	box-shadow: 0 0 0 1px var(--gold) !important;
	background: #ffffff !important;
}
/* Labels + legends — dark; required asterisk red */
.forminator-ui.forminator-custom-form .forminator-label,
.forminator-ui.forminator-custom-form label,
.forminator-ui.forminator-custom-form legend { color: var(--ink) !important; }
.forminator-ui.forminator-custom-form .forminator-required { color: #d32f2f !important; }
.forminator-ui.forminator-custom-form .forminator-description { color: #6b6457 !important; }
.forminator-ui.forminator-custom-form .forminator-checkbox-label,
.forminator-ui.forminator-custom-form .forminator-radio-label { color: var(--ink) !important; }
/* GDPR checkbox — style the VISIBLE box span; form-id specificity beats Forminator's per-form inline <style>; 20px box */
.forminator-ui.forminator-custom-form-31 .forminator-checkbox .forminator-checkbox-box,
.forminator-ui.forminator-custom-form-45 .forminator-checkbox .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box {
	background: #ffffff !important;
	border: 1px solid var(--gold-deep) !important;
	border-radius: 2px !important;
	width: 20px !important;
	height: 20px !important;
	flex: 0 0 20px !important;
}
.forminator-ui.forminator-custom-form-31 .forminator-checkbox input:checked + .forminator-checkbox-box,
.forminator-ui.forminator-custom-form-45 .forminator-checkbox input:checked + .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-checkbox input:checked + .forminator-checkbox-box {
	background: var(--gold) !important;
	border-color: var(--gold) !important;
}
.forminator-ui.forminator-custom-form-31 .forminator-checkbox input:checked + .forminator-checkbox-box:before,
.forminator-ui.forminator-custom-form-45 .forminator-checkbox input:checked + .forminator-checkbox-box:before,
.forminator-ui.forminator-custom-form .forminator-checkbox input:checked + .forminator-checkbox-box:before {
	color: #ffffff !important;
	opacity: 1 !important;
}
/* Multi-file drag-drop zone — light, dashed */
.forminator-ui.forminator-custom-form .forminator-multi-upload {
	background: #ffffff !important;
	border: 1px dashed #cfc8bb !important;
	color: var(--ink) !important;
	border-radius: 3px !important;
}
.forminator-ui.forminator-custom-form .forminator-multi-upload .forminator-multi-upload-message,
.forminator-ui.forminator-custom-form .forminator-multi-upload .forminator-multi-upload-message p { color: var(--ink) !important; }
.forminator-ui.forminator-custom-form .forminator-multi-upload a,
.forminator-ui.forminator-custom-form .forminator-multi-upload-message a { color: var(--gold) !important; }
.forminator-ui.forminator-custom-form .forminator-uploaded-files { color: var(--ink) !important; }
/* Cloud upload icon (icon font via color) — broad selector */
.forminator-ui.forminator-custom-form .forminator-multi-upload [class*=forminator-icon-],
.forminator-ui.forminator-custom-form .forminator-multi-upload [class*=forminator-icon-]:before { color: var(--gold) !important; }
/* Single-file upload button — light */
.forminator-ui.forminator-custom-form .forminator-button-upload {
	background: #ffffff !important; color: var(--ink) !important; border: 1px solid #d8d2c4 !important;
}
.forminator-ui.forminator-custom-form .forminator-button-upload:hover { border-color: var(--gold) !important; color: var(--gold) !important; }
/* Submit button — keep GOLD */
.forminator-ui.forminator-custom-form .forminator-button,
.forminator-ui.forminator-custom-form button[type=submit],
.forminator-ui.forminator-custom-form .forminator-button-submit {
	background: var(--gold) !important;
	color: var(--ink) !important;
	border: 1px solid var(--gold) !important;
	border-radius: 2px !important;
	font-family: var(--font-display) !important;
	font-weight: 600 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
}
.forminator-ui.forminator-custom-form .forminator-button-submit:hover,
.forminator-ui.forminator-custom-form button[type=submit]:hover { background: var(--gold-deep) !important; border-color: var(--gold-deep) !important; color: #ffffff !important; }
/* Error / response message — readable red on white */
.forminator-ui.forminator-custom-form .forminator-response-message.forminator-error { background: #fdecea !important; border: 1px solid #d32f2f !important; color: #b71c1c !important; }
.forminator-ui.forminator-custom-form .forminator-error-message,
.forminator-ui.forminator-custom-form .forminator-label.forminator-error { color: #d32f2f !important; }

/* Forminator grid: columns weren't honouring their width (computed flex:1 1 0%
   squeezed every full-width field into one row). Force the col-N widths so
   col-12 fields stack and partial columns sit side-by-side. */
.forminator-custom-form .forminator-row { display: flex; flex-wrap: wrap; }
.forminator-custom-form .forminator-row .forminator-col { flex: 0 0 100% !important; max-width: 100% !important; }
.forminator-custom-form .forminator-row .forminator-col-6 { flex: 0 0 50% !important; max-width: 50% !important; }
.forminator-custom-form .forminator-row .forminator-col-4 { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
.forminator-custom-form .forminator-row .forminator-col-3 { flex: 0 0 25% !important; max-width: 25% !important; }
@media (max-width: 680px) {
	.forminator-custom-form .forminator-row .forminator-col { flex: 0 0 100% !important; max-width: 100% !important; }
}

/* ============================================================
   AuctionForge MicroModal popups (login / register / etc.) — WHITE theme.
   Every selector scoped under .modal / .modal__container / .modal__content so
   the dark /login & /register PAGES (rendered WITHOUT the .modal wrapper) stay
   dark. Verified by adversarial review: eye icon coloured via currentColor (it
   is a fill="currentColor" SVG, not background); labels raised above the dark
   skin's cream label rule; nothing leaks to the dark pages.
   ============================================================ */
.modal .modal__container {
	background: #ffffff !important;
	color: var(--ink) !important;
	border: 1px solid #e6e1d6 !important;
	border-radius: 8px !important;
	box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .35) !important;
}
/* Title + body text */
.modal .modal__container .modal__title,
.modal .modal__container .modal__content h1,
.modal .modal__container .modal__content h2,
.modal .modal__container .modal__content h3,
.modal .modal__container .modal__content .bp-title { color: var(--ink) !important; }
.modal .modal__container .modal__content,
.modal .modal__container .modal__content p,
.modal .modal__container .modal__content span:not(.bp-price) { color: var(--ink) !important; }
/* Labels (incl. checkbox/radio labels) — high specificity to beat the dark skin's cream rule */
.modal .modal__container .modal__content label,
.modal .modal__container .bp-form-check-label,
.modal .modal__container .modal__content .bp-from .bp-form-group label,
.modal .modal__container .modal__content .bp-from .bp-form-group .bp-form-group__inner label,
.modal .modal__container .modal__content .bp-from .bp-form-group input.bp-form-check-input + label,
.modal .modal__container .modal__content .bp-from .bp-form-group input.bp-form-radio-input + label { color: var(--ink) !important; }
/* Inputs / selects / textareas — light field */
.modal .modal__container .bp-form-control,
.modal .modal__container .bp-from input[type="text"],
.modal .modal__container .bp-from input[type="email"],
.modal .modal__container .bp-from input[type="password"],
.modal .modal__container .bp-from input[type="tel"],
.modal .modal__container .bp-from select,
.modal .modal__container .bp-from textarea,
.modal .modal__container .bp-form-group__phone .countryCodeField,
.modal .modal__container .bp-form-group__phone select[name="phoneCountryCode"] {
	background: #f5f5f5 !important;
	border: 1px solid #d8d2c4 !important;
	color: var(--ink) !important;
}
.modal .modal__container .bp-form-control::placeholder { color: #888888 !important; }
.modal .modal__container .bp-form-control:focus,
.modal .modal__container .bp-from input:focus,
.modal .modal__container .bp-from select:focus,
.modal .modal__container .bp-from textarea:focus { border-color: var(--gold) !important; box-shadow: 0 0 0 1px var(--gold) !important; }
.modal .modal__container .bp-form-group__phone select[name="phoneCountryCode"] { background-image: none !important; }
/* Checkbox / radio — white box, darker (gold-deep) border so it shows on white; ink tick */
.modal .modal__container .bp-form-check-input,
.modal .modal__container .modal__content input[type="checkbox"],
.modal .modal__container .modal__content input[type="radio"] { background: #ffffff !important; border: 1px solid var(--gold-deep) !important; }
.modal .modal__container .modal__content input[type="checkbox"]:checked::after { border-color: var(--ink) !important; }
.modal .modal__container .modal__content input[type="radio"]:checked::after { background: var(--ink) !important; }
/* Links */
.modal .modal__container .modal__content a,
.modal .modal__container .bp-from a,
.modal .modal__container .bp-form-group__link,
.modal .modal__container .doForgotten { color: var(--gold-deep) !important; text-decoration: underline !important; }
.modal .modal__container .modal__content a:hover,
.modal .modal__container .bp-from a:hover,
.modal .modal__container .bp-form-group__link:hover,
.modal .modal__container .doForgotten:hover { color: var(--gold) !important; }
/* Close X — dark on white */
.modal .modal__container .modal__close { color: var(--ink) !important; opacity: .7 !important; }
.modal .modal__container .modal__close:hover { color: var(--gold) !important; opacity: 1 !important; }
/* Password eye icon — colour the glyph via currentColor (fill="currentColor" SVG), not background */
.modal .modal__container .bp_show_password,
.modal .modal__container .svg-icon.svg-eye,
.modal .modal__container .svg-icon.svg-eye-slash,
.modal .modal__container .bp-form-group_svg .svg-icon,
.modal .modal__container .icon-eye,
.modal .modal__container .bp-eye {
	color: #5a5a5a !important;
	background-color: transparent !important;
	opacity: 1 !important;
}
.modal .modal__container .bp-form-group_svg .svg-icon:hover { color: #111 !important; }
/* Error text — readable red on white */
.modal .modal__container .errors-group.bp-text-red,
.modal .modal__container .bp-form-error,
.modal .modal__container .bp-text-red { color: #d32f2f !important; }
/* Select2 country dropdown (when BidSpirit enhances the phone select) */
.modal .modal__container .select2-container--default .select2-selection { background: #f5f5f5 !important; border: 1px solid #d8d2c4 !important; }
.modal .modal__container .select2-container--default .select2-selection__rendered { color: var(--ink) !important; }
.modal .modal__container .select2-container--default .select2-selection__arrow b { border-color: #5a5a5a transparent transparent transparent !important; }

/* ---------- Checkboxes & radios — custom light box so they're visible on dark
   (native controls render dark under OS dark-mode and disappear) ---------- */
.bp-form-check-input,
.forminator-custom-form input[type="checkbox"],
.forminator-custom-form input[type="radio"],
.modal__content input[type="checkbox"],
.modal__content input[type="radio"] {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px;
	margin-right: 0.55rem;
	border: 1px solid var(--gold) !important;
	border-radius: 3px !important;
	background: #ffffff !important;
	cursor: pointer;
	position: relative;
	flex: 0 0 auto;
	vertical-align: middle;
	transition: background 0.2s ease, border-color 0.2s ease;
}
input[type="radio"].bp-form-check-input,
.forminator-custom-form input[type="radio"],
.modal__content input[type="radio"] { border-radius: 50% !important; }

.bp-form-check-input:checked,
.forminator-custom-form input[type="checkbox"]:checked,
.forminator-custom-form input[type="radio"]:checked,
.modal__content input[type="checkbox"]:checked,
.modal__content input[type="radio"]:checked {
	background: #ffffff !important;
	border-color: var(--gold) !important;
}
/* checkmark */
input[type="checkbox"].bp-form-check-input:checked::after,
.forminator-custom-form input[type="checkbox"]:checked::after,
.modal__content input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	left: 5px; top: 2px;
	width: 5px; height: 9px;
	border: solid var(--ink);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
/* radio dot */
input[type="radio"].bp-form-check-input:checked::after,
.forminator-custom-form input[type="radio"]:checked::after,
.modal__content input[type="radio"]:checked::after {
	content: "";
	position: absolute;
	left: 4px; top: 4px;
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--ink);
}
.bp-form-check-input:focus-visible,
.forminator-custom-form input[type="checkbox"]:focus-visible,
.forminator-custom-form input[type="radio"]:focus-visible,
.modal__content input[type="checkbox"]:focus-visible,
.modal__content input[type="radio"]:focus-visible { outline: 2px solid var(--gold-soft); outline-offset: 2px; }

/* ---------- Phone field + country-code selector (AuctionForge register/profile) ---------- */
.bp-form-group__phone { display: flex !important; gap: 0.5rem; align-items: stretch; }
.bp-form-group__phone .countryCodeField,
.bp-form-group__phone select[name="phoneCountryCode"] {
	flex: 0 0 auto;
	width: auto !important;
	min-width: 5.5rem;
	max-width: 8.5rem;
	padding: 0 0.5rem !important;
	background: var(--slate) !important;
	border: 1px solid var(--mist) !important;
	color: var(--bone) !important;
	border-radius: 3px !important;
	font-family: var(--font-body) !important;
	cursor: pointer;
}
.bp-form-group__phone .countryCodeField:focus,
.bp-form-group__phone select[name="phoneCountryCode"]:focus {
	border-color: var(--gold) !important; box-shadow: 0 0 0 1px var(--gold) !important; outline: none;
}
.bp-form-group__phone .bp-form-control { flex: 1 1 auto; }
.countryCodeField.hidden { display: none !important; }