/* [17 Okt 2026] Pro Trading desktop v2 (layout/pro-trading-halaman, GET pro-trading/{pair}).
   HANYA >= 992px dan HANYA #content.tata-pro (mode basic & tampilan HP/tablet tidak tersentuh: di bawah 992px semua
   elemen .dex-pt-* display:none dan tidak ada aturan lain yang berlaku).

   Berkas ini hanya dimuat oleh partial (saklar all_site.pro_trading_halaman_v2). Saklar mati = berkas tidak dimuat =
   tampilan pro lama (ui-fixes.css) apa adanya.

   Susunan grid pro (ui-fixes.css, "Tata letak /pro-trading") TIDAK diubah kecuali baris pertama: ticker lama
   (.blok-ticker, ticker ticker pasar) diganti bar ringkasan baru selebar penuh (kepala kepala kepala). Ticker lama
   tetap dirender & tetap ditulis socket -- hanya disembunyikan bila bar baru ada (:has + kelas cadangan dex-pt-aktif).
   Rantai flex/contain:size milik ui-fixes tidak disentuh: aturan di sini hanya warna, garis, radius, padding, huruf.

   Spesifisitas: semua penimpaan diawali "#page-container #content.tata-pro" (2 id) supaya menang atas aturan lama
   (#content.tata-pro ..., .darkmode ..., body.darkmode-page ...) tanpa perlu !important kecuali melawan !important lama.
   Mode gelap: #page-container.darkmode / body.darkmode-page (mekanisme yang sudah ada). Token dasar memakai
   --surface / --canvas dari design-v2.css sehingga ikut gelap otomatis. Semua kelas baru berawalan dex-pt-. */

/* ---------- di luar desktop: semua elemen baru tidak tampil ---------- */
.dex-pt,
.dex-pt-gudang,
.dex-pt-ob-alat,
.dex-pt-spread,
.dex-pt-segmen,
.dex-pt-geser,
.dex-pt-estimasi,
.dex-pt-maks,
.dex-pt-kosong,
.dex-pt-lihat-semua,
.dex-pt-pasar-alat,
.dex-pt-pasar-kosong,
.dex-pt-catatan-ikon { display: none; }
.dex-pt-gudang { display: none !important; }

