/* ============================================================================
   BEACON MEDIA CO. — "Control Room" identity.
   Loaded only for the eventsmedia pack; re-skins the shared UI kit into a
   cinematic broadcast-production product. Language: cool STUDIO-LIGHT field, a
   near-black CONTROL-ROOM rail, an electric CYAN accent, and a hot REC-RED that
   only fires on live/urgent states (Event Day, Overdue). Bold condensed ANTON
   display poster headers over clean Inter body. Deliberately unlike photography
   (warm bone + clay serif) and the blue trades (hvac/realestate): colder, harder,
   broadcast-console aesthetic with on-air signal cues.
   ============================================================================ */
:root {
    --accent: #1ba3c9;            /* electric cyan */
    --accent-2: #56c6e3;          /* bright cyan */
    --accent-soft: #def1f7;       /* pale cyan wash */
    --accent-deep: #14809e;       /* deep cyan */
    --rec: #ff3b4e;               /* on-air / REC red */
    --rec-soft: #ffe2e5;
    --bg: #eef1f5;                /* cool studio light */
    --panel: #ffffff;
    --ink: #14181f;               /* near-black */
    --ink-soft: #6b7480;
    --line: #dde3ea;
    --side: #14171c;              /* control-room near-black */
    --side-ink: #8a94a1;
    --side-ink-bright: #ffffff;
    --pos: #1f9d6b;
    --neg: #e0444f;
    --display-font: "Anton", "Arial Narrow", sans-serif;
    --radius: 7px;
    --shadow: 0 1px 2px rgba(20,24,31,.05), 0 16px 38px -24px rgba(20,24,31,.5);
}

body {
    font-family: "Inter", -apple-system, "Segoe UI", sans-serif;
    color: var(--ink);
    background-color: var(--bg);
    background-image:
        radial-gradient(1000px 560px at 100% -12%, rgba(27,163,201,.10), transparent 60%),
        radial-gradient(720px 420px at -8% 108%, rgba(20,23,28,.05), transparent 55%);
    background-attachment: fixed;
    letter-spacing: .1px;
}

