/* ==========================================================================
   Casting Center — front-end
   Structural CSS. Typography inherits the theme; colours default to
   theme-adaptive neutrals and can be overridden via the Custom Theme
   settings (which emit the .cc-scope variables inline).
   ========================================================================== */

.cc-scope{
	/* Defaults inherit / adapt to the active theme. */
	--cc-font: inherit;
	--cc-text: inherit;
	--cc-muted: rgba(128,128,128,.95);
	--cc-bg: transparent;
	--cc-surface: rgba(128,128,128,.06);
	--cc-line: rgba(128,128,128,.28);
	--cc-line-soft: rgba(128,128,128,.16);
	--cc-radius: 14px;
	--cc-accent-bg: #ffffff;
	--cc-accent-fg: #111111;

	/* Semantic status colours (overridable). */
	--st-open: #6f9c86;
	--st-pending: #8891a8;
	--st-short: #7fa7bd;
	--st-accepted: #7bab88;
	--st-rejected: #b58a8a;
	--st-closed: #8a8a8a;

	font-family: var(--cc-font);
	color: var(--cc-text);
	background: var(--cc-bg);
	line-height: 1.55;
	box-sizing: border-box;
}
.cc-scope *,
.cc-scope *::before,
.cc-scope *::after{ box-sizing: border-box; }

.cc-scope.cc-fullwidth{
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.cc-display{ font-family: inherit; }
.cc-mono{ font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.cc-scope img{ display:block; max-width:100%; }
.cc-scope a{ color: inherit; text-decoration: none; }

/* ---------- layout ---------- */
.cc-wrap{ max-width: 1200px; margin: 0 auto; padding: 40px 24px 56px; }
.cc-detail-wrap{ max-width: 1120px; }

/* ---------- buttons ---------- */
.cc-btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	font-size:.82rem; letter-spacing:.04em; line-height:1;
	padding:12px 22px; border-radius:100px; cursor:pointer;
	border:1px solid var(--cc-line); background:transparent; color:inherit;
	transition:.2s ease; text-align:center;
}
.cc-btn:hover{ opacity:.86; }
.cc-btn--primary{
	background: var(--cc-accent-bg); color: var(--cc-accent-fg);
	border-color: var(--cc-accent-bg); font-weight:500;
}
.cc-btn--primary:hover{ opacity:.9; }
.cc-btn--ghost{ background:transparent; color:inherit; border-color:var(--cc-line); }
.cc-btn--block{ width:100%; }
.cc-btn--disabled{ opacity:.45; cursor:default; pointer-events:none; background:transparent; color:var(--cc-muted); border-color:var(--cc-line); }

/* ---------- notices ---------- */
.cc-notice{ padding:12px 16px; border-radius:var(--cc-radius); border:1px solid var(--cc-line); margin:0 0 22px; font-size:.9rem; }
.cc-notice--error{ border-color: var(--st-rejected); }
.cc-notice--success{ border-color: var(--st-accepted); }
.cc-notice--info{ border-color: var(--st-pending); }

/* ---------- status pill ---------- */
.cc-status{
	display:inline-flex; align-items:center; gap:7px;
	font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
	padding:5px 11px 4px; border-radius:100px; border:1px solid var(--cc-line);
	color: var(--cc-muted); white-space:nowrap;
}
.cc-status .cc-dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.cc-open{ color: var(--st-open); }
.cc-pending{ color: var(--st-pending); }
.cc-short{ color: var(--st-short); }
.cc-accepted{ color: var(--st-accepted); }
.cc-rejected{ color: var(--st-rejected); }
.cc-closed{ color: var(--st-closed); }

/* ---------- dashboard ---------- */
.cc-dash{ display:flex; align-items:flex-end; justify-content:space-between; gap:22px; flex-wrap:wrap; margin-bottom:26px; }
.cc-greet{ font-size:1.9rem; line-height:1.1; }
.cc-sub{ font-size:.9rem; color:var(--cc-muted); margin-top:6px; }
.cc-summary{ display:flex; gap:10px; flex-wrap:wrap; }
.cc-cell{ border:1px solid var(--cc-line); border-radius:calc(var(--cc-radius) - 4px); padding:10px 15px; min-width:82px; background:var(--cc-surface); }
.cc-num{ font-size:1.5rem; line-height:1; }
.cc-lbl{ font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--cc-muted); margin-top:7px; display:flex; align-items:center; gap:6px; }
.cc-lbl .cc-dot{ width:5px; height:5px; border-radius:50%; }
.cc-dot--open{ background:var(--st-open); }
.cc-dot--pending{ background:var(--st-pending); }
.cc-dot--shortlisted{ background:var(--st-short); }
.cc-dot--accepted{ background:var(--st-accepted); }

