/**
 * WorkCampConnect — Site Intel Styles
 * /assets/css/site-intel.css
 *
 * Styles for Site Intel Reports on job listing pages.
 */

/* ═══════════════════════════════════════════
   SITE INTEL SECTION
   ═══════════════════════════════════════════ */

.site-intel {
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 1px solid var(--color-border, rgba(255,255,255,0.08));
}

.si-count {
    display: inline-block;
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-bold, 700);
    background: var(--color-accent, #E8AC25);
    color: var(--color-text-on-accent, #0b1e2d);
    padding: 1px 8px;
    border-radius: var(--radius-pill, 9999px);
    margin-left: var(--space-2);
    vertical-align: middle;
}

.si-count:empty { display: none; }

/* ── Compatibility Badge ── */
.si-compat {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-base, 8px);
    margin-bottom: var(--space-4);
}

.si-compat--green {
    background: rgba(67, 142, 37, 0.12);
    border: 1px solid rgba(67, 142, 37, 0.3);
}
.si-compat--yellow {
    background: rgba(232, 172, 37, 0.12);
    border: 1px solid rgba(232, 172, 37, 0.3);
}
.si-compat--red {
    background: rgba(217, 37, 22, 0.12);
    border: 1px solid rgba(217, 37, 22, 0.3);
}

