/* =========================================================================
   CELB MGMT v4 — shared public design kit
   Used by every theme-embedded public surface that is not the profile or
   the roster: artist contact form, booking form, submission portal,
   application form, newsroom (grid, carousel, article).

   Same rules as the 3.2 profile and 3.3 roster:
   - fonts: the theme's own body + heading fonts (font-family: inherit);
   - colours: derived from the theme's text colour (currentColor); the page
     background shows through; filled "ink" buttons use the detected text
     and page colours (set by celb-ui.js);
   - accent: theme palette (block themes, Elementor, Salient) unless an
     accent is set in Settings. No gold anywhere.
   ========================================================================= */

[data-celb-ui] {
	--u-ink: var(--celb-u-ink, currentColor);
	--u-page: var(--celb-u-page, #ffffff);
	--u-accent: var(--celb-accent, var(--wp--preset--color--primary, var(--wp--preset--color--accent, var(--e-global-color-accent, var(--nectar-accent-color, currentColor)))));
	--u-muted: color-mix(in srgb, currentColor 64%, transparent);
	--u-faint: color-mix(in srgb, currentColor 44%, transparent);
	--u-line: color-mix(in srgb, currentColor 14%, transparent);
	--u-line-2: color-mix(in srgb, currentColor 26%, transparent);
	--u-surface: color-mix(in srgb, currentColor 4%, transparent);
	--u-surface-2: color-mix(in srgb, currentColor 8%, transparent);
	--u-field: color-mix(in srgb, currentColor 3%, transparent);
	--u-ok: #2e7a4d;
	--u-err: #b3262d;
	--u-r: 18px;
	--u-r-sm: 12px;
	--u-gap: clamp(14px, 2vw, 20px);
	color: inherit;
	font-family: inherit;
	line-height: 1.6;
	box-sizing: border-box;
}
[data-celb-ui] *,
[data-celb-ui] *::before,
[data-celb-ui] *::after { box-sizing: inherit; }
[data-celb-ui] :is(h1, h2, h3, h4, p, ul, ol, dl, figure) { margin: 0; padding: 0; }
[data-celb-ui] a { color: inherit; }
[data-celb-ui] [hidden] { display: none !important; }

/* ---------- Section header ---------- */
.cu-head { display: grid; gap: 10px; margin: 0 0 clamp(22px, 3.4vw, 36px); }
.cu-head--center { justify-items: center; text-align: center; }
.cu-eyebrow { color: var(--u-muted); font-size: .76rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.cu-title { color: inherit; font-family: inherit; font-size: clamp(1.7rem, 3.6vw, 2.6rem); font-weight: 600; line-height: 1.1; letter-spacing: -.01em; }
.cu-intro { max-width: 62ch; color: var(--u-muted); font-size: 1.02rem; }

/* ---------- Card ---------- */
.cu-card { padding: clamp(20px, 3.4vw, 34px); border: 1px solid var(--u-line); border-radius: var(--u-r); background: var(--u-surface); }
.cu-card + .cu-card { margin-top: var(--u-gap); }
.cu-card-title { margin: 0 0 16px; font-size: 1.05rem; font-weight: 600; }

/* ---------- Form ---------- */
.cu-form { display: grid; gap: var(--u-gap); }
.cu-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--u-gap); }
.cu-grid > .cu-full { grid-column: 1 / -1; }
@media (max-width: 640px) { .cu-grid { grid-template-columns: 1fr; } }
.cu-field { display: grid; gap: 8px; min-width: 0; margin: 0; }
.cu-label { color: inherit; font-size: .84rem; font-weight: 600; letter-spacing: .01em; }
.cu-label .cu-req { color: var(--u-accent); margin-left: 2px; }
.cu-label small { color: var(--u-faint); font-weight: 400; }
.cu-help { color: var(--u-faint); font-size: .84rem; }