/* ---------- filters ---------- */
.cc-filters{ display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid var(--cc-line-soft); padding-bottom:16px; margin-bottom:26px; }
.cc-filter{ font-size:.82rem; padding:8px 15px; border-radius:100px; border:1px solid transparent; color:var(--cc-muted); transition:.2s; }
.cc-filter:hover{ color:var(--cc-text); }
.cc-filter.cc-on{ background:var(--cc-surface); border-color:var(--cc-line); color:var(--cc-text); }
.cc-filter .cc-c{ font-size:.7rem; margin-left:6px; opacity:.7; }

/* ---------- grid + cards ---------- */
.cc-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.cc-grid--past{ grid-template-columns:repeat(3,1fr); gap:18px; margin-top:2px; }
.cc-section-tag{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--cc-muted); margin:46px 0 18px; display:flex; align-items:center; gap:14px; }
.cc-section-tag::after{ content:""; flex:1; height:1px; background:var(--cc-line-soft); }

.cc-card{ display:flex; flex-direction:column; border:1px solid var(--cc-line); border-radius:var(--cc-radius); background:var(--cc-surface); overflow:hidden; transition:transform .25s ease, border-color .25s ease; }
.cc-card:hover{ transform:translateY(-3px); border-color:var(--cc-muted); }
.cc-thumb{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--cc-line-soft); }
.cc-thumb img{ width:100%; height:100%; object-fit:cover; }
.cc-thumb-empty{ position:absolute; inset:0; background:
	repeating-linear-gradient(45deg, rgba(128,128,128,.08) 0 10px, rgba(128,128,128,.14) 10px 20px); }
.cc-ribbon{ position:absolute; top:12px; left:12px; }
.cc-ribbon .cc-status{ background:rgba(0,0,0,.35); backdrop-filter:blur(4px); border-color:rgba(255,255,255,.25); }
.cc-type{ position:absolute; bottom:12px; left:12px; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.18); padding:4px 9px; border-radius:100px; backdrop-filter:blur(4px); }
.cc-card-body{ padding:18px 18px 20px; display:flex; flex-direction:column; flex:1; }
.cc-title{ font-size:1.35rem; line-height:1.15; }
.cc-card--past .cc-title{ font-size:1.05rem; }
.cc-card--past .cc-thumb img{ filter:grayscale(.6) brightness(.7); }
.cc-meta{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:10px; font-size:.8rem; color:var(--cc-muted); }
.cc-fee{ font-size:.82rem; margin-top:14px; padding-top:14px; border-top:1px solid var(--cc-line-soft); }
.cc-open-rate{ color:var(--cc-muted); }
.cc-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; }
.cc-foot .cc-btn{ padding:9px 16px; font-size:.72rem; }

.cc-empty{ padding:40px 20px; text-align:center; color:var(--cc-muted); border:1px dashed var(--cc-line); border-radius:var(--cc-radius); }

.cc-account{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:44px; padding-top:22px; border-top:1px solid var(--cc-line-soft); font-size:.85rem; color:var(--cc-muted); }

/* ---------- sign in ---------- */
.cc-signin{ min-height:60vh; display:flex; align-items:center; justify-content:center; padding:60px 24px; }
.cc-signin-card{ width:100%; max-width:380px; text-align:center; }
.cc-lock{ width:44px; height:44px; margin:0 auto 20px; border:1px solid var(--cc-line); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.cc-lock svg{ width:18px; height:18px; }
.cc-signin-card h1{ font-size:2rem; margin:0; }
.cc-say{ color:var(--cc-muted); font-size:.9rem; margin:10px 0 26px; }
.cc-form{ text-align:left; }
.cc-field{ margin-bottom:14px; }
.cc-field label{ display:block; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--cc-muted); margin-bottom:8px; }
.cc-field input{ width:100%; background:var(--cc-surface); border:1px solid var(--cc-line); border-radius:calc(var(--cc-radius) - 4px); color:inherit; font:inherit; font-size:.95rem; padding:13px 15px; }
.cc-field input:focus{ outline:none; border-color:var(--cc-muted); }
.cc-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin:6px 2px 22px; font-size:.8rem; }
.cc-check{ color:var(--cc-muted); display:inline-flex; align-items:center; gap:7px; }
.cc-foothint{ font-size:.75rem; color:var(--cc-muted); margin-top:24px; line-height:1.7; text-align:center; }

