/**
 * ธีม "สตรีม ดำชมพู" ให้สอดคล้องกับ webseries (webseries/css/style.css)
 * ใช้คู่กับ body.pp2p-stream
 * กำหนดบน :root ด้วย — บางหน้า (เช่น line_shop) ใช้ :root { --p: var(--pink-primary); } อ้างจาก html
 */

:root {
  --bg: #0a0a0c;
  --page-bg: #05060a;
  --panel: #111114;
  --pp-text: #fdf2f6;
  --pp-muted: #c4b0bb;
  --pp-border: #2a1f2a;
  --accent: #ff85a1;
  --accent-2: #e85b88;
  --pink-primary: #ff85a1;
  --pink-hover: #e85b88;
  --pink-bg: #0d0a0f;
  --pink-soft: rgba(255, 133, 161, 0.12);
  --text-main: #fdf2f6;
  --text-muted: #c4b0bb;
  --card-bg: #111114;
  --border-color: #2a1f2a;
}

body.pp2p-stream {
  --bg: #0a0a0c;
  --panel: #111114;
  --pp-text: #fdf2f6;
  --pp-muted: #c4b0bb;
  --pp-border: #2a1f2a;
  --accent: #ff85a1;
  --accent-2: #e85b88;
  --accent-soft: rgba(255, 133, 161, 0.12);
  --page-bg: #05060a;
  /* map เดิมของเว็บ */
  --pink-primary: var(--accent);
  --pink-hover: var(--accent-2);
  --pink-bg: #0d0a0f;
  --text-main: var(--pp-text);
  --text-muted: var(--pp-muted);
  --card-bg: var(--panel);
  --border-color: var(--pp-border);
  --pink-soft: var(--accent-soft);
  /* Bootstrap 5.3: ตารางใช้ --bs-table-bg ← --bs-body-bg; ค่าเริ่มจาก :root มักเป็น #fff ทำให้แถวข้อมูลขาว */
  --bs-body-bg: #05060a;
  --bs-body-color: #fdf2f6;
  --bs-secondary-color: #c4b0bb;
  --bs-tertiary-color: #a08f9a;
  --bs-border-color: #2a1f2a;
  --bs-table-bg: #141018;
  --bs-table-color: #fdf2f6;
  --bs-table-border-color: #2a1f2a;
  --bs-table-striped-bg: rgba(255, 100, 140, 0.1);
  --bs-table-active-bg: rgba(255, 100, 140, 0.16);
  --bs-table-hover-bg: rgba(255, 100, 140, 0.12);
  font-family: "Prompt", "Kanit", system-ui, sans-serif;
  background-color: var(--page-bg) !important;
  background-image:
    radial-gradient(900px 520px at 88% -8%, rgba(200, 60, 100, 0.18), rgba(5, 6, 10, 0) 60%),
    radial-gradient(720px 480px at -5% 105%, rgba(180, 40, 90, 0.12), rgba(5, 6, 10, 0) 58%),
    radial-gradient(500px 320px at 50% 0%, rgba(255, 120, 160, 0.08), rgba(5, 6, 10, 0) 50%) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  color: var(--pp-text) !important;
}

body.pp2p-stream .area {
  background: linear-gradient(
    180deg,
    rgba(8, 5, 10, 0.75) 0%,
    rgba(5, 4, 8, 0.4) 45%,
    rgba(5, 6, 10, 0.15) 100%
  ) !important;
}

body.pp2p-stream .circles li {
  background: var(--accent) !important;
  opacity: 0.14 !important;
}

/* Header / nav — กระจกดำ-ชมพู (คล้าย .site-header webseries) */
body.pp2p-stream .navbar-custom,
body.pp2p-stream .mobile-header {
  background: linear-gradient(180deg, rgba(10, 8, 12, 0.96) 0%, rgba(8, 6, 10, 0.9) 100%) !important;
  border-bottom: 1px solid rgba(255, 120, 150, 0.18) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(8px);
}

body.pp2p-stream .navbar-brand,
body.pp2p-stream .nav-link,
body.pp2p-stream .mobile-logo {
  color: var(--pp-text) !important;
}

body.pp2p-stream .nav-link:hover,
body.pp2p-stream .nav-link.active {
  color: var(--accent) !important;
}

/* ป้าย role แถบบน: เอาแต่ตัวอักษร ไม่ใช้กรอบ/พื้นอ่อน (index.php: .role-badge) */
body.pp2p-stream .navbar-custom .role-badge {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.2;
  display: inline;
}
body.pp2p-stream .navbar-custom .role-admin {
  color: var(--accent) !important;
}
body.pp2p-stream .navbar-custom .role-agent {
  color: #f0c14a !important;
}
body.pp2p-stream .navbar-custom .role-member {
  color: var(--pp-muted) !important;
}

body.pp2p-stream .mobile-balance {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  background: linear-gradient(135deg, rgba(80, 20, 40, 0.45), rgba(40, 8, 22, 0.55)) !important;
  color: #ffe0ea !important;
  border: 1px solid rgba(255, 120, 150, 0.4) !important;
  box-shadow: 0 0 16px rgba(200, 40, 100, 0.15) !important;
}
body.pp2p-stream .btn-mobile-admin,
body.pp2p-stream .btn-mobile-agent {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  align-items: center !important;
}

/* Bottom bar */
body.pp2p-stream .bottom-nav {
  background: linear-gradient(180deg, rgba(10, 8, 12, 0.97) 0%, rgba(5, 5, 8, 0.95) 100%) !important;
  border-top: 1px solid rgba(255, 120, 150, 0.2) !important;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(10px);
}

body.pp2p-stream .nav-item-mobile {
  color: var(--pp-muted) !important;
}
body.pp2p-stream .nav-item-mobile > span:not(.cart-badge-mobile) {
  white-space: nowrap !important;
  line-height: 1.1;
}

body.pp2p-stream .nav-item-mobile.active,
body.pp2p-stream .nav-item-mobile.active i {
  color: var(--accent) !important;
}

body.pp2p-stream .center-fab {
  border: 4px solid rgba(255, 100, 140, 0.25) !important;
  box-shadow: 0 8px 24px rgba(200, 40, 100, 0.35) !important;
}

body.pp2p-stream .footer {
  background: linear-gradient(180deg, rgba(8, 6, 9, 0.92) 0%, rgba(5, 5, 7, 0.95) 100%) !important;
  border-top: 1px solid var(--pp-border) !important;
  color: var(--pp-muted) !important;
}

