/* ==========================================================================
   RestoAudit Pitch v2.3.0 — AI Everywhere surfaces (CREW AI-SURFACES-230)

   Styles for the dual-mode (System / AI Agent) surfaces this crew added
   inside the existing tabs: the builder editor's AI edit / section
   rewrite boxes and agent-panel wrap, the templates "Edit with AI"
   action, and the panel host cards on the video, detective, traffic,
   menu and servicedesk screens. The shared Agent Panel itself is
   styled by assets/ai230-core.css (AI-CORE); app-wide chrome stays in
   assets/app.css. Palette is the house one — navy #061725, gold
   #EDBD5A, cream #FFFAF0 — with body text on dark surfaces kept at
   >= 4.5:1 contrast (cream on navy is 15.7:1; the muted tone below is
   #C9CDD6 on #0D2237, 9.4:1).
   ========================================================================== */

/* ---- Panel host cards (video / detective / traffic / menu / servicedesk) */
.s230-panel-card {
    border-color: rgba(237, 189, 90, .35);
}

.s230-panel-card > h2 {
    display: flex;
    align-items: center;
    gap: 10px;
}

.s230-panel-card > h2::after {
    content: "System · AI Agent";
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #061725;
    background: #EDBD5A;
    border-radius: 999px;
    padding: 3px 10px;
    white-space: nowrap;
}

/* Shown only if the shared agent-panel partial is not installed yet:
   the surface still explains itself instead of rendering a hole. */
.s230-panel-fallback {
    border: 1px dashed rgba(237, 189, 90, .45);
    border-radius: 10px;
    padding: 12px 14px;
    color: #C9CDD6;
}

/* ---- Templates: "Edit with AI" -------------------------------------- */
.s230-ai-edit-btn {
    border-color: rgba(237, 189, 90, .55);
    color: #EDBD5A;
}

.s230-ai-edit-btn:hover,
.s230-ai-edit-btn:focus-visible {
    background: rgba(237, 189, 90, .14);
    color: #FFFAF0;
}

.s230-ai-edit-row {
    margin-top: 12px;
}

/* ---- Builder editor: v2.3.0 AI boxes -------------------------------- */
.s230-ai-box textarea {
    min-height: 64px;
}

.s230-agent-box {
    border-color: rgba(237, 189, 90, .5);
}

/* The editor was opened with the agent panel surfaced (e.g. from a
   template's "Edit with AI"): draw the eye to the panel. */
.s230-agent-open {
    box-shadow: 0 0 0 2px rgba(237, 189, 90, .65), 0 12px 32px rgba(0, 0, 0, .35);
}

/* Cascade fix (found by this crew's contrast pass, 2026-10-12):
   app.css carries `body.pb-editor-body a { color: #17507e; }` for the
   editor shell, which out-specifies the shared panel's link colour
   and drops panel links to ~1.9:1 on the editor's dark panels.
   Inside this crew's agent box, panel links take the app's standard
   link colours (8.9:1 / 11.9:1 on navy). Flagged for AI-CORE/INT in
   V230_NOTES_AI-SURFACES.md — the general fix belongs in
   ai230-core.css, which this crew does not own. */
body.pb-editor-body .s230-agent-box .ai-panel a {
    color: #8FC7EE;
}

body.pb-editor-body .s230-agent-box .ai-panel a:hover {
    color: #BFE0F7;
}

.s230-agent-open > h3 {
    color: #EDBD5A;
}

/* ---- Agent Panel Apply feedback (v2.7.5) -----------------------------
   assets/ai230-core.js adds this class to the field an Apply just
   wrote, for ~2s, while it scrolls the field into view: the user must
   SEE where the draft landed. Gold ring + glow + a warm tint reads on
   the dark surfaces the panel lives on (and stays visible on light
   ones). Removed by the core script's timer — never left behind. */
.ai-apply-flash {
    outline: 3px solid #EDBD5A !important;
    outline-offset: 2px;
    box-shadow: 0 0 0 6px rgba(237, 189, 90, .22), 0 0 28px rgba(237, 189, 90, .38) !important;
    background-color: rgba(237, 189, 90, .10) !important;
    transition: outline-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}