[data-celb-ui] :is(.cu-input, .cu-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .cu-field select, .cu-field textarea) {
	width: 100%; min-height: 50px; margin: 0; padding: 12px 16px;
	border: 1px solid var(--u-line-2); border-radius: var(--u-r-sm);
	background: var(--u-field); color: inherit; box-shadow: none;
	font: inherit; font-size: 1rem; line-height: 1.4;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
	-webkit-appearance: none; appearance: none;
}
[data-celb-ui] .cu-field textarea { min-height: 140px; resize: vertical; line-height: 1.6; }
[data-celb-ui] .cu-field select {
	padding-right: 44px; cursor: pointer;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%;
	background-size: 6px 6px, 6px 6px; background-repeat: no-repeat;
}
[data-celb-ui] .cu-field select option { color: #111; background: #fff; }
[data-celb-ui] :is(.cu-input, .cu-field input, .cu-field select, .cu-field textarea)::placeholder { color: var(--u-faint); opacity: 1; }
[data-celb-ui] :is(.cu-input, .cu-field input, .cu-field select, .cu-field textarea):hover { border-color: color-mix(in srgb, currentColor 40%, transparent); }
[data-celb-ui] :is(.cu-input, .cu-field input, .cu-field select, .cu-field textarea):focus {
	outline: 0; border-color: var(--u-accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--u-accent) 22%, transparent);
	background: color-mix(in srgb, currentColor 1%, transparent);
}

/* Checkbox / radio rows */
.cu-check { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: .95rem; }
[data-celb-ui] .cu-check input,
[data-celb-ui] .cu-chip input { width: 18px; height: 18px; margin: 0; accent-color: var(--u-accent); }

/* Selectable chips (artists) */
.cu-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.cu-chip {
	position: relative; display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 14px 8px 8px;
	border: 1px solid var(--u-line-2); border-radius: 999px; background: var(--u-field); cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}
.cu-chip:hover { border-color: color-mix(in srgb, currentColor 45%, transparent); transform: translateY(-1px); }
.cu-chip input { position: absolute; opacity: 0; pointer-events: none; }
.cu-chip-ph {
	display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%;
	background: var(--u-surface-2) center 22% / cover no-repeat; color: var(--u-muted); font-size: .78rem; font-weight: 600;
}
.cu-chip-name { min-width: 0; font-size: .92rem; font-weight: 600; line-height: 1.25; }
.cu-chip-tick {
	display: grid; place-items: center; flex: 0 0 auto; width: 22px; height: 22px; margin-left: auto; border-radius: 50%;
	border: 1px solid var(--u-line-2); color: transparent; transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.cu-chip-tick svg { width: 12px; height: 12px; }
.cu-chip:has(input:checked) { border-color: var(--u-accent); background: color-mix(in srgb, var(--u-accent) 9%, transparent); }
.cu-chip:has(input:checked) .cu-chip-tick { background: var(--u-accent); border-color: var(--u-accent); color: #fff; }
.cu-chip:has(input:focus-visible) { box-shadow: 0 0 0 3px color-mix(in srgb, var(--u-accent) 25%, transparent); }
.cu-chips-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }

/* ---------- Buttons ---------- */
.cu-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 28px;
	border: 1px solid transparent; border-radius: 999px; font: inherit; font-size: .98rem; font-weight: 600; letter-spacing: .01em;
	line-height: 1; text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: transform .2s ease, opacity .2s ease, background-color .2s ease, border-color .2s ease;
}
.cu-btn:hover { transform: translateY(-1px); }
.cu-btn:focus-visible { outline: 2px solid var(--u-accent); outline-offset: 3px; }
.cu-btn svg { width: 17px; height: 17px; transition: transform .2s ease; }
.cu-btn:hover svg { transform: translateX(2px); }
[data-celb-ui] .cu-btn--ink { background: var(--u-ink); color: var(--u-page) !important; }
[data-celb-ui] .cu-btn--ink:hover { opacity: .88; }
[data-celb-ui] .cu-btn--ghost { background: transparent; border-color: var(--u-line-2); color: inherit !important; }
[data-celb-ui] .cu-btn--ghost:hover { border-color: currentColor; }
.cu-btn--block { width: 100%; }
.cu-btn[disabled] { opacity: .5; cursor: progress; transform: none; }
.cu-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }

/* ---------- Notices ---------- */
.cu-note { display: flex; align-items: flex-start; gap: 12px; padding: 14px 18px; border-radius: var(--u-r-sm); border: 1px solid var(--u-line-2); background: var(--u-surface); font-size: .95rem; }
.cu-note.is-ok { border-color: color-mix(in srgb, var(--u-ok) 45%, transparent); background: color-mix(in srgb, var(--u-ok) 9%, transparent); }
.cu-note.is-err { border-color: color-mix(in srgb, var(--u-err) 45%, transparent); background: color-mix(in srgb, var(--u-err) 8%, transparent); }
.cu-done { display: grid; justify-items: center; gap: 14px; padding: clamp(28px, 6vw, 56px) 20px; text-align: center; }
.cu-done-ic { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; border: 1px solid var(--u-line-2); }
.cu-done-ic svg { width: 28px; height: 28px; }
.cu-done h3 { font-size: 1.4rem; font-weight: 600; }
.cu-done p { max-width: 46ch; color: var(--u-muted); }

/* Honeypots stay out of view */
.cu-hp, .celb-acf-hp, .celb-hp, .cs-hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

/* ---------- Filter pills (newsroom) ---------- */
.cu-pills { display: flex; gap: 8px; margin: 0 0 clamp(18px, 2.6vw, 28px); overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.cu-pills::-webkit-scrollbar { display: none; }
.cu-pill {
	display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; height: 40px; padding: 0 16px;
	border: 1px solid var(--u-line-2); border-radius: 999px; background: transparent; color: inherit;
	font: inherit; font-size: .9rem; font-weight: 500; cursor: pointer; transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.cu-pill b { color: var(--u-faint); font-weight: 500; font-size: .82rem; }
.cu-pill:hover { border-color: currentColor; }
[data-celb-ui] .cu-pill.is-on { background: var(--u-ink); border-color: var(--u-ink); color: var(--u-page); }
[data-celb-ui] .cu-pill.is-on b { color: inherit; opacity: .7; }

/* =========================================================================
   SURFACES
   ========================================================================= */

/* Artist contact + booking forms */
.celb-acf, .celb-request-form { max-width: 880px; margin: 0 auto; }
.celb-acf .cu-form, .celb-request-form .cu-form { margin-top: 4px; }
.celb-acf .g-recaptcha { margin: 2px 0; }

/* ---------- Submission portal (theme-embedded [CLEB_submit]) ---------- */
.celb-portal { max-width: 880px; margin: 0 auto; }
.celb-portal .celb-portal-lead { color: var(--u-muted); margin: 0 0 18px; }
.celb-portal .celb-portal-hint, .celb-portal .celb-portal-optional { color: var(--u-faint); font-size: .86rem; }
.celb-portal .celb-portal-group-title { margin: clamp(26px, 4vw, 40px) 0 14px; padding-top: 20px; border-top: 1px solid var(--u-line); font-size: 1.1rem; font-weight: 600; }
.celb-portal .celb-field { display: grid; gap: 8px; margin: 0 0 var(--u-gap); }
.celb-portal .celb-field-split, .celb-portal .celb-row-inline { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--u-gap); }
@media (max-width: 640px) { .celb-portal .celb-field-split, .celb-portal .celb-row-inline { grid-template-columns: 1fr; } }
.celb-portal .celb-label { font-size: .84rem; font-weight: 600; }
.celb-portal :is(.celb-input, textarea, select) {
	width: 100%; min-height: 50px; padding: 12px 16px; border: 1px solid var(--u-line-2); border-radius: var(--u-r-sm);
	background: var(--u-field); color: inherit; font: inherit; font-size: 1rem; box-shadow: none;
}
.celb-portal textarea.celb-input, .celb-portal textarea { min-height: 130px; }
.celb-portal :is(.celb-input, textarea, select):focus { outline: 0; border-color: var(--u-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--u-accent) 22%, transparent); }
.celb-portal .celb-input-auto { width: auto; }
.celb-portal .celb-checkbox { display: inline-flex; align-items: center; gap: 10px; }
.celb-portal .celb-checkbox input { accent-color: var(--u-accent); width: 18px; height: 18px; }
.celb-portal .celb-portal-items { display: grid; gap: 10px; }
.celb-portal .celb-portal-repeater { margin: 0 0 var(--u-gap); }
.celb-portal .celb-social-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--u-gap); }
@media (max-width: 640px) { .celb-portal .celb-social-fields { grid-template-columns: 1fr; } }
.celb-portal :is(.celb-btn, .celb-portal-add, .celb-portal-submit button, button[type="submit"]) {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 24px;
	border: 1px solid transparent; border-radius: 999px; background: var(--u-ink); color: var(--u-page);
	font: inherit; font-weight: 600; cursor: pointer; transition: opacity .2s ease, transform .2s ease;
}
.celb-portal .celb-portal-add { background: transparent; color: inherit; border-color: var(--u-line-2); min-height: 40px; font-size: .9rem; }
.celb-portal :is(.celb-btn, button[type="submit"]):hover { opacity: .88; transform: translateY(-1px); }
.celb-portal .celb-portal-error { padding: 12px 16px; border-radius: var(--u-r-sm); border: 1px solid color-mix(in srgb, var(--u-err) 45%, transparent); background: color-mix(in srgb, var(--u-err) 8%, transparent); }
.celb-portal .celb-portal-gate { max-width: 460px; margin: 0 auto; text-align: center; }
.celb-portal .celb-gate-form { display: grid; gap: 12px; margin-top: 16px; }
.celb-portal .celb-portal-confirm { display: grid; justify-items: center; gap: 14px; padding: 40px 0; text-align: center; }
.celb-portal .celb-portal-check { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; border: 1px solid var(--u-line-2); font-size: 1.6rem; }
.celb-portal .celb-portal-confirm-text { max-width: 46ch; color: var(--u-muted); }

