/*
 * Tam Jai Studio — ornamental frames from the approved xianxia reference.
 * Visual-only layer: buttons, navigation, cards, badges, banners and icon rings.
 */
:root {
  --tj-orn-gold: #f4bd58;
  --tj-orn-gold-hi: #fff0af;
  --tj-orn-pink: #ff3aa7;
  --tj-orn-violet: #9a3ce8;
  --tj-orn-night: rgba(8, 3, 13, .96);
  --tj-orn-button-frame: url("/ornate-button-frame.svg");
  --tj-orn-panel-frame: url("/ornate-panel-frame.svg");
}

/* Reference-style button face: vivid primary, ink-black secondary, ornate frame. */
body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button,
  button:not(.btn-close):not(.swal2-close):not(.navbar-toggler):not(.tj-password-toggle):not(.wuxia-search-close):not(.carousel-control-prev):not(.carousel-control-next)
) {
  border: 1px solid rgba(255, 224, 148, .88) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 26% -35%, rgba(255,255,255,.34), transparent 38%),
    linear-gradient(112deg, #6f25dc 0%, #bb25dc 38%, #f02b9a 72%, #ef5863 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -4px 13px rgba(75,0,75,.28),
    0 0 0 2px rgba(242, 74, 175, .23),
    0 9px 24px rgba(75, 7, 105, .42),
    0 0 21px rgba(255, 49, 158, .25) !important;
  overflow: hidden !important;
  isolation: isolate;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button,
  button:not(.btn-close):not(.swal2-close):not(.navbar-toggler):not(.tj-password-toggle):not(.wuxia-search-close):not(.carousel-control-prev):not(.carousel-control-next)
)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 3 !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  pointer-events: none !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: var(--tj-orn-button-frame) center / 100% 100% no-repeat !important;
  opacity: .98 !important;
  filter: drop-shadow(0 0 4px rgba(255, 63, 173, .55)) !important;
  animation: none !important;
  translate: none !important;
  transform: none !important;
}

/* Replaced input controls cannot render pseudo-elements; layer the same frame directly. */
body.tamjai-v2 :is(input[type="submit"], input[type="button"], input[type="reset"]) {
  background-image:
    var(--tj-orn-button-frame),
    radial-gradient(circle at 26% -35%, rgba(255,255,255,.34), transparent 38%),
    linear-gradient(112deg, #6f25dc 0%, #bb25dc 38%, #f02b9a 72%, #ef5863 100%) !important;
  background-position: center, center, center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100%, 100% 100%, 100% 100% !important;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .swal2-actions button
)::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  inset: 4px !important;
  pointer-events: none !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.08), transparent 44%) !important;
  opacity: 1 !important;
  animation: none !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 :is(
  .btn-dark,
  .btn-secondary,
  .btn-thxk,
  .btn-link,
  .swal2-cancel,
  .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: #fff6fc !important;
  background:
    radial-gradient(circle at 24% -40%, rgba(205,72,238,.18), transparent 42%),
    linear-gradient(145deg, #1e1028 0%, #09050e 58%, #120713 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 0 22px rgba(195,48,220,.08),
    0 0 0 2px rgba(239, 98, 190, .14),
    0 9px 23px rgba(0,0,0,.44),
    0 0 17px rgba(255, 73, 166, .12) !important;
}

body.tamjai-v2 :is(.btn-warning, .btn-light) {
  color: #321606 !important;
  text-shadow: 0 1px rgba(255,255,255,.42) !important;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button,
  button:not(.btn-close):not(.swal2-close):not(.navbar-toggler):not(.tj-password-toggle):not(.wuxia-search-close):not(.carousel-control-prev):not(.carousel-control-next)
):hover {
  translate: none !important;
  transform: none !important;
  filter: brightness(1.13) saturate(1.08) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.4),
    inset 0 -4px 13px rgba(75,0,75,.22),
    0 0 0 2px rgba(255, 220, 132, .35),
    0 10px 27px rgba(77, 7, 106, .45),
    0 0 31px rgba(255, 44, 164, .47) !important;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button
):hover::before {
  opacity: 1 !important;
  filter: drop-shadow(0 0 7px rgba(255, 52, 171, .9)) drop-shadow(0 0 3px rgba(255, 226, 145, .75)) !important;
}

