/* =========================================================
   right-panel.css — Right Panel, Health Score, Speed Panel
   MMSEO Crawl & Audit Console
   ========================================================= */

/* ── RIGHT PANEL ── */
.right-panel{
  width:255px;flex-shrink:0;background:var(--white);border-left:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;padding:12px;
}
.rp-section{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:10px;flex-shrink:0;}
.rp-section-inner{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:8px;}
.rp-single{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.rp-divider{border:none;border-top:1px solid var(--border-light);margin:10px 0;flex-shrink:0;}
.rp-title{font-size:10px;font-weight:700;color:var(--text);letter-spacing:.5px;text-transform:uppercase;margin-bottom:6px;}

/* ── DONUT GAUGE ── */
.gauge-wrap{display:flex;justify-content:center;margin-bottom:16px;}

/* ── HEALTH BARS ── */
.hs-bars{display:flex;flex-direction:column;gap:5px;}
.hs-bar-row{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--text-dim);}
.hs-bar-lbl{font-size:9px;font-weight:600;color:var(--text-dim);letter-spacing:.4px;text-transform:uppercase;width:75px;flex-shrink:0;font-weight:600;text-transform:uppercase;letter-spacing:0;}
.hs-bar-track{flex:1;height:5px;background:var(--bg3);border-radius:3px;overflow:hidden;border:none;}
.hs-bar-fill{height:100%;border-radius:3px;transition:width .6s ease;}
.hs-bar-val{font-size:11px;font-weight:700;min-width:34px;text-align:right;flex-shrink:0;font-size:10px;color:var(--text-dim);font-weight:700;}