/* การ์ด / ฟอร์ม — ไม่ใช้ #000 สนิท (แยก .table ออก — กำหนดด้านล่าง) */
body.pp2p-stream .card,
body.pp2p-stream .list-group-item,
body.pp2p-stream .modal-content,
body.pp2p-stream .modal-header,
body.pp2p-stream .modal-footer,
body.pp2p-stream .dropdown-menu,
body.pp2p-stream .form-control,
body.pp2p-stream .form-select,
body.pp2p-stream .input-group-text {
  background: var(--panel) !important;
  border-color: var(--pp-border) !important;
  color: var(--pp-text) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
}

/* ตาราง Bootstrap — แก้ tbody/เซลล์ยังพื้นขาว (อ้าง --bs-body-bg จาก :root) */
body.pp2p-stream .table {
  --bs-table-color: #fdf2f6;
  --bs-table-bg: #141018;
  --bs-table-border-color: #2a1f2a;
  --bs-table-striped-color: #fdf2f6;
  --bs-table-striped-bg: rgba(255, 100, 140, 0.1);
  --bs-table-active-color: #fdf2f6;
  --bs-table-active-bg: rgba(255, 100, 140, 0.16);
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: rgba(255, 100, 140, 0.12);
  margin-bottom: 0;
  /* ห้าม !important: ต้องให้ลูก .badge / .text-dark / ปุ่มสีกำหนดสีได้ ไม่งั้นพื้นอ่อนกลายเป็นตัวอ่อน (มองไม่เห็น) */
  color: var(--pp-text);
  border-color: var(--pp-border) !important;
  box-shadow: none !important;
  background-color: transparent !important;
}

/* เซลล์: พื้นมืด — สีตัวอักษรค่าเริ่มต้น ไม่ใส่ !important บน color */
body.pp2p-stream .table > :not(caption) > * > * {
  color: #f0dde6;
  border-color: var(--pp-border) !important;
  background-color: #141018 !important;
  box-shadow: none !important;
}

/* หัวตาราง — รวม thead.bg-light ในแอดมิน */
body.pp2p-stream .table thead th,
body.pp2p-stream .table thead tr th,
body.pp2p-stream .toprank-section .table thead th {
  background: linear-gradient(180deg, #221a25, #19141e) !important;
  color: #ffeff5 !important;
  border-color: var(--pp-border) !important;
  font-weight: 800;
}

/* เงิน / เน้น — ชมพูสดบนพื้นมืด แทน text-danger บนขาว */
body.pp2p-stream .table .text-danger {
  color: #ff9ab8 !important;
}

body.pp2p-stream .table .text-muted,
body.pp2p-stream .table .small.text-muted {
  color: #bda8b2 !important;
}

body.pp2p-stream .form-control::placeholder {
  color: #9a8290;
}

body.pp2p-stream .form-control:focus,
body.pp2p-stream .form-select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 0.2rem var(--accent-soft) !important;
  color: var(--pp-text) !important;
}

/* ปุ่มหลัก — ไล่เฉดชมพู */
body.pp2p-stream .btn-pink,
body.pp2p-stream .btn-pink:hover {
  background: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 120, 150, 0.35) !important;
  box-shadow: 0 4px 16px rgba(200, 40, 100, 0.25) !important;
}

