/* ========================================
   sales-visit.css  -  来店属性（売上ビューの5つ目のタブ）/ PitFlow v2.59.0
   ⚠ 見た目は売上ビュー（sales.css の sv-*）を借りている。ここに置くのはこの画面だけの部品。
   ⚠ クラスの頭は vst-。
   🔴 **色は必ずここ（css）で持つ。js に直書きしない**（test_pit_rules.mjs ③ に引っかかる）。
      リピーター＝青／一見＝オレンジ＝**色が見分けられない人でも分かれる組み合わせ**（青とオレンジ）。
      ⚠ 色だけで意味を運ばないよう、バーの下に必ず名前と台数と％を出している。
   ======================================== */

/* 比率のバー（2つに割るだけ） */
.vst-bars{ display:flex; gap:22px; flex-wrap:wrap; padding:6px 2px 2px; }
.vst-bwrap{ flex:1 1 300px; min-width:260px; }
.vst-btl{ font-size:11px; font-weight:700; color:var(--text3); margin-bottom:6px; }
.vst-bar{ display:flex; height:16px; border-radius:999px; overflow:hidden; background:var(--bg3); gap:2px; }
.vst-bar i{ display:block; height:100%; }
.vst-bar .vst-a{ background:var(--blue,#378ADD); }
.vst-bar .vst-b{ background:#f59e0b; }
.vst-bar.ky .vst-a{ background:var(--green,#1db97a); }
.vst-bar.ky .vst-b{ background:#ec4899; }
.vst-bar-empty{ font-size:12px; color:var(--text3); padding:6px 0; }
.vst-lg{ display:flex; gap:18px; flex-wrap:wrap; margin-top:7px; font-size:12px; color:var(--text2); }
.vst-lg b{ color:var(--text); margin:0 1px; }
.vst-sw{ display:inline-block; width:9px; height:9px; border-radius:3px; margin-right:5px; }
.vst-lg span:nth-child(1) .vst-sw-a{ background:var(--blue,#378ADD); }
.vst-lg span:nth-child(2) .vst-sw-b{ background:#f59e0b; }
.vst-bwrap:nth-child(2) .vst-lg span:nth-child(1) .vst-sw-a{ background:var(--green,#1db97a); }
.vst-bwrap:nth-child(2) .vst-lg span:nth-child(2) .vst-sw-b{ background:#ec4899; }

/* ヒーローの数字 */
.vst-num-a{ color:var(--blue,#378ADD); }
.vst-num-dom{ color:var(--green,#1db97a); }

/* 表 */
.vst-tbl th small{ display:block; font-size:9.5px; font-weight:400; color:var(--text3); }
.vst-tbl td.vst-tot{ background:rgba(255,255,255,.04); font-weight:800; }
.vst-tbl tr.vst-rep td:first-child{ border-left:3px solid var(--blue,#378ADD); }
.vst-tbl tr.vst-first td:first-child{ border-left:3px solid #f59e0b; }
.vst-tbl tr.vst-dom td:first-child{ border-left:3px solid var(--green,#1db97a); }
.vst-tbl tr.vst-imp td:first-child{ border-left:3px solid #ec4899; }
.vst-tbl tr.vst-sum td{ font-weight:800; }
.vst-tbl tr.vst-grand td{ font-weight:800; border-top:2px solid var(--border2,#444870); }

.vst-none{ color:var(--text3); opacity:.6; }

/* 🔴 v2.59.1 スライド＝売上日が前の月なのに返車が今月＝この月に作った仕事ではない */
.vst-tbl tr.vst-slide td:first-child{ border-left:3px solid #a78bfa; }
.vst-tbl tr.vst-slide td{ color:var(--text2); }
.vst-slide-n{ color:#a78bfa; }

/* 🔴 v2.61.0 未チェック＝札を選んでいないもの。0にする対象なので、グレーで静かに、でも必ず見える */
.vst-bar .vst-c{ background:var(--text3); }
.vst-lg .vst-sw-c{ background:var(--text3); }
.vst-tbl tr.vst-none-row td:first-child{ border-left:3px solid var(--text3); }
.vst-tbl tr.vst-none-row td{ color:var(--text2); }
.vst-none-n{ color:#f59e0b; }

/* 0にする対象の一覧 */
.vst-fix{ margin-top:10px; padding:10px 12px; border:1px solid rgba(245,158,11,.35);
  border-radius:10px; background:rgba(245,158,11,.06); }
.vst-fix-h{ font-size:11.5px; font-weight:800; color:#f59e0b; margin-bottom:5px; }
.vst-fix ul{ margin:0; padding-left:18px; }
.vst-fix li{ font-size:12.5px; line-height:1.8; color:var(--text2); }
.vst-fix li b{ color:var(--text); }
.vst-fix li span{ display:block; font-size:11.5px; color:var(--text3); }
.vst-fix-n{ color:#f59e0b !important; }
.vst-fix-ok{ border-color:rgba(29,185,122,.35); background:rgba(29,185,122,.07); font-size:12.5px; color:var(--text2); }