/* =========================================================
   DARK MODE — กลุ่ม Marketplace ฝั่งศิลปิน
   /app/market/* (บีท · Shopping) · /app/services/* · /app/seller/* · /app/checkout* · /app/affiliate*
   - โหลดต่อจาก dark.css ตามลำดับชื่อไฟล์ · ใช้ token --fb-* จาก dark.css เท่านั้น
   - ต้นเหตุหลัก: CSS ของหน้า (beat_web · mk_beats* · seller_beats · services_market · shop · slip_checkout · affiliate)
     ใช้ var(--brand) / rgba(var(--brand-rgb),x) (#03338a) เป็น "สีตัวหนังสือ/ไอคอน" ซึ่ง dark_auto.css ไม่แปลง
     → น้ำเงินเข้มบนพื้นมืดมองไม่เห็น → ไฟล์นี้เปลี่ยนเป็น --fb-accent (ฟ้าอ่านได้)
   - ไอคอนแทนปก/รูปที่ยังไม่มี (placeholder) → เทาอ่อน --fb-text3 บนพื้น --fb-card2 (แบบ Facebook)
   - หัวเพจน้ำเงิน (bw_hero · sp-hero · svc-hero · sv-hero · slp-hero) + ปุ่มขาวทึบบนหัวเพจ = ตั้งใจ ไม่แตะ
   - สถานะบวกเป็นน้ำเงิน (ห้ามเขียว) · เหลือง = เตือน · แดง = อันตราย
   ========================================================= */

/* ── 1) ตัวหนังสือ/ไอคอนที่ใช้น้ำเงินแบรนด์ → ฟ้าอ่านได้ ───────────────────── */
/* Beat (beat_web.css · mk_beats*.css · seller_beats.css) */
html[data-theme="dark"] .bw .bw-meta i.bi,
html[data-theme="dark"] .bw .bw-fact__k i.bi,
html[data-theme="dark"] .bw .bw-kv__k i.bi,
html[data-theme="dark"] .bw .bw-spec i.bi,
html[data-theme="dark"] .bw .bw-tag i.bi,
html[data-theme="dark"] .bw-tag,
html[data-theme="dark"] .bw-fact__v.is-price,
html[data-theme="dark"] .bw-price,
html[data-theme="dark"] .bw-kv.is-total .bw-kv__v,
html[data-theme="dark"] .bw-note > i.bi,
html[data-theme="dark"] .bw .bw-file__ic i.bi,
html[data-theme="dark"] .bw-file__ic i.bi,
html[data-theme="dark"] .bw .ck-steps__hint > i.bi,
html[data-theme="dark"] .bw .ck-drop__label > i.bi,
html[data-theme="dark"] .ck-drop__label b,
html[data-theme="dark"] .ck-accno,
html[data-theme="dark"] .co-item__meta > span > i,
html[data-theme="dark"] .co-note > i,
html[data-theme="dark"] .co-acc__bank > i,
html[data-theme="dark"] .co-acc__no,
html[data-theme="dark"] .mk-label .bi,
html[data-theme="dark"] .mk-ig .input-group-text,
html[data-theme="dark"] .mk-dd__label .bi,
html[data-theme="dark"] .mk-dd .dropdown-item i,
html[data-theme="dark"] .mk-mobilebar .input-group-text,
html[data-theme="dark"] .bv-fmeta__ext,
html[data-theme="dark"] .bv-fmeta__left,
html[data-theme="dark"] .bw .bv-notes > li > i.bi,
html[data-theme="dark"] .bw .bo-av i.bi,
html[data-theme="dark"] .bw .mk-buy__pay i.bi,
html[data-theme="dark"] .bw .mk-inc-list li > i.bi,
html[data-theme="dark"] .mk-buybar .mk-buybar__label i.bi,
html[data-theme="dark"] .modal .sb-pill i.bi,
html[data-theme="dark"] .sb-form .form-label > i.bi:first-child,
html[data-theme="dark"] .sb-form .sb-status-btn #sbStatusLabel i.bi,
html[data-theme="dark"] .sb-form .sb-hintline i.bi,
html[data-theme="dark"] .sb-form .sb-current i.bi,
html[data-theme="dark"] .sb-form .sb-files__k i.bi,
html[data-theme="dark"] .bw .sb-pv__k i.bi,
html[data-theme="dark"] .sd-page .mk-seller-detail__label i.bi,
html[data-theme="dark"] .mk-seller-tags span,
html[data-theme="dark"] .mk-seller-links a,
html[data-theme="dark"] .sd-page .mk-seller-tags span i.bi,
html[data-theme="dark"] .sd-page .mk-seller-links a i.bi,
/* Services (services_market.css) */
html[data-theme="dark"] .svc-ig .input-group-text,
html[data-theme="dark"] .svc-hint .bi,
html[data-theme="dark"] .mkt-badge,
/* Shopping (shop.css) */
html[data-theme="dark"] .shop-note > i,
html[data-theme="dark"] .shop-store-chip i,
html[data-theme="dark"] .shop-filter .input-group-text i,
html[data-theme="dark"] .shop-afilter .input-group-text i,
html[data-theme="dark"] .shop-hint i,
html[data-theme="dark"] .shop-card__price b,
html[data-theme="dark"] .shop-detail__price b,
html[data-theme="dark"] .shop-detail__buyhead i,
html[data-theme="dark"] .shop-detail__deschead i,
html[data-theme="dark"] .shop-related__head i,
html[data-theme="dark"] .shop-sub i,
html[data-theme="dark"] .shop-storerow__price,
html[data-theme="dark"] .shop-catnav__head i,
html[data-theme="dark"] .shop-catnav__item i,
html[data-theme="dark"] .shop-storeline__copy,
html[data-theme="dark"] .shop-storeline__copy i,
html[data-theme="dark"] .shop-help > i,
html[data-theme="dark"] .shop-field__label i,
/* ชวนเพื่อน (affiliate.css) */
html[data-theme="dark"] .aff-kpi__badge,
html[data-theme="dark"] .aff-chip,
html[data-theme="dark"] .aff-soft-badge,
html[data-theme="dark"] .aff-code,
html[data-theme="dark"] .aff-step__no,
html[data-theme="dark"] .aff-empty__icon {
  color: var(--fb-accent) !important;
}