body.tamjai-v2 :is(
  .btn,
  .shopbtn,
  .neon-button,
  .tj-preset,
  .buyproduct-btn,
  .submit_buyproduct,
  .submit_buyproduct_app,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .dataTables_wrapper .dataTables_paginate .paginate_button,
  .swal2-actions button
):active {
  translate: none !important;
  transform: none !important;
  filter: brightness(.92) saturate(1.08) !important;
  box-shadow: inset 0 5px 14px rgba(28,0,38,.48), 0 0 0 2px rgba(255,213,125,.25), 0 0 20px rgba(255,48,163,.26) !important;
}

/* Navbar frame and active tab treatment. */
.tamjai-navbar-shell,
body > .bg-black.container-lg.border {
  z-index: 1040 !important;
  border: 2px solid rgba(246, 190, 77, .88) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(14,5,20,.97), rgba(5,2,9,.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 56, 169, .4), inset 0 0 24px rgba(178,38,211,.12), 0 15px 45px rgba(0,0,0,.62), 0 0 22px rgba(248,46,161,.19) !important;
}

.tamjai-navbar-shell .navbar {
  position: relative;
  isolation: isolate;
}

.tamjai-navbar-shell .navbar::before {
  content: "";
  position: absolute;
  z-index: 4;
  inset: -10px -15px;
  pointer-events: none;
  background: var(--tj-orn-button-frame) center / 100% 100% no-repeat;
  filter: drop-shadow(0 0 5px rgba(255,66,174,.48));
}

.navbar-dark .navbar-nav .nav-link {
  border: 1px solid transparent !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: #fff6ff !important;
  border-color: rgba(245, 187, 84, .34) !important;
  background: rgba(177, 36, 187, .13) !important;
  box-shadow: inset 0 0 13px rgba(245,49,164,.1), 0 0 13px rgba(245,49,164,.08) !important;
  translate: none !important;
  transform: none !important;
}

.navbar-dark .navbar-nav .nav-link:is(.tj-active, .active) {
  border-color: rgba(255, 222, 143, .9) !important;
  background: linear-gradient(112deg, rgba(113,35,221,.92), rgba(238,42,157,.92)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,126,211,.54), inset 0 0 17px rgba(255,255,255,.1), 0 0 20px rgba(247,45,166,.34) !important;
}

/* Stronger filigree corners on the hero, navbar and carousel. */
.wuxia-frame-corner {
  width: 42px !important;
  height: 42px !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 7px rgba(255, 57, 168, .64)) drop-shadow(0 0 3px rgba(255, 226, 139, .8)) !important;
}

.wuxia-frame-corner::before,
.wuxia-frame-corner::after {
  background: linear-gradient(90deg, #9f4b17, #fff0a8 48%, #f28c2f) !important;
  box-shadow: 0 0 5px rgba(255, 72, 174, .72) !important;
}

.wuxia-frame-corner::before { height: 3px !important; border-radius: 999px; }
.wuxia-frame-corner::after { width: 3px !important; border-radius: 999px; }

/* Framed category/product/auth/admin surfaces. */
body.tamjai-v2 :is(
  .tj-promo-card,
  .card-body.border-glowing,
  .class-menu,
  .modal-content,
  .tj-app-static-card,
  .tj-shop-tools,
  .tj-admin-tools,
  .wuxia-search-panel,
  .page-login .card-body,
  .page-register .card-body
) {
  position: relative !important;
  isolation: isolate;
  border: 2px solid rgba(245, 186, 75, .82) !important;
  outline: 1px solid rgba(255, 58, 169, .45) !important;
  outline-offset: -6px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 87, 188, .2), inset 0 0 25px rgba(173,38,204,.08), 0 14px 38px rgba(0,0,0,.52), 0 0 22px rgba(255,52,166,.17) !important;
}

body.tamjai-v2 :is(
  .tj-promo-card,
  .card-body.border-glowing,
  .class-menu,
  .modal-content,
  .tj-app-static-card,
  .tj-shop-tools,
  .tj-admin-tools,
  .wuxia-search-panel,
  .page-login .card-body,
  .page-register .card-body
)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 5 !important;
  inset: -2px !important;
  pointer-events: none !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: var(--tj-orn-panel-frame) center / 100% 100% no-repeat !important;
  opacity: .96 !important;
  filter: drop-shadow(0 0 5px rgba(255, 64, 172, .48)) !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 :is(
  .tj-promo-card,
  .card-body.border-glowing,
  .class-menu,
  .modal-content,
  .tj-app-static-card,
  .tj-shop-tools,
  .tj-admin-tools,
  .wuxia-search-panel,
  .page-login .card-body,
  .page-register .card-body
):hover {
  border-color: rgba(255, 218, 134, .94) !important;
  filter: brightness(1.035) saturate(1.025) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 94, 192, .28), inset 0 0 28px rgba(185,41,216,.1), 0 16px 42px rgba(0,0,0,.56), 0 0 29px rgba(255,52,166,.25) !important;
  translate: none !important;
  transform: none !important;
}