body.pp2p-stream.dark-mode .btn,
body.pp2p-stream.dark-mode .btn-primary,
body.pp2p-stream.dark-mode .btn-pink,
body.pp2p-stream.dark-mode .btn-secondary,
body.pp2p-stream.dark-mode .btn-success,
body.pp2p-stream.dark-mode .btn-danger,
body.pp2p-stream.dark-mode .btn-warning,
body.pp2p-stream.dark-mode .swal2-confirm {
  background: linear-gradient(135deg, #1a1520, #121018) !important;
  color: var(--pp-text) !important;
  border: 1px solid rgba(255, 120, 150, 0.28) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

body.pp2p-stream.dark-mode .btn-pink,
body.pp2p-stream.dark-mode .swal2-confirm {
  background: linear-gradient(45deg, var(--accent), var(--accent-2)) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 150, 170, 0.4) !important;
}

/* ปุ่มอ่อน (แอดมิน) — ยกเว้นจาก .dark-mode .btn: ต้อง ตัวเข้ม + พื้นชมพูอ่อน ไม่ละตัวบนอ่อน */
body.pp2p-stream.dark-mode .btn.btn-light,
body.pp2p-stream.dark-mode a.btn.btn-light {
  background: linear-gradient(180deg, #f3e0ea, #e5ccd8) !important;
  color: #2a101c !important;
  border: 1px solid rgba(160, 90, 120, 0.45) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18) !important;
}
body.pp2p-stream.dark-mode .btn.btn-light i,
body.pp2p-stream.dark-mode a.btn.btn-light i {
  color: #4a1f2f !important;
}
body.pp2p-stream.dark-mode .btn.btn-light.text-danger,
body.pp2p-stream.dark-mode a.btn.btn-light.text-danger,
body.pp2p-stream.dark-mode .btn.btn-light .text-danger {
  color: #b91c1c !important;
}
body.pp2p-stream.dark-mode .btn.btn-outline-secondary,
body.pp2p-stream.dark-mode .btn.btn-outline-primary {
  background: rgba(20, 14, 20, 0.6) !important;
  color: #ffccd9 !important;
  border: 1px solid rgba(255, 150, 170, 0.4) !important;
}

/* Badge พื้นอ่อนในรายงาน/ตาราง (เช่น หมวด NETFLIX) */
body.pp2p-stream .badge.bg-light,
body.pp2p-stream .table .badge.bg-light,
body.pp2p-stream .admin-shell .badge.bg-light {
  background: #f0dfe8 !important;
  color: #1a0a12 !important;
  border: 1px solid rgba(180, 90, 120, 0.38) !important;
  font-weight: 700;
}
body.pp2p-stream .table .badge.text-dark {
  color: #1a0a12 !important;
}

/* SweetAlert2 */
body.pp2p-stream .swal2-popup,
body.pp2p-stream .swal2-toast {
  background: var(--panel) !important;
  color: var(--pp-text) !important;
  border: 1px solid var(--pp-border) !important;
}

body.pp2p-stream .swal2-title {
  color: #fff5f8 !important;
  font-weight: 800;
}
body.pp2p-stream .swal2-html-container {
  color: var(--pp-text) !important;
}
body.pp2p-stream .swal2-icon.swal2-question {
  border-color: rgba(255, 150, 170, 0.55) !important;
  color: var(--accent) !important;
}
body.pp2p-stream .swal2-icon.swal2-question .swal2-icon-content {
  color: var(--accent) !important;
}
body.pp2p-stream .swal2-styled.swal2-cancel,
body.pp2p-stream .swal2-deny {
  color: #f0d8e4 !important;
  background: linear-gradient(180deg, #1f1824, #15111a) !important;
  border: 1px solid rgba(255, 120, 150, 0.4) !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}
body.pp2p-stream .swal2-styled.swal2-cancel:hover {
  filter: brightness(1.08) !important;
  background: linear-gradient(180deg, #2a1f2a, #1a1218) !important;
}

/* หน้า product: modal ซื้อ/ตะกร้า (Swal) — ดำ-ชมพู ไม่พื้นขาว */
body.pp2p-stream .swal2-html-container .pp-sw-warn {
  text-align: center;
  margin-bottom: 10px;
  padding: 10px 12px;
  background: linear-gradient(135deg, rgba(120, 20, 50, 0.5), rgba(50, 10, 30, 0.65)) !important;
  border: 1px solid rgba(255, 100, 130, 0.45) !important;
  border-radius: 12px;
  color: #ffccd5 !important;
  font-weight: 800;
  font-size: 0.88rem;
}
body.pp2p-stream .swal2-html-container .pp-sw-product {
  background: linear-gradient(130deg, rgba(18, 8, 14, 0.85) 0%, rgba(25, 12, 20, 0.92) 100%) !important;
  border: 1px solid rgba(255, 120, 150, 0.28) !important;
  border-radius: 16px;
  padding: 14px 14px;
  text-align: left;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35) !important;
  color: var(--pp-text) !important;
}
body.pp2p-stream .swal2-html-container .pp-sw-product__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
body.pp2p-stream .swal2-html-container .pp-sw-muted,
body.pp2p-stream .swal2-html-container .pp-sw-qty-hint {
  color: var(--pp-muted) !important;
  font-size: 0.9rem;
  font-weight: 700;
}
body.pp2p-stream .swal2-html-container .pp-sw-name {
  font-weight: 900;
  color: #fff5f8 !important;
  font-size: 1.4rem;
  line-height: 1.1;
  margin-top: 2px;
  word-break: break-word;
}
body.pp2p-stream .swal2-html-container .pp-sw-pr-col {
  text-align: right;
}
body.pp2p-stream .swal2-html-container .pp-sw-base-price,
body.pp2p-stream .swal2-html-container .pp-sw-total__price {
  font-weight: 900;
  color: #ff8fab !important;
  font-size: 1.85rem;
  line-height: 1.05;
  margin-top: 2px;
  text-shadow: 0 0 20px rgba(255, 100, 130, 0.25);
}
body.pp2p-stream .swal2-html-container .pp-sw-total__price {
  font-size: 1.3rem;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt {
  border: 1px solid var(--pp-border) !important;
  cursor: pointer;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt input[type="radio"] {
  accent-color: var(--accent-2, #e85b88);
}
body.pp2p-stream .swal2-html-container .pp-sw-opt--ok {
  background: rgba(40, 18, 30, 0.55) !important;
  border-color: rgba(255, 120, 150, 0.3) !important;
  opacity: 1;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt--out {
  background: rgba(8, 8, 10, 0.45) !important;
  border-color: rgba(255, 100, 100, 0.2) !important;
  opacity: 0.72;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt-name,
body.pp2p-stream .swal2-html-container .pp-sw-opt--ok .pp-sw-opt-name {
  color: #fdf2f6 !important;
  font-weight: 600;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt--out .pp-sw-opt-name,
body.pp2p-stream .swal2-html-container .pp-sw-opt--out .pp-sw-opt-price {
  color: #8a7a86 !important;
}
body.pp2p-stream .swal2-html-container .pp-sw-opt--ok .pp-sw-opt-price {
  color: #e8d4de !important;
}
body.pp2p-stream .swal2-html-container .pp-sw-stockin {
  font-size: 0.71rem;
  font-weight: 800;
  color: #86f0c0 !important;
  background: rgba(20, 60, 45, 0.5) !important;
  border: 1px solid rgba(100, 200, 150, 0.35) !important;
  border-radius: 999px;
  padding: 1px 8px;
}
body.pp2p-stream .swal2-html-container .pp-sw-stockout {
  font-size: 0.71rem;
  font-weight: 800;
  color: #ff9a9a !important;
  background: rgba(80, 20, 30, 0.45) !important;
  border: 1px solid rgba(255, 100, 100, 0.3) !important;
  border-radius: 999px;
  padding: 1px 8px;
}
body.pp2p-stream .swal2-html-container .pp-sw-total {
  background: linear-gradient(180deg, rgba(20, 14, 24, 0.75), rgba(10, 8, 12, 0.85)) !important;
  border: 1px dashed rgba(255, 130, 160, 0.3) !important;
  border-radius: 12px;
  padding: 10px 12px;
}
body.pp2p-stream .swal2-html-container .pp-sw-total__label {
  font-size: 0.8rem;
  color: var(--pp-muted) !important;
  margin-bottom: 4px;
}
body.pp2p-stream .swal2-html-container .pp-sw-ins-label {
  font-weight: 700;
  color: #e8d4de !important;
  margin-bottom: 4px;
}
body.pp2p-stream .swal2-html-container .pp-sw-ins-label .form-check-input {
  width: 1.1rem;
  height: 1.1rem;
  border-color: rgba(255, 150, 170, 0.5) !important;
  background-color: #141018 !important;
}
body.pp2p-stream .swal2-html-container .pp-sw-ins-label .form-check-input:checked {
  background-color: var(--accent) !important;
  border-color: var(--accent-2) !important;
}
body.pp2p-stream .swal2-html-container .pp-sw-desc,
body.pp2p-stream .swal2-html-container .text-start.pp-sw-desc {
  background: rgba(18, 14, 22, 0.7) !important;
  color: #e8d4de !important;
  border: 1px solid var(--pp-border) !important;
  border-radius: 12px !important;
}
body.pp2p-stream .swal2-html-container h4.text-pink {
  color: var(--accent) !important;
}
body.pp2p-stream .swal2-textarea,
body.pp2p-stream .swal2-input {
  background: #141018 !important;
  border: 1px solid rgba(255, 120, 150, 0.3) !important;
  color: #fdf2f6 !important;
}
body.pp2p-stream .swal2-textarea::placeholder,
body.pp2p-stream .swal2-input::placeholder {
  color: #7a6a75 !important;
}

/* --- ลบโทน “ดำ-ขาว 100%” ของ home.php --- */
body.pp2p-stream.dark-mode .area {
  background: linear-gradient(180deg, rgba(6, 4, 7, 0.85) 0%, rgba(4, 3, 5, 0.45) 100%) !important;
}

body.pp2p-stream.dark-mode .hero-section,
body.pp2p-stream.dark-mode .quick-item,
body.pp2p-stream.dark-mode .rank-card,
body.pp2p-stream.dark-mode .step-card,
body.pp2p-stream.dark-mode .catcard-row {
  background: var(--panel) !important;
  border: 1px solid var(--pp-border) !important;
  color: var(--pp-text) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}
/* การ์ดสินค้า: กรอบชมพู (หน้าแรก prodcard + รายหมวด product .prod-card) */
body.pp2p-stream.dark-mode .prodcard,
body.pp2p-stream.dark-mode .prod-card {
  background: var(--panel) !important;
  color: var(--pp-text) !important;
  border: 1px solid rgba(255, 120, 150, 0.5) !important;
  box-shadow:
    0 0 0 1px rgba(255, 100, 130, 0.14),
    0 8px 24px rgba(0, 0, 0, 0.32) !important;
}
body.pp2p-stream.dark-mode .prodcard:hover,
body.pp2p-stream.dark-mode .prod-card:hover {
  border-color: rgba(255, 150, 170, 0.7) !important;
  box-shadow:
    0 0 0 1px rgba(255, 130, 150, 0.25),
    0 10px 28px rgba(200, 50, 90, 0.2) !important;
}

/* หน้า product: ปุ่ม ซื้อเลย (พื้นชมพู) / ใส่ตะกร้า+พรีออเดอร์ (กรอบชมพู) — เอาชนะ .dark-mode ใน product.php */
body.pp2p-stream.dark-mode .btn-buy {
  background: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 170, 200, 0.55) !important;
  border-radius: 50px !important;
  box-shadow: 0 4px 16px rgba(200, 50, 100, 0.38) !important;
  font-weight: 700 !important;
}
body.pp2p-stream.dark-mode .btn-buy:hover {
  filter: brightness(1.07) !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--accent-2), #d94680) !important;
  border-color: rgba(255, 200, 215, 0.55) !important;
  box-shadow: 0 6px 20px rgba(200, 50, 100, 0.42) !important;
}
body.pp2p-stream.dark-mode .btn-cart {
  background: linear-gradient(180deg, rgba(32, 18, 28, 0.65), rgba(12, 8, 12, 0.85)) !important;
  color: #ffe8ef !important;
  border: 1.5px solid rgba(255, 130, 165, 0.65) !important;
  border-radius: 50px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25) !important;
  font-weight: 700 !important;
}
body.pp2p-stream.dark-mode .btn-cart:hover {
  background: rgba(255, 100, 140, 0.1) !important;
  color: #fff5f8 !important;
  border-color: var(--accent) !important;
}
body.pp2p-stream.dark-mode .btn-pre {
  background: linear-gradient(180deg, rgba(40, 22, 20, 0.55), rgba(18, 8, 10, 0.8)) !important;
  color: #ffd0cc !important;
  border: 1.5px solid rgba(255, 150, 140, 0.6) !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22) !important;
}
body.pp2p-stream.dark-mode .btn-pre:hover {
  color: #fff5f0 !important;
  background: rgba(120, 40, 50, 0.35) !important;
  border-color: #ffb0a0 !important;
}
body.pp2p-stream.dark-mode .prod-card .text-pink {
  color: var(--accent) !important;
}
body.pp2p-stream.dark-mode .prod-card .btn.btn-sm.btn-light {
  background: linear-gradient(180deg, #221820, #151018) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(255, 140, 170, 0.5) !important;
  box-shadow: 0 0 0 1px rgba(255, 100, 130, 0.12) !important;
}
body.pp2p-stream.dark-mode .prod-card .btn.btn-sm.btn-light:hover {
  color: #fff0f4 !important;
  border-color: var(--accent) !important;
  background: rgba(80, 30, 50, 0.45) !important;
}

/* หน้า home — การ์ดสถิติ 3 ใบ (ขายแล้ว / สมาชิก / ต่ออายุ) คนละเฉด โทน ดำ-ชมพู */
body.pp2p-stream.dark-mode .stats-section .stat-box {
  color: #fff5f8 !important;
}
body.pp2p-stream.dark-mode .stats-section .stat-box .stat-details h4,
body.pp2p-stream.dark-mode .stats-section .stat-box .stat-details small {
  color: inherit !important;
}
body.pp2p-stream.dark-mode .stats-section .stat-box.pink-theme {
  background: linear-gradient(130deg, #10080c 0%, #1f0f16 32%, #7a1f3d 70%, #d13d6a 100%) !important;
  border: 1px solid rgba(255, 100, 130, 0.4) !important;
  box-shadow: 0 8px 24px rgba(200, 40, 80, 0.25) !important;
}
body.pp2p-stream.dark-mode .stats-section .stat-box.dark-theme {
  background: linear-gradient(130deg, #0a0a10 0%, #14121c 40%, #4a2048 75%, #b84578 100%) !important;
  border: 1px solid rgba(255, 130, 200, 0.32) !important;
  box-shadow: 0 8px 24px rgba(150, 40, 100, 0.2) !important;
}
body.pp2p-stream.dark-mode .stats-section .stat-box.renewal-theme {
  background: linear-gradient(130deg, #080810 0%, #12101e 38%, #302060 78%, #6a4a9a 100%) !important;
  border: 1px solid rgba(180, 150, 255, 0.3) !important;
  box-shadow: 0 8px 24px rgba(60, 30, 120, 0.2) !important;
}
body.pp2p-stream.dark-mode .stats-section .stat-box .stat-icon-sm {
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 200, 220, 0.2);
}
body.pp2p-stream.dark-mode .stats-section .stat-box .stat-bg-icon {
  color: #fff;
  opacity: 0.09;
}

body.pp2p-stream.dark-mode .prodcard-name,
body.pp2p-stream.dark-mode .catcard-name,
body.pp2p-stream.dark-mode .hero-title,
body.pp2p-stream.dark-mode .quick-label {
  color: var(--pp-text) !important;
}

body.pp2p-stream.dark-mode .prodcard-label-price,
body.pp2p-stream .prodcard-label-price {
  color: var(--accent) !important;
}

body.pp2p-stream.dark-mode .prodcard-btn,
body.pp2p-stream.dark-mode .btn-main-action {
  background: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 150, 170, 0.4) !important;
  box-shadow: 0 4px 14px rgba(200, 50, 90, 0.3) !important;
}

body.pp2p-stream.dark-mode .prodcard-btn:hover,
body.pp2p-stream.dark-mode .btn-main-action:hover {
  filter: brightness(1.06) !important;
  background: linear-gradient(135deg, var(--accent-2), #d94680) !important;
}

/* Admin sidebar header */
body.pp2p-stream .list-group-item.bg-dark.text-white {
  background: linear-gradient(90deg, rgba(90, 20, 50, 0.6), var(--panel)) !important;
  color: var(--pp-text) !important;
  border: 1px solid var(--pp-border) !important;
}

body.pp2p-stream .admin-menu-backdrop {
  background: rgba(3, 2, 4, 0.62) !important;
  backdrop-filter: blur(3px);
}

/* Bootstrap text helpers on dark pink */
body.pp2p-stream .text-muted,
body.pp2p-stream .text-secondary {
  color: var(--pp-muted) !important;
}

body.pp2p-stream .text-dark {
  color: var(--pp-text) !important;
}

body.pp2p-stream .dropdown-item:hover,
body.pp2p-stream .dropdown-item:focus {
  background: var(--accent-soft) !important;
  color: var(--pp-text) !important;
}

body.pp2p-stream .table-hover tbody tr:hover td,
body.pp2p-stream .table-hover tbody tr:hover th {
  background: rgba(255, 100, 140, 0.08) !important;
}

body.pp2p-stream .form-control:focus,
body.pp2p-stream .form-select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 0.2rem var(--accent-soft) !important;
  color: var(--pp-text) !important;
}

body.pp2p-stream .btn:not(.btn-pink):not(.swal2-confirm):hover {
  filter: brightness(1.08);
}

body.pp2p-stream .btn-close {
  filter: invert(1) grayscale(1) brightness(1.15);
  opacity: 0.85;
}

/* Scrollbar บาง ๆ */
body.pp2p-stream * {
  scrollbar-color: rgba(255, 100, 140, 0.35) var(--panel);
  scrollbar-width: thin;
}

/* Bootstrap utility ยอดฮิตบน index / admin */
body.pp2p-stream .bg-white,
body.pp2p-stream .shadow-sm {
  background: var(--panel) !important;
  color: var(--pp-text) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2) !important;
}

/* --- LINE SHOP: ปรับกล่อง/พื้นสว่าง -- */
body.pp2p-stream .slip-box {
  background: #16131a !important;
  border-color: rgba(255, 120, 150, 0.3) !important;
}
body.pp2p-stream .slip-box:hover {
  background: #1a1620 !important;
  border-color: rgba(255, 133, 161, 0.55) !important;
}
body.pp2p-stream .pay-tabs {
  background: rgba(255, 100, 140, 0.08) !important;
}
body.pp2p-stream .h-code {
  background: #141018 !important;
  border-color: rgba(255, 133, 161, 0.35) !important;
  color: var(--pp-text) !important;
}
body.pp2p-stream .h-item {
  background: var(--panel) !important;
  border-color: var(--pp-border) !important;
}
body.pp2p-stream .p-img {
  background: #1c1520 !important;
}
body.pp2p-stream .modal-content {
  background: var(--panel) !important;
}

/* ========================================================================
   Webseries ฝังร้าน (?page=admin&sub=webseries_settings&wsv=…)
   เดิม .ws-embed-panel-light ใน webseries/admin.css บังคับพื้นสว่าง
   ใช้ body.pp2p-stream.dark-mode ให้ชนะลำดับ + specificity กว่า body.dark-mode
   ======================================================================== */
body.pp2p-stream.dark-mode .ws-portal-inline-wrap {
  background: linear-gradient(165deg, #120d12, #08060a) !important;
  border: 1px solid rgba(255, 100, 140, 0.2) !important;
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.4) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .admin-layout.ws-shop-embed-layout {
  background: transparent !important;
}

/* คอลัมน์เนื้อหา: พื้น + สีฐาน (ลูก * inherit จากนี้ แทน light theme) */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light {
  background: radial-gradient(80% 120% at 100% 0%, rgba(180, 40, 100, 0.12), transparent 55%),
    linear-gradient(180deg, #0a080c 0%, #05040a 100%) !important;
  color: #f0e0e8 !important;
  border-radius: 12px;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  * {
  color: inherit !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-topbar
  h1,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-home-topbar-text
  h1 {
  color: #ffeff5 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-card,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-media-card {
  background: #111114 !important;
  border: 1px solid #2a1f2a !important;
  color: #f0e0e8 !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-card
  h2,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-card-title {
  color: #fff5f8 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-field-hint,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-card-desc,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-home-lead {
  color: #bda8b2 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-card-desc
  code,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-field-hint
  code {
  background: #1a1420 !important;
  color: #ffbdd0 !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  label,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-label-like {
  color: #e8d4de !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  select,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  textarea,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-textarea,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  textarea.admin-textarea {
  background: #141018 !important;
  color: #fdf2f6 !important;
  border: 1px solid rgba(255, 120, 150, 0.32) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  input:focus,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  select:focus,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .form-field
  textarea:focus {
  border-color: #ff85a1 !important;
  box-shadow: 0 0 0 0.2rem rgba(255, 100, 140, 0.2) !important;
}

/* โซนอัปโหลด */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload {
  background: linear-gradient(165deg, #160f18, #0f0a12) !important;
  border: 1px dashed rgba(255, 100, 140, 0.4) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__panel {
  background: #16111a !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
  color: #fdf2f6 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__panel:hover {
  background: #1c1520 !important;
  border-color: rgba(255, 150, 170, 0.5) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__glyph {
  color: #ff8fab !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__title {
  color: #fff0f4 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__meta,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__placeholder,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__caption {
  color: #9a8793 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__preview {
  background: #0f0c10 !important;
  border: 1px solid #2a1f2a !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__thumb {
  background: #1a1420 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-upload__clear {
  background: #1e1522 !important;
  color: #e8d4de !important;
  border: 1px solid #3d2a35 !important;
}

/* เลือกสี (branding) */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .brand-color-row
  input[type="color"] {
  background: #141018 !important;
  border: 1px solid rgba(255, 100, 140, 0.4) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .brand-color-readout {
  color: #ffd0e0 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .brand-color-readout--empty {
  color: #8f7a88 !important;
}

/* สถานะ/ปุ่ม */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-ok {
  background: rgba(16, 120, 80, 0.2) !important;
  border: 1px solid rgba(52, 211, 153, 0.45) !important;
  color: #6ee7b7 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-alert-error {
  background: rgba(120, 30, 40, 0.3) !important;
  border: 1px solid rgba(252, 165, 165, 0.45) !important;
  color: #fecaca !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-hint {
  background: rgba(60, 80, 120, 0.25) !important;
  border: 1px solid rgba(147, 197, 253, 0.3) !important;
  color: #bfdbfe !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-primary-btn {
  background: linear-gradient(45deg, #ff85a1, #e85b88) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 150, 170, 0.45) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-secondary-btn {
  background: #1e1824 !important;
  color: #e8d4de !important;
  border: 1px solid rgba(255, 100, 140, 0.32) !important;
}

/* แท็บ home_portal */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-admin-tabs {
  background: #141018 !important;
  border: 1px solid #2a1f2a !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-admin-tab {
  color: #9a8793 !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-admin-tab:hover,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-admin-tab.is-active {
  color: #fff0f4 !important;
  background: rgba(255, 100, 140, 0.12) !important;
  border-color: rgba(255, 100, 140, 0.3) !important;
}

/* แถบ topbar ฝั่ง webseries ใน embed */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .logout-btn {
  background: #1a1520 !important;
  color: #e8d4de !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .logout-btn:hover {
  background: #241a2a !important;
}

/* บล็อกลิงก์ซีรีส์ (home_portal) — เอาโทนเหลืองอ่อนออก */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-series-link-block {
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
  background: linear-gradient(165deg, #1a1018, #0f0a10) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-series-link-input {
  background: #141018 !important;
  color: #fdf2f6 !important;
  border-color: rgba(255, 100, 140, 0.4) !important;
}

body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .hp-series-link-help {
  color: #f9a8d4 !important;
}

/* ========================================================================
   wsv=apps — .apps-admin-page--light (webseries บังคับ #f4f6fa ใน index + admin.css)
   ======================================================================== */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light {
  background: radial-gradient(80% 100% at 100% 0%, rgba(200, 60, 100, 0.12), transparent 50%),
    linear-gradient(180deg, #0a080c 0%, #05040a 100%) !important;
  color: #e8d4de !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  * {
  color: inherit !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-topbar
  h1 {
  color: #ffeff5 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .apps-admin-page-lead,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .apps-admin-lead {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-card {
  background: #111114 !important;
  border: 1px solid #2a1f2a !important;
  color: #e8d4de !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-card
  h2 {
  color: #fff5f8 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-card
  > p,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-card
  p.apps-admin-lead {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .form-field
  label {
  color: #e0ccd6 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-textarea,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .form-field
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .form-field
  select,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  select {
  background: #141018 !important;
  color: #fdf2f6 !important;
  border: 1px solid rgba(255, 120, 150, 0.35) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload {
  background: linear-gradient(165deg, #120e14, #0a070c) !important;
  border: 1px dashed rgba(255, 100, 140, 0.35) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__panel {
  background: #16111a !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
  color: #fdf2f6 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__panel:hover {
  background: #1c1520 !important;
  border-color: rgba(255, 150, 170, 0.5) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__glyph {
  color: #ff8fab !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__title {
  color: #fff0f4 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__meta,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__placeholder,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__caption {
  color: #8a7688 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__preview {
  background: #0f0c10 !important;
  border: 1px solid #2a1f2a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-upload__thumb {
  background: #1a1420 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .featured-toggle {
  background: #1a1520 !important;
  border: 1px solid #3d2a35 !important;
  color: #e8d4de !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .apps-admin-app-item,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-app-item {
  background: #141018 !important;
  border: 1px solid #2a1f2a !important;
  color: #e8d4de !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .apps-admin-app-item.is-featured,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-app-item.is-featured {
  background: linear-gradient(165deg, #221a12, #141018) !important;
  border-color: rgba(251, 191, 36, 0.5) !important;
  box-shadow: inset 0 0 0 1px rgba(251, 191, 36, 0.2) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .apps-admin-app-item
  h3,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-app-item
  h3 {
  color: #fff5f8 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .app-slug {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .featured-check {
  background: rgba(120, 80, 0, 0.25) !important;
  border: 1px solid rgba(252, 211, 77, 0.45) !important;
  color: #fde68a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .mini-btn {
  background: #1e1824 !important;
  color: #e8d4de !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .mini-btn-edit {
  border-color: rgba(255, 150, 200, 0.45) !important;
  color: #fda4d4 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .mini-btn-delete {
  background: rgba(80, 20, 30, 0.4) !important;
  color: #fecaca !important;
  border: 1px solid rgba(248, 113, 113, 0.4) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .status-pill.status-active {
  background: rgba(6, 95, 70, 0.35) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .status-pill.status-inactive {
  background: #1a1820 !important;
  color: #9a8793 !important;
  border: 1px solid #2a1f2a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .status-pill.status-maintenance {
  background: rgba(120, 50, 10, 0.35) !important;
  color: #fdba74 !important;
  border: 1px solid rgba(251, 146, 60, 0.4) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .app-maintenance-note-admin {
  color: #fdba74 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-primary-btn {
  background: linear-gradient(45deg, #ff85a1, #e85b88) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 150, 170, 0.45) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.apps-admin-page.apps-admin-page--light
  .admin-secondary-btn {
  background: #1e1824 !important;
  color: #e8d4de !important;
  border: 1px solid rgba(255, 100, 140, 0.32) !important;
}

/* ========================================================================
   wsv=coin_locks — แถบ bulk + ตาราง (admin.css บรรทัด ~3175 บังคับเทา/ขาว)
   ======================================================================== */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-card.coin-bulk-panel {
  background: linear-gradient(165deg, #140f16, #0a070c) !important;
  border: 1px solid rgba(255, 100, 140, 0.25) !important;
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.4) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__title {
  color: #ffeff5 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__lead {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__lead
  strong {
  color: #fda4d4 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__status {
  background: rgba(120, 60, 20, 0.25) !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  color: #fde68a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__reset,
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-panel__reset
  a {
  color: #7dd3fc !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-toolbar {
  background: rgba(12, 8, 14, 0.95) !important;
  border-top: 1px solid #2a1f2a !important;
  border-bottom: 1px solid #2a1f2a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-toolbar__select-all {
  color: #e8d4de !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-toolbar__count {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-toolbar__count
  strong {
  color: #ffc8dc !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .admin-card.coin-bulk-panel
  .coin-bulk-apply-btn {
  background: linear-gradient(135deg, #ff85a1, #e85b88) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 150, 170, 0.45) !important;
  box-shadow: 0 4px 18px rgba(200, 50, 90, 0.3) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table
  thead
  th {
  color: #f0d8e4 !important;
  background: linear-gradient(180deg, #221a28, #16111a) !important;
  border-bottom: 1px solid #2a1f2a !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table
  tbody
  td {
  color: #e2d4dc !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table
  tbody
  tr:hover
  td {
  background: rgba(255, 100, 140, 0.08) !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table__title {
  color: #fff5f8 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table
  input[type="number"] {
  background: #141018 !important;
  border: 1px solid rgba(255, 120, 150, 0.35) !important;
  color: #fdf2f6 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-bulk-table__id
  code {
  background: #1a1420 !important;
  border: 1px solid rgba(255, 100, 140, 0.3) !important;
  color: #ffb3cc !important;
}

/* แถบ nav เลือกแอป (coin_locks) */
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-lock-toolbar {
  background: #111114 !important;
  border: 1px solid #2a1f2a !important;
  color: #e8d4de !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-lock-toolbar
  .admin-field-hint {
  color: #9a8793 !important;
}
body.pp2p-stream.dark-mode
  .ws-portal-inline-wrap
  .ws-shop-embed-layout
  .admin-content.ws-embed-panel-light
  .coin-lock-toolbar
  strong {
  color: #ffeff5 !important;
}

/* หน้า admin ภาพรวม — การ์ดยอดขาย / สมาชิก / สต็อก คนละเฉด (โทน ดำ-ชมพู) */
body.pp2p-stream .admin-dash-stat-row .dash-stat-card {
  color: #fff !important;
  background-color: #161118 !important;
  border: 1px solid rgba(255, 120, 150, 0.25) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4) !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--sales {
  background: linear-gradient(130deg, #10080c 0%, #1f0f16 32%, #7a1f3d 70%, #d13d6a 100%) !important;
  border-color: rgba(255, 100, 130, 0.45) !important;
  box-shadow: 0 10px 32px rgba(200, 40, 80, 0.28) !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--members {
  background: linear-gradient(130deg, #0a0a10 0%, #14121c 40%, #4a2048 75%, #c24a7a 100%) !important;
  border-color: rgba(255, 130, 200, 0.35) !important;
  box-shadow: 0 10px 32px rgba(150, 40, 100, 0.22) !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--stock {
  background: linear-gradient(130deg, #080810 0%, #12101e 38%, #302060 78%, #6a4a9a 100%) !important;
  border-color: rgba(180, 150, 255, 0.3) !important;
  box-shadow: 0 10px 32px rgba(60, 30, 120, 0.2) !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card__label,
body.pp2p-stream .admin-dash-stat-row .dash-stat-card .small {
  color: rgba(255, 250, 252, 0.9) !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card h2 {
  color: #fff5f8 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--sales .dash-stat-card__icon {
  color: rgba(255, 180, 200, 0.45) !important;
  opacity: 1 !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--members .dash-stat-card__icon {
  color: rgba(255, 160, 220, 0.42) !important;
  opacity: 1 !important;
}
body.pp2p-stream .admin-dash-stat-row .dash-stat-card--stock .dash-stat-card__icon {
  color: rgba(200, 180, 255, 0.42) !important;
  opacity: 1 !important;
}

/* ----- หน้า home: Hero Spotlight กรอบไฟวิ่ง (ดำ-ชมพู) + สไลด์ ----- */
/* หมุนมุม conic แทนการหมุน pseudo ที่ยืดตาม aspect ratio ของแบนเนอร์
   (เดิม ::before ไม่เป็นสี่เหลี่ยมจัตุรัส ไฟเลย "วิ่ง" เฉพาะบน/ล่างดูมั่ว) */
@property --pp-home-hero-glow {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

body.pp2p-stream .home-hero-spotlight {
  position: relative;
  z-index: 1;
}
body.pp2p-stream .home-hero-neon-outer {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
body.pp2p-stream .home-hero-neon-outer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 24px;
  background: conic-gradient(
    from var(--pp-home-hero-glow),
    #0a0a0c 0%,
    #0a0a0c 9%,
    #ff6b9a 11%,
    #0a0a0c 16%,
    #0a0a0c 32%,
    #e85b88 35%,
    #0a0a0c 40%,
    #0a0a0c 55%,
    #ff8fab 58%,
    #0a0a0c 63%,
    #0a0a0c 78%,
    #ff6b9a 80%,
    #0a0a0c 100%
  );
  animation: pp-home-hero-glow-spin 4.5s linear infinite;
  opacity: 0.95;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  body.pp2p-stream .home-hero-neon-outer::before {
    animation: none;
    --pp-home-hero-glow: 120deg;
    background: conic-gradient(
      from 120deg,
      #e85b88 0%,
      #0a0a0c 22%,
      #ff6b9a 50%,
      #1a0a0e 78%,
      #e85b88 100%
    );
  }
}
@keyframes pp-home-hero-glow-spin {
  to {
    --pp-home-hero-glow: 1turn;
  }
}
@media (min-width: 769px) {
  .container-xxl {
    max-width: 2200px !important;
  }
  body.pp2p-stream .home-hero-spotlight {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 0 !important;
    margin-bottom: 2rem !important;
  }
  body.pp2p-stream .home-hero-neon-outer {
    border-radius: 0;
  }
  body.pp2p-stream .home-hero-neon-inner {
    position: relative;
    z-index: 1;
    margin: 0;
    border-radius: 0;
    background: linear-gradient(145deg, #120c12 0%, #08060a 55%, #0a080c 100%);
    overflow: hidden;
    min-height: 0;
    box-shadow: none;
  }
  body.pp2p-stream .home-hero-kv-inner {
    border-radius: 0;
    background: #0a0a0c;
  }
}
@media (max-width: 768px) {
  body.pp2p-stream .home-hero-neon-outer {
    border-radius: 24px;
    overflow: hidden;
  }
  body.pp2p-stream .home-hero-neon-inner {
    margin: 2px;
    border-radius: 20px;
  }
  body.pp2p-stream .home-hero-kv-inner {
    border-radius: 18px;
  }
}
/* Hero KV Style Core */
body.pp2p-stream .home-hero-kv-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 21 / 7;
  object-fit: cover;
  max-height: min(75vh, 650px);
  vertical-align: top;
}
@media (max-width: 768px) {
  body.pp2p-stream .home-hero-kv-img {
    aspect-ratio: 3 / 2;
    max-height: 450px;
    border-radius: 18px;
  }
}
body.pp2p-stream .home-hero-kv-ctrl {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(8, 6, 10, 0.55) !important;
  opacity: 0.9;
}
body.pp2p-stream .home-hero-kv-ctrl .carousel-control-prev-icon,
body.pp2p-stream .home-hero-kv-ctrl .carousel-control-next-icon {
  width: 1.15rem;
  height: 1.15rem;
  filter: invert(1) brightness(1.1);
}
body.pp2p-stream .home-hero-kv-ctrl:hover {
  opacity: 1;
  background: rgba(60, 20, 40, 0.7) !important;
}
body.pp2p-stream .home-hero-spot__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: transparent;
  overflow: hidden;
  border-radius: 20px;
}
body.pp2p-stream .home-hero-spot__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.32;
  filter: saturate(1.05) blur(0);
}
body.pp2p-stream .home-hero-spot__row {
  z-index: 2;
}
body.pp2p-stream .home-hero-spot__text,
body.pp2p-stream .home-hero-spot__text .hero-title,
body.pp2p-stream .home-hero-spot__text .hero-desc {
  position: relative;
  z-index: 1;
  color: var(--pp-text) !important;
}
body.pp2p-stream .home-hero-spot__glow-blob {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(220px, 64vw);
  height: min(220px, 64vw);
  margin-left: auto;
  margin-right: auto;
  filter: drop-shadow(0 0 22px rgba(255, 100, 140, 0.4));
  isolation: isolate;
}
/* วงแหวน conic รอบรูป (กล่องสี่เหลี่ยมจัตุรัส + mask เป็นวง) */
body.pp2p-stream .home-hero-spot__glow-blob::after {
  content: "";
  position: absolute;
  inset: -3px;
  z-index: 0;
  border-radius: 50%;
  background: conic-gradient(
    from var(--pp-home-hero-glow),
    #0a0a0c 0%,
    #0a0a0c 8%,
    #ff6b9a 10%,
    #0a0a0c 15%,
    #0a0a0c 30%,
    #e85b88 33%,
    #0a0a0c 38%,
    #0a0a0c 52%,
    #ff8fab 55%,
    #0a0a0c 60%,
    #0a0a0c 100%
  );
  -webkit-mask: radial-gradient(closest-side, #0000 calc(100% - 5px), #000 100%);
  mask: radial-gradient(closest-side, #0000 calc(100% - 5px), #000 100%);
  animation: pp-home-hero-glow-spin 4.5s linear infinite;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  body.pp2p-stream .home-hero-spot__glow-blob::after {
    animation: none;
    --pp-home-hero-glow: 120deg;
  }
}
body.pp2p-stream .home-hero-spot__glow-blob .blob-anim {
  position: absolute;
  border-radius: 50%;
  filter: blur(28px);
  z-index: 0;
  opacity: 0.5;
}
body.pp2p-stream .home-hero-spot__glow-blob .blob-1 {
  width: 60%;
  height: 60%;
  background: var(--accent, #ff85a1);
  top: 8%;
  right: 0;
}
body.pp2p-stream .home-hero-spot__glow-blob .blob-2 {
  width: 50%;
  height: 50%;
  background: #6a1a3a;
  bottom: 5%;
  left: 5%;
}
body.pp2p-stream .home-hero-spot__circle-img {
  width: min(200px, 58vw) !important;
  height: min(200px, 58vw) !important;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid rgba(255, 150, 170, 0.4);
  box-shadow: 0 0 40px rgba(200, 40, 90, 0.3);
  position: relative;
  z-index: 1;
  background: #0a0a0c;
}
body.pp2p-stream .home-hero-carousel-inner {
  border-radius: 0 0 20px 20px;
  overflow: hidden;
}
body.pp2p-stream .home-hero-indicators {
  position: static;
  margin: 0 0.75rem 0.5rem;
  justify-content: center;
  gap: 0.4rem;
}
body.pp2p-stream .home-hero-indicators [data-bs-target] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 200, 210, 0.35) !important;
  border: 0 !important;
  opacity: 1;
}
body.pp2p-stream .home-hero-indicators .active {
  background: var(--accent) !important;
  transform: scale(1.25);
}
body.pp2p-stream .home-hero-count {
  color: #d8b8c8 !important;
  font-weight: 600;
  letter-spacing: 0.02em;
}
body.pp2p-stream .border-pink-ghost,
body.pp2p-stream .btn.home-hero-arrow {
  border-color: rgba(255, 150, 170, 0.5) !important;
  color: #ffe0ea !important;
  background: rgba(8, 6, 10, 0.6) !important;
}
body.pp2p-stream .home-hero-arrow:hover {
  background: rgba(80, 30, 50, 0.55) !important;
  border-color: var(--accent) !important;
  color: #fff5f8 !important;
}
body.pp2p-stream .home-hero-ctrls {
  border-bottom: 1px solid rgba(255, 120, 150, 0.12);
}
body.pp2p-stream .home-hero-spot--empty {
  min-height: 8rem;
}
body.pp2p-stream .home-hero-spot--empty .home-hero-empty-ico {
  font-size: 2.2rem;
  color: var(--accent, #ff85a1);
  opacity: 0.75;
}
body.pp2p-stream .home-hero-spot--empty .home-hero-empty-title {
  color: var(--pp-text, #fdf2f6);
  font-size: 1.1rem;
  letter-spacing: 0.02em;
}
body.pp2p-stream .home-hero-spotlight .carousel-control-next,
body.pp2p-stream .home-hero-spotlight .carousel-control-prev {
  /* ใช้ปุ่ม home-hero-arrow แทน */
  display: none;
}