/* RestoAudit Pitch v2.3.0 — FUNNEL-SEO-230 surfaces:
   the 1-Click Full Funnel Builder panel (funnels/create) and the
   SEO Optimize tab (seo/index, seo/show). Brand tokens come from
   app.css :root (navy #061725, gold #EDBD5A, cream #FFFAF0); every
   text colour below sits on the app's dark glass and keeps the
   house >= 4.5:1 body-text contrast. */

/* ---- Shared 1-click panel pattern (funnel + SEO forms) ---- */

.oc-panel h2:first-child { margin-top: 0; }

.oc-form fieldset.oc-group {
    border: 1px solid rgba(237, 189, 90, 0.35);
    border-radius: 12px;
    padding: 14px 16px 6px;
    margin: 0 0 16px;
    background: var(--glass-soft);
}
.oc-form fieldset.oc-group legend {
    padding: 0 8px;
    color: var(--gold);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.oc-radio {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 18px 10px 0;
    color: var(--cream);
    cursor: pointer;
}
.oc-radio input[type="radio"] { accent-color: var(--gold); width: 17px; height: 17px; }

.oc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 0 18px;
}

.oc-details {
    border: 1px dashed rgba(237, 189, 90, 0.4);
    border-radius: 12px;
    padding: 10px 16px;
    margin: 0 0 16px;
    background: var(--glass-soft);
}
.oc-details summary {
    cursor: pointer;
    color: var(--gold-bright);
    font-weight: 600;
    padding: 4px 0 8px;
}

.oc-source-url, .oc-airow { margin-bottom: 6px; }

.oc-agent { margin-top: 20px; }
.oc-agent-note { color: var(--navy-muted); }

/* ---- SEO Optimize ---- */

.seo-table { width: 100%; border-collapse: collapse; }
.seo-table th, .seo-table td {
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(255, 250, 240, 0.12);
    color: var(--cream);
    vertical-align: top;
}
.seo-table th { color: var(--gold); font-weight: 600; }

.seo-badge {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--gold-bright), var(--gold));
    color: #2e2303;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.seo-score .seo-findings { list-style: none; padding: 0; margin: 10px 0 0; }
.seo-score .seo-findings li { margin: 0 0 8px; color: var(--cream); }
.seo-finding-badge {
    display: inline-block;
    min-width: 38px;
    text-align: center;
    padding: 1px 6px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    margin-right: 6px;
}
.seo-finding-badge.is-ok { background: rgba(46, 125, 50, 0.35); color: #b9e4bc; border: 1px solid rgba(185, 228, 188, 0.5); }
.seo-finding-badge.is-fix { background: rgba(231, 150, 66, 0.18); color: var(--amber-text); border: 1px solid rgba(231, 150, 66, 0.55); }

.seo-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}
.seo-section-head h2 { margin-top: 0; }

.seo-dl { display: grid; grid-template-columns: 170px 1fr; gap: 6px 16px; margin: 10px 0; }
.seo-dl dt { color: var(--gold); font-weight: 600; }
.seo-dl dd { margin: 0; color: var(--cream); overflow-wrap: anywhere; }
@media (max-width: 640px) {
    .seo-dl { grid-template-columns: 1fr; }
    .seo-dl dt { margin-top: 8px; }
}

.seo-htag {
    display: inline-block;
    padding: 0 6px;
    border: 1px solid rgba(237, 189, 90, 0.55);
    border-radius: 6px;
    color: var(--gold);
    font-size: 0.78rem;
    font-weight: 700;
    margin-right: 4px;
}

.seo-copytext, .seo-code {
    background: var(--glass-input);
    border: 1px solid rgba(255, 250, 240, 0.14);
    border-radius: 10px;
    padding: 12px 14px;
    color: var(--cream);
    font-size: 0.85rem;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-height: 420px;
    overflow-y: auto;
}