/* ---------- Newsroom: card (grid + carousel + profile) ---------- */
.celb-scope .celb-news-card {
	position: relative; display: flex; align-items: flex-end; overflow: hidden; aspect-ratio: 4 / 5; min-height: 0;
	border-radius: var(--u-r, 18px); background: #141414 center / cover no-repeat; color: #fff !important; text-decoration: none !important;
	isolation: isolate; transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease;
}
.celb-scope .celb-news-card::before {
	content: ""; position: absolute; inset: 0; z-index: -1; background: inherit; background-size: cover; background-position: center;
	transition: transform .7s cubic-bezier(.2, .7, .2, 1);
}
.celb-scope .celb-news-card .celb-news-card-shade {
	position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .55) 70%, rgba(0, 0, 0, .86) 100%);
}
.celb-scope .celb-news-card .celb-news-card-text { position: relative; z-index: 1; display: grid; gap: 8px; width: 100%; padding: clamp(16px, 2.2vw, 22px); }
.celb-scope .celb-news-card .celb-news-card-talent { justify-self: start; padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, .16); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-size: .74rem; font-weight: 600; letter-spacing: .02em; }
.celb-scope .celb-news-card .celb-news-card-title {
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
	color: #fff; font-family: inherit; font-size: clamp(1.02rem, 1.6vw, 1.22rem); font-weight: 600; line-height: 1.25;
}
.celb-scope .celb-news-card .celb-news-card-meta { color: rgba(255, 255, 255, .72); font-size: .8rem; letter-spacing: .02em; }
@media (hover: hover) {
	.celb-scope .celb-news-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0, 0, 0, .22); }
	.celb-scope .celb-news-card:hover::before { transform: scale(1.05); }
}
.celb-scope .celb-news-card:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Newsroom page */
.celb-newsroom-page .celb-newsroom-bar { display: none; }
.celb-newsroom-page.has-pills .celb-newsroom-bar { display: none; }
.celb-newsroom-page .celb-news-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: clamp(14px, 2vw, 24px); }
@media (max-width: 560px) { .celb-newsroom-page .celb-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .celb-newsroom-page .celb-news-card .celb-news-card-text { padding: 12px; } .celb-newsroom-page .celb-news-card .celb-news-card-talent { display: none; } }
.celb-newsroom-page .celb-news-empty,
.celb-newsroom-page .celb-news-empty-static { padding: 48px 0; color: var(--u-muted); text-align: center; }