/* ── HEALTH SCORE CARD (right panel) ── */
.hs-card{background:transparent;border:none;padding:0;}
.hs-card::before{display:none;}
.hs-gauge-wrap{display:flex;flex-direction:column;align-items:center;margin-bottom:8px;}
.hs-score-block{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-10px;margin-bottom:6px;}
.hs-score-num{font-size:24px;font-weight:700;line-height:1;color:var(--text);}
.hs-score-num.good{color:var(--g-green);}
.hs-score-num.fair{color:var(--g-amber);}
.hs-score-num.poor{color:var(--g-red);}
.hs-score-lbl{font-size:11px;color:var(--text-dim);margin-top:2px;}
.hs-footer{display:flex;justify-content:space-between;font-size:10px;color:var(--text-dim);border-top:1px solid var(--border-light);padding-top:8px;margin-top:4px;}
.hs-badge{font-size:9px;padding:2px 8px;border-radius:3px;font-weight:700;}
.hs-badge.good{background:#e6f4ea;color:var(--g-green);border:1px solid #b8d8a0;}
.hs-badge.fair{background:#fef0d8;color:var(--g-amber);border:1px solid #e0c070;}
.hs-badge.poor{background:#fce8e6;color:var(--g-red);border:1px solid #f0b0a8;}
.hs-card-hdr{font-size:10px;letter-spacing:2px;color:var(--text-dim);display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}

/* ── SPEED PANEL ── */
.sp-panel{display:flex;flex-direction:column;flex:1;overflow:hidden;position:relative;}
.sp-hdr{background:var(--white);border-bottom:1px solid var(--border);padding:10px 12px;flex-shrink:0;}
.sp-dd-btn{
  display:flex;align-items:center;justify-content:space-between;
  padding:7px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);
  font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;
  background:var(--white);color:var(--text);user-select:none;
}
.sp-dd-arrow{font-size:9px;color:var(--text-dim);}
.sp-dd-menu{position:absolute;left:12px;right:12px;top:calc(100% + 2px);background:var(--white);border:1px solid var(--border);border-radius:var(--radius-sm);z-index:999;display:none;box-shadow:0 6px 20px rgba(0,0,0,.12);}
.sp-dd-menu.show{display:block;}
.sp-dd-item{padding:9px 12px;font-family:inherit;font-size:12px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .12s;color:var(--text);}
.sp-dd-item:hover{background:var(--bg2);}
.sp-dd-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.sp-gauge{padding:8px 8px 0;flex-shrink:0;}
.sp-hdr-inner{display:none;}
.sp-sec{font-size:10px;font-weight:700;letter-spacing:1.5px;padding:6px 12px;background:var(--bg2);border-bottom:1px solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;color:var(--text-mid);}
.sp-sec-note{font-size:9px;color:var(--text-dim);font-weight:400;}
.sp-scroll{flex:1;overflow-y:auto;min-height:0;}
.sp-row{display:flex;align-items:center;gap:8px;padding:5px 12px;border-bottom:1px solid var(--border-light);font-size:11px;}
.sp-row:nth-child(even){background:var(--bg2);}
.sp-row-url{flex:1;color:var(--forest-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sp-row-ms{color:var(--g-amber);font-weight:700;flex-shrink:0;}
.sp-empty{padding:20px;text-align:center;color:var(--text-dim);font-size:12px;}
.sp-mini-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;padding:8px;}
.sp-mini-stat{background:var(--bg2);border-radius:6px;padding:6px 8px;text-align:center;border:1px solid var(--border-light);}
.sp-mini-v{font-size:16px;font-weight:700;}
.sp-mini-l{font-size:9px;color:var(--text-dim);margin-top:1px;}

/* ── SPEED PANEL EXTRAS ── */
.sp-row-val{font-size:11px;font-weight:700;flex-shrink:0;}
.sp-bar-w{flex:1;height:4px;background:var(--bg3);border-radius:2px;margin:0 8px;}
.sp-bar-f{height:100%;border-radius:2px;transition:width .3s;}
/* PageSpeed score cards */
.sp-sc{text-align:center;padding:8px;background:var(--bg2);border-radius:6px;border:1px solid var(--border);}
.sp-sc-v{font-size:20px;font-weight:700;line-height:1;}
.sp-sc-l{font-size:9px;color:var(--text-dim);margin-top:2px;}
.sp-sc.g .sp-sc-v{color:var(--g-green);}.sp-sc.y .sp-sc-v{color:var(--g-amber);}.sp-sc.r .sp-sc-v{color:var(--g-red);}
/* PageSpeed metrics */
.sp-met{padding:6px 12px;border-bottom:1px solid var(--border-light);}
.sp-met-row{display:flex;justify-content:space-between;font-size:11px;margin-bottom:3px;}
.sp-met-lbl{color:var(--text-mid);}
.sp-met-val{font-weight:700;}
.sp-met-bar{height:4px;background:var(--bg3);border-radius:2px;}
.sp-met-bar-f{height:100%;border-radius:2px;}
.sp-loading{padding:20px;text-align:center;color:var(--text-dim);font-size:12px;}

/* ── CRAWL BREAKDOWN DONUT ── */
.donut-row{display:flex;align-items:center;gap:10px;}
.donut-wrap{position:relative;display:flex;justify-content:center;align-items:center;flex-shrink:0;width:100px;height:100px;}
.donut-center{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;}
.donut-total{font-size:18px;font-weight:700;color:var(--text);line-height:1;}
.donut-label{font-size:9px;color:var(--text-dim);margin-top:2px;text-transform:uppercase;letter-spacing:.5px;}
.donut-legend{display:flex;flex-direction:column;gap:4px;flex:1;}
.donut-leg-row{display:flex;align-items:center;gap:6px;font-size:11px;}
.donut-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.donut-leg-lbl{flex:1;color:var(--text-mid);font-size:9.5px;}
.donut-leg-val{font-weight:700;color:var(--text);min-width:20px;text-align:right;font-size:9.5px;}

/* ── DEPTH DISTRIBUTION ── */
.depth-bars{display:flex;flex-direction:column;gap:5px;}
.depth-row{display:flex;align-items:center;gap:6px;}
.depth-lbl{font-size:9.5px;color:var(--text-dim);width:44px;flex-shrink:0;}
.depth-track{flex:1;height:6px;background:var(--bg3);border-radius:3px;overflow:hidden;}
.depth-fill{height:100%;border-radius:3px;background:var(--forest);opacity:0.75;transition:width .5s ease;}
.depth-val{font-size:9.5px;font-weight:700;color:var(--text);min-width:20px;text-align:right;flex-shrink:0;}