/* THOJA Native Mobile UI — compatibility layer for THOJA plugins & third-party UIs.
   CSS overrides only: no plugin file is modified. Hosted payment pages (MonCash/NatCash) are never styled. */

/* ---------- Shared tokens mapped onto plugin variables ---------- */
html[data-tnm-theme] .thoja-picker, html[data-tnm-theme] .thoja-dynamic-fields, html[data-tnm-theme] .thoja-board {
  --thoja-accent: var(--tnm-primary); --thoja-accent-dark: color-mix(in srgb, var(--tnm-primary) 75%, #000); --thoja-accent-light: color-mix(in srgb, var(--tnm-primary) 12%, var(--tnm-surface));
  --thoja-primary: var(--tnm-primary); --thoja-primary-dark: color-mix(in srgb, var(--tnm-primary) 75%, #000); --thoja-primary-light: color-mix(in srgb, var(--tnm-primary) 12%, var(--tnm-surface));
  --thoja-text: var(--tnm-text); --thoja-muted: var(--tnm-muted); --thoja-border: var(--tnm-border); --thoja-bg: var(--tnm-bg); --thoja-card: var(--tnm-surface);
  --thoja-radius: var(--tnm-radius);
}
html[data-tnm-theme="dark"] .thoja-picker, html[data-tnm-theme="dark"] .thoja-dynamic-fields, html[data-tnm-theme="dark"] .thoja-board {
  --thoja-success-bg: rgba(18, 183, 106, .14); --thoja-success: #4ade80; --thoja-error-bg: rgba(240, 68, 56, .14); --thoja-error: #f87171;
  --thoja-amber-bg: rgba(247, 144, 9, .14); --thoja-amber: #fbbf24; --thoja-shadow: none;
}

/* FlashTopup: theme follows the customer's choice, not only the phone (overrides @media prefers-color-scheme). */
html[data-tnm-theme="light"] .ftr { --ftr-surface: #fff; --ftr-surface-2: #f7f8fa; --ftr-bd: #e6e8ec; --ftr-text: #1d2433; --ftr-muted: #6b7280; }
html[data-tnm-theme="dark"] .ftr { --ftr-surface: var(--tnm-surface); --ftr-surface-2: color-mix(in srgb, var(--tnm-surface) 80%, var(--tnm-bg)); --ftr-bd: var(--tnm-border); --ftr-text: var(--tnm-text); --ftr-muted: var(--tnm-muted); }
html[data-tnm-theme] .ftr { --ftr-gold: var(--tnm-primary); --ftr-gold-2: color-mix(in srgb, var(--tnm-primary) 75%, #000); --ftr-radius: calc(var(--tnm-radius) + 2px); }
.ftr-modal-card { padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important; }

/* ---------- Player ID / Server ID / package cards (Digital Products + FlashTopup Woo) ---------- */
html[data-tnm-theme] :is(.thoja-dynamic-fields, .thoja-picker, .ftr-wc-fields, .ftr-thoja-flow) { background: var(--tnm-surface) !important; color: var(--tnm-text); border: 1px solid var(--tnm-border) !important; border-radius: calc(var(--tnm-radius) + 4px) !important; box-shadow: var(--tnm-shadow) !important; }
html[data-tnm-theme] .ftr-wc-fields, html[data-tnm-theme] .ftr-thoja-flow { padding: var(--tnm-space); }
html[data-tnm-theme] :is(.thoja-field-input, .ftr-wc-input) { background: color-mix(in srgb, var(--tnm-text) 4%, var(--tnm-surface)) !important; color: var(--tnm-text) !important; border: 1px solid var(--tnm-border) !important; border-radius: 14px !important; min-height: 50px; font-size: 16px !important; }
html[data-tnm-theme] :is(.thoja-field-input, .ftr-wc-input):focus { border-color: var(--tnm-primary) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--tnm-primary) 18%, transparent) !important; }
html[data-tnm-theme] :is(.thoja-validate-btn, .ftr-validate-id-btn) { border-radius: 999px !important; min-height: 46px; font-weight: 800 !important; background: var(--tnm-btn) !important; color: var(--tnm-btn-text) !important; border: 0 !important; }
html[data-tnm-theme] :is(.thoja-validate-btn, .ftr-validate-id-btn):active { transform: scale(.97); }
html[data-tnm-theme] :is(.thoja-pill, .thoja-denom-pill) { background: var(--tnm-surface) !important; border: 1.5px solid var(--tnm-border) !important; border-radius: 16px !important; color: var(--tnm-text) !important; transition: transform var(--tnm-dur) var(--tnm-ease), border-color var(--tnm-dur) ease; }
html[data-tnm-theme] :is(.thoja-pill, .thoja-denom-pill).thoja-selected { border-color: var(--tnm-primary) !important; background: color-mix(in srgb, var(--tnm-primary) 10%, var(--tnm-surface)) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--tnm-primary) 16%, transparent); }
html[data-tnm-theme] .thoja-denom-pill.thoja-disabled { background: color-mix(in srgb, var(--tnm-text) 5%, var(--tnm-surface)) !important; }
html[data-tnm-theme] .thoja-step-num { background: var(--tnm-primary) !important; }

/* Verification result cards: ✓ ID correct / ✕ Région incorrecte */
html[data-tnm-theme] :is(.thoja-validate-result, .ftr-validate-id-result, .ftr-wc-checkid-msg) { display: block; border-radius: 14px !important; padding: 12px 14px !important; font-size: 14px !important; line-height: 1.4; margin-top: 10px; }
html[data-tnm-theme] .thoja-validate-result:empty, html[data-tnm-theme] .ftr-validate-id-result:empty, html[data-tnm-theme] .ftr-wc-checkid-msg:empty { display: none; }
html[data-tnm-theme] .thoja-validate-result.thoja-state-success { background: color-mix(in srgb, var(--tnm-success) 12%, var(--tnm-surface)) !important; color: var(--tnm-text) !important; border: 1px solid color-mix(in srgb, var(--tnm-success) 35%, transparent); }
html[data-tnm-theme] .thoja-validate-result.thoja-state-error { background: color-mix(in srgb, var(--tnm-error) 10%, var(--tnm-surface)) !important; color: var(--tnm-text) !important; border: 1px solid color-mix(in srgb, var(--tnm-error) 35%, transparent); }
html[data-tnm-theme] .thoja-check-icon.valid { background: var(--tnm-success) !important; color: #fff !important; }
html[data-tnm-theme] .thoja-check-icon.invalid { background: var(--tnm-error) !important; color: #fff !important; }
html[data-tnm-theme] .thoja-player-name { color: var(--tnm-text) !important; font-weight: 800; }
html[data-tnm-theme] .thoja-region-alert { border-radius: calc(var(--tnm-radius) + 2px) !important; background: color-mix(in srgb, var(--tnm-warn) 10%, var(--tnm-surface)) !important; border: 1px solid color-mix(in srgb, var(--tnm-warn) 40%, transparent) !important; color: var(--tnm-text) !important; }
html[data-tnm-theme] .thoja-region-btn-primary { border-radius: 999px !important; background: var(--tnm-btn) !important; color: var(--tnm-btn-text) !important; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; }
html[data-tnm-theme] .thoja-cart-disabled { opacity: .5; }

/* ---------- Digital Products account board / codes ---------- */
html[data-tnm-theme="dark"] :is(.thoja-board, .thoja-card, .thoja-code-zone, .thoja-filters, .thoja-empty) { background: var(--tnm-surface) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; box-shadow: none !important; }
html[data-tnm-theme="dark"] .thoja-filter-pill { background: color-mix(in srgb, var(--tnm-text) 6%, transparent) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; }
html[data-tnm-theme="dark"] .thoja-filter-pill.active, html[data-tnm-theme="dark"] .thoja-filter-pill.is-active { background: var(--tnm-primary) !important; color: #fff !important; }
html[data-tnm-theme] :is(.thoja-copy-btn, .tov-copy, .ftr-copy-btn, .thoja-reveal-btn) { border-radius: 999px !important; min-height: 36px; font-weight: 800 !important; }

/* ---------- Orders Modern (no variables, heavy !important) ---------- */
html[data-tnm-theme="dark"] :is(.thoja-orders, .to-list, .to-card, .to-card-body, .to-card-foot, .to-card-top, .thoja-view-order-page, .thoja-order-view, .tov-grid, .tov-item, .tov-accordion, .tov-pay-box, .tov-status-hero, .tov-codes, .tov-code-row) { background: var(--tnm-surface) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; box-shadow: none !important; }
html[data-tnm-theme="dark"] :is(.to-meta, .to-order-id, .tov-item-meta, .tov-payment-method, .to-product-copy small) { color: var(--tnm-muted) !important; }
html[data-tnm-theme="dark"] :is(.to-product, .to-card-foot, .tov-code-row) { border-color: var(--tnm-border) !important; }
html[data-tnm-theme="dark"] :is(.to-card *, .tov-item *, .tov-status-hero *) { border-color: var(--tnm-border) !important; }
html[data-tnm-theme="dark"] :is(.to-card, .tov-item) :is(h2, h3, h4, strong, a:not(.button)) { color: var(--tnm-text) !important; }
html.tnm-is-mobile .to-card { border-radius: calc(var(--tnm-radius) + 4px) !important; }

/* ---------- Dashboard Modern ---------- */
html[data-tnm-theme="dark"] .tjdb { --b: var(--tnm-primary); --bd: var(--tnm-border); --mu: var(--tnm-muted); --tx: var(--tnm-text); }
html[data-tnm-theme="dark"] :is(.tjdb-hero, .tjdb-stat, .tjdb-panel, .tjdb-order, .tjdb-links a, .tjdb-empty) { background: var(--tnm-surface) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; box-shadow: none !important; }
html[data-tnm-theme="dark"] .tjdb :is(h1, h2, h3, strong, b) { color: var(--tnm-text) !important; }
html[data-tnm-theme="dark"] .tjdb :is(p, small, .tjdb-kicker) { color: var(--tnm-muted) !important; }
html.tnm-is-mobile .tjdb-stats { gap: 10px !important; }

/* ---------- Order Tracking Pro ---------- */
html[data-tnm-theme="dark"] .thoja-track-shell { --tt-bg: var(--tnm-bg); --tt-ink: var(--tnm-text); --tt-muted: var(--tnm-muted); --tt-line: var(--tnm-border); --tt-blue: var(--tnm-primary); }
html[data-tnm-theme="dark"] :is(.thoja-track-shell, .thoja-track-item, .thoja-track-customer, .thoja-item-result) { background: var(--tnm-surface) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; }

/* ---------- Login & Register (glass card, matches the provided "Sign In" reference) ---------- */
html[data-tnm-theme="dark"] .thoja-auth-shell { --ta-ink: var(--tnm-text); --ta-muted: var(--tnm-muted); --ta-border: rgba(255, 255, 255, .12); --ta-blue: var(--tnm-primary); background: transparent !important; }
html[data-tnm-theme="dark"] .thoja-auth-card { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(255, 255, 255, .12) !important; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px rgba(0, 0, 0, .45) !important; color: var(--tnm-text) !important; }
html[data-tnm-theme="dark"] .thoja-auth-card :is(input[type=text], input[type=email], input[type=password]) { background: rgba(255, 255, 255, .07) !important; border-color: rgba(255, 255, 255, .1) !important; color: var(--tnm-text) !important; }
html[data-tnm-theme] .thoja-auth-card :is(input, button) { border-radius: 14px !important; min-height: 50px; font-size: 16px; }
html[data-tnm-theme="dark"] .thoja-auth-card .thoja-submit { background: #fff !important; color: #0b1220 !important; }

/* ---------- Account details / Addresses ---------- */
html[data-tnm-theme="dark"] .thoja-account-head, html[data-tnm-theme="dark"] .woocommerce-EditAccountForm { --tj-text: var(--tnm-text); --tj-muted: var(--tnm-muted); --tj-border: var(--tnm-border); --tj-blue: var(--tnm-primary); }
html[data-tnm-theme="dark"] :is(.thoja-account-head, .woocommerce-EditAccountForm, .woocommerce-EditAccountForm fieldset, .thoja-address-page, .thoja-address-hero, .thoja-address-card, .thoja-address-form) { background: var(--tnm-surface) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; box-shadow: none !important; }
html[data-tnm-theme="dark"] :is(.thoja-address-card, .thoja-account-head) :is(h2, h3, strong) { color: var(--tnm-text) !important; }
html[data-tnm-theme="dark"] .thoja-address-toggle { background: color-mix(in srgb, var(--tnm-primary) 14%, transparent) !important; color: var(--tnm-primary) !important; }

/* ---------- Nextend Social Login ---------- */
.nsl-container .nsl-container-buttons a { margin: 6px 0 !important; }
.nsl-container .nsl-button { border-radius: 14px !important; min-height: 50px; display: flex !important; align-items: center; justify-content: center; box-shadow: none !important; }
html[data-tnm-theme="dark"] .nsl-container .nsl-button-default { background: rgba(255, 255, 255, .07) !important; color: var(--tnm-text) !important; border: 1px solid rgba(255, 255, 255, .12) !important; }

/* ---------- YITH Wishlist ---------- */
html.tnm-is-mobile .wishlist_table.mobile li, html.tnm-is-mobile table.wishlist_table tr { background: var(--tnm-surface) !important; border: 1px solid var(--tnm-border) !important; border-radius: calc(var(--tnm-radius) + 2px) !important; padding: 12px !important; margin: 0 0 12px !important; box-shadow: var(--tnm-shadow); }
html.tnm-is-mobile table.wishlist_table thead { display: none; }
html.tnm-is-mobile table.wishlist_table td { border: 0 !important; background: none !important; }
html[data-tnm-theme="dark"] :is(.wishlist_table, .wishlist-title, .yith-wcwl-share) { color: var(--tnm-text) !important; background: transparent !important; }
html.tnm-is-mobile body.tnm-has-nav :is(#yith-wcwl-popup-message, .yith-wcwl-popup-feedback, .yith-wcwl-add-to-wishlist-popup) { bottom: calc(var(--tnm-nav-h) + 32px + env(safe-area-inset-bottom, 0px)) !important; }
html[data-tnm-theme] .yith-wcwl-add-to-wishlist a { color: var(--tnm-primary) !important; }

/* v1.1: verification result always readable (all plugin states). */
html[data-tnm-theme="dark"] :is(.thoja-validate-result, .ftr-validate-id-result, .ftr-wc-checkid-msg):not(:empty) { background: color-mix(in srgb, var(--tnm-success) 12%, var(--tnm-surface)) !important; color: var(--tnm-text) !important; border: 1px solid color-mix(in srgb, var(--tnm-success) 35%, transparent) !important; min-height: 0 !important; height: auto !important; width: 100%; }
html[data-tnm-theme="dark"] :is(.thoja-validate-result, .ftr-validate-id-result, .ftr-wc-checkid-msg) :is(*, span, strong) { color: inherit !important; }
html[data-tnm-theme="dark"] :is(.thoja-validate-result.thoja-state-error, .thoja-validate-result.error, .ftr-validate-id-result.is-error, .ftr-wc-checkid-msg.error) { background: color-mix(in srgb, var(--tnm-error) 12%, var(--tnm-surface)) !important; border-color: color-mix(in srgb, var(--tnm-error) 40%, transparent) !important; }
html[data-tnm-theme] :is(.thoja-pill, .thoja-denom-pill).thoja-selected, html[data-tnm-theme] :is(.thoja-pill, .thoja-denom-pill).thoja-selected * { color: var(--tnm-text) !important; }
html[data-tnm-theme="dark"] :is(.thoja-step-heading, .thoja-picker h3, .thoja-dynamic-fields h3) { color: var(--tnm-text) !important; }

/* ---------- Goya 1.0.8.x (analysed from the theme source): mobile header, logo, counters, sticky bar ---------- */
/* Header icons (.header-mobile: hamburger, search, cart, account, wishlist): plain icons, no bubble/background. */
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(a.icon, .menu-toggle, .et-menu-account-btn, .quick_search, .quick_cart, .quick_wishlist, .account-links > li > a) {
  background: none !important; background-color: transparent !important; box-shadow: none !important; border: 0 !important; border-radius: 0 !important; outline: 0;
  min-width: 0; width: auto; height: auto; padding: 6px !important; position: relative; display: inline-flex; align-items: center; justify-content: center; -webkit-tap-highlight-color: transparent;
}
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(a.icon, .menu-toggle, .et-menu-account-btn, .account-links > li > a)::before,
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(a.icon, .menu-toggle, .et-menu-account-btn, .account-links > li > a)::after { display: none !important; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(a.icon, .menu-toggle, .et-menu-account-btn) svg { width: 22px; height: 22px; fill: none !important; stroke: currentColor !important; background: none !important; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(a.icon, .menu-toggle, .et-menu-account-btn):active { opacity: .6; }
html.tnm-is-mobile body.tnm-on .site-header .mobile-header-icons > * { margin-left: 14px; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .account-links.et-header-menu > li { padding: 0; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .account-links .sub-menu { display: none !important; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .menu-toggle .name { display: none !important; }
/* Counters: small badge on the icon; hidden when empty (Goya prints an empty wishlist counter and a "0" cart counter). */
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .item-counter {
  position: absolute; top: 0; right: -4px; min-width: 17px; height: 17px; padding: 0 4px; margin: 0 !important; border-radius: 999px; box-sizing: border-box;
  font-size: 10.5px; font-weight: 800; line-height: 17px; text-align: center; background: var(--tnm-primary) !important; color: #fff !important; box-shadow: 0 0 0 2px var(--tnm-bg);
}
html.tnm-is-mobile body.tnm-on .site-header .header-mobile :is(.minicart-counter.et-count-zero, .et-wishlist-counter:not(.active)) { display: none !important; }

/* Dark mode: Goya's header, sticky header, spacer, menus and mobile menu panel. */
html[data-tnm-theme="dark"] body.tnm-scope-full :is(.site-header, .header_on_scroll .site-header, .site-header .header-mobile, .header-spacer, .product-header-spacer, .sticky-product-bar, .top-bar, .et-global-campaign) { background-color: var(--tnm-bg) !important; border-color: var(--tnm-border) !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full .site-header :is(a.icon, .menu-toggle, .site-title, .et-header-text, .et-switcher-container .selected) { color: var(--tnm-text) !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full .site-header .header-mobile :is(.item-counter, .minicart-counter, .et-wishlist-counter.active) { background: var(--tnm-primary) !important; color: #fff !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full :is(.et-header-menu .sub-menu, .et-switcher-container .sub-menu, .side-mobile-menu, .side-fullscreen-menu, .search-panel, .mfp-wrap.quick-search, .click-capture) { background-color: var(--tnm-bg) !important; color: var(--tnm-text) !important; border-color: var(--tnm-border) !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full :is(.side-mobile-menu, .side-fullscreen-menu) :is(a, .et-menu-toggle, h1, h2, h3, li) { color: var(--tnm-text) !important; }
/* Dark mode logo: Goya prints .bg--light / .bg--dark / .bg--alt images; show the "dark background" logo
   (Customizer > Header > Logo > Logo dark). Without one, Goya repeats the main logo, so nothing breaks. */
html[data-tnm-theme="dark"] body.tnm-scope-full .site-header .logolink .logoimg { display: none !important; opacity: 0 !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full .site-header .logolink .logoimg.bg--dark { display: block !important; opacity: 1 !important; }
/* Our fixed buy bar replaces Goya's sticky add-to-cart bar on mobile (no double bar). */
html.tnm-is-mobile body.tnm-has-buybar .sticky-product-bar { display: none !important; }
.tnm-back.tnm-back--inline { position: relative; left: auto; top: auto; z-index: 1; flex-shrink: 0; width: 36px; height: 36px; margin: 0 4px 0 -6px; color: inherit; background: none !important; box-shadow: none !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
html[data-tnm-theme="dark"] body.tnm-scope-full .tnm-back--inline { color: var(--tnm-text); }

/* ---------- v1.3 header bell + back button inside Goya header ---------- */
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .tnm-bell svg { width: 22px; height: 22px; fill: none !important; stroke: currentColor !important; }
html[data-tnm-theme="dark"] body.tnm-scope-full .site-header .tnm-bell { color: var(--tnm-text) !important; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .tnm-bell .item-counter[hidden] { display: none !important; }
html.tnm-is-mobile body.tnm-on .site-header .mobile-header-icons:has(.tnm-bell) > * { margin-left: 6px; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .logo-holder { min-width: 0; flex: 1 1 auto; }
html.tnm-is-mobile body.tnm-on .site-header .header-mobile .logo-holder img { max-width: 100%; height: auto; }
@media (max-width: 380px) { html.tnm-is-mobile body.tnm-on .site-header .mobile-header-icons:has(.tnm-bell) .quick_wishlist { display: none !important; } }

/* ---------- v1.4: Goya ".animation" items stay at opacity 0 until a scroll waypoint fires (often never in the app) ---------- */
html.tnm-is-mobile body.tnm-on :is(.animation, .et-animation-ready .animation, .product-inner.animation) { opacity: 1 !important; transform: none !important; animation: none !important; visibility: visible !important; }
html.tnm-is-mobile body.tnm-on .woocommerce-product-gallery { opacity: 1 !important; }
html.tnm-is-mobile body.tnm-on img.lazyload:not([src^="data:"]) { opacity: 1 !important; }

/* Header with bell + install: keep the logo readable (wishlist stays in the account menu / bottom bar). */
@media (max-width: 430px) { html.tnm-is-mobile body.tnm-on .site-header .mobile-header-icons:has(.tnm-bell):has(.tnm-install-hd) .quick_wishlist { display: none !important; } }

/* ---------- v1.5 Chatway: one entry point (bottom bar) — no floating bubble, no preview card ---------- */
body.tnm-cw-integrated :is(.chatway--trigger-container, #chatway_widget_trigger, .chatway--trigger-icon-container) { display: none !important; }
body.tnm-cw-integrated .chatway--frame-container:is(.chatway--preview--only--container, .chatway--quick--reply--container) { display: none !important; }