/* =========================================================
   YD DISTRIBUTION — Dark Page Heroes (V68.7.8.274)
   ทำให้หัวเพจทุกตระกูลที่ไม่ใช่ .yd-hero เป็นโทนน้ำเงินไล่สี
   ชุดเดียวกับ .yd-bhero (token --yd-blue-grad ใน app.css :root)
   .yd-hero คุมที่ yd_hero.css · ไฟล์นี้คุมตระกูลอื่นทั้งหมด
   ใช้ html:root นำหน้า เพื่อชนะ CSS extracted/หน้า ที่โหลดทีหลัง

   ตระกูลที่คุม (H):
     .yd-admin-hero ........ /admin/dashboard · releases · qc · support · users · approvals · akas · traffic · /app/dashboard
     .acc-hero ............. /admin/revenue/*
     .sp-hero .............. Marketplace (partial mk_hero.php)
     .aff-hero ............. /app/affiliate + /admin/affiliate*
     .mk-approval-hero ..... /admin/services/approvals · beat-approvals
     .mk-orders-hero · .mk-cat-hero · .mk-settings-hero ...... /admin/services/*
     .mk-market-home-hero .. /admin/system/marketplace
     .mk-seller-hero ....... /app/seller/apply
     .yd-dash .dash-hero ... /admin/finance/{payout-requests,payout,wallets,wallet-credits,statements} · /app/finance/payout
     .fin-admin-hero ....... /admin/finance
     .co-hero .............. /app/checkout · /app/checkout/list
     .svc-hero · .sv-hero · .slp-hero ..... /app/services · /view · /seller
     .yd-bc-hero ........... /admin/system/broadcasts
     .yd-artists-hero ...... /app/settings/artists

   หลักการ:
     พื้น = var(--yd-blue-grad) · ตัวหนังสือขาว · รอง = ขาว 75%
     icon tile / chip / ปุ่มรอง = กระจกขาวจาง · ปุ่มหลัก + ป้ายสถานะ + ช่องกรอก = ขาวทึบตัวน้ำเงิน
     การ์ดสถิติขาวที่อยู่ "ใน" hero (WHITE) คงเป็นการ์ดขาวเหมือนเดิม
     ห่อด้วย @media screen → ตอนพิมพ์ (งบ P&L ฯลฯ) ใช้หน้าตาเดิมพื้นขาว
   ========================================================= */

@media screen {

/* ---------------------------------------------------------
   1) กรอบ hero
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero) {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: var(--yd-blue-grad) !important;
  border: 0 !important;
  box-shadow: var(--yd-blue-shadow) !important;
}
/* svc-hero มีแถบค้นหา + dropdown ซ้อนอยู่ข้างใน — ห้ามตัดขอบ (ของเดิม overflow:visible) */
html:root .svc-hero { overflow: visible; }

/* ลายวงแหวนจาง ๆ มุมขวาล่าง (แทนวงกลม/จุดสีฟ้าเดิมที่ไม่เข้ากับพื้นเข้ม) */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)::after {
  content: "";
  position: absolute;
  inset: auto -70px -130px auto;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: none;
  border: 36px solid rgba(255, 255, 255, .05);
  pointer-events: none;
  z-index: 0;
}
html:root .sp-hero::before,
html:root .svc-hero::before,
html:root .svc-hero .yd-icon-badge::after { display: none; }

html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero) > * {
  position: relative;
  z-index: 1;
}

/* ---------------------------------------------------------
   2) ตัวหนังสือ
   --------------------------------------------------------- */
html:root :is(
  .yd-admin-hero:not(.is-light) .yd-admin-hero__title, .acc-hero__title, .sp-hero .sp-title,
  .aff-hero .yd-hero__title, .aff-hero h3,
  .mk-approval-hero__title, .mk-orders-hero__title, .mk-cat-hero__title, .mk-settings-hero__title,
  .mk-market-home-hero > .d-flex .h3, .mk-seller-hero h3,
  .yd-dash .dash-hero .dash-title, .fin-admin-hero__title, .co-hero__title,
  .svc-hero .svc-title, .sv-hero h4, .slp-hero h4, .yd-bc-hero__title, .yd-artists-hero__title) {
  color: #fff !important;
}