/* ไอคอนหัวข้อข้อมูลบีท (เดิมจาง opacity .7 = น้ำเงินขุ่นบนการ์ดมืด) */
html[data-theme="dark"] .bw .bw-fact__k i.bi { opacity: 1; }

/* ชิป/ป้ายพื้นอ่อนของแบรนด์ → พื้นฟ้าโปร่ง + ขอบฟ้าจาง (แบบชิป Facebook) */
html[data-theme="dark"] .bw-tag,
html[data-theme="dark"] .mkt-badge,
html[data-theme="dark"] .aff-chip,
html[data-theme="dark"] .aff-soft-badge,
html[data-theme="dark"] .aff-code,
html[data-theme="dark"] .aff-step__no,
html[data-theme="dark"] .aff-kpi__badge,
html[data-theme="dark"] .mk-seller-tags span {
  background: var(--fb-accent-soft) !important;
  border-color: rgba(69, 153, 255, 0.28) !important;
}

/* ชิปเทา (แท็กรอง · รหัสบีท) */
html[data-theme="dark"] .bw-tag--muted,
html[data-theme="dark"] .bw .bw-tag--muted i.bi,
html[data-theme="dark"] .bw-id {
  color: var(--fb-text2) !important;
}
html[data-theme="dark"] .bw-tag--muted,
html[data-theme="dark"] .bw-id {
  background: var(--fb-card2) !important;
  border-color: var(--fb-line) !important;
}

/* ปุ่มรองในแถวรายการ (แก้ไข · รายละเอียด · ดูหน้าร้าน) — คงปุ่มหลัก/อันตรายไว้ตามเดิม */
html[data-theme="dark"] .bw-act:not(.is-primary):not(.is-danger),
html[data-theme="dark"] .bw .bw-act:not(.is-primary):not(.is-danger) i.bi {
  color: var(--fb-accent) !important;
}
html[data-theme="dark"] .bw-act:not(.is-primary):not(.is-danger) {
  background: var(--fb-card2) !important;
  border-color: var(--fb-line) !important;
}
html[data-theme="dark"] .bw-act:not(.is-primary):not(.is-danger):hover,
html[data-theme="dark"] .bw .bw-act:not(.is-primary):not(.is-danger):hover i.bi {
  color: #fff !important;
}
html[data-theme="dark"] .bw-act:not(.is-primary):not(.is-danger):hover {
  background: var(--fb-accent-strong) !important;
  border-color: var(--fb-accent-strong) !important;
}
html[data-theme="dark"] .bw-act.is-danger,
html[data-theme="dark"] .bw .bw-act.is-danger i.bi { color: var(--fb-danger) !important; }
html[data-theme="dark"] .bw-act.is-danger { background: var(--fb-danger-soft) !important; border-color: rgba(255, 107, 107, 0.3) !important; }