.si-compat__icon {
    font-size: 2rem;
    flex-shrink: 0;
}
.si-compat__body { flex: 1; }
.si-compat__title {
    font-size: var(--font-size-base, 16px);
    font-weight: var(--font-weight-bold, 700);
    margin-bottom: 2px;
}
.si-compat--green .si-compat__title { color: #5cb838; }
.si-compat--yellow .si-compat__title { color: var(--color-accent, #E8AC25); }
.si-compat--red .si-compat__title { color: #e04030; }

.si-compat__detail {
    font-size: var(--font-size-sm, 14px);
    color: var(--color-text-muted, rgba(255,255,255,0.6));
    line-height: 1.5;
}
.si-compat__detail li {
    list-style: none;
    padding: 2px 0;
}
.si-compat__detail li::before {
    margin-right: 4px;
}

.si-compat__score {
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-semibold, 600);
    color: var(--color-text-muted);
    margin-top: var(--space-1);
}

/* ── No Rig Profile Prompt ── */
.si-no-rig {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-base, 8px);
    background: rgba(232, 172, 37, 0.08);
    border: 1px solid rgba(232, 172, 37, 0.2);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm, 14px);
}
.si-no-rig__icon { font-size: 1.5rem; flex-shrink: 0; }
.si-no-rig a { color: var(--color-accent, #E8AC25); }
.si-no-rig a:visited { color: var(--color-accent, #E8AC25); }

/* ── Summary ── */
.si-summary {
    margin-bottom: var(--space-4);
}

.si-summary__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.si-stat {
    padding: var(--space-3);
    background: var(--color-surface, rgba(255,255,255,0.04));
    border-radius: var(--radius-base, 8px);
    text-align: center;
}
.si-stat__label {
    font-size: var(--font-size-xs, 12px);
    color: var(--color-text-muted, rgba(255,255,255,0.6));
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.si-stat__value {
    font-size: var(--font-size-lg, 18px);
    font-weight: var(--font-weight-bold, 700);
    color: var(--color-heading, #fff);
}

.si-stars {
    color: var(--color-accent, #E8AC25);
    letter-spacing: 2px;
}
.si-stars--dim { opacity: 0.3; }

.si-confidence {
    display: inline-block;
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-semibold, 600);
    padding: 2px 8px;
    border-radius: var(--radius-pill, 9999px);
    margin-bottom: var(--space-3);
}
.si-confidence--high { background: rgba(67,142,37,0.2); color: #5cb838; }
.si-confidence--medium { background: rgba(232,172,37,0.2); color: var(--color-accent); }
.si-confidence--low { background: var(--color-surface-raised); color: var(--color-text-muted); }
.si-confidence--very_low { background: var(--color-surface); color: var(--color-text-muted); }

/* Hazard pills */
.si-hazards {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: var(--space-3);
}
.si-hazard-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-semibold, 600);
    padding: 3px 10px;
    border-radius: var(--radius-pill, 9999px);
    background: rgba(217, 37, 22, 0.12);
    color: #e04030;
}
.si-hazard-pill__pct {
    opacity: 0.7;
    font-weight: normal;
}

/* ── Detailed Reports ── */
.si-reports__title {
    font-size: var(--font-size-base, 16px);
    font-weight: var(--font-weight-bold, 700);
    color: var(--color-heading, #fff);
    margin-bottom: var(--space-3);
}

.si-report-card {
    padding: var(--space-4);
    background: var(--color-surface, rgba(255,255,255,0.04));
    border-radius: var(--radius-base, 8px);
    margin-bottom: var(--space-3);
    border: 1px solid var(--color-border, rgba(255,255,255,0.08));
}

.si-report-card__header {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.si-report-card__avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--color-primary, #3a8abf);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-bold, 700);
    color: var(--color-text);
    flex-shrink: 0;
}

.si-report-card__meta {
    flex: 1;
}
.si-report-card__author {
    font-weight: var(--font-weight-semibold, 600);
    font-size: var(--font-size-sm, 14px);
}
.si-report-card__date {
    font-size: var(--font-size-xs, 12px);
    color: var(--color-text-muted);
}
.si-report-card__badge {
    display: inline-block;
    font-size: 10px;
    font-weight: var(--font-weight-bold, 700);
    padding: 1px 6px;
    border-radius: var(--radius-pill, 9999px);
    background: rgba(67,142,37,0.15);
    color: #5cb838;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-left: var(--space-2);
}

.si-report-card__notes {
    font-size: var(--font-size-sm, 14px);
    color: var(--color-text, #fff);
    line-height: 1.5;
    margin-top: var(--space-2);
    padding-top: var(--space-2);
    border-top: 1px solid var(--color-border, rgba(255,255,255,0.06));
}

.si-report-card__flag {
    margin-top: var(--space-2);
    text-align: right;
}
.si-report-card__flag-btn {
    background: none;
    border: none;
    font-size: var(--font-size-xs, 12px);
    color: var(--color-text-muted);
    cursor: pointer;
    padding: 2px 6px;
}
.si-report-card__flag-btn:hover { color: #e04030; }

/* ── Upgrade Prompt ── */
.si-upgrade {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-base, 8px);
    background: rgba(58, 138, 191, 0.08);
    border: 1px solid rgba(58, 138, 191, 0.2);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm, 14px);
}
.si-upgrade__icon { font-size: 1.5rem; flex-shrink: 0; }

/* ── Empty State ── */
.si-empty {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-base, 8px);
    background: var(--color-surface, rgba(255,255,255,0.04));
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm, 14px);
    color: var(--color-text-muted);
}
.si-empty__icon { font-size: 1.5rem; flex-shrink: 0; }

/* ── Submit Bar ── */
.si-submit-bar {
    margin-top: var(--space-3);
}
.si-submit-bar__note {
    display: block;
    margin-top: var(--space-2);
    font-size: var(--font-size-xs, 12px);
    color: var(--color-text-muted);
    font-style: italic;
}

/* ── Form ── */
.si-form-wrap {
    margin-top: var(--space-4);
    padding: var(--space-5);
    background: var(--color-surface, rgba(255,255,255,0.04));
    border-radius: var(--radius-lg, 12px);
    border: 1px solid var(--color-border, rgba(255,255,255,0.08));
}
.si-form-wrap__title {
    font-size: var(--font-size-lg, 18px);
    font-weight: var(--font-weight-bold, 700);
    margin-bottom: var(--space-4);
    color: var(--color-heading, #fff);
}

.si-fieldset {
    border: 1px solid var(--color-border, rgba(255,255,255,0.08));
    border-radius: var(--radius-base, 8px);
    padding: var(--space-4);
    margin-bottom: var(--space-4);
}
.si-fieldset legend {
    font-weight: var(--font-weight-bold, 700);
    font-size: var(--font-size-sm, 14px);
    color: var(--color-accent, #E8AC25);
    padding: 0 var(--space-2);
}

.si-radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-2);
}
.si-radio {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-sm, 14px);
    cursor: pointer;
}

.si-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--space-2);
    margin-top: var(--space-2);
}

/* Star rating input */
.si-star-input {
    display: flex;
    gap: 4px;
    margin-top: 4px;
}
.si-star-input__star {
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--color-text-muted);
    transition: color 0.1s;
    user-select: none;
}
.si-star-input__star.is-active,
.si-star-input__star:hover {
    color: var(--color-accent, #E8AC25);
}

.si-form-actions {
    display: flex;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.si-form-msg {
    margin-top: var(--space-3);
    font-size: var(--font-size-sm, 14px);
    font-weight: var(--font-weight-semibold, 600);
}
.si-form-msg--success { color: #5cb838; }
.si-form-msg--error { color: #e04030; }

/* ── Responsive ── */
@media (max-width: 600px) {
    .si-summary__grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .si-checkbox-grid {
        grid-template-columns: 1fr;
    }
    .si-radio-group {
        flex-direction: column;
    }
    .si-compat {
        flex-direction: column;
        text-align: center;
    }
}