/* ---------- detail ---------- */
.cc-back{ display:inline-block; font-size:.82rem; color:var(--cc-muted); margin-bottom:20px; }
.cc-back:hover{ color:var(--cc-text); }
.cc-detail{ border:1px solid var(--cc-line); border-radius:var(--cc-radius); overflow:hidden; background:var(--cc-surface); }
.cc-detail-hero{ position:relative; aspect-ratio:21/8; overflow:hidden; background:var(--cc-line-soft); }
.cc-detail-hero img{ width:100%; height:100%; object-fit:cover; }
.cc-detail-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.72)); }
.cc-detail-hero--closed img{ filter:grayscale(.6) brightness(.62); }
.cc-cap{ position:absolute; left:0; right:0; bottom:0; padding:30px 34px; color:#fff; }
.cc-cap .cc-type{ position:static; display:inline-block; background:transparent; border:none; padding:0; color:rgba(255,255,255,.8); }
.cc-cap h1{ font-size:2.6rem; line-height:1.05; margin:8px 0 0; max-width:72%; }
.cc-detail-body{ display:grid; grid-template-columns:1fr 330px; gap:40px; padding:34px; }
.cc-block{ margin-bottom:30px; }
.cc-block h3{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--cc-muted); margin:0 0 12px; }
.cc-rich{ font-size:.95rem; line-height:1.75; color:var(--cc-text); }
.cc-rich p{ margin:0 0 12px; }
.cc-block ul{ margin:0; padding:0; list-style:none; }
.cc-block li{ font-size:.92rem; color:var(--cc-text); padding:9px 0 9px 22px; position:relative; border-bottom:1px solid var(--cc-line-soft); }
.cc-block li::before{ content:""; position:absolute; left:2px; top:16px; width:8px; height:1px; background:var(--cc-muted); }

.cc-apply-panel{ border:1px solid var(--cc-line); border-radius:var(--cc-radius); background:var(--cc-bg); padding:24px; position:sticky; top:24px; align-self:start; }
.cc-sum-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--cc-line-soft); }
.cc-sum-row:first-child{ padding-top:0; }
.cc-sum-row .cc-k{ font-size:.6rem; letter-spacing:.13em; text-transform:uppercase; color:var(--cc-muted); }
.cc-sum-row .cc-v{ font-size:.88rem; text-align:right; }
.cc-rate{ margin:18px 0 6px; }
.cc-rate label{ display:block; font-size:.6rem; letter-spacing:.13em; text-transform:uppercase; color:var(--cc-muted); margin-bottom:8px; }
.cc-rate input{ width:100%; background:var(--cc-surface); border:1px solid var(--cc-line); border-radius:calc(var(--cc-radius) - 4px); color:inherit; font:inherit; font-size:.95rem; padding:13px 15px; }
.cc-rate input:focus{ outline:none; border-color:var(--cc-muted); }
.cc-apply-form .cc-btn{ margin-top:18px; }
.cc-fineprint{ font-size:.68rem; color:var(--cc-muted); text-align:center; margin-top:14px; line-height:1.6; }
.cc-closed-note,.cc-applied-note{ border:1px solid var(--cc-line); border-radius:calc(var(--cc-radius) - 4px); padding:14px 16px; margin-bottom:16px; }
.cc-closed-note{ border-color:var(--st-rejected); }
.cc-applied-note{ border-color:var(--st-pending); }
.cc-closed-note .cc-t,.cc-applied-note .cc-t{ font-size:.85rem; }
.cc-closed-note .cc-t span,.cc-applied-note .cc-t span{ display:block; color:var(--cc-muted); font-size:.78rem; margin-top:3px; }

/* ---------- responsive ---------- */
@media (max-width:900px){
	.cc-detail-body{ grid-template-columns:1fr; gap:26px; }
	.cc-apply-panel{ position:static; }
	.cc-cap h1{ font-size:2rem; max-width:90%; }
}
@media (max-width:680px){
	.cc-grid{ grid-template-columns:1fr; gap:18px; }
	.cc-grid--past{ grid-template-columns:1fr; }
	.cc-detail-hero{ aspect-ratio:4/3; }
	.cc-cap{ padding:20px; }
	.cc-cap h1{ font-size:1.7rem; }
	.cc-greet{ font-size:1.5rem; }
	.cc-filters{ flex-wrap:nowrap; overflow-x:auto; }
	.cc-wrap{ padding:28px 16px 40px; }
}

/* ==========================================================================
   v1.1 — promo labels, inactive overlays, grayscale, gallery
   ========================================================================== */

/* Sign-in heading (page title already shows "Casting Center"). */
.cc-signin-title{ font-size:1.7rem; margin:0 0 4px; }

/* Canceled status pill. */
.cc-canceled{ color: var(--st-rejected); }