@media (min-width: 992px) {

	/* =====================================================================
	   TOKEN
	   ===================================================================== */
	#page-container #content.tata-pro {
		--pt-kartu: var(--surface, #FFFFFF);
		--pt-garis: rgba(15, 23, 42, .08);
		--pt-garis-2: rgba(15, 23, 42, .14);
		--pt-teks: #0F172A;
		--pt-teks-2: #64748B;
		--pt-teks-3: #94A3B8;
		--pt-hover: #F1F5F9;
		--pt-isi: #F8FAFC;
		--pt-input: #FFFFFF;
		--pt-aksen: #2563EB;
		--pt-aksen-2: #1D4ED8;
		--pt-aksen-bg: #EFF6FF;
		--pt-naik: #16A34A;
		--pt-naik-bg: #F0FDF4;
		--pt-naik-kuat: #16A34A;
		--pt-turun: #E11D48;
		--pt-turun-bg: #FFF1F2;
		--pt-turun-kuat: #E11D48;
		--pt-bintang: #F59E0B;
		--pt-radius: 12px;
		--pt-bayang-menu: 0 12px 32px -8px rgba(15, 23, 42, .22), 0 2px 6px rgba(15, 23, 42, .06);
		font-family: 'Plus Jakarta Sans', 'Inter', 'Open Sans', system-ui, sans-serif;
	}
	#page-container.darkmode #content.tata-pro,
	body.darkmode-page #page-container #content.tata-pro {
		--pt-kartu: var(--surface, #121C30);
		--pt-garis: rgba(255, 255, 255, .08);
		--pt-garis-2: rgba(255, 255, 255, .16);
		--pt-teks: #F1F5F9;
		--pt-teks-2: #94A3B8;
		--pt-teks-3: #64748B;
		--pt-hover: rgba(255, 255, 255, .05);
		--pt-isi: rgba(255, 255, 255, .04);
		--pt-input: #0E2739;
		--pt-aksen: #60A5FA;
		--pt-aksen-2: #3B82F6;
		--pt-aksen-bg: rgba(37, 99, 235, .18);
		--pt-naik: #4ADE80;
		--pt-naik-bg: rgba(74, 222, 128, .12);
		--pt-turun: #FB7185;
		--pt-turun-bg: rgba(251, 113, 133, .12);
		--pt-bayang-menu: 0 16px 40px -10px rgba(0, 0, 0, .6), 0 2px 8px rgba(0, 0, 0, .35);
	}
	#page-container #content.tata-pro input,
	#page-container #content.tata-pro button,
	#page-container #content.tata-pro textarea { font-family: inherit; }

	/* [hidden] hanya untuk elemen baru -- elemen lama tidak disentuh */
	#page-container #content.tata-pro .dex-pt [hidden],
	#page-container #content.tata-pro [data-pt-bagian][hidden],
	#page-container #content.tata-pro [data-pt-bagian] [hidden] { display: none !important; }
	#page-container #content.tata-pro .dex-pt-sembunyi { display: none !important; }

	/* =====================================================================
	   SUSUNAN: bar ringkasan selebar penuh menggantikan ticker lama.
	   Dua aturan terpisah (bukan satu daftar selektor) supaya peramban tanpa :has
	   tetap menjalankan versi kelas cadangan dari JS.
	   ===================================================================== */
	#content.tata-pro:has(.dex-pt-kepala) {
		grid-template-areas:
			"kepala kepala kepala"
			"buku   grafik pasar"
			"buku   form   tabkanan"
			"buku   form   dagang";
		padding-bottom: 16px !important;
	}
	#content.tata-pro.dex-pt-aktif {
		grid-template-areas:
			"kepala kepala kepala"
			"buku   grafik pasar"
			"buku   form   tabkanan"
			"buku   form   dagang";
		padding-bottom: 16px !important;
	}
	#content.tata-pro:has(.dex-pt-kepala) .blok-ticker { display: none !important; }
	#content.tata-pro.dex-pt-aktif .blok-ticker { display: none !important; }
	#content.tata-pro:has(.dex-pt-kepala) .dex-pt-kepala { display: flex; grid-area: kepala; }
	#content.tata-pro.dex-pt-aktif .dex-pt-kepala { display: flex; grid-area: kepala; }
	/* tombol Basic Mode & Advanced Chart di bilah grafik pindah ke bar ringkasan */
	#content.tata-pro:has(.dex-pt-kepala) .blok-grafik .btn-tukar-tata,
	#content.tata-pro:has(.dex-pt-kepala) .blok-grafik .btn-advance { display: none !important; }
	#content.tata-pro.dex-pt-aktif .blok-grafik .btn-tukar-tata,
	#content.tata-pro.dex-pt-aktif .blok-grafik .btn-advance { display: none !important; }

	/* =====================================================================
	   BAR RINGKASAN (.dex-pt-kepala)
	   ===================================================================== */
	#page-container #content.tata-pro .dex-pt-kepala {
		position: relative;
		z-index: 6;
		flex-direction: column;
		gap: 10px;
		min-width: 0;
		padding: 12px 16px 10px;
		border: 1px solid var(--pt-garis);
		border-radius: var(--pt-radius);
		background: var(--pt-kartu);
		color: var(--pt-teks);
		font-size: 13px;
		line-height: 1.4;
	}
	#page-container #content.tata-pro .dex-pt *,
	#page-container #content.tata-pro .dex-pt *::before,
	#page-container #content.tata-pro .dex-pt *::after { box-sizing: border-box; }
	#page-container #content.tata-pro .dex-pt h2,
	#page-container #content.tata-pro .dex-pt p,
	#page-container #content.tata-pro .dex-pt dl,
	#page-container #content.tata-pro .dex-pt dd,
	#page-container #content.tata-pro .dex-pt ul { margin: 0; padding: 0; }
	#page-container #content.tata-pro .dex-pt ul { list-style: none; }
	#page-container #content.tata-pro .dex-pt button { cursor: pointer; }
	#page-container #content.tata-pro .dex-pt svg { flex: none; }
	#page-container #content.tata-pro .dex-pt :focus-visible { outline: 2px solid var(--pt-aksen); outline-offset: 2px; }

	#page-container #content.tata-pro .dex-pt-k-baris {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 28px;
		row-gap: 10px;
		min-width: 0;
	}

	/* identitas */
	#page-container #content.tata-pro .dex-pt-identitas {
		display: flex;
		align-items: center;
		gap: 10px;
		flex: 0 0 auto;
		min-width: 0;
	}
	#page-container #content.tata-pro .dex-pt-koin {
		position: relative;
		display: grid;
		place-items: center;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		background: var(--pt-hover);
		overflow: hidden;
	}
	#page-container #content.tata-pro .dex-pt-koin img {
		position: relative;
		z-index: 1;
		display: block;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		object-fit: cover;
	}
	#page-container #content.tata-pro .dex-pt-koin img.gagal { display: none; }
	#page-container #content.tata-pro .dex-pt-koin-huruf {
		position: absolute;
		inset: 0;
		display: grid;
		place-items: center;
		color: var(--pt-teks-2);
		font-size: 15px;
		font-weight: 800;
	}
	#page-container #content.tata-pro .dex-pt-nama { display: flex; flex-direction: column; min-width: 0; }
	#page-container #content.tata-pro .dex-pt-nama-atas { display: flex; align-items: center; gap: 6px; }
	#page-container #content.tata-pro .dex-pt-simbol {
		color: var(--pt-teks);
		font-size: 18px;
		font-weight: 800;
		letter-spacing: -.2px;
		line-height: 1.2;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-simbol span { color: var(--pt-teks-2); font-weight: 700; }
	#page-container #content.tata-pro .dex-pt-nama-koin {
		max-width: 180px;
		overflow: hidden;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 500;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-fav {
		display: grid;
		place-items: center;
		width: 26px;
		height: 26px;
		padding: 0;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--pt-garis-2);
		transition: color .15s ease, background-color .15s ease, transform .15s ease;
	}
	#page-container #content.tata-pro .dex-pt-fav svg {
		width: 18px;
		height: 18px;
		fill: none;
		stroke: currentColor;
		stroke-width: 1.8;
		stroke-linejoin: round;
	}
	#page-container #content.tata-pro .dex-pt-fav:hover { background: var(--pt-hover); color: var(--pt-bintang); }
	#page-container #content.tata-pro .dex-pt-fav[aria-pressed="true"] { color: var(--pt-bintang); }
	#page-container #content.tata-pro .dex-pt-fav[aria-pressed="true"] svg { fill: currentColor; }
	#page-container #content.tata-pro .dex-pt-fav.sibuk { opacity: .55; pointer-events: none; }
	#page-container #content.tata-pro .dex-pt-fav.letup { animation: dex-pt-letup .35s ease; }

	/* harga terakhir */
	#page-container #content.tata-pro .dex-pt-harga {
		display: flex;
		flex-direction: column;
		flex: 0 0 auto;
		min-width: 0;
	}
	#page-container #content.tata-pro .dex-pt-harga-angka {
		margin: 0 -6px;
		padding: 0 6px;
		border-radius: 8px;
		color: var(--pt-teks);
		font-size: 24px;
		font-weight: 800;
		letter-spacing: -.4px;
		line-height: 1.2;
		font-variant-numeric: tabular-nums;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-harga-angka.naik { color: var(--pt-naik); }
	#page-container #content.tata-pro .dex-pt-harga-angka.turun { color: var(--pt-turun); }
	#page-container #content.tata-pro .dex-pt-harga-angka.kilat-naik { animation: dex-pt-kilat-naik .9s ease-out; }
	#page-container #content.tata-pro .dex-pt-harga-angka.kilat-turun { animation: dex-pt-kilat-turun .9s ease-out; }
	#page-container #content.tata-pro .dex-pt-harga-sub {
		color: var(--pt-teks-2);
		font-size: 11px;
		font-weight: 600;
	}

	/* statistik 24 jam */
	#page-container #content.tata-pro .dex-pt-stat {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 24px;
		row-gap: 8px;
		flex: 1 1 0;
		min-width: 0;
	}
	#page-container #content.tata-pro .dex-pt-stat-item {
		display: flex;
		flex-direction: column;
		gap: 3px;
		min-width: 0;
	}
	#page-container #content.tata-pro .dex-pt-stat dt {
		color: var(--pt-teks-2);
		font-size: 11px;
		font-weight: 600;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-stat dd {
		color: var(--pt-teks);
		font-size: 13px;
		font-weight: 700;
		font-variant-numeric: tabular-nums;
		line-height: 1.35;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-pill {
		display: inline-block;
		padding: 1px 8px;
		border-radius: 999px;
		background: var(--pt-hover);
		font-weight: 800;
	}
	#page-container #content.tata-pro .dex-pt-pill.naik { background: var(--pt-naik-bg); color: var(--pt-naik); }
	#page-container #content.tata-pro .dex-pt-pill.turun { background: var(--pt-turun-bg); color: var(--pt-turun); }
	#page-container #content.tata-pro .dex-pt-rentang {
		position: relative;
		display: block;
		width: 120px;
		height: 6px;
		margin: 6px 0 5px;
		border-radius: 999px;
		background: linear-gradient(90deg, var(--pt-turun-bg), var(--pt-hover) 50%, var(--pt-naik-bg));
		box-shadow: inset 0 0 0 1px var(--pt-garis);
	}
	#page-container #content.tata-pro .dex-pt-rentang-isi {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: var(--pt-posisi, 50%);
		border-radius: 999px;
		background: linear-gradient(90deg, var(--pt-turun), var(--pt-aksen) 55%, var(--pt-naik));
		opacity: .35;
		transition: width .4s ease;
	}
	#page-container #content.tata-pro .dex-pt-rentang-titik {
		position: absolute;
		top: 50%;
		left: var(--pt-posisi, 50%);
		width: 12px;
		height: 12px;
		margin: -6px 0 0 -6px;
		border: 2px solid var(--pt-kartu);
		border-radius: 50%;
		background: var(--pt-aksen);
		box-shadow: 0 0 0 1px var(--pt-aksen);
		transition: left .4s ease;
	}

	/* baris 2: saldo, deposit/tarik, tautan */
	#page-container #content.tata-pro .dex-pt-k-alat {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 14px;
		row-gap: 8px;
		padding-top: 10px;
		border-top: 1px solid var(--pt-garis);
	}
	#page-container #content.tata-pro .dex-pt-saldo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
	#page-container #content.tata-pro .dex-pt-saldo-item {
		display: inline-flex;
		align-items: baseline;
		gap: 6px;
		height: 30px;
		padding: 0 10px;
		border: 1px solid transparent;
		border-radius: 8px;
		background: var(--pt-isi);
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 600;
		line-height: 28px;
		white-space: nowrap;
		transition: border-color .12s ease, background-color .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-saldo-item b {
		color: var(--pt-teks);
		font-weight: 800;
		font-variant-numeric: tabular-nums;
	}
	#page-container #content.tata-pro .dex-pt-saldo-item:hover { border-color: var(--pt-aksen); background: var(--pt-aksen-bg); }
	#page-container #content.tata-pro .dex-pt-saldo-item.segar b { animation: dex-pt-segar .8s ease; }

	#page-container #content.tata-pro .dex-pt-dana { display: flex; align-items: center; gap: 6px; }
	#page-container #content.tata-pro .dex-pt-menu { position: relative; }
	#page-container #content.tata-pro .dex-pt-menu > summary { list-style: none; }
	#page-container #content.tata-pro .dex-pt-menu > summary::-webkit-details-marker { display: none; }
	#page-container #content.tata-pro .dex-pt-tombol {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		height: 30px;
		padding: 0 10px 0 12px;
		border: 1px solid var(--pt-garis-2);
		border-radius: 8px;
		background: transparent;
		color: var(--pt-teks);
		font-size: 12px;
		font-weight: 700;
		line-height: 28px;
		white-space: nowrap;
		cursor: pointer;
		user-select: none;
		transition: background-color .12s ease, border-color .12s ease, filter .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-tombol:hover { background: var(--pt-hover); }
	#page-container #content.tata-pro .dex-pt-tombol svg { width: 14px; height: 14px; transition: transform .15s ease; }
	#page-container #content.tata-pro .dex-pt-menu[open] > .dex-pt-tombol svg { transform: rotate(180deg); }
	#page-container #content.tata-pro .dex-pt-tombol-utama {
		border-color: #2563EB;
		background: #2563EB;
		color: #FFFFFF;
	}
	#page-container #content.tata-pro .dex-pt-tombol-utama:hover { background: #2563EB; filter: brightness(1.08); }
	#page-container #content.tata-pro .dex-pt-menu-isi {
		position: absolute;
		top: calc(100% + 6px);
		left: 0;
		z-index: 30;
		display: flex;
		flex-direction: column;
		min-width: 170px;
		padding: 6px;
		border: 1px solid var(--pt-garis);
		border-radius: 10px;
		background: var(--pt-kartu);
		box-shadow: var(--pt-bayang-menu);
		animation: dex-pt-muncul .14s ease-out;
	}
	#page-container #content.tata-pro .dex-pt-menu-isi a {
		display: block;
		padding: 8px 10px;
		border-radius: 7px;
		color: var(--pt-teks) !important;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none !important;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-menu-isi a:hover,
	#page-container #content.tata-pro .dex-pt-menu-isi a:focus-visible { background: var(--pt-hover); color: var(--pt-aksen) !important; }

	#page-container #content.tata-pro .dex-pt-tautan {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 2px;
		margin-left: auto;
	}
	#page-container #content.tata-pro .dex-pt-tautan > a,
	#page-container #content.tata-pro .dex-pt-tautan > button {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		height: 28px;
		padding: 0 9px;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--pt-teks-2) !important;
		font-size: 12px;
		font-weight: 700;
		text-decoration: none !important;
		white-space: nowrap;
		transition: background-color .12s ease, color .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-tautan > a:hover,
	#page-container #content.tata-pro .dex-pt-tautan > button:hover { background: var(--pt-hover); color: var(--pt-aksen) !important; }
	#page-container #content.tata-pro .dex-pt-tautan svg { width: 13px; height: 13px; }
	#page-container #content.tata-pro .dex-pt-pemisah { width: 1px; height: 16px; margin: 0 4px; background: var(--pt-garis-2); }
	#page-container #content.tata-pro .dex-pt kbd {
		display: inline-grid;
		place-items: center;
		min-width: 20px;
		height: 20px;
		padding: 0 5px;
		border: 1px solid var(--pt-garis-2);
		border-bottom-width: 2px;
		border-radius: 5px;
		background: var(--pt-isi);
		box-shadow: none;
		color: var(--pt-teks);
		font-family: inherit;
		font-size: 11px;
		font-weight: 800;
		line-height: 1;
	}
	#page-container #content.tata-pro .dex-pt-tautan kbd { min-width: 18px; height: 18px; font-size: 10px; }

	/* tips pengguna baru */
	#page-container #content.tata-pro .dex-pt-tips {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 8px 8px 8px 12px;
		border: 1px solid color-mix(in srgb, var(--pt-aksen) 28%, transparent);
		border-radius: 10px;
		background: var(--pt-aksen-bg);
		animation: dex-pt-muncul .2s ease-out;
	}
	#page-container #content.tata-pro .dex-pt-tips-ikon { display: grid; place-items: center; color: var(--pt-aksen); }
	#page-container #content.tata-pro .dex-pt-tips-ikon svg { width: 18px; height: 18px; }
	#page-container #content.tata-pro .dex-pt-tips p { flex: 1 1 auto; min-width: 0; color: var(--pt-teks); font-size: 12px; }
	#page-container #content.tata-pro .dex-pt-tips p b { margin-right: 4px; font-weight: 800; }
	#page-container #content.tata-pro .dex-pt-tips .dex-pt-tombol { height: 28px; border-color: var(--pt-aksen); color: var(--pt-aksen); }
	#page-container #content.tata-pro .dex-pt-tips-tutup {
		display: grid;
		place-items: center;
		width: 28px;
		height: 28px;
		padding: 0;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--pt-teks-2);
	}
	#page-container #content.tata-pro .dex-pt-tips-tutup svg { width: 16px; height: 16px; }
	#page-container #content.tata-pro .dex-pt-tips-tutup:hover { background: var(--pt-hover); color: var(--pt-teks); }

	/* panel pintasan keyboard */
	#page-container #content.tata-pro .dex-pt-pintasan-panel {
		position: absolute;
		top: calc(100% + 8px);
		right: 12px;
		z-index: 40;
		width: 300px;
		padding: 12px 14px 14px;
		border: 1px solid var(--pt-garis);
		border-radius: 12px;
		background: var(--pt-kartu);
		box-shadow: var(--pt-bayang-menu);
		animation: dex-pt-muncul .14s ease-out;
	}
	#page-container #content.tata-pro .dex-pt-pintasan-kepala {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 8px;
		font-size: 13px;
	}
	#page-container #content.tata-pro .dex-pt-pintasan-panel li {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 5px 0;
		color: var(--pt-teks);
		font-size: 12px;
		font-weight: 500;
	}
	#page-container #content.tata-pro .dex-pt-pintasan-panel li kbd { min-width: 34px; }
	#page-container #content.tata-pro .dex-pt-pintasan-panel > p {
		margin-top: 8px;
		color: var(--pt-teks-2);
		font-size: 11px;
	}

	/* layar 992-1365: bar lebih rapat */
	@media (max-width: 1365px) {
		#page-container #content.tata-pro .dex-pt-k-baris { column-gap: 18px; }
		#page-container #content.tata-pro .dex-pt-stat { column-gap: 16px; }
		#page-container #content.tata-pro .dex-pt-harga-angka { font-size: 21px; }
		#page-container #content.tata-pro .dex-pt-rentang { width: 90px; }
		#page-container #content.tata-pro .dex-pt-nama-koin { max-width: 120px; }
	}
	@media (max-width: 1199px) {
		#page-container #content.tata-pro .dex-pt-stat-rentang { display: none; }
		#page-container #content.tata-pro .dex-pt-tautan .dex-pt-pemisah { display: none; }
	}

	/* =====================================================================
	   KARTU: radius + garis tipis + latar seragam (mengikuti --surface)
	   ===================================================================== */
	#page-container #content.tata-pro .blok-grafik > .col-md-12,
	#page-container #content.tata-pro .blok-form > .col-md-12 > .panel,
	#page-container #content.tata-pro .kolom-buku > .row > .col-md-12 > .panel,
	#page-container #content.tata-pro #side-market-tab {
		border: 1px solid var(--pt-garis) !important;
		border-radius: var(--pt-radius) !important;
		background: var(--pt-kartu) !important;
		box-shadow: none !important;
		overflow: hidden;
	}
	#page-container #content.tata-pro .kolom-pasar > .row > .panel {
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}
	/* panel di dalam kartu: rata, tanpa garis/latar sendiri */
	#page-container #content.tata-pro #order-book .kolom-jual > .row > .panel,
	#page-container #content.tata-pro #order-book .kolom-beli > .row > .panel,
	#page-container #content.tata-pro #order-book .panel-heading,
	#page-container #content.tata-pro #order-book .panel-body,
	#page-container #content.tata-pro .blok-form > .col-md-12 > .panel > .panel-heading,
	#page-container #content.tata-pro .blok-form #form-order,
	#page-container #content.tata-pro #side-market-tab > .tab-content,
	#page-container #content.tata-pro #side-market-tab .tab-content {
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}
	/* strip tab yang menempel ke panelnya: sudut atas di strip, sudut bawah di panel */
	#page-container #content.tata-pro .tab-kanan-pro,
	#page-container #content.tata-pro .tab-bawah-pro {
		border: 1px solid var(--pt-garis) !important;
		border-bottom: 1px solid var(--pt-garis) !important;
		border-radius: var(--pt-radius) var(--pt-radius) 0 0;
		background: var(--pt-kartu) !important;
	}
	#page-container #content.tata-pro .blok-dagang .panel,
	#page-container #content.tata-pro .panel-bawah,
	#page-container #content.tata-pro .blok-order-aktif {
		border: 1px solid var(--pt-garis) !important;
		border-top: 0 !important;
		border-radius: 0 0 var(--pt-radius) var(--pt-radius) !important;
		background: var(--pt-kartu) !important;
		overflow: hidden;
	}

	/* =====================================================================
	   TAB: Order Book, Market | Chat, Market Trades, Open Orders | ...
	   Ukuran px, bukan vw (.6vw = 8,6px di layar 1440 -- terlalu kecil).
	   ===================================================================== */
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs,
	#page-container #content.tata-pro #tab_right_side {
		display: flex;
		gap: 2px;
		margin: 0;
		padding: 0 8px;
		border: 0;
		background: transparent !important;
	}
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs::before,
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs::after,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs::before,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs::after,
	#page-container #content.tata-pro #tab_right_side::before,
	#page-container #content.tata-pro #tab_right_side::after { display: none; }
	#page-container #content.tata-pro #tab_right_side { border-bottom: 1px solid var(--pt-garis); }
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs > li,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li,
	#page-container #content.tata-pro #tab_right_side > li {
		float: none;
		width: auto !important;
		margin: 0 0 -1px;
		border: 0 !important;
		background: transparent !important;
	}
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs > li > a,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li > a,
	#page-container #content.tata-pro #tab_right_side > li > a,
	#page-container #content.tata-pro #order-book .title-order-book {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin: 0;
		padding: 10px 8px 8px !important;
		border: 0 !important;
		border-bottom: 2px solid transparent !important;
		border-radius: 0;
		background: transparent !important;
		color: var(--pt-teks-2) !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		line-height: 1.3;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs > li > a:hover,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li > a:hover,
	#page-container #content.tata-pro #tab_right_side > li > a:hover { color: var(--pt-teks) !important; }
	#page-container #content.tata-pro .tab-kanan-pro .nav-tabs > li.active > a,
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li.active > a,
	#page-container #content.tata-pro #tab_right_side > li.active > a,
	#page-container #content.tata-pro #order-book .title-order-book {
		border-bottom-color: var(--pt-aksen) !important;
		color: var(--pt-teks) !important;
	}
	#page-container #content.tata-pro .tab-kanan-pro { padding: 0; }
	/* Open Orders(<n>): tanda kurung lama berupa node teks -> disembunyikan lewat font-size 0, angkanya jadi lencana */
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li > a[data-tab-bawah="aktif"] { font-size: 0 !important; }
	#page-container #content.tata-pro .tab-bawah-pro .nav-tabs > li > a[data-tab-bawah="aktif"] > span { font-size: 13px; }
	#page-container #content.tata-pro .tab-bawah-pro .jml-open-order {
		display: inline-grid;
		place-items: center;
		min-width: 20px;
		height: 18px;
		margin-left: 6px;
		padding: 0 6px;
		border-radius: 999px;
		background: var(--pt-hover);
		color: var(--pt-teks-2);
		font-size: 11px !important;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}
	#page-container #content.tata-pro .tab-bawah-pro .jml-open-order.ada { background: var(--pt-aksen); color: #FFFFFF; }
	#page-container #content.tata-pro .tab-bawah-pro .jml-open-order.letup { animation: dex-pt-letup .35s ease; }
	#page-container #content.tata-pro .tab-bawah-pro { align-items: stretch; }
	#page-container #content.tata-pro .dex-pt-lihat-semua {
		display: inline-flex;
		align-items: center;
		gap: 2px;
		margin-left: auto;
		padding: 0 14px;
		color: var(--pt-aksen) !important;
		font-size: 12px;
		font-weight: 700;
		text-decoration: none !important;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-lihat-semua svg { width: 14px; height: 14px; transition: transform .15s ease; }
	#page-container #content.tata-pro .dex-pt-lihat-semua:hover svg { transform: translateX(2px); }

	/* =====================================================================
	   BILAH ALAT GRAFIK: segmented kalem, bukan tombol biru berderet
	   ===================================================================== */
	#page-container #content.tata-pro .blok-grafik > .col-md-12 { padding: 8px 10px 0 !important; }
	#page-container #content.tata-pro .blok-grafik #chart_tabs,
	#page-container #content.tata-pro .blok-grafik #kline_tf,
	#page-container #content.tata-pro .blok-grafik #kline_ind {
		display: inline-flex;
		gap: 2px;
		padding: 3px;
		border-radius: 9px;
		background: var(--pt-hover);
	}
	#page-container #content.tata-pro .blok-grafik #chart_tabs > .btn,
	#page-container #content.tata-pro .blok-grafik #kline_tf > .btn,
	#page-container #content.tata-pro .blok-grafik #kline_ind > .btn {
		float: none;
		height: 24px;
		margin: 0;
		padding: 0 10px;
		border: 0 !important;
		border-radius: 6px !important;
		background: transparent !important;
		color: var(--pt-teks-2) !important;
		font-size: 11px;
		font-weight: 700;
		line-height: 24px;
		box-shadow: none;
	}
	#page-container #content.tata-pro .blok-grafik #chart_tabs > .btn:hover,
	#page-container #content.tata-pro .blok-grafik #kline_tf > .btn:hover,
	#page-container #content.tata-pro .blok-grafik #kline_ind > .btn:hover { color: var(--pt-teks) !important; }
	#page-container #content.tata-pro .blok-grafik #chart_tabs > .btn.btn-primary,
	#page-container #content.tata-pro .blok-grafik #kline_tf > .btn.btn-primary,
	#page-container #content.tata-pro .blok-grafik #kline_ind > .btn.btn-primary {
		background: var(--pt-kartu) !important;
		color: var(--pt-aksen) !important;
		box-shadow: 0 1px 2px rgba(15, 23, 42, .14);
	}
	#page-container #content.tata-pro .blok-grafik #kline_ind > .btn.dexapp-trd-mobile-only { display: none; }
	#page-container #content.tata-pro .blok-grafik #kline_ohlc { color: var(--pt-teks-2); }

	/* =====================================================================
	   ORDER BOOK
	   ===================================================================== */
	#page-container #content.tata-pro #order-book .kolom-jual .panel-heading {
		min-height: 0;
		padding: 0 6px 0 8px !important;
		border-bottom: 1px solid var(--pt-garis) !important;
	}
	#page-container #content.tata-pro #order-book .kolom-jual .panel-heading > .row { justify-content: space-between; }
	#page-container #content.tata-pro #order-book .kolom-jual .panel-heading > .row::before,
	#page-container #content.tata-pro #order-book .kolom-jual .panel-heading > .row::after { display: none; }
	#page-container #content.tata-pro #order-book .kolom-jual .panel-heading .col-md-8 { display: flex; justify-content: flex-end; }
	#page-container #content.tata-pro .dex-pt-ob-alat {
		display: inline-flex;
		gap: 2px;
		padding: 2px;
		border-radius: 8px;
		background: var(--pt-hover);
	}
	#page-container #content.tata-pro .dex-pt-ob-alat button {
		display: grid;
		place-items: center;
		width: 26px;
		height: 22px;
		padding: 0;
		border: 0;
		border-radius: 6px;
		background: transparent;
		opacity: .55;
		cursor: pointer;
		transition: opacity .12s ease, background-color .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-ob-alat button:hover { opacity: .9; }
	#page-container #content.tata-pro .dex-pt-ob-alat button[aria-pressed="true"] {
		background: var(--pt-kartu);
		opacity: 1;
		box-shadow: 0 1px 2px rgba(15, 23, 42, .14);
	}
	#page-container #content.tata-pro .dex-pt-ob-alat svg { width: 14px; height: 14px; }
	#page-container #content.tata-pro .dex-pt-ob-alat .j { fill: var(--pt-turun); }
	#page-container #content.tata-pro .dex-pt-ob-alat .b { fill: var(--pt-naik); }
	#page-container #content.tata-pro .dex-pt-ob-alat button:focus-visible { outline: 2px solid var(--pt-aksen); outline-offset: 1px; }

	/* mode tampilan (kelas di #order-book dari JS) */
	#page-container #content.tata-pro #order-book.dex-pt-ob-beli .kolom-jual { flex: 0 0 auto !important; }
	#page-container #content.tata-pro #order-book.dex-pt-ob-beli .kolom-jual .panel-body { display: none !important; }
	#page-container #content.tata-pro #order-book.dex-pt-ob-beli .kolom-beli thead { display: table-header-group !important; }
	#page-container #content.tata-pro #order-book.dex-pt-ob-jual .kolom-beli { display: none !important; }

	#page-container #content.tata-pro #order-book .table > thead > tr > th {
		padding: 6px 8px !important;
		border-bottom: 0 !important;
		background: var(--pt-kartu) !important;
		color: var(--pt-teks-2) !important;
		font-size: 10.5px !important;
		font-weight: 600 !important;
	}
	#page-container #content.tata-pro #order-book .table > tbody > tr > td,
	#page-container #content.tata-pro #table_sell > tr > td,
	#page-container #content.tata-pro #table_buy > tr > td {
		padding: 0 8px !important;
		border: 0 !important;
		color: var(--pt-teks);
		font-size: 11.5px;
		font-weight: 500;
		line-height: 1.75;
		font-variant-numeric: tabular-nums;
	}
	#page-container #content.tata-pro #order-book .table > tbody > tr { cursor: pointer; }
	#page-container #content.tata-pro #order-book .table > tbody > tr:hover > td { background: var(--pt-hover); }
	#page-container #content.tata-pro #order-book .table > tbody > tr.high_demand > td { font-weight: 800; }
	#page-container #content.tata-pro #order-book .text-sell { color: var(--pt-turun) !important; }
	#page-container #content.tata-pro #order-book .text-buy { color: var(--pt-naik) !important; }

	#page-container #content.tata-pro .bar-harga-pro {
		justify-content: flex-start;
		align-items: baseline;
		gap: 6px;
		padding: 7px 10px;
		border: 0 !important;
		border-top: 1px solid var(--pt-garis) !important;
		border-bottom: 1px solid var(--pt-garis) !important;
		background: var(--pt-isi) !important;
	}
	#page-container #content.tata-pro .harga-pro {
		font-size: 17px;
		font-weight: 800;
		letter-spacing: -.2px;
		font-variant-numeric: tabular-nums;
	}
	#page-container #content.tata-pro .harga-pro.naik { color: var(--pt-naik); }
	#page-container #content.tata-pro .harga-pro.turun { color: var(--pt-turun); }
	#page-container #content.tata-pro .pair-harga-pro { color: var(--pt-teks-2); font-size: 11px; font-weight: 600; }
	#page-container #content.tata-pro .dex-pt-spread {
		display: inline-flex;
		align-items: baseline;
		gap: 4px;
		margin-left: auto;
		color: var(--pt-teks-2);
		font-size: 10.5px;
		font-weight: 600;
		white-space: nowrap;
		cursor: help;
	}
	#page-container #content.tata-pro .dex-pt-spread b { color: var(--pt-teks); font-weight: 700; font-variant-numeric: tabular-nums; }
	#page-container #content.tata-pro .bar-rasio-pro {
		padding: 7px 10px;
		border: 0 !important;
		border-top: 1px solid var(--pt-garis) !important;
		background: transparent !important;
		font-size: 11px;
	}
	#page-container #content.tata-pro .bar-rasio-pro .sisi-beli,
	#page-container #content.tata-pro .bar-rasio-pro .angka-beli { color: var(--pt-naik); }
	#page-container #content.tata-pro .bar-rasio-pro .sisi-jual,
	#page-container #content.tata-pro .bar-rasio-pro .angka-jual { color: var(--pt-turun); }
	#page-container #content.tata-pro .bar-rasio-pro .sisi-beli,
	#page-container #content.tata-pro .bar-rasio-pro .sisi-jual {
		display: inline-grid;
		place-items: center;
		width: 18px;
		height: 18px;
		border-radius: 5px;
		font-size: 10px;
	}
	#page-container #content.tata-pro .bar-rasio-pro .sisi-beli { background: var(--pt-naik-bg); }
	#page-container #content.tata-pro .bar-rasio-pro .sisi-jual { background: var(--pt-turun-bg); }
	#page-container #content.tata-pro .batang-rasio { gap: 2px; height: 5px; background: transparent; }
	#page-container #content.tata-pro .batang-rasio i { border-radius: 999px; transition: width .35s ease; }
	#page-container #content.tata-pro .batang-rasio .isi-beli { background: var(--pt-naik); }
	#page-container #content.tata-pro .batang-rasio .isi-jual { background: var(--pt-turun); }

	/* =====================================================================
	   DAFTAR MARKET (panel kanan) -- sama dengan Spot desktop (trading-desktop.css):
	   baris jadi grid 4 kolom bintang | ikon+simbol+nama | harga | %; kolom Vol disembunyikan
	   (angkanya tetap dipakai chip urut "Volume").
	   ===================================================================== */
	#page-container #content.tata-pro #market > .tab-content { padding-top: 0 !important; }
	#page-container #content.tata-pro #market .tab-pane > .row:first-child {
		margin: 0 !important;
		padding: 8px 10px 0 !important;
	}
	#page-container #content.tata-pro #market .tab-pane > .row:first-child > .col-md-12 { margin: 0 !important; padding: 0 !important; }
	#page-container #content.tata-pro .kolom-pasar .search-box {
		display: flex;
		align-items: center;
		gap: 8px;
		height: 32px;
		margin: 0 !important;
		padding: 0 10px !important;
		border: 1px solid var(--pt-garis);
		border-radius: 9px;
		background: transparent;
		color: var(--pt-teks-2);
	}
	#page-container #content.tata-pro .kolom-pasar .search-box::before,
	#page-container #content.tata-pro .kolom-pasar .search-box::after { display: none; }
	#page-container #content.tata-pro .kolom-pasar .search-box:focus-within {
		border-color: var(--pt-aksen);
		box-shadow: 0 0 0 3px var(--pt-aksen-bg);
	}
	#page-container #content.tata-pro .kolom-pasar .search-box .icon-search {
		float: none;
		width: auto;
		padding: 0 !important;
		color: var(--pt-teks-2);
		font-size: 12px;
	}
	#page-container #content.tata-pro .kolom-pasar .search-box .search-custom {
		float: none;
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
		height: 30px;
		padding: 0;
		border: 0;
		outline: 0;
		background: transparent !important;
		color: var(--pt-teks) !important;
		font-size: 12.5px !important;
		font-weight: 500;
	}
	#page-container #content.tata-pro .kolom-pasar .search-box .search-custom::placeholder { color: var(--pt-teks-2); opacity: 1; }
	#page-container #content.tata-pro .kolom-pasar .search-box::after {
		content: '/';
		display: inline-grid !important;
		place-items: center;
		width: 18px;
		height: 18px;
		border: 1px solid var(--pt-garis-2);
		border-radius: 5px;
		color: var(--pt-teks-3);
		font-size: 10px;
		font-weight: 800;
	}
	#page-container #content.tata-pro .kolom-pasar .search-box:focus-within::after { display: none !important; }

	/* tab Semua / Favorit + chip urut */
	#page-container #content.tata-pro .dex-pt-pasar-alat {
		display: flex;
		flex: 0 0 auto;
		flex-direction: column;
		gap: 6px;
		padding: 8px 10px 4px;
	}
	#page-container #content.tata-pro .dex-pt-pasar-tab { display: flex; gap: 4px; }
	#page-container #content.tata-pro .dex-pt-pasar-tab button {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		height: 26px;
		padding: 0 10px;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 700;
		cursor: pointer;
	}
	#page-container #content.tata-pro .dex-pt-pasar-tab button:hover { background: var(--pt-hover); color: var(--pt-teks); }
	#page-container #content.tata-pro .dex-pt-pasar-tab button[aria-pressed="true"] { background: var(--pt-aksen-bg); color: var(--pt-aksen); }
	#page-container #content.tata-pro .dex-pt-pasar-tab svg {
		width: 13px;
		height: 13px;
		fill: var(--pt-bintang);
		stroke: var(--pt-bintang);
		stroke-width: 1.5;
		stroke-linejoin: round;
	}
	#page-container #content.tata-pro .dex-pt-jml {
		display: inline-grid;
		place-items: center;
		min-width: 18px;
		height: 16px;
		padding: 0 5px;
		border-radius: 999px;
		background: var(--pt-hover);
		color: var(--pt-teks-2);
		font-size: 10px;
		font-weight: 800;
	}
	#page-container #content.tata-pro .dex-pt-urut {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 3px;
		padding: 3px;
		border-radius: 9px;
		background: var(--pt-hover);
	}
	#page-container #content.tata-pro .dex-pt-urut button {
		height: 22px;
		padding: 0 4px;
		border: 0;
		border-radius: 6px;
		background: transparent;
		color: var(--pt-teks-2);
		font-size: 11px;
		font-weight: 700;
		white-space: nowrap;
		cursor: pointer;
	}
	#page-container #content.tata-pro .dex-pt-urut button:hover { color: var(--pt-teks); }
	#page-container #content.tata-pro .dex-pt-urut button[aria-pressed="true"] {
		background: var(--pt-kartu);
		color: var(--pt-aksen);
		box-shadow: 0 1px 2px rgba(15, 23, 42, .12);
	}
	#page-container #content.tata-pro .dex-pt-pasar-tab button:focus-visible,
	#page-container #content.tata-pro .dex-pt-urut button:focus-visible { outline: 2px solid var(--pt-aksen); outline-offset: 1px; }
	#page-container #content.tata-pro .dex-pt-pasar-kosong {
		display: flex;
		flex: 0 0 auto;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 22px 16px;
		color: var(--pt-teks-2);
		font-size: 12px;
		text-align: center;
	}
	#page-container #content.tata-pro .dex-pt-pasar-kosong svg {
		width: 26px;
		height: 26px;
		fill: none;
		stroke: var(--pt-bintang);
		stroke-width: 1.6;
		stroke-linejoin: round;
	}

	/* tabel -> blok + baris grid */
	#page-container #content.tata-pro .kolom-pasar .header-side-market,
	#page-container #content.tata-pro .kolom-pasar .side-market {
		border: 0;
		font-family: inherit !important;
	}
	#page-container #content.tata-pro .kolom-pasar .header-side-market { overflow: visible; }
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table,
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets {
		display: block;
		width: 100% !important;
		margin: 0 !important;
		border: 0 !important;
		background: transparent;
		font-size: 12px;
	}
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead,
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody { display: block; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > thead { display: none !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .dataTables_wrapper { width: 100%; }
	#page-container #content.tata-pro .kolom-pasar .side-market .dataTables_filter,
	#page-container #content.tata-pro .kolom-pasar .side-market .dataTables_info,
	#page-container #content.tata-pro .kolom-pasar .side-market .dataTables_paginate { display: none !important; }
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr,
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr {
		display: grid;
		grid-template-columns: 16px minmax(0, 1.3fr) minmax(0, 1fr) 60px;
		column-gap: 8px;
		align-items: center;
		margin: 0 4px;
		padding: 5px 8px;
		border-radius: 8px;
	}
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr { padding-top: 4px; padding-bottom: 4px; }
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th,
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td {
		display: block;
		width: auto !important;
		min-width: 0;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		text-align: left;
		vertical-align: middle;
	}
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th {
		position: static;
		color: var(--pt-teks-2) !important;
		font-size: 10.5px !important;
		font-weight: 600 !important;
		line-height: 1.6;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th:first-child { font-size: 0 !important; }
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th:nth-child(3),
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th:nth-child(4),
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:nth-child(3),
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:nth-child(4) { text-align: right; }
	#page-container #content.tata-pro .kolom-pasar .header-side-market > .table > thead > tr > th:nth-child(5),
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:nth-child(5) { display: none; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr {
		cursor: pointer;
		background: transparent !important;
		font-variant-numeric: tabular-nums;
		transition: background-color .12s ease;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr:hover { background: var(--pt-hover) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr.dex-pt-baris-aktif {
		background: var(--pt-aksen-bg) !important;
		box-shadow: inset 2px 0 0 var(--pt-aksen);
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr.dexapp-suspend { opacity: .55; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr.dex-pt-tersaring { display: none !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:first-child {
		font-size: 0 !important;
		line-height: 1;
		text-align: center;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .btn-favourite { display: inline-block; padding: 2px 0; font-size: 12px; line-height: 1; }
	#page-container #content.tata-pro .kolom-pasar .side-market .btn-marked .far { color: var(--pt-garis-2) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .btn-marked:hover .far { color: var(--pt-bintang) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .btn-marked .fa { color: var(--pt-bintang) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col {
		display: grid;
		grid-template-columns: 20px minmax(0, 1fr);
		column-gap: 8px;
		align-items: center;
		margin: 0;
		overflow: hidden;
		color: var(--pt-teks);
		font-size: 12px;
		font-weight: 800;
		line-height: 1.25;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col::before,
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col::after { display: none; }
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col > .img-asset {
		grid-column: 1;
		grid-row: 1 / span 2;
		width: 20px;
		height: 20px;
		margin: 0;
		border-radius: 50%;
		background-position: center;
		background-size: cover;
		object-fit: cover;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col > .market-alias {
		display: block !important;
		grid-column: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		color: var(--pt-teks-2);
		font-size: 10px;
		font-weight: 500;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .asset-col > .market-alias:empty { display: none !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:nth-child(3) {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		color: var(--pt-teks);
		font-size: 12px !important;
		font-weight: 600;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .table-markets > tbody > tr > td:nth-child(4) {
		white-space: nowrap;
		font-size: 12px !important;
		font-weight: 800;
	}
	#page-container #content.tata-pro .kolom-pasar .side-market .text-buy { color: var(--pt-naik) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .text-sell { color: var(--pt-turun) !important; }
	#page-container #content.tata-pro .kolom-pasar .side-market .dataTables_empty {
		grid-column: 1 / -1;
		padding: 18px 0 !important;
		color: var(--pt-teks-2);
		font-size: 12px !important;
		text-align: center !important;
	}

	/* =====================================================================
	   FORM BELI / JUAL
	   ===================================================================== */
	/* flex: kartu form mengisi tinggi selnya (rantai flex ui-fixes: .blok-form > .col-md-12 kolom flex) */
	#page-container #content.tata-pro .blok-form > .col-md-12 > .panel { flex: 1 1 auto; padding: 0 12px 12px 2px !important; }
	#page-container #content.tata-pro .blok-form > .col-md-12 > .panel > .panel-heading { display: none; }
	#page-container #content.tata-pro .blok-form #form-order { color: var(--pt-teks); font-size: 13px; }
	#page-container #content.tata-pro .blok-form #form-order > .row:first-child {
		display: flex;
		align-items: center;
		gap: 12px;
		margin: 0 !important;
		padding: 10px 0 8px 10px !important;
	}
	#page-container #content.tata-pro .blok-form #form-order > .row:first-child::before,
	#page-container #content.tata-pro .blok-form #form-order > .row:first-child::after { display: none; }
	#page-container #content.tata-pro .blok-form #form-order > .row:first-child > * { float: none !important; }
	#page-container #content.tata-pro .blok-form #form-order .text-title {
		color: var(--pt-teks);
		font-size: 14px;
		font-weight: 800;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .blok-form #form-order .btn-info-bnb {
		height: 28px;
		margin-left: auto;
		padding: 0 10px;
		border: 1px solid var(--pt-garis) !important;
		border-radius: 8px;
		background: transparent !important;
		color: var(--pt-aksen) !important;
		font-size: 12px;
		font-weight: 700 !important;
		line-height: 26px;
		box-shadow: none;
	}
	#page-container #content.tata-pro .blok-form #form-order .btn-info-bnb:hover { background: var(--pt-aksen-bg) !important; }

	/* segmented Limit | Market */
	#page-container #content.tata-pro .dex-pt-segmen {
		display: inline-flex;
		gap: 2px;
		padding: 3px;
		border-radius: 9px;
		background: var(--pt-hover);
	}
	#page-container #content.tata-pro .dex-pt-segmen button {
		height: 26px;
		padding: 0 14px;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 700;
		cursor: pointer;
		transition: background-color .12s ease, color .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-segmen button:hover { color: var(--pt-teks); }
	#page-container #content.tata-pro .dex-pt-segmen button[aria-pressed="true"] {
		background: var(--pt-kartu);
		color: var(--pt-aksen);
		box-shadow: 0 1px 2px rgba(15, 23, 42, .14);
	}
	#page-container #content.tata-pro .dex-pt-segmen button:focus-visible { outline: 2px solid var(--pt-aksen); outline-offset: 1px; }

	/* dua form: rata di dalam kartu, dipisah garis tipis */
	#page-container #content.tata-pro #form-order form.add-full-border {
		padding: 12px 14px 14px !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		transition: box-shadow .2s ease;
	}
	#page-container #content.tata-pro #form-order form[id^="form_sell"].add-full-border { border-left: 1px solid var(--pt-garis) !important; }
	#page-container #content.tata-pro #form-order form.dex-pt-sorot { box-shadow: inset 0 0 0 2px var(--pt-aksen-bg) !important; border-radius: 10px !important; }
	#page-container #content.tata-pro #form-order .form-group { margin-bottom: 9px; }
	#page-container #content.tata-pro #form-order .balance-row {
		display: flex;
		align-items: center;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-variant-numeric: tabular-nums;
	}
	#page-container #content.tata-pro #form-order .balance-row::before,
	#page-container #content.tata-pro #form-order .balance-row::after { display: none; }
	#page-container #content.tata-pro #form-order .balance-row > .col-md-5 {
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		flex-wrap: wrap;
		gap: 2px 4px;
		width: auto;
		float: none;
	}
	#page-container #content.tata-pro #form-order .balance-row > .col-md-3,
	#page-container #content.tata-pro #form-order .balance-row > .col-md-4 { flex: 0 0 auto; width: auto; float: none; }
	#page-container #content.tata-pro #form-order .balance-row label { color: var(--pt-teks-2); font-weight: 600; }
	#page-container #content.tata-pro #form-order .balance-row a {
		color: var(--pt-teks);
		font-weight: 800;
		text-decoration: none;
		border-bottom: 1px dashed var(--pt-garis-2);
	}
	#page-container #content.tata-pro #form-order .balance-row a:hover { color: var(--pt-aksen); border-bottom-color: var(--pt-aksen); }
	#page-container #content.tata-pro #form-order .balance-row br { display: none; }
	#page-container #content.tata-pro .dex-pt-maks {
		display: inline-flex;
		align-items: center;
		height: 18px;
		margin-left: 4px;
		padding: 0 6px;
		border: 1px solid var(--pt-aksen);
		border-radius: 5px;
		background: transparent;
		color: var(--pt-aksen);
		font-size: 10px;
		font-weight: 800;
		letter-spacing: .3px;
		text-transform: uppercase;
		cursor: pointer;
	}
	#page-container #content.tata-pro .dex-pt-maks:hover { background: var(--pt-aksen); color: #FFFFFF; }
	#page-container #content.tata-pro #form-order .logo-buy { margin-right: 0 !important; color: var(--pt-teks); font-size: 13px; font-weight: 800; }
	#page-container #content.tata-pro #form-order .logo-bg { width: 20px; height: 20px; border-radius: 50%; background: transparent; }
	#page-container #content.tata-pro #form-order .logo-bg img { width: 20px; height: 20px; border-radius: 50%; }
	#page-container #content.tata-pro #form-order .control-label {
		padding-top: 10px;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 600;
	}
	#page-container #content.tata-pro #form-order .input-group.add-full-border {
		display: flex;
		align-items: stretch;
		width: 100%;
		overflow: hidden;
		border: 1px solid var(--pt-garis-2) !important;
		border-radius: 9px;
		background: var(--pt-input);
		transition: border-color .12s ease, box-shadow .12s ease;
	}
	#page-container #content.tata-pro #form-order form[id^="form_buy"] .input-group.add-full-border:focus-within {
		border-color: var(--pt-naik-kuat) !important;
		box-shadow: 0 0 0 3px var(--pt-naik-bg);
	}
	#page-container #content.tata-pro #form-order form[id^="form_sell"] .input-group.add-full-border:focus-within {
		border-color: var(--pt-turun-kuat) !important;
		box-shadow: 0 0 0 3px var(--pt-turun-bg);
	}
	#page-container #content.tata-pro #form-order .input-group .form-control {
		flex: 1 1 auto;
		float: none;
		width: auto;
		min-width: 0;
		height: 36px;
		padding: 0 12px;
		border: 0;
		background: var(--pt-input) !important;
		color: var(--pt-teks) !important;
		font-size: 13px;
		font-weight: 600;
		font-variant-numeric: tabular-nums;
		box-shadow: none;
	}
	#page-container #content.tata-pro #form-order .input-group .form-control.dex-pt-terisi { animation: dex-pt-terisi .7s ease; }
	#page-container #content.tata-pro #form-order .input-group .input-group-addon {
		display: flex;
		align-items: center;
		width: auto;
		padding: 0 12px;
		border: 0;
		background: var(--pt-isi) !important;
		color: var(--pt-teks-2) !important;
		font-size: 12px;
		font-weight: 700;
	}
	#page-container #content.tata-pro #form-order .row-percentages {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}
	#page-container #content.tata-pro #form-order .btn-percentages {
		flex: 1 1 0;
		min-width: 0;
		height: 24px;
		margin: 0;
		padding: 0 2px;
		border: 1px solid var(--pt-garis) !important;
		border-radius: 7px;
		background: transparent !important;
		color: var(--pt-teks-2) !important;
		font-size: 11px;
		font-weight: 700;
		white-space: nowrap;
		box-shadow: none;
	}
	#page-container #content.tata-pro #form-order .btn-percentages:hover { border-color: var(--pt-garis-2) !important; color: var(--pt-teks) !important; }
	#page-container #content.tata-pro #form-order form[id^="form_buy"] .btn-percentages.percent-active {
		border-color: var(--pt-naik-kuat) !important;
		background: var(--pt-naik-bg) !important;
		color: var(--pt-naik) !important;
	}
	#page-container #content.tata-pro #form-order form[id^="form_sell"] .btn-percentages.percent-active {
		border-color: var(--pt-turun-kuat) !important;
		background: var(--pt-turun-bg) !important;
		color: var(--pt-turun) !important;
	}

	/* slider persen */
	#page-container #content.tata-pro .dex-pt-geser {
		display: block;
		flex: 0 0 100%;
		width: 100%;
		padding: 2px 2px 0;
		--pt-geser-warna: var(--pt-naik-kuat);
	}
	#page-container #content.tata-pro .dex-pt-geser[data-sisi="sell"] { --pt-geser-warna: var(--pt-turun-kuat); }
	#page-container #content.tata-pro .dex-pt-geser-baris { display: flex; align-items: center; gap: 10px; }
	#page-container #content.tata-pro .dex-pt-geser output {
		flex: 0 0 38px;
		color: var(--pt-teks);
		font-size: 11px;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		text-align: right;
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"] {
		-webkit-appearance: none;
		appearance: none;
		flex: 1 1 auto;
		min-width: 0;
		height: 18px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
		--pt-nilai: 0%;
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]:focus { outline: none; }
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]::-webkit-slider-runnable-track {
		height: 4px;
		border-radius: 999px;
		background: linear-gradient(90deg, var(--pt-geser-warna) var(--pt-nilai), var(--pt-garis-2) var(--pt-nilai));
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]::-moz-range-track {
		height: 4px;
		border-radius: 999px;
		background: var(--pt-garis-2);
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]::-moz-range-progress {
		height: 4px;
		border-radius: 999px;
		background: var(--pt-geser-warna);
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]::-webkit-slider-thumb {
		-webkit-appearance: none;
		appearance: none;
		width: 14px;
		height: 14px;
		margin-top: -5px;
		border: 2px solid var(--pt-geser-warna);
		border-radius: 50%;
		background: var(--pt-kartu);
		box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
		transition: transform .12s ease;
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]::-moz-range-thumb {
		width: 10px;
		height: 10px;
		border: 2px solid var(--pt-geser-warna);
		border-radius: 50%;
		background: var(--pt-kartu);
		box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
	}
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]:hover::-webkit-slider-thumb,
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]:focus-visible::-webkit-slider-thumb { transform: scale(1.2); }
	#page-container #content.tata-pro .dex-pt-geser input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px var(--pt-aksen-bg); }
	#page-container #content.tata-pro .dex-pt-geser-tanda {
		display: flex;
		justify-content: space-between;
		margin: -1px 48px 0 5px;
		pointer-events: none;
	}
	#page-container #content.tata-pro .dex-pt-geser-tanda i {
		display: block;
		width: 2px;
		height: 4px;
		border-radius: 1px;
		background: var(--pt-garis-2);
	}

	/* ringkasan estimasi */
	#page-container #content.tata-pro .dex-pt-estimasi {
		display: flex;
		flex-direction: column;
		gap: 3px;
		margin: 2px 0 8px;
		padding: 8px 10px;
		border-radius: 9px;
		background: var(--pt-isi);
		font-size: 11.5px;
	}
	#page-container #content.tata-pro .dex-pt-estimasi-baris {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 10px;
		color: var(--pt-teks-2);
		font-weight: 600;
	}
	#page-container #content.tata-pro .dex-pt-estimasi-baris b {
		color: var(--pt-teks);
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		text-align: right;
		white-space: nowrap;
	}
	#page-container #content.tata-pro .dex-pt-estimasi-catatan { margin: 2px 0 0; color: var(--pt-teks-3); font-size: 10.5px; }

	/* tombol kirim */
	#page-container #content.tata-pro #form-order .btn-buy,
	#page-container #content.tata-pro #form-order .btn-sell {
		height: 40px;
		margin-top: 2px;
		border-radius: 9px;
		color: #FFFFFF !important;
		box-shadow: none;
		transition: filter .12s ease, transform .06s ease, opacity .12s ease;
	}
	#page-container #content.tata-pro #form-order .btn-buy { background: #16A34A !important; border-color: #16A34A !important; }
	#page-container #content.tata-pro #form-order .btn-sell { background: #E11D48 !important; border-color: #E11D48 !important; }
	#page-container #content.tata-pro #form-order .btn-buy:hover,
	#page-container #content.tata-pro #form-order .btn-sell:hover { filter: brightness(1.07); }
	#page-container #content.tata-pro #form-order .btn-buy:active,
	#page-container #content.tata-pro #form-order .btn-sell:active { transform: translateY(1px); }
	#page-container #content.tata-pro #form-order .btn-buy:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--pt-naik-bg), 0 0 0 5px #16A34A; }
	#page-container #content.tata-pro #form-order .btn-sell:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--pt-turun-bg), 0 0 0 5px #E11D48; }
	#page-container #content.tata-pro #form-order .btn-buy:disabled,
	#page-container #content.tata-pro #form-order .btn-sell:disabled,
	#page-container #content.tata-pro #form-order .btn-buy.disabled,
	#page-container #content.tata-pro #form-order .btn-sell.disabled { opacity: .5; filter: grayscale(.25); cursor: not-allowed; }
	#page-container #content.tata-pro #form-order .btn-block strong { font-size: 14px; font-weight: 800; }
	#page-container #content.tata-pro #form-order .fa-question-circle { cursor: pointer; }
	#page-container #content.tata-pro #form-order .control-label .text-danger { color: var(--pt-teks) !important; }

	/* =====================================================================
	   MARKET TRADES + BARIS BAWAH (Open Orders, Order History, Trade History)
	   ===================================================================== */
	#page-container #content.tata-pro #market-trades .table > thead > tr > th,
	#page-container #content.tata-pro .panel-bawah .table > thead > tr > th,
	#page-container #content.tata-pro .blok-order-aktif .table > thead > tr > th {
		padding: 8px 12px !important;
		border-bottom: 1px solid var(--pt-garis) !important;
		background: var(--pt-kartu) !important;
		color: var(--pt-teks-2) !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		white-space: nowrap;
	}
	#page-container #content.tata-pro #market-trades .table > tbody > tr > td {
		padding: 3px 12px !important;
		border: 0 !important;
		color: var(--pt-teks);
		font-size: 11.5px !important;
		font-variant-numeric: tabular-nums;
	}
	#page-container #content.tata-pro .panel-bawah .table > tbody > tr > td,
	#page-container #content.tata-pro .blok-order-aktif .table > tbody > tr > td {
		padding: 8px 12px !important;
		border: 0 !important;
		border-bottom: 1px solid var(--pt-garis) !important;
		color: var(--pt-teks);
		font-size: 12px !important;
		font-weight: 500 !important;
		font-variant-numeric: tabular-nums;
		vertical-align: middle;
	}
	#page-container #content.tata-pro .blok-order-aktif .table-order { font-size: 12px; }
	#page-container #content.tata-pro #market-trades .table > tbody > tr:hover > td,
	#page-container #content.tata-pro .panel-bawah .table > tbody > tr:hover > td,
	#page-container #content.tata-pro .blok-order-aktif .table > tbody > tr:hover > td { background: var(--pt-hover); }
	#page-container #content.tata-pro #market-trades .text-buy,
	#page-container #content.tata-pro .panel-bawah .text-buy,
	#page-container #content.tata-pro .blok-order-aktif .text-buy { color: var(--pt-naik) !important; }
	#page-container #content.tata-pro #market-trades .text-sell,
	#page-container #content.tata-pro .panel-bawah .text-sell,
	#page-container #content.tata-pro .blok-order-aktif .text-sell { color: var(--pt-turun) !important; }
	#page-container #content.tata-pro #market-trades .text-black,
	#page-container #content.tata-pro .panel-bawah .text-black,
	#page-container #content.tata-pro .blok-order-aktif .text-black { color: var(--pt-teks) !important; }
	#page-container #content.tata-pro .blok-order-aktif .btn-cancel-order {
		height: 24px;
		padding: 0 10px !important;
		border: 1px solid transparent !important;
		border-radius: 7px;
		background: var(--pt-turun-bg) !important;
		color: var(--pt-turun) !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		line-height: 22px;
		transition: border-color .12s ease;
	}
	#page-container #content.tata-pro .blok-order-aktif .btn-cancel-order:hover { border-color: var(--pt-turun) !important; }
	#page-container #content.tata-pro .panel-bawah,
	#page-container #content.tata-pro .blok-order-aktif { min-height: 280px; }

	/* empty state Open Orders (dipasang JS di wadah gulir tabel) */
	#page-container #content.tata-pro .dex-pt-kosong {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 26px 16px 22px;
		color: var(--pt-teks-2);
		text-align: center;
		animation: dex-pt-muncul .2s ease-out;
	}
	#page-container #content.tata-pro .dex-pt-kosong-ikon {
		display: grid;
		place-items: center;
		width: 56px;
		height: 56px;
		margin-bottom: 4px;
		border-radius: 16px;
		background: var(--pt-aksen-bg);
		color: var(--pt-aksen);
	}
	#page-container #content.tata-pro .dex-pt-kosong-ikon svg { width: 32px; height: 32px; }
	#page-container #content.tata-pro .dex-pt-kosong strong { color: var(--pt-teks); font-size: 14px; font-weight: 800; }
	#page-container #content.tata-pro .dex-pt-kosong p { max-width: 380px; margin: 0; font-size: 12px; }
	#page-container #content.tata-pro .dex-pt-kosong-aksi { display: flex; gap: 8px; margin-top: 8px; }
	#page-container #content.tata-pro .dex-pt-kosong-aksi button {
		height: 30px;
		padding: 0 14px;
		border: 1px solid transparent;
		border-radius: 8px;
		font-size: 12px;
		font-weight: 800;
		cursor: pointer;
	}
	#page-container #content.tata-pro .dex-pt-kosong-aksi .beli { background: var(--pt-naik-bg); color: var(--pt-naik); }
	#page-container #content.tata-pro .dex-pt-kosong-aksi .jual { background: var(--pt-turun-bg); color: var(--pt-turun); }
	#page-container #content.tata-pro .dex-pt-kosong-aksi .beli:hover { border-color: var(--pt-naik); }
	#page-container #content.tata-pro .dex-pt-kosong-aksi .jual:hover { border-color: var(--pt-turun); }

	/* "No records" lama: ikon kecil (dipasang JS) + teks kalem */
	#page-container #content.tata-pro .tanpa-catatan {
		flex-direction: column;
		gap: 8px;
		min-height: 160px;
		color: var(--pt-teks-2);
		font-size: 12px;
		font-weight: 600;
	}
	#page-container #content.tata-pro .dex-pt-catatan-ikon {
		display: grid;
		place-items: center;
		width: 40px;
		height: 40px;
		border-radius: 12px;
		background: var(--pt-hover);
		color: var(--pt-teks-3);
	}
	#page-container #content.tata-pro .dex-pt-catatan-ikon svg { width: 22px; height: 22px; }

	/* ajakan masuk (pengunjung) */
	#page-container #content.tata-pro .ajakan-masuk { color: var(--pt-teks-2); }
	#page-container #content.tata-pro .ajakan-masuk a { color: var(--pt-aksen); }

	/* =====================================================================
	   MODE GELAP: sisa aturan lama yang memakai warna tetap
	   ===================================================================== */
	#page-container.darkmode #content.tata-pro #order-book thead th,
	#page-container.darkmode #content.tata-pro #market-trades thead th,
	#page-container.darkmode #content.tata-pro .panel-bawah thead th,
	#page-container.darkmode #content.tata-pro .blok-order-aktif thead th { background: var(--pt-kartu) !important; }
	#page-container.darkmode #content.tata-pro #order-book .kolom-jual .panel-heading { background: transparent !important; }
	#page-container.darkmode #content.tata-pro .search-custom { background: transparent !important; }
	#page-container.darkmode #content.tata-pro .dex-pt-tombol-utama,
	body.darkmode-page #page-container #content.tata-pro .dex-pt-tombol-utama { color: #FFFFFF; }
}