.tj-promo-card::after {
  content: "✦" !important;
  z-index: 6 !important;
  color: #fff0ae !important;
  text-shadow: 0 0 8px rgba(255,55,167,.9), 0 0 4px rgba(255,220,125,.9) !important;
}

/* Hero and banners get a visible double neon frame without changing imagery. */
.page-home .tj-hero,
.page-home #carouselExampleControls,
.page-home #carouselExampleControls .carousel-inner {
  border: 2px solid rgba(245, 185, 74, .86) !important;
  outline: 1px solid rgba(255, 59, 170, .42) !important;
  outline-offset: -7px !important;
  box-shadow: inset 0 0 0 1px rgba(255,91,190,.2), inset 0 0 38px rgba(176,37,211,.08), 0 24px 68px rgba(0,0,0,.66), 0 0 26px rgba(255,50,163,.2) !important;
}

.page-home #carouselExampleControls::before {
  content: "";
  position: absolute;
  z-index: 7;
  inset: -2px;
  pointer-events: none;
  border-radius: inherit;
  background: var(--tj-orn-panel-frame) center / 100% 100% no-repeat;
  filter: drop-shadow(0 0 5px rgba(255,62,171,.5));
}

/* Badges and small labels from the reference sheet. */
body.tamjai-v2 :is(.badge, .tj-badge, .tj-recommended, .tj-kicker, .tj-wallet-pill, .tj-trust span) {
  border: 1px solid rgba(255, 222, 143, .82) !important;
  color: #fff5fc !important;
  background: linear-gradient(112deg, rgba(92,27,152,.92), rgba(204,37,178,.9) 58%, rgba(237,58,123,.9)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,100,201,.27), inset 0 1px rgba(255,255,255,.15), 0 0 12px rgba(246,48,168,.25) !important;
  text-shadow: 0 1px 6px rgba(15,0,24,.7) !important;
}

/* Keep only the first live credit indicator when the upstream navbar repeats it. */
body.tamjai-v2 .tamjai-navbar-shell .navbar-nav > .nav-item:has(> .tj-wallet-pill)
  ~ .nav-item:has(> .tj-wallet-pill),
body.tamjai-v2 .tamjai-navbar-shell .navbar-nav > .nav-item:has(.fa-gem)
  ~ .nav-item:has(.fa-gem),
body.tamjai-v2 .tamjai-navbar-shell .tj-wallet-pill ~ .tj-wallet-pill,
body.tamjai-v2 .tamjai-navbar-shell .tj-wallet-duplicate {
  display: none !important;
}

body.tamjai-v2 .tamjai-navbar-shell .dropdown-menu {
  z-index: 1045 !important;
}

html:has(body.tamjai-v2.page-admin.modal-open)::before {
  z-index: 1045 !important;
}

@media (min-width: 992px) {
  body.tamjai-v2 .tamjai-navbar-shell .navbar-toggler {
    display: none !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell #navbarNav > .navbar-nav {
    min-width: 0;
    flex-wrap: nowrap !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell #navbarNav > .navbar-nav > .nav-item:last-child {
    display: list-item !important;
    flex: 0 0 auto;
  }

  body.tamjai-v2 .tamjai-navbar-shell #navbarNav > .navbar-nav > .nav-item:last-child > .nav-link {
    white-space: nowrap !important;
  }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
  body.tamjai-v2 .tamjai-navbar-shell .navbar > .container {
    padding-inline: 0 !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell .navbar-brand {
    margin-right: .45rem !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell #navbarNav > .navbar-nav {
    gap: .2rem !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell #navbarNav .nav-link {
    padding-inline: .52rem !important;
    font-size: .84rem !important;
  }

  body.tamjai-v2 .tamjai-navbar-shell .tj-wallet-pill {
    padding-inline: .7rem !important;
    font-size: .82rem !important;
    white-space: nowrap !important;
  }
}