/* Newsroom pager (built by celb-frontend.js) */
.celb-newsroom-page .celb-news-pager { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; margin-top: clamp(24px, 3.4vw, 40px); }
.celb-newsroom-page .celb-news-page {
	display: inline-grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 999px;
	border: 1px solid var(--u-line-2); background: transparent; color: inherit; font: inherit; font-weight: 600; font-size: .9rem; cursor: pointer;
}
.celb-newsroom-page .celb-news-page:hover:not([disabled]) { border-color: currentColor; }
.celb-newsroom-page .celb-news-page.is-active { background: var(--u-ink); border-color: var(--u-ink); color: var(--u-page); }
.celb-newsroom-page .celb-news-page[disabled] { opacity: .35; cursor: default; }
.celb-newsroom-page .celb-news-ellipsis { padding: 0 4px; color: var(--u-faint); }

/* Newsroom carousel header + "View more" */
.celb-news-carousel-wrap .celb-news-carousel-title { font-family: inherit; font-weight: 600; letter-spacing: -.01em; }
.celb-news-carousel-wrap .celb-news-viewmore {
	display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; border: 1px solid var(--u-line-2, rgba(127, 127, 127, .35));
	border-radius: 999px; color: inherit; text-decoration: none; font-weight: 600; font-size: .9rem; transition: border-color .2s ease;
}
.celb-news-carousel-wrap .celb-news-viewmore:hover { border-color: currentColor; }
.celb-news-carousel-wrap .celb-carousel-nav { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--u-line-2, rgba(127, 127, 127, .35)); background: transparent; color: inherit; cursor: pointer; }

/* ---------- Newsroom article (single-celeb_news) ---------- */
.celb-article .celb-article-hero-text { font-family: inherit; }
.celb-article .celb-article-title { font-family: inherit; font-weight: 600; letter-spacing: -.01em; line-height: 1.08; }
.celb-article .celb-article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: .86rem; letter-spacing: .02em; }
.celb-article .celb-article-celeb { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; background: rgba(255, 255, 255, .16); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; text-decoration: none; font-weight: 600; }
.celb-article .celb-article-lang { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.celb-article .celb-news-lang-btn { height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; color: #fff; font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer; }
.celb-article .celb-news-lang-btn.is-active { background: #fff; color: #0a0a0a; }
.celb-article .celb-article-body { font-size: clamp(1.02rem, 1.3vw, 1.12rem); line-height: 1.85; }
.celb-article .celb-article-body p { margin: 0 0 1.2em; }
.celb-article .celb-article-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.celb-article .celb-article-link {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 18px;
	border: 1px solid color-mix(in srgb, currentColor 18%, transparent); border-radius: 14px; color: inherit; text-decoration: none; font-weight: 600;
	transition: border-color .2s ease, transform .2s ease;
}
.celb-article .celb-article-link:hover { border-color: currentColor; transform: translateY(-1px); }
.celb-article .celb-article-gallery { gap: 10px; }
.celb-article .celb-article-gthumb { border-radius: 12px; overflow: hidden; }
.celb-article .celb-article-dl {
	display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 999px;
	border: 1px solid color-mix(in srgb, currentColor 22%, transparent); color: inherit; text-decoration: none; font-weight: 600;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	[data-celb-ui] *, .celb-scope .celb-news-card, .celb-scope .celb-news-card::before { transition: none !important; }
}