/* ---------- animasi ---------- */
@keyframes dex-pt-kilat-naik {
	0% { background-color: var(--pt-naik-bg, rgba(22, 163, 74, .14)); }
	100% { background-color: transparent; }
}
@keyframes dex-pt-kilat-turun {
	0% { background-color: var(--pt-turun-bg, rgba(225, 29, 72, .14)); }
	100% { background-color: transparent; }
}
@keyframes dex-pt-letup {
	0% { transform: scale(1); }
	45% { transform: scale(1.22); }
	100% { transform: scale(1); }
}
@keyframes dex-pt-muncul {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: none; }
}
@keyframes dex-pt-segar {
	0% { color: var(--pt-aksen, #2563EB); }
	100% { color: inherit; }
}
/* kolom input berlatar !important (tema lama) -> kilat lewat box-shadow inset, bukan background */
@keyframes dex-pt-terisi {
	0% { box-shadow: inset 0 0 0 999px var(--pt-aksen-bg, #EFF6FF); }
	100% { box-shadow: inset 0 0 0 999px transparent; }
}
@media (prefers-reduced-motion: reduce) {
	.dex-pt *,
	.dex-pt-kosong,
	.dex-pt-geser *,
	#content.tata-pro .harga-pro,
	#content.tata-pro .batang-rasio i,
	#content.tata-pro .form-control { animation: none !important; transition: none !important; }
}

/* [18 Okt 2026] tamu: Deposit / Tarik & saldo nonaktif (tidak bisa diklik atau dipilih) */
.dex-pt-dana-tamu .dex-pt-tombol[disabled],
.dex-pt-saldo-tamu .dex-pt-saldo-item[disabled] { opacity: .45; cursor: not-allowed; pointer-events: none; filter: grayscale(.3); }

	/* [18 Okt 2026] pasar non-LP: tombol Market nonaktif (redup + gembok) dan gelembung catatan saat diklik */
	#page-container #content.tata-pro .dex-pt-segmen { position: relative; }
	#page-container #content.tata-pro .dex-pt-segmen [data-pt-tipe][aria-disabled="true"] { opacity: .45; cursor: not-allowed !important; }
	#page-container #content.tata-pro .dex-pt-segmen [data-pt-tipe][aria-disabled="true"]:hover { color: inherit; }
	#page-container #content.tata-pro .dex-pt-segmen .dex-tipe-gembok { margin-right: 4px; vertical-align: -1px; }
	#page-container #content.tata-pro .dex-pt-segmen .dex-tipe-catatan { position: absolute; left: 0; top: calc(100% + 6px); z-index: 30; max-width: 260px; padding: 8px 10px; border-radius: 10px;
		background: #0F172A; color: #FFFFFF; font-size: 12px; font-weight: 600; line-height: 1.45; box-shadow: 0 10px 24px rgba(15, 23, 42, .25);
		opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity .15s ease, transform .15s ease; white-space: normal; }
	#page-container #content.tata-pro .dex-pt-segmen .dex-tipe-catatan.tampil { opacity: 1; transform: none; }