/* ลิงก์ hover ที่เดิมเป็นน้ำเงินเข้ม */
html[data-theme="dark"] a.bw-title:hover,
html[data-theme="dark"] .bw-meta > a:hover,
html[data-theme="dark"] .mk-producer:hover { color: var(--fb-accent) !important; }

/* ── 2) ปก/รูปที่ยังไม่มี (placeholder) → พื้นเทา + ไอคอนเทาอ่อน ──────────── */
html[data-theme="dark"] .bw-cover,
html[data-theme="dark"] .bw-card__cover,
html[data-theme="dark"] .bw-confirm__cover,
html[data-theme="dark"] .co-item__cover,
html[data-theme="dark"] .mk-detail-cover--empty {
  background: var(--fb-card2) !important;
  border-color: var(--fb-line) !important;
}
html[data-theme="dark"] .bw .bw-cover > i.bi,
html[data-theme="dark"] .bw .bw-card__cover > i.bi,
html[data-theme="dark"] .bw-confirm__cover > i.bi,
html[data-theme="dark"] .co-item__cover > i,
html[data-theme="dark"] .bw .mk-detail-cover--empty i.bi,
html[data-theme="dark"] .bw .mk-bcard__empty i.bi,
html[data-theme="dark"] .sb-form .sb-up-preview__ph i.bi,
html[data-theme="dark"] .mkt-cover-ph,
html[data-theme="dark"] .mkt-cover-ph i,
html[data-theme="dark"] .bw .mk-producer i.bi {
  color: var(--fb-text3) !important;
}

/* ── 3) ข้อความเตือน/เหตุผลไม่ผ่านตรวจ ──────────────────────────────────── */
html[data-theme="dark"] .sb-reason { color: var(--fb-danger) !important; }

/* ── 4) Services ───────────────────────────────────────────────────────── */
html[data-theme="dark"] .svc-hint,
html[data-theme="dark"] .mkt-meta { color: var(--fb-text2) !important; }
html[data-theme="dark"] .mkt-card { border-color: var(--fb-line) !important; }

