/* Tam Jai Studio — cinematic xianxia romance treatment.
   Loaded last so the complete storefront follows the approved visual reference. */
:root {
  --x-bg: #07030d;
  --x-ink: #100819;
  --x-panel: rgba(13, 6, 20, .78);
  --x-panel-deep: rgba(7, 3, 12, .91);
  --x-plum: #50115f;
  --x-violet: #8f32ed;
  --x-magenta: #ee2790;
  --x-rose: #ff4c79;
  --x-gold: #dcae58;
  --x-gold-bright: #ffe39a;
  --x-ivory: #fff7ed;
  --x-copy: #e9deec;
  --x-muted: #b9a9c1;
  --x-line: rgba(228, 181, 90, .62);
  --x-line-soft: rgba(239, 198, 111, .25);
  --x-purple-line: rgba(182, 72, 242, .42);
  --x-shadow: 0 24px 75px rgba(1, 0, 7, .7);
  --x-glow: 0 0 26px rgba(235, 52, 146, .18), 0 0 55px rgba(218, 167, 77, .11);

  --tamjai-accent: var(--x-magenta) !important;
  --tamjai-font-color: var(--x-ivory) !important;
  --tj-bg: var(--x-bg) !important;
  --tj-bg-2: #100619 !important;
  --tj-surface: var(--x-panel) !important;
  --tj-surface-2: rgba(45, 12, 57, .72) !important;
  --tj-purple: var(--x-violet) !important;
  --tj-purple-2: #bd43ef !important;
  --tj-magenta: var(--x-magenta) !important;
  --tj-red: var(--x-rose) !important;
  --tj-red-2: #9b174b !important;
  --tj-pink: #ff78b7 !important;
  --tj-success: #bba963 !important;
  --tj-warning: #f1c96d !important;
  --tj-danger: #f04d6f !important;
  --tj-text: var(--x-ivory) !important;
  --tj-text-2: var(--x-copy) !important;
  --tj-muted: var(--x-muted) !important;
  --tj-grad: linear-gradient(118deg, #762ce6 0%, #bd2fe1 38%, #f32e8e 74%, #ef6058 100%) !important;
  --tj-grad-soft: linear-gradient(135deg, rgba(133, 43, 221, .25), rgba(239, 43, 139, .13)) !important;

  --bs-body-color: var(--x-copy);
  --bs-body-bg: var(--x-bg);
  --bs-primary: var(--x-violet);
  --bs-secondary: #72537f;
  --bs-success: #8f9f68;
  --bs-danger: #e64a70;
  --bs-warning: #e5bc61;
  --bs-info: #9a66d7;
  --bs-light: #fff2dc;
  --bs-dark: #09040e;
}

html {
  background: var(--x-bg) !important;
  color-scheme: dark;
}

html::before {
  top: 52px !important;
  z-index: 2147483647 !important;
  padding: 7px 20px 8px !important;
  color: #fff4df !important;
  border: 1px solid rgba(242, 198, 105, .82) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(20, 7, 29, .98), rgba(7, 3, 12, .98)) padding-box,
    linear-gradient(90deg, #a536e7, #f1c46b, #a536e7) border-box !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .72), 0 0 22px rgba(209, 62, 224, .19), inset 0 0 14px rgba(255, 231, 171, .08) !important;
  font-family: "Kanit", "IBM Plex Sans Thai", sans-serif !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: .045em !important;
}

body,
body.tamjai-v2 {
  min-height: 100vh;
  padding-top: 49px !important;
  color: var(--x-copy) !important;
  background: var(--x-bg) !important;
  font-family: "Kanit", "IBM Plex Sans Thai", "Leelawadee UI", Tahoma, sans-serif !important;
  font-weight: 400 !important;
}

body.tamjai-v2 .container { max-width: 1120px; }
body::selection { color: #fff; background: rgba(225, 40, 143, .72); }

/* Full-screen living scenery */
.wuxia-backdrop {
  inset: -18px !important;
  opacity: .98 !important;
  background: url("/xianxia-romance-bg.webp") center top / cover no-repeat !important;
  filter: saturate(1.06) contrast(1.03) brightness(.96) !important;
  transform: scale(1.035) translate3d(var(--scene-x, 0), var(--scene-y, 0), 0);
  transform-origin: center top;
  will-change: transform;
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}

.wuxia-vignette {
  background:
    linear-gradient(180deg, rgba(5, 1, 12, .02) 0%, rgba(7, 2, 13, .05) 44%, rgba(4, 1, 8, .68) 100%),
    radial-gradient(ellipse at 50% 35%, transparent 24%, rgba(8, 2, 14, .08) 58%, rgba(3, 1, 7, .46) 116%) !important;
  box-shadow: inset 0 0 120px rgba(4, 0, 9, .28) !important;
}

.wuxia-pointer-light {
  width: 520px !important;
  height: 520px !important;
  background: radial-gradient(circle, rgba(255, 211, 127, .10), rgba(218, 61, 203, .045) 34%, transparent 70%) !important;
}

.wuxia-petals { z-index: 1240 !important; }
.wuxia-petal {
  background: linear-gradient(145deg, #ffd5e5 2%, #ff78b7 43%, #db2c73 82%, #7b164e) !important;
  box-shadow: 0 0 10px rgba(255, 139, 191, .48) !important;
  filter: blur(.15px);
}

.wuxia-embers {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.wuxia-ember {
  position: absolute;
  left: var(--x);
  bottom: -4vh;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  opacity: 0;
  background: #ffe7a4;
  box-shadow: 0 0 6px #ffb348, 0 0 15px rgba(255, 104, 41, .8);
  animation: xianxia-ember-rise var(--duration) ease-in var(--delay) infinite;
}
@keyframes xianxia-ember-rise {
  0% { opacity: 0; translate: 0 0; scale: .5; }
  14% { opacity: var(--opacity); }
  70% { opacity: calc(var(--opacity) * .7); }
  100% { opacity: 0; translate: var(--drift) -105vh; scale: 1.35; }
}

#wuxia-scroll-progress {
  height: 3px !important;
  background: linear-gradient(90deg, #8434e8, #f037a1 48%, #ffd67f) !important;
  box-shadow: 0 0 18px rgba(247, 76, 180, .85), 0 0 8px rgba(255, 213, 118, .7) !important;
}

/* Gold filigree corners added by the interaction layer. */
.wuxia-frame-corner {
  position: absolute;
  z-index: 8;
  width: 31px;
  height: 31px;
  pointer-events: none;
  opacity: .96;
  filter: drop-shadow(0 0 6px rgba(255, 210, 103, .58));
}
.wuxia-frame-corner::before,
.wuxia-frame-corner::after {
  content: "";
  position: absolute;
  background: linear-gradient(90deg, #8d5b20, #ffe39a 48%, #a46b24);
}
.wuxia-frame-corner::before { width: 100%; height: 2px; left: 0; top: 0; }
.wuxia-frame-corner::after { width: 2px; height: 100%; left: 0; top: 0; }
.wuxia-frame-corner--tl { left: -5px; top: -5px; }
.wuxia-frame-corner--tr { right: -5px; top: -5px; rotate: 90deg; }
.wuxia-frame-corner--br { right: -5px; bottom: -5px; rotate: 180deg; }
.wuxia-frame-corner--bl { left: -5px; bottom: -5px; rotate: 270deg; }

/* Navigation: black glass, gold frame, purple selection. */
.tamjai-navbar-shell,
body > .bg-black.container-lg.border {
  top: 46px !important;
  width: min(94vw, 1120px) !important;
  max-width: 1120px !important;
  margin: 18px auto 0 !important;
  padding: 0 12px !important;
  overflow: visible !important;
  border: 1px solid var(--x-line) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(180deg, rgba(10, 4, 17, .91), rgba(4, 2, 8, .88)) padding-box,
    linear-gradient(90deg, rgba(125, 67, 26, .65), #f3ce78, rgba(125, 67, 26, .65)) border-box !important;
  box-shadow: 0 17px 55px rgba(0, 0, 0, .56), 0 0 22px rgba(255, 189, 76, .11), inset 0 1px rgba(255, 240, 193, .1) !important;
  backdrop-filter: blur(18px) saturate(1.28) !important;
}
.tamjai-navbar-shell::before,
.tamjai-navbar-shell::after { content: none !important; }
.tamjai-navbar-shell.wuxia-nav-scrolled {
  width: min(97vw, 1170px) !important;
  background: rgba(6, 2, 11, .96) !important;
  border-color: rgba(247, 205, 113, .72) !important;
  box-shadow: 0 18px 58px rgba(0, 0, 0, .72), 0 0 30px rgba(222, 66, 196, .1) !important;
}
.tamjai-navbar-shell .navbar { min-height: 62px; padding-block: 7px; }
.tamjai-navbar-shell .navbar > .container { max-width: none; }
.tamjai-navbar-shell .navbar-brand img {
  width: 44px !important;
  height: 44px !important;
  padding: 3px !important;
  border: 1px solid rgba(255, 220, 144, .68) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.17), rgba(108,31,117,.16)) !important;
  box-shadow: 0 0 18px rgba(244, 89, 170, .25), inset 0 0 10px rgba(255,255,255,.1) !important;
}
.navbar-dark .navbar-nav .nav-link {
  min-height: 41px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: .58rem .82rem !important;
  border: 1px solid transparent;
  border-radius: 10px !important;
  color: #e9dfeb !important;
  font-size: .91rem;
  font-weight: 600 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.8);
}
.navbar-dark .navbar-nav .nav-link:hover {
  color: #fff7e8 !important;
  border-color: rgba(224, 177, 87, .28) !important;
  background: linear-gradient(145deg, rgba(107, 30, 139, .6), rgba(39, 9, 54, .7)) !important;
  box-shadow: 0 8px 23px rgba(76, 13, 104, .24);
}
.navbar-dark .navbar-nav .nav-link.tj-active,
.navbar-dark .navbar-nav .nav-link.active {
  color: #fff !important;
  border-color: rgba(226, 181, 92, .32) !important;
  background: linear-gradient(145deg, rgba(89, 34, 133, .96), rgba(48, 17, 71, .96)) !important;
  box-shadow: inset 0 0 18px rgba(229, 84, 236, .17), 0 7px 21px rgba(33, 4, 49, .38) !important;
}
.navbar-dark .navbar-nav .nav-link.tj-active::after,
.navbar-dark .navbar-nav .nav-link.active::after {
  height: 2px !important;
  bottom: 2px !important;
  background: linear-gradient(90deg, transparent, #ff45c0 38%, #ffe18d 72%, transparent) !important;
  box-shadow: 0 0 8px #ef54dd;
}
.navbar-toggler {
  border-color: rgba(235, 190, 100, .55) !important;
  background: rgba(67, 19, 83, .54) !important;
}
.dropdown-menu {
  padding: 8px !important;
  border: 1px solid rgba(232, 187, 95, .54) !important;
  border-radius: 12px 18px 12px 18px !important;
  background: linear-gradient(145deg, rgba(25, 8, 35, .98), rgba(6, 2, 11, .98)) !important;
  box-shadow: 0 25px 70px rgba(0,0,0,.75), 0 0 25px rgba(166,51,221,.14) !important;
}
.dropdown-item { color: #e9dbeb !important; }
.dropdown-item:hover,
.dropdown-item:focus { color: #fff !important; background: linear-gradient(90deg, rgba(133, 44, 204, .46), rgba(237, 42, 142, .18)) !important; }
.tj-wallet-pill {
  color: #ffe7a9 !important;
  border-color: rgba(240, 196, 102, .48) !important;
  background: rgba(63, 31, 72, .66) !important;
}

/* Main reference composition */
.page-home .tj-hero {
  position: relative;
  width: min(94vw, 1120px) !important;
  min-height: clamp(390px, 37vw, 445px) !important;
  margin: 18px auto 12px !important;
  padding: clamp(34px, 4.2vw, 56px) clamp(31px, 4.7vw, 58px) !important;
  overflow: visible !important;
  border: 1px solid rgba(236, 190, 95, .72) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(90deg, rgba(26, 7, 42, .88) 0%, rgba(24, 7, 39, .77) 36%, rgba(12, 4, 20, .32) 62%, rgba(7, 2, 13, .09) 100%),
    linear-gradient(180deg, rgba(55, 13, 68, .12), rgba(7, 2, 12, .38)) !important;
  box-shadow: var(--x-shadow), inset 0 0 65px rgba(35, 5, 49, .26), 0 0 32px rgba(222, 174, 77, .1) !important;
  backdrop-filter: blur(1.2px) saturate(1.06) !important;
  isolation: isolate;
}
.page-home .tj-hero::before {
  content: "" !important;
  position: absolute;
  inset: 9px !important;
  z-index: -1 !important;
  width: auto !important;
  border: 1px solid rgba(255, 222, 147, .18);
  border-radius: 8px;
  background: radial-gradient(circle at 14% 32%, rgba(148, 39, 201, .18), transparent 34%);
  pointer-events: none;
}
.page-home .tj-hero::after {
  content: "" !important;
  position: absolute;
  inset: 0 !important;
  z-index: -2;
  border-radius: inherit !important;
  background:
    linear-gradient(115deg, transparent 12%, rgba(255,255,255,.04) 30%, transparent 46%),
    radial-gradient(circle at 79% 24%, rgba(255, 194, 101, .08), transparent 28%);
  pointer-events: none;
}
.page-home .tj-hero__content {
  position: relative;
  z-index: 3;
  width: min(600px, 57%) !important;
  margin: 0 !important;
  padding: 0 !important;
}
.page-home .tj-kicker {
  gap: 8px;
  padding: 8px 14px !important;
  color: #f5dbff !important;
  border: 1px solid rgba(213, 96, 244, .48) !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(89, 28, 135, .72), rgba(41, 12, 58, .66)) !important;
  box-shadow: inset 0 0 17px rgba(234, 84, 230, .1), 0 7px 24px rgba(18, 2, 31, .24) !important;
  font-size: .76rem !important;
  font-weight: 600 !important;
  letter-spacing: .07em !important;
}
.page-home .tj-kicker i { color: #ff69ce !important; filter: drop-shadow(0 0 6px rgba(255,70,191,.6)); }
.page-home .tj-hero h1 {
  max-width: 610px !important;
  margin: 22px 0 15px !important;
  color: #fff !important;
  font-family: "Kanit", "IBM Plex Sans Thai", sans-serif !important;
  font-size: clamp(2.65rem, 4.25vw, 4.45rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  text-shadow: 0 5px 25px rgba(0,0,0,.92), 0 0 2px rgba(255,255,255,.5) !important;
}
.page-home .tj-gradient-text {
  display: block;
  color: transparent !important;
  background: linear-gradient(96deg, #b544ff 0%, #ee2cd1 40%, #ff296e 92%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  filter: drop-shadow(0 4px 12px rgba(202, 30, 185, .36));
}
.page-home .tj-hero p {
  max-width: 590px !important;
  margin-bottom: 0 !important;
  color: #eee5f0 !important;
  font-family: "IBM Plex Sans Thai", "Kanit", sans-serif !important;
  font-size: clamp(.94rem, 1.05vw, 1.05rem) !important;
  font-weight: 400 !important;
  line-height: 1.78 !important;
  text-shadow: 0 2px 11px rgba(0,0,0,.98) !important;
}
.tj-hero__actions { margin-top: 20px !important; gap: 10px !important; }
.tj-trust { margin-top: 15px !important; gap: 7px !important; }
.tj-trust span {
  padding: 7px 11px !important;
  color: #eee5f0 !important;
  border: 1px solid rgba(225, 190, 224, .28) !important;
  border-radius: 999px !important;
  background: rgba(13, 6, 22, .62) !important;
  box-shadow: inset 0 0 12px rgba(175, 61, 217, .08) !important;
  backdrop-filter: blur(9px);
  font-size: .78rem !important;
}
.tj-trust span i { color: #e8c56f !important; }

/* Four reference feature cards. */
.tj-promo-rail {
  width: min(91vw, 1050px) !important;
  margin: 0 auto 22px !important;
  gap: 9px !important;
}
.tj-promo-card {
  min-height: 98px !important;
  padding: 17px 17px 15px !important;
  overflow: hidden !important;
  border: 1px solid rgba(206, 91, 229, .48) !important;
  border-radius: 11px !important;
  background:
    linear-gradient(135deg, rgba(29, 9, 46, .88), rgba(90, 16, 92, .65)),
    url("/xianxia-romance-bg.webp") center 46% / cover no-repeat !important;
  box-shadow: 0 14px 35px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.08), 0 0 20px rgba(194,47,224,.07) !important;
  backdrop-filter: blur(10px) saturate(1.18) !important;
}
.tj-promo-card:nth-child(2) { background-position: 42% 42% !important; }
.tj-promo-card:nth-child(3) { background-position: 65% 45% !important; }
.tj-promo-card:nth-child(4) { background-position: 85% 48% !important; }
.tj-promo-card::before {
  background: linear-gradient(115deg, rgba(119, 36, 164, .34), transparent 48%, rgba(244, 61, 154, .15)) !important;
}
.tj-promo-card::after {
  content: "✦" !important;
  color: rgba(255, 219, 136, .84) !important;
  text-shadow: 0 0 8px rgba(255,196,94,.58);
}
.tj-promo-card > i {
  color: #dc89ff !important;
  filter: drop-shadow(0 0 9px rgba(219, 75, 248, .58)) !important;
}
.tj-promo-card strong { color: #fff7fb !important; font-weight: 650 !important; }
.tj-promo-card small { color: #d5c5da !important; }
.tj-promo-card:hover {
  border-color: rgba(245, 197, 101, .68) !important;
  box-shadow: 0 19px 45px rgba(0,0,0,.55), 0 0 25px rgba(218,55,228,.15) !important;
}

/* All buttons, including Bootstrap, checkout, modals, and admin controls. */
body.tamjai-v2 .btn,
body.tamjai-v2 input[type="submit"],
body.tamjai-v2 input[type="button"],
body.tamjai-v2 input[type="reset"],
body.tamjai-v2 .dataTables_wrapper .dataTables_paginate .paginate_button,
body.tamjai-v2 .swal2-actions button,
body.tamjai-v2 .tj-preset {
  min-height: 42px;
  border: 1px solid rgba(227, 184, 94, .52) !important;
  border-radius: 9px !important;
  color: #fff8f4 !important;
  background: linear-gradient(118deg, #762ce6 0%, #bd2fe1 42%, #f32e8e 76%, #ef5c5b 100%) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.2), 0 9px 24px rgba(91, 18, 135, .35), 0 0 15px rgba(239,45,143,.08) !important;
  font-family: "Kanit", "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 1px 7px rgba(20,2,31,.68) !important;
}
body.tamjai-v2 .btn:hover,
body.tamjai-v2 input[type="submit"]:hover,
body.tamjai-v2 input[type="button"]:hover,
body.tamjai-v2 input[type="reset"]:hover,
body.tamjai-v2 .swal2-actions button:hover,
body.tamjai-v2 .tj-preset:hover {
  transform: translateY(-2px) !important;
  color: #fff !important;
  border-color: #ffe09a !important;
  filter: brightness(1.12) saturate(1.08) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.27), 0 14px 31px rgba(112,23,159,.42), 0 0 22px rgba(244,59,167,.22) !important;
}
body.tamjai-v2 :is(.btn-primary, .btn-danger, .btn-zero, .swal2-confirm) {
  background: linear-gradient(118deg, #762ce6 0%, #bd2fe1 42%, #f32e8e 76%, #ef5c5b 100%) !important;
}
body.tamjai-v2 :is(.btn-secondary, .btn-dark, .btn-thxk, .swal2-cancel) {
  color: #f8ecfb !important;
  border-color: rgba(223, 181, 93, .44) !important;
  background: linear-gradient(145deg, rgba(29, 14, 42, .92), rgba(8, 4, 13, .92)) !important;
  box-shadow: inset 0 0 15px rgba(154,50,205,.08), 0 9px 23px rgba(0,0,0,.3) !important;
}
body.tamjai-v2 .btn-success {
  color: #fff9e9 !important;
  background: linear-gradient(118deg, #3a685a, #5e8e72 52%, #b38a45) !important;
}
body.tamjai-v2 .btn-warning {
  color: #2f1706 !important;
  border-color: #ffe8ae !important;
  background: linear-gradient(118deg, #c28b31, #f0c866 58%, #ffe7a4) !important;
  text-shadow: 0 1px rgba(255,255,255,.35) !important;
}
body.tamjai-v2 .btn-info {
  color: #fff !important;
  background: linear-gradient(118deg, #5146b4, #8d52d7 54%, #dd4ec5) !important;
}
body.tamjai-v2 .btn-light {
  color: #32133a !important;
  background: linear-gradient(118deg, #fff8eb, #efd49a) !important;
  text-shadow: none !important;
}
body.tamjai-v2 :is(.btn-outline-primary, .btn-outline-danger, .btn-outline-success, .btn-outline-warning, .btn-outline-info, .btn-outline-secondary, .btn-outline-light, .btn-outline-dark) {
  color: #f0d7f7 !important;
  border-color: rgba(217, 146, 234, .55) !important;
  background: rgba(10, 4, 16, .7) !important;
  box-shadow: inset 0 0 14px rgba(132,40,183,.09) !important;
}
body.tamjai-v2 :is(.btn-outline-primary, .btn-outline-danger, .btn-outline-success, .btn-outline-warning, .btn-outline-info, .btn-outline-secondary, .btn-outline-light, .btn-outline-dark):hover {
  color: #fff !important;
  background: linear-gradient(118deg, #702ac9, #d82dab 70%, #e65273) !important;
}
body.tamjai-v2 .btn-link {
  color: #e7bdf5 !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.tamjai-v2 :is(.btn-close, .swal2-close) { filter: invert(1) sepia(.2) hue-rotate(235deg) !important; }

/* Type system across every page. */
body.tamjai-v2,
body.tamjai-v2 button,
body.tamjai-v2 input,
body.tamjai-v2 select,
body.tamjai-v2 textarea,
body.tamjai-v2 table,
body.tamjai-v2 .swal2-popup,
body.tamjai-v2 .tooltip,
body.tamjai-v2 .popover {
  font-family: "Kanit", "IBM Plex Sans Thai", "Leelawadee UI", sans-serif !important;
}
body.tamjai-v2 :is(h1,h2,h3,h4,h5,h6) {
  color: #fff7ef !important;
  font-family: "Kanit", "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 650 !important;
  text-shadow: 0 3px 18px rgba(3,0,8,.8), 0 0 1px rgba(255,233,183,.4) !important;
}
body.tamjai-v2 :is(p,li,dd,dt,td,th,label,legend,figcaption) { color: #e8ddeb; }
body.tamjai-v2 :is(strong,b) { color: #fff8f0; font-weight: 650; }
body.tamjai-v2 :is(small,.small,.form-text,.text-muted) { color: #bfaec5 !important; }
body.tamjai-v2 a:not(.btn):not(.nav-link):not(.dropdown-item):not(.tj-bottom-nav a) { color: #e5bcf2; }
body.tamjai-v2 a:not(.btn):not(.nav-link):not(.dropdown-item):hover { color: #ffe39a; }
body.tamjai-v2 .text-primary,
body.tamjai-v2 .text-info { color: #d99cf2 !important; }
body.tamjai-v2 .text-secondary { color: #bdacc4 !important; }
body.tamjai-v2 .text-success { color: #d6d59a !important; }
body.tamjai-v2 .text-warning { color: #ffda80 !important; }
body.tamjai-v2 .text-danger { color: #ff7896 !important; }
body.tamjai-v2 hr { border-color: rgba(230,184,93,.22) !important; }

/* Shared glass surfaces and product blocks. */
.tj-promo-card,
.class-thxk,
.card-body.border-glowing,
.class-menu,
.modal-content,
body.tamjai-v2 .card,
body.tamjai-v2 .tj-shop-tools,
body.tamjai-v2 .tj-admin-tools {
  color: var(--x-ivory) !important;
  border-color: rgba(213, 130, 225, .35) !important;
  background: linear-gradient(145deg, rgba(31, 10, 43, .86), rgba(7, 3, 12, .91)) !important;
  box-shadow: 0 16px 45px rgba(0,0,0,.5), inset 0 1px rgba(255,255,255,.06), 0 0 22px rgba(182,47,219,.06) !important;
  backdrop-filter: blur(17px) saturate(1.16) !important;
}
.class-thxk,
.class-menu,
.modal-content,
body.tamjai-v2 .card { border-radius: 12px 20px 12px 20px !important; }
.card-body.border-glowing {
  border-radius: 10px 18px 10px 18px !important;
  overflow: hidden;
}
.card-body.border-glowing:hover,
.border-glowing-v2:hover {
  border-color: rgba(241, 197, 105, .68) !important;
  box-shadow: 0 24px 58px rgba(0,0,0,.62), 0 0 26px rgba(217,54,213,.16) !important;
}
.tj-section-title::before { background: linear-gradient(#ffe28e, #df39c3) !important; }
.tj-section-title i,
body h3 > i,
body h4 > i { color: #e4a9ff !important; filter: drop-shadow(0 0 8px rgba(210,76,241,.35)); }
.tj-price,
.product-name { color: #f4cf7b !important; }
.tj-live-dot { background: #ff4b9b !important; box-shadow: 0 0 13px #ff4b9b !important; }
.tj-count { color: #ffe39a !important; }

.page-home #carouselExampleControls,
.page-home #carouselExampleControls .carousel-inner {
  border: 1px solid rgba(235, 190, 97, .68) !important;
  border-radius: 13px !important;
  box-shadow: 0 23px 68px rgba(0,0,0,.62), 0 0 28px rgba(224,68,208,.11) !important;
}
.page-home #carouselExampleControls { overflow: visible !important; }
.page-home #carouselExampleControls .carousel-inner { overflow: hidden !important; }
.page-home #carouselExampleControls::after {
  color: #fff2d0 !important;
  border-color: rgba(238,193,100,.58) !important;
  background: rgba(14,5,20,.82) !important;
}

/* Forms */
body.tamjai-v2 :is(.form-control,.form-select,textarea,input:not([type="checkbox"]):not([type="radio"]),select) {
  color: #fff5fb !important;
  border: 1px solid rgba(191, 111, 214, .42) !important;
  border-radius: 9px 14px 9px 14px !important;
  background-color: rgba(9, 4, 15, .82) !important;
  box-shadow: inset 0 1px 9px rgba(0,0,0,.28) !important;
}
body.tamjai-v2 :is(.form-control,.form-select,textarea,input,select):focus {
  border-color: #dc83f5 !important;
  box-shadow: 0 0 0 .2rem rgba(187,57,224,.14), 0 0 19px rgba(226,54,204,.1) !important;
}
body.tamjai-v2 ::placeholder { color: #8f7d97 !important; }
body.tamjai-v2 .form-floating > label { color: #ad9ab4 !important; }
body.tamjai-v2 :is(.form-check-input,input[type="checkbox"],input[type="radio"]) {
  border-color: rgba(219,165,228,.6) !important;
  background-color: #12081b !important;
}
body.tamjai-v2 :is(.form-check-input,input[type="checkbox"],input[type="radio"]):checked {
  border-color: #edc86f !important;
  background-color: #b22bd2 !important;
}
body.tamjai-v2 input[type="file"]::file-selector-button {
  color: #fff5fa !important;
  border-color: rgba(224,179,91,.42) !important;
  background: linear-gradient(118deg, #6430ba, #cb2da8) !important;
}

/* Tabs, badges, alerts, tables and popups. */
body.tamjai-v2 :is(.nav-tabs,.nav-pills) { border-color: rgba(230,184,93,.22) !important; }
body.tamjai-v2 :is(.nav-tabs,.nav-pills) .nav-link { color: #c4b2ca !important; }
body.tamjai-v2 :is(.nav-tabs,.nav-pills) .nav-link:hover { color: #f1d8f7 !important; border-color: rgba(202,101,222,.3) !important; }
body.tamjai-v2 :is(.nav-tabs,.nav-pills) .nav-link.active {
  color: #fff !important;
  border-color: rgba(235,189,95,.48) !important;
  background: linear-gradient(118deg, #6d2ac6, #c42ba9) !important;
}
body.tamjai-v2 :is(.badge,.tj-badge,.tj-recommended) {
  color: #fff0fb !important;
  border-color: rgba(219,151,232,.38) !important;
  background: rgba(106, 26, 131, .78) !important;
}
body.tamjai-v2 :is(.badge.bg-primary,.badge.bg-info,.badge.bg-secondary) { background: linear-gradient(118deg, #6430b6, #a32dba) !important; }
body.tamjai-v2 :is(.badge.bg-success,.tj-badge--ok) { color: #fff5d4 !important; background: rgba(60,101,76,.84) !important; border-color: rgba(231,199,119,.45) !important; }
body.tamjai-v2 .badge.bg-warning { color: #311806 !important; background: linear-gradient(118deg, #c48b31, #f2ce71) !important; }
body.tamjai-v2 :is(.badge.bg-danger,.tj-badge--out) { color: #fff !important; background: linear-gradient(118deg, #a12462, #ef4a78) !important; }

body.tamjai-v2 .alert {
  color: #eee2f0 !important;
  border-color: rgba(206,121,223,.34) !important;
  background: rgba(18,7,26,.9) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.3) !important;
}
body.tamjai-v2 .alert-success { border-left-color: #a9b472 !important; background: rgba(45,80,61,.42) !important; }
body.tamjai-v2 .alert-danger { border-left-color: #f2577d !important; background: rgba(113,20,61,.44) !important; }
body.tamjai-v2 .alert-warning { border-left-color: #edc66c !important; background: rgba(99,65,19,.38) !important; }
body.tamjai-v2 .alert-info { border-left-color: #ad73e5 !important; background: rgba(65,36,100,.42) !important; }

body.tamjai-v2 .swal2-popup {
  color: #f0e4f2 !important;
  border-color: rgba(235,190,96,.58) !important;
  background: linear-gradient(145deg, #281032, #08040d) !important;
  box-shadow: 0 35px 120px rgba(0,0,0,.82), 0 0 35px rgba(205,49,210,.12) !important;
}
body.tamjai-v2 :is(.swal2-title,.swal2-html-container) { color: #fff4f7 !important; }

body.tamjai-v2 .table {
  --bs-table-bg: rgba(9,4,14,.55) !important;
  --bs-table-color: #e9deeb !important;
  --bs-table-striped-color: #eee4f0 !important;
  --bs-table-striped-bg: rgba(166,67,197,.06) !important;
  --bs-table-hover-bg: rgba(202,47,174,.12) !important;
  --bs-table-hover-color: #fff !important;
  border-color: rgba(214,150,224,.15) !important;
}
body.tamjai-v2 .table thead th {
  color: #ffe5b0 !important;
  border-bottom-color: rgba(234,190,97,.33) !important;
  background: linear-gradient(90deg, rgba(105,35,151,.52), rgba(189,44,158,.13)) !important;
}
body.tamjai-v2 .page-link,
body.tamjai-v2 .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: #e1bbef !important;
  border-color: rgba(196,109,215,.28) !important;
  background: rgba(10,4,16,.88) !important;
}
body.tamjai-v2 .page-item.active .page-link,
body.tamjai-v2 .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  color: #fff !important;
  border-color: rgba(238,194,99,.58) !important;
  background: linear-gradient(118deg, #6b2ac2, #d02ca3) !important;
}
body.tamjai-v2 .progress { border-color: rgba(213,135,225,.18) !important; background: #100718 !important; }
body.tamjai-v2 .progress-bar { background: linear-gradient(90deg, #7130cd, #e32c9d, #ebc462) !important; }
body.tamjai-v2 :is(.spinner-border,.spinner-grow) { color: #d98cf3 !important; }

/* Footer and floating utilities. */
.tj-footer {
  margin-top: 68px !important;
  color: #dfd1e2 !important;
  border-top: 1px solid rgba(233,187,94,.5) !important;
  background:
    linear-gradient(180deg, rgba(10,4,16,.84), rgba(4,1,8,.98)),
    url("/xianxia-romance-bg.webp") center bottom / cover no-repeat !important;
  box-shadow: 0 -24px 70px rgba(0,0,0,.5), 0 -1px 24px rgba(213,54,203,.08) !important;
}
.tj-footer h5 { color: #ffe2a0 !important; }
.tj-footer a { color: #d4c2da !important; }
.tj-footer a:hover { color: #f2c6ff !important; }
.tj-footer__social a { border-color: rgba(221,169,230,.36) !important; background: rgba(99,26,124,.34) !important; }
.tj-footer__bottom { border-color: rgba(233,187,94,.18) !important; }
.tj-bottom-nav {
  border-color: rgba(232,187,94,.46) !important;
  background: rgba(8,3,13,.95) !important;
  box-shadow: 0 -12px 40px rgba(0,0,0,.7), 0 -1px 18px rgba(198,48,207,.09) !important;
}
.tj-bottom-nav a { color: #ad9ab5 !important; }
.tj-bottom-nav a.tj-active { color: #f2c7ff !important; }
.tj-bottom-nav a.tj-active::before { background: linear-gradient(90deg, #6e31ce, #ef32a1, #efc866) !important; }

.wuxia-action-dock button {
  color: #ffe4a3 !important;
  border-color: rgba(235,188,94,.53) !important;
  background: linear-gradient(145deg, rgba(75,18,96,.93), rgba(8,4,13,.94)) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.55), 0 0 17px rgba(221,61,218,.1) !important;
}
.wuxia-action-dock button:hover {
  color: #fff !important;
  border-color: #ffe19a !important;
  background: linear-gradient(145deg, #7130c8, #d42c9e) !important;
}
.wuxia-search-overlay { background: rgba(5,1,10,.82) !important; }
.wuxia-search-panel {
  border-color: rgba(237,191,97,.65) !important;
  background: linear-gradient(145deg, rgba(37,12,48,.99), rgba(6,2,11,.99)) !important;
  box-shadow: 0 35px 110px rgba(0,0,0,.84), 0 0 35px rgba(210,58,211,.13) !important;
}
.wuxia-search-head { border-color: rgba(227,181,91,.23) !important; }
.wuxia-search-head i { color: #e49aff !important; }
.wuxia-search-results a { color: #eaddec !important; }
.wuxia-search-results a:hover { color: #fff !important; background: linear-gradient(90deg, rgba(114,40,174,.44), rgba(226,44,159,.15)) !important; }

body.tamjai-v2 #support {
  border-color: rgba(238,191,95,.55) !important;
  background: linear-gradient(135deg, rgba(119,25,119,.97), rgba(10,4,16,.97)) !important;
  box-shadow: 0 15px 42px rgba(0,0,0,.6), 0 0 22px rgba(234,45,157,.15) !important;
}
body.tamjai-v2 #support p { color: #fff1dc !important; }
body.tamjai-v2 #support img { border-color: rgba(255,215,131,.52) !important; box-shadow: 0 0 19px rgba(236,55,174,.28) !important; }

/* Admin inherits the same luxury language without reducing usability. */
body.tamjai-v2.page-admin .class-menu,
body.tamjai-v2 .tj-admin-tools {
  border-color: rgba(210,122,223,.36) !important;
  background: linear-gradient(145deg, rgba(38,12,50,.9), rgba(7,3,12,.94)) !important;
}
body.tamjai-v2.page-admin .class-menu i,
body.tamjai-v2 .tj-drag-handle { color: #df95f8 !important; }
body.tamjai-v2 .tj-bg-preview,
body.tamjai-v2 .tj-slide-preview { border-color: rgba(211,130,224,.38) !important; background-color: #0d0614 !important; }

/* Responsive composition: keep the couple visible, then darken beneath live content. */
@media (max-width: 1199.98px) {
  .page-home .tj-hero__content { width: min(570px, 59%) !important; }
  .navbar-dark .navbar-nav .nav-link { padding-inline: .64rem !important; font-size: .86rem; }
}

@media (max-width: 991.98px) {
  html::before { top: 46px !important; }
  body,
  body.tamjai-v2 { padding-top: 43px !important; }
  .wuxia-backdrop {
    background-position: 65% top !important;
    filter: saturate(1.02) contrast(1.03) brightness(.84) !important;
  }
  .tamjai-navbar-shell,
  body > .bg-black.container-lg.border {
    top: 42px !important;
    width: 96vw !important;
    margin-top: 15px !important;
  }
  .navbar-collapse {
    margin-top: 8px;
    padding: 10px;
    border-top: 1px solid rgba(233,188,95,.22) !important;
    background: rgba(9,3,15,.45);
  }
  .page-home .tj-hero {
    min-height: 660px !important;
    align-items: flex-end !important;
    padding: 32px 27px 39px !important;
    background:
      linear-gradient(180deg, rgba(10,3,17,.05) 0%, rgba(10,3,17,.15) 34%, rgba(12,4,20,.93) 68%, rgba(8,3,14,.97) 100%) !important;
  }
  .page-home .tj-hero__content { width: 100% !important; }
  .page-home .tj-hero h1 { font-size: clamp(2.5rem, 8.7vw, 4.35rem) !important; }
  .tj-promo-rail { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 575.98px) {
  html::before {
    top: 41px !important;
    max-width: 88vw;
    padding: 6px 11px !important;
    overflow: hidden;
    font-size: 9px !important;
    text-overflow: ellipsis;
  }
  body,
  body.tamjai-v2 { padding-top: 38px !important; }
  .wuxia-backdrop {
    inset: -10px !important;
    background-position: 67% top !important;
    transform: scale(1.025) !important;
  }
  .wuxia-vignette {
    background: linear-gradient(180deg, rgba(4,1,8,.02), rgba(5,1,10,.13) 35%, rgba(4,1,8,.82) 82%, #050109 100%) !important;
  }
  .tamjai-navbar-shell,
  body > .bg-black.container-lg.border {
    top: 38px !important;
    width: 96vw !important;
    margin-top: 12px !important;
    padding-inline: 4px !important;
    border-radius: 11px !important;
  }
  .tamjai-navbar-shell .navbar { min-height: 55px; }
  .tamjai-navbar-shell .navbar-brand img { width: 40px !important; height: 40px !important; }
  .page-home .tj-hero {
    width: 96vw !important;
    min-height: 620px !important;
    margin-top: 13px !important;
    padding: 28px 20px 31px !important;
    border-radius: 11px !important;
  }
  .page-home .tj-kicker { max-width: 100%; font-size: .66rem !important; letter-spacing: .04em !important; }
  .page-home .tj-hero h1 { margin-top: 18px !important; font-size: clamp(2.15rem, 11.5vw, 3.15rem) !important; }
  .page-home .tj-hero p { font-size: .9rem !important; line-height: 1.66 !important; }
  .tj-hero__actions .btn { width: 100%; }
  .tj-trust { display: grid !important; grid-template-columns: 1fr !important; }
  .tj-promo-rail { width: 93vw !important; grid-template-columns: 1fr !important; }
  .tj-promo-card { min-height: 88px !important; }
  .wuxia-frame-corner { width: 23px; height: 23px; }
  .wuxia-petals .wuxia-petal:nth-child(n+11),
  .wuxia-embers .wuxia-ember:nth-child(n+14) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .wuxia-backdrop { transform: scale(1.02) !important; transition: none !important; }
  .wuxia-embers { display: none !important; }
}

.fx-paused .wuxia-embers { display: none !important; }

/* Hover stability hotfix.
   The upstream theme moved hovered cards to top:-100% / left:200%, which made
   the pointer repeatedly enter and leave the target. Keep every hit area still
   and express hover feedback only with color, glow and brightness. */
body.tamjai-v2 :is(.border-glowing, .border-glowing-v2, .img-effect),
body.tamjai-v2 :is(.card-body.border-glowing, .class-menu, .tj-promo-card) {
  top: 0 !important;
  left: 0 !important;
  translate: none !important;
  transform: none !important;
  transition-property: color, background-color, border-color, box-shadow, filter, opacity !important;
  transition-duration: .2s !important;
  transition-timing-function: ease !important;
}

body.tamjai-v2 :is(.border-glowing, .border-glowing-v2, .img-effect):hover,
body.tamjai-v2 :is(.card-body.border-glowing, .class-menu, .tj-promo-card):hover,
body.tamjai-v2.page-product .card-body.border-glowing:hover,
body.tamjai-v2.page-app .card-body.border-glowing:hover,
body.tamjai-v2 a > .border-glowing.img-fluid:hover,
body.tamjai-v2 a > img.border-glowing:hover {
  top: 0 !important;
  left: 0 !important;
  translate: none !important;
  transform: none !important;
  filter: brightness(1.045) saturate(1.025) !important;
}

body.tamjai-v2.page-product .card-body.border-glowing:hover > img,
body.tamjai-v2.page-app .card-body.border-glowing:hover > img {
  transform: none !important;
  filter: brightness(1.025) saturate(1.015) !important;
}

body.tamjai-v2 :is(.btn, .tj-preset, input[type="submit"], input[type="button"], input[type="reset"], .swal2-actions button),
body.tamjai-v2 :is(.navbar-brand img, .navbar .nav-link, .dropdown-item, .tj-footer a),
.wuxia-action-dock button {
  translate: none !important;
  transition-property: color, background-color, border-color, box-shadow, filter, opacity !important;
}

body.tamjai-v2 :is(.btn, .tj-preset, input[type="submit"], input[type="button"], input[type="reset"], .swal2-actions button):hover,
body.tamjai-v2 :is(.navbar-brand:hover img, .navbar .nav-link:hover, .dropdown-item:hover, .tj-footer a:hover),
.wuxia-action-dock button:hover {
  translate: none !important;
  transform: none !important;
}