html:root :is(
  .yd-admin-hero:not(.is-light) .yd-admin-hero__eyebrow, .yd-admin-hero:not(.is-light) .yd-admin-hero__sub,
  .acc-hero__eyebrow, .acc-hero__sub,
  .sp-hero .sp-sub, .sp-hero .sp-sub .sp-arrow,
  .mk-approval-hero__sub, .mk-orders-hero__sub, .mk-cat-hero__sub, .mk-settings-hero__sub,
  .yd-dash .dash-hero .dash-sub, .yd-dash .dash-hero .dash-hint, .yd-dash .dash-hero .fin-admin-hero__eyebrow,
  .fin-admin-hero__eyebrow, .fin-admin-hero__sub,
  .co-hero__eyebrow, .co-hero__sub,
  .svc-hero .svc-sub, .svc-hero .svc-sep .bi,
  .yd-artists-hero__eyebrow, .yd-artists-hero__sub) {
  color: rgba(255, 255, 255, .75) !important;
}

/* Bootstrap text-* / .small-muted ใน hero (มี !important) — ยกเว้นในการ์ดขาว */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  :is(.text-muted, .text-secondary, .small-muted, .text-dark, .text-body):not(:is(.yd-admin-stats, .fin-admin-stats, .mk-market-stats, .yd-artists-stats, .svc-filterbar, .yd-dd, .btn) *) {
  color: rgba(255, 255, 255, .75) !important;
}
html:root .sp-hero .sp-back { color: rgba(255, 255, 255, .72); }
html:root :is(.sp-hero .sp-back, .sv-hero a.text-muted, .slp-hero a.text-muted):hover { color: #fff !important; }

/* ไอคอนทั้งหมดใน hero = ขาว (ชนะ `.bi { color: var(--primary) }` · `.card-yd i.bi` · text-info/text-brand-yd)
   ยกเว้นในการ์ดขาว / dropdown */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  i.bi:not(:is(.yd-admin-stats, .fin-admin-stats, .mk-market-stats, .yd-artists-stats, .svc-filterbar, .yd-dd) *) {
  color: rgba(255, 255, 255, .9) !important;
}
/* ไอคอนที่ต้องคงสีเดิม: LINE (แบรนด์) · ดาวรีวิว
   (คลาสซ้ำเพื่อดัน specificity ให้ชนะกฎไอคอนขาวด้านบน) */
html:root :is(.yd-bc-hero, .sv-hero, .slp-hero) i.bi.bi-line.bi-line.bi-line { color: #06c755 !important; }
html:root :is(.sv-hero, .slp-hero) i.bi:is(.sv-star, .slp-star).bi-star-fill.bi-star-fill { color: #fbbf24 !important; }

/* การ์ดขาวที่อยู่ใน hero → รีเซ็ตสีที่ไหลลงมาจาก hero */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-stats, .fin-admin-hero .fin-admin-stats,
  .mk-market-home-hero .mk-market-stats, .yd-artists-hero .yd-artists-stats, .svc-hero .svc-filterbar) {
  color: var(--text, #0f172a);
}

/* V68.7.8.280 — การ์ดขาวทุกใบที่วางใน hero (.card-yd / .promo-kpi-card) ที่ไม่ได้ห่อด้วยคลาสข้างบน
   (เช่น /admin/system/marketplace) → ตัวหนังสือเข้ม · ข้อความรอง = เทา · ไอคอนประกอบ = แบรนด์
   ⚠️ ใช้ "hero .card-yd" (การ์ดที่อยู่ข้างใน) ไม่ใช่ :not(.card-yd *) เพราะ .aff-hero ตัวมันเองเป็น card-yd
   specificity สูงกว่ากฎตัวหนังสือ/ไอคอนขาวของ hero ด้านบน · tile ไอคอน / ป้าย / ปุ่ม ยังขาวตามกฎของมันเอง */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero) :is(.card-yd, .promo-kpi-card) {
  color: var(--text, #0f172a) !important;
}
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  :is(.card-yd, .promo-kpi-card) :is(.text-muted, .text-secondary, .small-muted, .text-body, .form-text) {
  color: var(--muted, #64748b) !important;
}
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  :is(.card-yd, .promo-kpi-card) :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .fw-bold, .fs-3, .fs-4) {
  color: var(--text, #0f172a) !important;
}
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  :is(.card-yd, .promo-kpi-card) i.bi:not(.yd-card-wm):not(:is(.promo-kpi-badge, .yd-mini-ico, .sp-kpi__icon, .yd-admin-kpi__badge, .yd-admin-stat__icon, .btn, .yd-badge) i, :is(.promo-kpi-badge, .yd-mini-ico, .sp-kpi__icon, .yd-admin-kpi__badge, .yd-admin-stat__icon, .btn, .yd-badge) *) {
  color: #94a3b8 !important;
}
/* ลายน้ำมุมการ์ด (app.js) ในการ์ดขาวใน hero → สีแบรนด์จาง (เดิมโดนกฎไอคอนขาวทับจนมองไม่เห็น) */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)
  :is(.card-yd, .promo-kpi-card) i.bi.yd-card-wm {
  color: var(--brand) !important;
}

/* ---------------------------------------------------------
   3) icon tile → กระจกขาว ไอคอนขาว
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-hero__icon, .acc-hero__badge, .sp-hero .sp-icon-badge,
  .aff-hero .aff-hero__badge, .yd-dash .dash-hero .dash-icon, .fin-admin-hero__icon, .co-hero__badge,
  .svc-hero .yd-icon-badge, .yd-bc-hero__ico, .yd-artists-hero__icon) {
  background: var(--yd-glass-bg) !important;
  border: 1px solid var(--yd-glass-border) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 10px 24px rgba(0, 0, 0, .18) !important;
}
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-hero__icon, .acc-hero__badge, .sp-hero .sp-icon-badge,
  .aff-hero .aff-hero__badge, .yd-dash .dash-hero .dash-icon, .fin-admin-hero__icon, .co-hero__badge,
  .svc-hero .yd-icon-badge, .yd-bc-hero__ico, .yd-artists-hero__icon) i {
  color: #fff !important;
}

/* ---------------------------------------------------------
   4) chip / pill → กระจกขาว
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-chip, .acc-hero__chip, .sp-hero .sp-pill, .aff-hero .aff-chip,
  .yd-dash .dash-hero .wc-chip, .fin-admin-hero .fin-chip, .co-hero .co-pill, .svc-hero .svc-hero__left .svc-pill,
  .svc-hero > .d-flex .svc-pill, .sv-hero .sv-chip, .yd-bc-hero .yd-bc-chip, .yd-artists-hero .yd-artists-chip,
  .mk-market-home-hero .mk-market-chip, .mk-seller-hero .mk-seller-chip) {
  color: #fff !important;
  background: var(--yd-glass-bg) !important;
  border: 1px solid var(--yd-glass-border) !important;
  box-shadow: none !important;
  backdrop-filter: none;
}
html:root :is(.sp-hero a.sp-pill, .svc-hero a.svc-pill, .sv-hero a .sv-chip):hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .18) !important;
  border-color: rgba(255, 255, 255, .34) !important;
}
/* หมวดที่เลือกอยู่ (Services) = ขาวทึบตัวน้ำเงิน */
html:root .svc-hero .svc-pill--cat.active {
  color: var(--brand) !important;
  background: #fff !important;
  border-color: #fff !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .18) !important;
}
html:root .svc-hero .svc-pill--cat.active i.bi { color: var(--brand) !important; }

/* สถานะงวดบัญชี: เตือน = กระจกเหลือง · ปิดงวด = กระจกปกติ (ไม่ใช้เขียว) */
html:root .acc-hero .acc-hero__chip.acc-hero__chip--warn {
  color: #fde68a !important;
  background: rgba(245, 158, 11, .2) !important;
  border-color: rgba(252, 211, 77, .5) !important;
}
html:root .acc-hero .acc-hero__chip.acc-hero__chip--warn i.bi.bi { color: #fcd34d !important; }

/* ---------------------------------------------------------
   5) ป้ายสถานะ (yd_ui_badge_html / yd-badge) = pill ขาวทึบ
      ตัวหนังสือ + วงกลมไอคอนยังเป็นสีประจำโทน (V68.7.8.276 · ไอคอนขาวจาก app.css)
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero) .yd-badge {
  --ydb-bg: #fff;
  --ydb-bd: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .16);
}

/* ---------------------------------------------------------
   6) ปุ่ม — จำกัดเฉพาะแถบปุ่มของ hero (ไม่ไปโดนปุ่มในการ์ดขาวด้านใน)
   ปุ่มหลัก = ขาวทึบตัวน้ำเงิน · ปุ่มรอง = กระจก
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions)
  :is(.btn-brand-yd, .btn-brand-yd:hover, .btn-brand-yd:focus, .btn-brand-yd:active),
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .yd-dash .dash-hero .dash-quick) .dash-quick__btn--primary {
  color: var(--brand) !important;
  background: #fff !important;
  border: 1px solid #fff !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .2) !important;
}
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions)
  .btn-brand-yd:hover,
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .yd-dash .dash-hero .dash-quick) .dash-quick__btn--primary:hover {
  background: #eaf2ff !important;
  border-color: #eaf2ff !important;
}
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions)
  .btn-brand-yd :is(*, i.bi),
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .yd-dash .dash-hero .dash-quick) .dash-quick__btn--primary :is(*, i.bi) {
  color: var(--brand) !important;
}

/* ปุ่มรอง (btn-outline-yd / dash-quick__btn / outline-danger) = กระจก */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions,
  .yd-dash .dash-hero .dash-quick)
  :is(.btn-outline-yd, .btn-outline-danger, .dash-quick__btn:not(.dash-quick__btn--primary)):not(.yd-dd-btn) {
  color: #fff !important;
  background: var(--yd-glass-bg) !important;
  border: 1px solid rgba(255, 255, 255, .26) !important;
  box-shadow: none !important;
}
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions,
  .yd-dash .dash-hero .dash-quick)
  :is(.btn-outline-yd, .btn-outline-danger, .dash-quick__btn:not(.dash-quick__btn--primary)):not(.yd-dd-btn):is(:hover, :focus-visible) {
  color: #fff !important;
  background: rgba(255, 255, 255, .18) !important;
  border-color: rgba(255, 255, 255, .4) !important;
}
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-actions, .acc-hero__actions, .sp-hero__actions, .aff-hero,
  .mk-approval-hero, .mk-orders-hero, .mk-cat-hero, .mk-settings-actions, .mk-market-home-hero > .d-flex,
  .mk-seller-hero, .fin-admin-actions, .co-hero__actions, .svc-hero__actions, .yd-bc-hero, .yd-artists-hero__actions,
  .yd-dash .dash-hero .dash-quick)
  :is(.btn-outline-yd, .dash-quick__btn:not(.dash-quick__btn--primary)):not(.yd-dd-btn) :is(i.bi, .small-muted) {
  color: rgba(255, 255, 255, .88) !important;
}
/* ปุ่มลบ (outline-danger) = กระจก ตัวแดงอ่อน (ต้องชนะกฎกระจกด้านบน → ซ้ำคลาส) */
html:root .sp-hero .sp-hero__actions .btn.btn-outline-danger.btn-outline-danger:not(.yd-dd-btn),
html:root .sp-hero .sp-hero__actions .btn.btn-outline-danger.btn-outline-danger:not(.yd-dd-btn) i.bi.bi { color: #fecaca !important; }
html:root .sp-hero .sp-hero__actions .btn.btn-outline-danger.btn-outline-danger:not(.yd-dd-btn):hover {
  background: rgba(239, 68, 68, .28) !important; border-color: rgba(254, 202, 202, .6) !important;
}
html:root .sp-hero__actions .btn-brand-yd .small-muted { color: rgba(var(--brand-rgb), .65) !important; }

html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
  .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
  .fin-admin-hero, .co-hero, .svc-hero, .yd-bc-hero, .yd-artists-hero) :is(.btn, .dash-quick__btn):focus-visible {
  outline: 3px solid rgba(147, 197, 253, .8);
  outline-offset: 2px;
}

/* ช่องเลือก (select ที่ app.js แปลงเป็นปุ่ม .yd-dd-btn) / input ใน hero = ขาวทึบอ่านง่าย */
html:root .acc-hero__actions .yd-dd-btn,
html:root .acc-hero__actions .yd-dd-btn:hover {
  color: var(--brand) !important;
  background: #fff !important;
  border: 1px solid #fff !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18) !important;
}
html:root .acc-hero__actions .yd-dd-btn .yd-dd-label { color: var(--text, #0f172a); }
html:root .acc-hero__actions .yd-dd-btn i.bi { color: var(--brand) !important; }
html:root .acc-hero__actions :is(.form-select, .form-control) {
  color: var(--text, #0f172a);
  background-color: #fff;
  border-color: #fff;
}

/* ---------------------------------------------------------
   7) metric tiles ใน hero (Marketplace / Services) = กระจก
   --------------------------------------------------------- */
html:root :is(.sp-hero .sp-metric, .svc-hero .svc-metric) {
  background: var(--yd-glass-bg) !important;
  border: 1px solid var(--yd-glass-border) !important;
  box-shadow: none !important;
}
html:root :is(.sp-hero .sp-metric__top, .svc-hero .svc-metric__top) { color: rgba(255, 255, 255, .75) !important; }
html:root :is(.sp-hero .sp-metric__top i, .svc-hero .svc-metric__top .bi) {
  background: rgba(255, 255, 255, .14) !important;
  border-color: rgba(255, 255, 255, .22) !important;
  color: #fff !important;
}
html:root :is(.sp-hero .sp-metric__val, .svc-hero .svc-metric__val) { color: #fff !important; }

/* ---------------------------------------------------------
   8) การ์ดสถิติขาว "ใน" hero — คงขาว · เงาเข้มขึ้นให้ลอยจากพื้นน้ำเงิน
   --------------------------------------------------------- */
html:root :is(.yd-admin-hero:not(.is-light) .yd-admin-stat, .fin-admin-hero .fin-admin-stat,
  .mk-market-home-hero .mk-market-stat, .yd-artists-hero .yd-artists-stat) {
  border-color: rgba(255, 255, 255, .6) !important;
  box-shadow: 0 12px 28px rgba(2, 6, 23, .22) !important;
}
html:root .svc-hero .svc-filterbar {
  border-color: rgba(255, 255, 255, .6);
  box-shadow: 0 12px 28px rgba(2, 6, 23, .22);
}
html:root .fin-admin-hero .fin-admin-stats { margin-bottom: 0; }
html:root .yd-admin-hero:not(.is-light) .yd-admin-hero__top:last-child,
html:root .fin-admin-hero .fin-admin-hero__top:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------
   9) อื่น ๆ เฉพาะตระกูล
   --------------------------------------------------------- */
/* dash-hero เดิมเป็นแถบเตี้ย มุม 16px → ให้หนาขึ้นเท่า hero อื่น */
html:root .yd-dash .dash-hero { padding: 20px 22px; border-radius: 24px; }

/* yd-bc-hero chip ตัว LINE มีสีเขียว inline (ทั้งข้อความ) → ข้อความขาว ไอคอนยังเขียวแบรนด์ LINE (ข้อ 2) */

@media (max-width: 767.98px) {
  html:root :is(.yd-admin-hero:not(.is-light), .acc-hero, .sp-hero, .aff-hero, .mk-approval-hero, .mk-orders-hero,
    .mk-cat-hero, .mk-settings-hero, .mk-market-home-hero, .mk-seller-hero, .yd-dash .dash-hero,
    .fin-admin-hero, .co-hero, .sv-hero, .slp-hero, .yd-bc-hero, .yd-artists-hero)::after { display: none; }
  html:root .yd-dash .dash-hero { padding: 16px; }
}

} /* @media screen */