/* ── 5) Shopping ───────────────────────────────────────────────────────── */
html[data-theme="dark"] .shop-hint { color: var(--fb-text2) !important; }
/* สีประจำร้านใช้เป็น "พื้น" ของไอคอนขาว → คืนสีแบรนด์จริงของร้าน (dark_auto ทำให้อ่อนจนไอคอนขาวมองไม่เห็น) */
html[data-theme="dark"] .shop-page,
html[data-theme="dark"] .shop-admin {
  --shop-shopee: #ee4d2d !important;
  --shop-lazada: #3b44d6 !important;
  --shop-tiktok: #000000 !important;
}
/* ตัวหนังสือ/ไอคอนบนพื้นมืดที่ใช้สีร้านเป็น "สีตัวหนังสือ" → ใช้โทนสว่างแทน */
html[data-theme="dark"] .shop-store-chip--shopee i { color: #ff8a6b !important; }
html[data-theme="dark"] .shop-store-chip--lazada i { color: #8f95ff !important; }
html[data-theme="dark"] .shop-store-chip--tiktok i { color: var(--fb-text) !important; }
/* TikTok ดำบนพื้นมืด → มีขอบเส้นให้เห็นรูปทรง */
html[data-theme="dark"] .shop-dot--tiktok,
html[data-theme="dark"] .shop-storerow--tiktok .shop-storerow__ic {
  box-shadow: inset 0 0 0 1px var(--fb-hover) !important;
}

/* ── 6) ชวนเพื่อน ─────────────────────────────────────────────────────── */
/* ลิงก์แนะนำ (code) — Bootstrap ใช้ชมพู → ตัวหนังสือหลัก */
html[data-theme="dark"] .aff-page code,
html[data-theme="dark"] .aff-page .yd-url-text { color: var(--fb-text) !important; }
html[data-theme="dark"] .aff-table-head { border-bottom-color: var(--fb-line) !important; }
html[data-theme="dark"] .aff-table-head--soft { background: rgba(255, 255, 255, 0.03) !important; }
/* แถวที่ปิดแล้ว (หมดเวลา/ยกเลิก) จางพอให้รู้ แต่ข้อความยังอ่านได้ */
html[data-theme="dark"] .bw-row.is-muted { opacity: 0.86; }
/* ชิปในหัวเพจน้ำเงิน (.aff-hero) คงแบบกระจกขาว — ไม่ใช้ชิปฟ้าของการ์ดด้านบน */
html[data-theme="dark"] .aff-hero :is(.aff-chip, .aff-soft-badge, .aff-code),
html[data-theme="dark"] .aff-hero :is(.aff-chip, .aff-soft-badge, .aff-code) i.bi {
  color: #fff !important;
}
html[data-theme="dark"] .aff-hero :is(.aff-chip, .aff-soft-badge, .aff-code) {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

/* ── 7) ชิปตัวเล็ก (.72–.8rem) ต้องผ่าน 4.5:1 → ตัวหนังสือสว่าง ไอคอนฟ้า (แบบชิป Facebook) ── */
html[data-theme="dark"] .bw-tag,
html[data-theme="dark"] .bw .bw-tag,
html[data-theme="dark"] .mkt-badge,
html[data-theme="dark"] .aff-code,
html[data-theme="dark"] .aff-soft-badge,
html[data-theme="dark"] .aff-step__no,
html[data-theme="dark"] .mk-seller-tags span,
html[data-theme="dark"] .ck-drop__label b {
  color: var(--fb-text) !important;
}
html[data-theme="dark"] .bw .bw-tag.bw-tag--muted,
html[data-theme="dark"] .bw .bw-tag.bw-tag--muted i.bi,
html[data-theme="dark"] .bw .bw-id {
  color: var(--fb-text2) !important;
  opacity: 1 !important;
}
/* ปุ่มรองในแถว: พื้นการ์ด + ขอบเส้น → ฟ้าบนการ์ด 6:1 */
html[data-theme="dark"] .bw-act:not(.is-primary):not(.is-danger) {
  background: transparent !important;
}
/* ไอคอนแทนปก: เทารองให้เห็นรูปทรง */
html[data-theme="dark"] .bw .bw-cover > i.bi,
html[data-theme="dark"] .bw .bw-card__cover > i.bi,
html[data-theme="dark"] .co-item__cover > i { color: var(--fb-text2) !important; }
html[data-theme="dark"] .sb-reason { color: var(--fb-text) !important; }

/* ── 8) ข้อความรองในหัวเพจน้ำเงิน: ขาวเกือบทึบ อ่านชัดทุกจุดของพื้นไล่สี ── */
html[data-theme="dark"] :is(.svc-hero .svc-metric__top, .sp-hero .sp-metric__top),
html[data-theme="dark"] :is(.svc-hero .svc-metric__top, .sp-hero .sp-metric__top) > span,
html[data-theme="dark"] :is(.sv-hero, .slp-hero) .text-muted,
html[data-theme="dark"] :is(.sv-hero, .slp-hero) .text-muted > span {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* รอบตรวจสุดท้าย: รหัสบีทบนชิปเทา (4.39 → 5.7) · ป้ายปุ่มรองในแถวบีท (4.29 → 6.0) */
html[data-theme="dark"] .bw-tags .bw-id { color: var(--fb-text2) !important; background: var(--fb-card2) !important; }
html[data-theme="dark"] .bw-act .bw-act__lbl { color: var(--fb-accent) !important; }

/* ป้ายของปุ่มหลักในแถวบีท (พื้นน้ำเงินแบรนด์) ต้องเป็นขาว — กฎ .bw-act__lbl ด้านบนใช้กับปุ่มรองเท่านั้น */
html[data-theme="dark"] .bw-act.is-primary .bw-act__lbl,
html[data-theme="dark"] .bw-act.is-primary .bi { color: #fff !important; }
html[data-theme="dark"] .bw-act.is-primary { background: var(--fb-accent-strong) !important; border-color: var(--fb-accent-strong) !important; }

/* รอบตรวจสุดท้าย: ข้อความเล็กที่ต่ำกว่า 4.5:1 */
html[data-theme="dark"] .bw-tags .bw-id { color: #c9ccd0 !important; }
html[data-theme="dark"] .bw-act:not(.is-primary) .bw-act__lbl { color: #6cb0ff !important; }
html[data-theme="dark"] .vip-plan__name small,
html[data-theme="dark"] .vip-offer__price small { color: #d6d8dc !important; }