/* Promo badges (top-left of the image, stacked under any state pill). */
.cc-badges{ position:absolute; top:12px; right:12px; display:flex; flex-direction:column; align-items:flex-end; gap:6px; z-index:3; }
.cc-badge{
	display:inline-block; font-size:.58rem; letter-spacing:.13em; text-transform:uppercase;
	padding:4px 9px; border-radius:100px; color:#fff; line-height:1;
	border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(4px);
	background: rgba(0,0,0,.4);
}
.cc-badge--new{ background: var(--st-accepted); color:#0b160f; border-color:transparent; }
.cc-badge--hot{ background: #c0736f; color:#160b0b; border-color:transparent; }
.cc-badge--recommended{ background: var(--st-short); color:#0b1116; border-color:transparent; }
.cc-badge--highly_paid{ background: #9a8fb0; color:#120e16; border-color:transparent; }

/* On the detail hero the badges sit inline in the caption. */
.cc-cap .cc-badges{ position:static; flex-direction:row; align-items:center; margin-bottom:8px; }

/* Grayscale for inactive castings (color is the default). */
.cc-thumb--gray img{ filter: grayscale(1) brightness(.62); }
.cc-detail-hero--gray img{ filter: grayscale(1) brightness(.55); }

/* Big overlay label over grayed images. */
.cc-overlay-label{
	position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
	z-index:3; font-size:.8rem; letter-spacing:.28em; text-transform:uppercase;
	color:#fff; padding:8px 18px; border:1px solid rgba(255,255,255,.6);
	border-radius:100px; background:rgba(0,0,0,.35); backdrop-filter:blur(3px); white-space:nowrap;
}
.cc-overlay-label--hero{ font-size:1rem; padding:10px 26px; }

/* Remove the past-specific dimming rule from v1 (superseded by --gray). */
.cc-card--past .cc-thumb img{ filter:none; }
.cc-card--inactive .cc-title{ opacity:.9; }

/* Gallery on the detail page. */
.cc-gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.cc-gallery-item{ display:block; aspect-ratio:1/1; overflow:hidden; border-radius:calc(var(--cc-radius) - 6px); border:1px solid var(--cc-line-soft); }
.cc-gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.cc-gallery-item:hover img{ transform:scale(1.04); }
.cc-gallery--gray img{ filter:grayscale(1) brightness(.7); }
@media (max-width:680px){ .cc-gallery{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   v1.1.1 — overrides to beat theme image filters + legibility fixes
   (kept last so they win against theme rules)
   ========================================================================== */

/* Force TRUE COLOUR on active casting images; grayscale only when inactive.
   !important overrides themes that apply a site-wide grayscale filter. */
.cc-scope .cc-thumb img,
.cc-scope .cc-detail-hero img,
.cc-scope .cc-gallery-item img{
	filter: grayscale(0) !important;
	-webkit-filter: grayscale(0) !important;
}
.cc-scope .cc-thumb--gray img{
	filter: grayscale(1) brightness(.62) !important;
	-webkit-filter: grayscale(1) brightness(.62) !important;
}
.cc-scope .cc-detail-hero--gray img{
	filter: grayscale(1) brightness(.55) !important;
	-webkit-filter: grayscale(1) brightness(.55) !important;
}
.cc-scope .cc-gallery--gray img{
	filter: grayscale(1) brightness(.7) !important;
	-webkit-filter: grayscale(1) brightness(.7) !important;
}

/* Hero banner: stronger gradient + guaranteed-legible title over any image. */
.cc-scope .cc-detail-hero{ background:#111; }
.cc-scope .cc-detail-hero::after{
	background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,.9) 100%) !important;
	z-index:1;
}
.cc-scope .cc-cap{ z-index:2; }
.cc-scope .cc-cap h1{ color:#fff !important; text-shadow:0 2px 24px rgba(0,0,0,.6); }
.cc-scope .cc-cap .cc-type{ color:rgba(255,255,255,.85) !important; }

/* Image labels legible over white OR black photos (solid-dark chips). */
.cc-scope .cc-ribbon .cc-status{
	background: rgba(8,8,8,.66) !important;
	border-color: rgba(255,255,255,.32) !important;
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.cc-scope .cc-type{
	background: rgba(8,8,8,.62) !important;
	border: 1px solid rgba(255,255,255,.28) !important;
	color:#fff !important;
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.cc-scope .cc-overlay-label{
	background: rgba(8,8,8,.5) !important;
	border-color: rgba(255,255,255,.7) !important;
	color:#fff !important;
	-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}

/* Card divider: one clean hairline above the action row (not under the meta). */
.cc-scope .cc-fee{ border-top:0 !important; padding-top:0 !important; margin-top:12px; }
.cc-scope .cc-foot{ border-top:1px solid var(--cc-line-soft); padding-top:15px; margin-top:16px; }