/* ===========================================================================
   Data Processing, LLC — Website Audit  (app-specific styles on top of Porto)
   =========================================================================== */

:root {
    --dp-primary: #cc9900; /* Porto default skin accent; matches main site */
}

/* ---- Hero / audit form ---------------------------------------------------- */
.audit-hero {
    background: linear-gradient(135deg, #1d2127 0%, #2b3038 100%);
    color: #fff;
    padding: 80px 0 90px;
    position: relative;
    overflow: hidden;
}
.audit-hero h1 { color: #fff; font-weight: 800; }
.audit-hero .lead { color: rgba(255,255,255,.82); }
.audit-form-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 24px 60px rgba(0,0,0,.28);
    padding: 26px;
}
.audit-form-card .form-control-lg { height: 56px; font-size: 1.05rem; }

/* ---- Score gauge ---------------------------------------------------------- */
.score-gauge {
    --val: 0;
    --col: #6c757d;
    width: 190px; height: 190px; border-radius: 50%;
    display: grid; place-items: center; margin: 0 auto;
    background:
        radial-gradient(closest-side, #fff 79%, transparent 80% 100%),
        conic-gradient(var(--col) calc(var(--val) * 1%), #e9ecef 0);
}
.score-gauge .score-num { font-size: 3.2rem; font-weight: 800; line-height: 1; color: #23282d; }
.score-gauge .score-max { font-size: 1rem; color: #8a9099; }
.grade-badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 64px; height: 64px; border-radius: 12px;
    font-size: 2rem; font-weight: 800; color: #fff;
}

/* category score bars */
.cat-row { padding: 14px 0; border-bottom: 1px solid #eee; }
.cat-row:last-child { border-bottom: 0; }
.cat-icon { width: 42px; height: 42px; border-radius: 9px; display: grid; place-items: center; color:#fff; font-size: 1.05rem; }
.cat-bar { height: 8px; background:#edeff2; border-radius: 6px; overflow: hidden; }
.cat-bar > span { display:block; height:100%; border-radius:6px; }

/* ---- Findings ------------------------------------------------------------- */
.finding { border-left: 4px solid #dee2e6; background:#fff; border-radius: 6px; padding: 16px 18px; margin-bottom: 12px; box-shadow: 0 2px 6px rgba(0,0,0,.05); }
.finding.sev-critical { border-left-color:#dc3545; }
.finding.sev-high     { border-left-color:#e8590c; }
.finding.sev-medium   { border-left-color:#f0ad4e; }
.finding.sev-low      { border-left-color:#0dcaf0; }
.finding.sev-good     { border-left-color:#28a745; }
.finding .finding-title { font-weight: 700; margin: 0; }
.finding .finding-rec { background:#f8f9fa; border-radius:6px; padding:10px 12px; margin-top:10px; font-size:.92rem; }
.sev-pill { font-size:.7rem; letter-spacing:.03em; text-transform:uppercase; font-weight:700; padding:3px 9px; border-radius:20px; }

/* ---- Report progress overlay --------------------------------------------- */
#auditProgress { display:none; }
.progress-checks li { padding: 6px 0; color:#8a9099; transition: color .3s; }
.progress-checks li.done { color:#28a745; }
.progress-checks li.active { color:#23282d; font-weight:600; }

/* ---- Admin ---------------------------------------------------------------- */
.admin-body { background:#f4f6f9; }
/* Porto's theme.css redefines .bg-primary/.bg-secondary/.bg-dark (and text-color-*) with
   skin variables — var(--primary) etc. — that only the public site's skin css defines.
   The admin layout loads no skin, so badges/progress segments rendered transparent with
   white text (invisible). Define the base skin variables for the admin shell. */
.admin-body { --primary:#0d6efd; --secondary:#6c757d; --tertiary:#0dcaf0; --quaternary:#383f48; --dark:#212529; --light:#f8f9fa; }
.admin-navbar { background:#23282d; padding:.6rem 1rem; }
.admin-navbar .navbar-brand, .admin-navbar .nav-link { color:#e9ecef !important; }
.admin-navbar .nav-link.active { color:#ffc107 !important; }
.admin-navbar .nav-link:hover { color:#fff !important; }
.stat-card { background:#fff; border-radius:10px; padding:20px; box-shadow:0 2px 10px rgba(0,0,0,.05); }
.stat-card .stat-num { font-size:2rem; font-weight:800; }
.admin-card { background:#fff; border-radius:10px; box-shadow:0 2px 10px rgba(0,0,0,.05); }
.table-sm td, .table-sm th { vertical-align: middle; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size:.85rem; }
.badge-grade-A,.badge-grade-B{background:#28a745}
.badge-grade-C,.badge-grade-D{background:#f0ad4e;color:#23282d}
.badge-grade-F{background:#dc3545}