/* ============================================================
   2026 URL slots + colourful visibility boost
   ============================================================ */

/* How-it-works multicolour cards */
.kvp-how-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin: 0 0 16px;
}
@media (max-width: 900px) {
	.kvp-how-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
	.kvp-how-grid { grid-template-columns: 1fr; }
}
.kvp-how-card {
	position: relative;
	padding: 14px 12px 12px;
	border-radius: 16px;
	border: 1px solid #e2e8f0;
	background: #fff;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
}
.kvp-how-card--1 { background: linear-gradient(160deg, #eef2ff, #fff); border-color: #c7d2fe; }
.kvp-how-card--2 { background: linear-gradient(160deg, #ecfdf5, #fff); border-color: #6ee7b7; }
.kvp-how-card--3 { background: linear-gradient(160deg, #fff7ed, #fff); border-color: #fdba74; }
.kvp-how-card--4 { background: linear-gradient(160deg, #fdf2f8, #fff); border-color: #f9a8d4; }
.kvp-how-num {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.75rem;
	font-weight: 900;
	color: #fff;
	background: linear-gradient(135deg, #6366f1, #db2777);
}
.kvp-how-ico {
	display: inline-flex;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	align-items: center;
	justify-content: center;
	color: #fff;
	margin-bottom: 8px;
	font-size: 1rem;
}
.kvp-how-card--1 .kvp-how-ico { background: linear-gradient(135deg, #6366f1, #4f46e5); }
.kvp-how-card--2 .kvp-how-ico { background: linear-gradient(135deg, #10b981, #059669); }
.kvp-how-card--3 .kvp-how-ico { background: linear-gradient(135deg, #f59e0b, #ea580c); }
.kvp-how-card--4 .kvp-how-ico { background: linear-gradient(135deg, #ec4899, #db2777); }
.kvp-how-card strong {
	display: block;
	font-size: 0.92rem;
	font-weight: 900;
	color: #0f172a;
	margin-bottom: 4px;
}
.kvp-how-card p {
	margin: 0;
	font-size: 0.8rem;
	line-height: 1.4;
	color: #475569;
	font-weight: 600;
}

/* Locked visibility cards clearer */
.kvp-vis-card.is-locked {
	opacity: 0.55 !important;
	filter: grayscale(0.35);
	pointer-events: none;
	position: relative;
}
.kvp-vis-card.is-locked::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: repeating-linear-gradient(
		-45deg,
		transparent,
		transparent 6px,
		rgba(15, 23, 42, 0.04) 6px,
		rgba(15, 23, 42, 0.04) 12px
	);
}
.kvp-vis-card.is-locked .kvp-vis-lock {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	padding: 4px 8px;
	border-radius: 999px;
	background: #0f172a;
	color: #fde68a;
	font-size: 0.7rem;
	font-weight: 800;
}

.kvp-hero-chip--single { background: linear-gradient(135deg,#0284c7,#0369a1); }
.kvp-card--single {
	background: linear-gradient(165deg,#f0f9ff,#e0f2fe) !important;
	border-color: #bae6fd !important;
}
.kvp-card--single .kvp-card-ico { background: linear-gradient(135deg,#0ea5e9,#0284c7); }
.kvp-card--single.is-selected {
	border-color: #0284c7 !important;
	box-shadow: 0 0 0 3px rgba(2,132,199,.18), 0 12px 28px rgba(2,132,199,.12);
}
.kvp-hero-chip--agency { background: linear-gradient(135deg,#7c3aed,#4f46e5); }
.kvp-card--agency {
	background: linear-gradient(165deg,#f5f3ff,#ede9fe) !important;
	border-color: #c4b5fd !important;
}
.kvp-card--agency .kvp-card-ico { background: linear-gradient(135deg,#8b5cf6,#6d28d9); }
.kvp-card--agency.is-selected {
	border-color: #7c3aed !important;
	box-shadow: 0 0 0 3px rgba(124,58,237,.18), 0 12px 28px rgba(124,58,237,.12);
}
.kvp-card-slots {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 4px 0 8px;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 800;
	background: rgba(15,23,42,.06);
	color: #0f172a;
}
.kvp-card--single .kvp-card-slots { background: #e0f2fe; color: #0369a1; }
.kvp-card--standard .kvp-card-slots { background: #ffedd5; color: #9a3412; }
.kvp-card--pro .kvp-card-slots { background: #fee2e2; color: #991b1b; }
.kvp-card--agency .kvp-card-slots { background: #ede9fe; color: #5b21b6; }

.kvp-note--platforms {
	background: linear-gradient(135deg,#ecfdf5,#dbeafe) !important;
	border-color: #6ee7b7 !important;
	color: #064e3b !important;
}

.kvp-platform-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
}
.kvp-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 800;
	color: #fff;
}
.kvp-pill--yt { background: linear-gradient(135deg,#ff0033,#b91c1c); }
.kvp-pill--fb { background: linear-gradient(135deg,#1877f2,#0b5fcc); }
.kvp-pill--ig { background: linear-gradient(135deg,#f58529,#dd2a7b,#8134af); }
.kvp-pill--li { background: linear-gradient(135deg,#0a66c2,#004182); }
.kvp-pill--vm { background: linear-gradient(135deg,#1ab7ea,#0d8ecf); }
.kvp-pill--tt { background: linear-gradient(135deg,#111,#25f4ee 55%,#fe2c55); color: #fff; }

.kvp-step--urls-2026 {
	border-color: #93c5fd !important;
	background:
		radial-gradient(ellipse 50% 60% at 100% 0%, rgba(59,130,246,.12), transparent 55%),
		linear-gradient(180deg,#eff6ff,#fff 40%) !important;
}
.kvp-url-slots {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
	max-height: min(70vh, 720px);
	overflow-y: auto;
	padding: 4px 4px 8px 2px;
	margin-bottom: 12px;
}
.kvp-url-slot {
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	gap: 10px;
	align-items: center;
	padding: 10px 12px;
	border-radius: 14px;
	border: 2px solid #e2e8f0;
	background: #fff;
	transition: border-color .12s ease, box-shadow .12s ease;
}
.kvp-url-slot.is-hidden-slot { display: none !important; }
.kvp-url-slot.is-ok { border-color: #6ee7b7; box-shadow: 0 0 0 3px rgba(16,185,129,.1); }
.kvp-url-slot.is-playlist { border-color: #a78bfa; box-shadow: 0 0 0 3px rgba(124,58,237,.12); }
.kvp-url-slot.is-invalid { border-color: #f87171; box-shadow: 0 0 0 3px rgba(239,68,68,.12); }
.kvp-url-slot__label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-size: 0.88rem !important;
	font-weight: 800 !important;
	color: #0f172a !important;
}
.kvp-url-slot__num {
	width: 28px;
	height: 28px;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.8rem;
	font-weight: 900;
	color: #fff;
	background: linear-gradient(135deg,#3b82f6,#2563eb);
	flex-shrink: 0;
}
.kvp-url-slot__text { line-height: 1.2; }
.kvp-req { color: #e60023; font-style: normal; }
.kvp-url-input { width: 100% !important; min-width: 0; }
.kvp-url-slot__hint {
	grid-column: 1 / -1;
	font-size: 0.78rem;
	font-weight: 700;
	color: #64748b;
	margin-top: -4px;
}
.kvp-url-slot.is-invalid .kvp-url-slot__hint { color: #b91c1c; }
.kvp-url-slot.is-playlist .kvp-url-slot__hint { color: #6d28d9; }
.kvp-filled-count {
	font-weight: 800;
	color: #1e40af;
	margin: 0 0 4px;
	font-size: 0.9rem;
}

.kvp-step--vis-2026 {
	border-color: #c4b5fd !important;
	background:
		radial-gradient(ellipse 45% 55% at 0% 0%, rgba(236,72,153,.12), transparent 50%),
		radial-gradient(ellipse 45% 55% at 100% 100%, rgba(99,102,241,.12), transparent 50%),
		linear-gradient(180deg,#faf5ff,#fff 45%) !important;
}
.kvp-vis-cards--2026 {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 14px;
}
.kvp-vis-cards--2026 .kvp-vis-card {
	min-height: 210px;
	display: flex;
	flex-direction: column;
	padding: 18px !important;
	border-width: 3px !important;
	border-radius: 20px !important;
}
.kvp-vis-cards--2026 .kvp-vis-ico {
	width: 48px;
	height: 48px;
	border-radius: 14px;
	font-size: 1.15rem;
}
.kvp-vis-cards--2026 .kvp-vis-name {
	font-size: 1.05rem !important;
	margin: 8px 0 4px !important;
}
.kvp-vis-cards--2026 .kvp-vis-price {
	display: inline-flex !important;
	align-self: flex-start;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 0.95rem !important;
	margin: 6px 0 10px !important;
	background: rgba(255,255,255,.75);
}
.kvp-vis-card--color-slate {
	background: linear-gradient(165deg,#f8fafc,#e2e8f0) !important;
	border-color: #94a3b8 !important;
}
.kvp-vis-card--color-orange {
	background: linear-gradient(165deg,#fff7ed,#ffedd5) !important;
	border-color: #fb923c !important;
}
.kvp-vis-card--color-violet {
	background: linear-gradient(165deg,#f5f3ff,#ddd6fe) !important;
	border-color: #a78bfa !important;
}
.kvp-vis-card--color-rose {
	background: linear-gradient(165deg,#fff1f2,#fecdd3) !important;
	border-color: #fb7185 !important;
}
.kvp-vis-card--color-slate .kvp-vis-price { color: #334155 !important; }
.kvp-vis-card--color-orange .kvp-vis-price { color: #c2410c !important; background: #ffedd5; }
.kvp-vis-card--color-violet .kvp-vis-price { color: #6d28d9 !important; background: #ede9fe; }
.kvp-vis-card--color-rose .kvp-vis-price { color: #be123c !important; background: #ffe4e6; }
.kvp-vis-card.is-selected.kvp-vis-card--color-slate {
	box-shadow: 0 0 0 4px rgba(71,85,105,.2), 0 16px 32px rgba(15,23,42,.1) !important;
	border-color: #334155 !important;
}
.kvp-vis-card.is-selected.kvp-vis-card--color-orange {
	box-shadow: 0 0 0 4px rgba(249,115,22,.25), 0 16px 32px rgba(249,115,22,.15) !important;
	border-color: #ea580c !important;
	transform: translateY(-3px);
}
.kvp-vis-card.is-selected.kvp-vis-card--color-violet {
	box-shadow: 0 0 0 4px rgba(124,58,237,.25), 0 16px 32px rgba(124,58,237,.15) !important;
	border-color: #7c3aed !important;
	transform: translateY(-3px);
}
.kvp-vis-card.is-selected.kvp-vis-card--color-rose {
	box-shadow: 0 0 0 4px rgba(244,63,94,.25), 0 16px 32px rgba(244,63,94,.15) !important;
	border-color: #e11d48 !important;
	transform: translateY(-3px);
}
.kvp-vis-card.is-locked {
	opacity: 0.55;
	filter: grayscale(0.45);
	cursor: not-allowed !important;
	position: relative;
}
.kvp-vis-card.is-locked::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 18px;
	background: repeating-linear-gradient(-45deg, transparent, transparent 8px, rgba(15,23,42,.03) 8px, rgba(15,23,42,.03) 16px);
	pointer-events: none;
}
.kvp-vis-lock {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	margin: 6px 0;
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 800;
	background: #0f172a;
	color: #fff !important;
}
.kvp-vis-lock[hidden] { display: none !important; }
.kvp-sum-total {
	background: linear-gradient(135deg,#dbeafe,#ede9fe) !important;
}
.kvp-sum-total strong { color: #4f46e5 !important; }

@media (max-width: 700px) {
	.kvp-url-slot { grid-template-columns: 1fr; gap: 6px; }
	.kvp-url-slots { max-height: 55vh; }
}

/* ---- Modern title / category / content fields ---- */
.kvp-submit-2026 .kvp-field {
	margin: 18px 0 20px !important;
	padding: 16px 16px 18px !important;
	border-radius: 18px !important;
	border: 1px solid #e2e8f0 !important;
	background: linear-gradient(165deg, #ffffff, #f8fafc) !important;
	box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05) !important;
}
.kvp-submit-2026 .kvp-field--title {
	border-color: #c7d2fe !important;
	background: linear-gradient(165deg, #eef2ff, #fff 55%) !important;
}
.kvp-submit-2026 .kvp-field--cats {
	border-color: #fbcfe8 !important;
	background: linear-gradient(165deg, #fdf2f8, #fff 55%) !important;
}
.kvp-submit-2026 .kvp-field--content {
	border-color: #fdba74 !important;
	background: linear-gradient(165deg, #fff7ed, #fff 50%) !important;
}
.kvp-submit-2026 .kvp-field-label {
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	margin: 0 0 12px !important;
	font-weight: inherit !important;
}
.kvp-submit-2026 .kvp-field-ico {
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1rem;
	box-shadow: 0 8px 16px rgba(79, 70, 229, 0.2);
}
.kvp-field--title .kvp-field-ico { background: linear-gradient(135deg, #6366f1, #4f46e5); }
.kvp-field--cats .kvp-field-ico { background: linear-gradient(135deg, #ec4899, #db2777); }
.kvp-field--content .kvp-field-ico { background: linear-gradient(135deg, #f59e0b, #ea580c); }
.kvp-submit-2026 .kvp-field-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.kvp-submit-2026 .kvp-field-text strong {
	font-size: 1.02rem;
	font-weight: 900;
	color: #0f172a;
	letter-spacing: -0.01em;
}
.kvp-submit-2026 .kvp-field-text em {
	font-style: normal;
	font-size: 0.82rem;
	font-weight: 600;
	color: #64748b;
}
.kvp-submit-2026 .kvp-input.bpinput,
.kvp-submit-2026 .kvp-field .bpinput {
	border: 2px solid #e2e8f0 !important;
	border-radius: 14px !important;
	padding: 12px 14px !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	background: #fff !important;
	box-shadow: none !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.kvp-submit-2026 .kvp-input.bpinput:focus,
.kvp-submit-2026 .kvp-field .bpinput:focus {
	border-color: #818cf8 !important;
	box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15) !important;
	outline: none !important;
}
.kvp-submit-2026 .kvp-cat-list {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.kvp-submit-2026 .kvp-cat-list .form-categories-item {
	margin: 0 !important;
	padding: 0 !important;
}
.kvp-submit-2026 .kvp-cat-list label {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 8px 14px !important;
	border-radius: 999px !important;
	border: 2px solid #e2e8f0 !important;
	background: #fff !important;
	font-weight: 750 !important;
	font-size: 0.86rem !important;
	color: #334155 !important;
	cursor: pointer !important;
	transition: border-color 0.12s ease, background 0.12s ease, color 0.12s ease !important;
}
.kvp-submit-2026 .kvp-cat-list input[type="checkbox"] {
	accent-color: #7c3aed;
}
.kvp-submit-2026 .kvp-cat-list input[type="checkbox"]:checked + label,
.kvp-submit-2026 .kvp-cat-list label:has(input:checked) {
	border-color: #a855f7 !important;
	background: linear-gradient(135deg, #f5f3ff, #fdf2f8) !important;
	color: #6d28d9 !important;
}
.kvp-submit-2026 .kvp-content-hint {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0 0 10px;
	padding: 10px 12px;
	border-radius: 12px;
	background: #fff7ed;
	border: 1px solid #fdba74;
	color: #9a3412;
	font-size: 0.84rem;
	font-weight: 650;
	line-height: 1.4;
}
.kvp-submit-2026 .kvp-content-hint i { color: #ea580c; margin-top: 2px; }
.kvp-submit-2026 .kvp-content-editor.tinymce,
.kvp-submit-2026 #king_post_content.tinymce {
	min-height: 180px !important;
	border: 2px solid #e2e8f0 !important;
	border-radius: 14px !important;
	padding: 12px 14px !important;
	background: #fff !important;
}
.kvp-submit-2026 .kvp-add-cart.king-submit-button,
.kvp-submit-2026 .kvp-pay-footer .king-submit-button.kvp-add-cart {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	width: 100% !important;
	max-width: 420px !important;
	min-height: 52px !important;
	padding: 14px 22px !important;
	border: 0 !important;
	border-radius: 14px !important;
	font-size: 1.05rem !important;
	font-weight: 900 !important;
	letter-spacing: -0.01em !important;
	color: #fff !important;
	background: linear-gradient(105deg, #4f46e5, #a855f7 50%, #ec4899) !important;
	box-shadow: 0 12px 28px rgba(99, 102, 241, 0.35) !important;
	cursor: pointer !important;
	transition: transform 0.12s ease, box-shadow 0.12s ease !important;
}
.kvp-submit-2026 .kvp-add-cart.king-submit-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 32px rgba(219, 39, 119, 0.3) !important;
}
.kvp-submit-2026 .kvp-save-draft.king-submit-button {
	margin-top: 10px !important;
	background: #fff !important;
	color: #4f46e5 !important;
	border: 2px solid #c7d2fe !important;
	box-shadow: none !important;
	font-weight: 800 !important;
	border-radius: 12px !important;
}
.kvp-card-price small {
	display: block;
	font-size: 0.75rem;
	font-weight: 800;
	opacity: 0.85;
	margin-top: 2px;
}