body.tamjai-v2 :is(.badge.bg-warning, .tj-badge--ok) {
  color: #2c1604 !important;
  background: linear-gradient(112deg, #d8972f, #f5cc68 60%, #ffe8a8) !important;
  text-shadow: 0 1px rgba(255,255,255,.35) !important;
}

/* Circular icon rings. */
body.tamjai-v2 :is(
  .wuxia-action-dock button,
  .wuxia-search-close,
  .swal2-close,
  .btn-close,
  .carousel-control-prev,
  .carousel-control-next,
  .tj-footer__social a
) {
  border: 2px solid rgba(255, 219, 137, .88) !important;
  border-radius: 50% !important;
  color: #fff0b0 !important;
  background: radial-gradient(circle at 38% 30%, rgba(241,53,173,.42), transparent 43%), linear-gradient(145deg, #3c124d, #09050e 72%) !important;
  box-shadow: inset 0 0 0 2px rgba(255,72,180,.27), inset 0 0 14px rgba(232,49,178,.18), 0 0 0 2px rgba(150,46,193,.2), 0 7px 19px rgba(0,0,0,.42), 0 0 17px rgba(255,48,162,.25) !important;
  filter: none !important;
  translate: none !important;
  transform: none !important;
  transition: color .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

body.tamjai-v2 :is(
  .wuxia-action-dock button,
  .wuxia-search-close,
  .swal2-close,
  .btn-close,
  .carousel-control-prev,
  .carousel-control-next,
  .tj-footer__social a
):hover {
  color: #fff !important;
  border-color: #fff0af !important;
  box-shadow: inset 0 0 0 2px rgba(255,86,190,.38), inset 0 0 17px rgba(242,48,184,.25), 0 0 0 2px rgba(207,63,219,.26), 0 8px 20px rgba(0,0,0,.44), 0 0 25px rgba(255,48,162,.5) !important;
  filter: brightness(1.1) !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2 .tj-password-toggle {
  border: 1px solid rgba(255, 218, 131, .28) !important;
  color: #ffe29a !important;
  background: radial-gradient(circle, rgba(238,53,179,.14), transparent 68%) !important;
  box-shadow: inset 0 0 8px rgba(239,55,181,.08) !important;
}

/* Mobile keeps ornaments readable without crowding labels. */
@media (max-width: 575.98px) {
  body.tamjai-v2 :is(.btn, .shopbtn, .neon-button, .tj-preset, .swal2-actions button) {
    border-radius: 14px !important;
  }

  body.tamjai-v2 :is(.btn, .shopbtn, .neon-button, .tj-preset, .swal2-actions button)::before {
    background-size: 112% 100% !important;
  }

  .tamjai-navbar-shell .navbar::before { inset: -8px -7px; }
  .wuxia-frame-corner { width: 31px !important; height: 31px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.tamjai-v2 :is(.btn, button, .tj-promo-card, .card-body.border-glowing, .class-menu) {
    transition: none !important;
  }
}

/* Five live service buttons matching the main navigation service menu. */
body.tamjai-v2.page-home .tj-promo-rail.tj-service-rail {
  width: min(94vw, 1320px) !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.tamjai-v2.page-home .tj-service-card {
  display: block !important;
  position: relative !important;
  min-width: 0;
  min-height: 0 !important;
  aspect-ratio: 16 / 9;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 218, 134, .88) !important;
  border-radius: 14px !important;
  outline: 0 !important;
  background: #12051b !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .5), 0 0 18px rgba(255, 55, 168, .24) !important;
  text-decoration: none !important;
  cursor: pointer;
  line-height: 0;
}

body.tamjai-v2.page-home .tj-service-card::before,
body.tamjai-v2.page-home .tj-service-card::after {
  content: none !important;
  display: none !important;
}

body.tamjai-v2.page-home .tj-service-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  user-select: none;
}

body.tamjai-v2.page-home .tj-service-card:hover {
  border-color: #ffe59b !important;
  filter: brightness(1.05) saturate(1.03) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .56), 0 0 26px rgba(255, 55, 168, .38) !important;
  translate: none !important;
  transform: none !important;
}

body.tamjai-v2.page-home .tj-service-card:focus-visible {
  outline: 3px solid #fff0a8 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 5px rgba(239, 55, 180, .35), 0 0 30px rgba(255, 62, 174, .55) !important;
}

@media (max-width: 991.98px) {
  body.tamjai-v2.page-home .tj-promo-rail.tj-service-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 575.98px) {
  body.tamjai-v2.page-home .tj-promo-rail.tj-service-rail {
    grid-template-columns: 1fr !important;
  }
}