/* ---------------- Sidebar: control-room console ---------------- */
.side { background: linear-gradient(180deg, #181c22, #101216); border-right: 1px solid #07080a; }
.brand { border-bottom: 1px solid rgba(255,255,255,.08); margin: -2px -6px 14px; padding: 6px 14px 16px; }
.brand-mark {
    background: var(--accent); border-radius: 9px; box-shadow: 0 0 0 3px rgba(27,163,201,.22), 0 0 18px rgba(27,163,201,.35);
    font-family: var(--display-font); font-weight: 400; color: #06222b; letter-spacing: .5px;
}
.brand-name { font-family: var(--display-font); font-weight: 400; font-size: 21px; letter-spacing: .6px; text-transform: uppercase; }
.brand-pack { text-transform: uppercase; letter-spacing: .24em; font-size: 9px; color: var(--accent-2); opacity: .95; }
.nav-link {
    border-radius: 5px; font-size: 12.5px; font-weight: 500; letter-spacing: .03em;
    color: #9aa3b0; border-left: 2px solid transparent; padding-left: 10px;
}
.nav-link:hover { background: rgba(255,255,255,.05); color: #fff; }
.nav-link.active {
    background: linear-gradient(90deg, rgba(27,163,201,.28), rgba(27,163,201,.03));
    color: #fff; border-left-color: var(--accent);
}
.nav-link.active .nav-ico { color: var(--accent-2); opacity: 1; }
.side-foot { text-transform: uppercase; letter-spacing: .2em; font-size: 9px; }

/* ---------------- Topbar ---------------- */
.topbar { background: var(--panel); border-bottom: 1px solid var(--line); }
.client-id strong { font-family: var(--display-font); font-weight: 400; font-size: 18px; letter-spacing: .5px; text-transform: uppercase; }
.client-id .dot { border-radius: 2px; }

/* ---------------- Page header: poster masthead ---------------- */
.page-head { position: relative; margin-bottom: 24px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.page-head h1 { font-family: var(--display-font); font-weight: 400; font-size: 34px; letter-spacing: .6px; text-transform: uppercase; }
.page-head .sub { color: var(--ink-soft); text-transform: uppercase; letter-spacing: .16em; font-size: 11px; }

/* condensed display on panel titles + big numerals */
.rpanel .panel-h h3 { font-family: var(--display-font); font-weight: 400; font-size: 16px; letter-spacing: .5px; text-transform: uppercase; }
.kpi-num, .kpi-val { font-family: var(--display-font); font-weight: 400; letter-spacing: .5px; }
.kpi-lab, .kpi-label { text-transform: uppercase; letter-spacing: .12em; font-size: 10px; }

/* buttons */
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-deep); border-color: var(--accent-deep); }

/* ---------------- Status badge palette ---------------- */
/* neutral / new / queued (cool slate) */
.badge-new, .badge-inquiry, .badge-pending, .badge-draft, .badge-reserved,
.badge-assigned, .badge-lead, .badge-not-started { background: #e6eaf0; color: #5a6573; }
/* info / in-motion (cyan wash) */
.badge-qualified, .badge-quoted, .badge-negotiation, .badge-sent, .badge-viewed,
.badge-in-review { background: var(--accent-soft); color: var(--accent-deep); }
/* active / working (amber) */
.badge-booked, .badge-pre-production, .badge-editing, .badge-revisions, .badge-partial,
.badge-out, .badge-confirmed, .badge-on-job, .badge-installment { background: #fbe9d2; color: #9a6320; }
/* live / on-air / urgent (REC red) */
.badge-event-day, .badge-overdue, .badge-maintenance { background: var(--rec-soft); color: #c92434; }
/* delivered / done / paid / healthy (green) */
.badge-delivered, .badge-completed, .badge-paid, .badge-signed, .badge-returned,
.badge-available, .badge-active, .badge-published, .badge-replied, .badge-done { background: #e0f0e8; color: #2f7a55; }
/* alerts (red) */
.badge-cancelled, .badge-lost, .badge-declined, .badge-retired, .badge-expired { background: #f7e0e2; color: #b53b44; }

/* event-type + service-category + role/gear info chips (cool neutral cyan-grey) */
.badge-conference, .badge-corporate-event, .badge-wedding, .badge-concert, .badge-gala,
.badge-product-launch, .badge-sports, .badge-livestream, .badge-fundraiser, .badge-brand-film,
.badge-video, .badge-photo, .badge-live-stream, .badge-drone, .badge-photo-booth, .badge-audio,
.badge-led-wall, .badge-multi-cam, .badge-day, .badge-half-day, .badge-hour, .badge-flat,
.badge-camera, .badge-lens, .badge-lighting, .badge-switcher, .badge-computer, .badge-grip,
.badge-streaming, .badge-misc, .badge-corporate, .badge-agency, .badge-nonprofit, .badge-venue,
.badge-government, .badge-education, .badge-past,
.badge-highlight-reel, .badge-full-edit, .badge-photo-gallery, .badge-livestream-recording,
.badge-raw-footage, .badge-recap-reel, .badge-social-cutdowns, .badge-drone-edit { background: #e7eef2; color: #4a6470; }

.ph-pos { color: var(--pos); } .ph-neg { color: var(--neg); }
.ph-money { font-variant-numeric: tabular-nums; }

/* small "on-air" live dot helper for custom views */
.em-live { display:inline-flex; align-items:center; gap:6px; font-weight:700; color:#c92434; text-transform:uppercase; letter-spacing:.1em; font-size:11px; }
.em-live::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--rec); box-shadow:0 0 0 0 rgba(255,59,78,.6); animation:em-pulse 1.6s infinite; }
@keyframes em-pulse { 0%{box-shadow:0 0 0 0 rgba(255,59,78,.55);} 70%{box-shadow:0 0 0 7px rgba(255,59,78,0);} 100%{box-shadow:0 0 0 0 rgba(255,59,78,0);} }