/* =====================================================
   TNG GLOBAL UX
   Mejoras visuales compartidas por toda la plataforma
   ===================================================== */

:root {
  --tng-green: #075b43;
  --tng-green-dark: #043f31;
  --tng-gold: #b78620;
  --tng-radius: 14px;
  --tng-transition: 180ms ease;
}

/* ---------- NÚMEROS ---------- */

.tracking-radar-codes > *,
.tracking-next-codes > *,
.tracking-operation-code,
[class*="code-card"],
[class*="number-card"] {
  transition:
    transform var(--tng-transition),
    box-shadow var(--tng-transition),
    border-color var(--tng-transition);
}

.tracking-radar-codes > *:hover,
.tracking-next-codes > *:hover,
[class*="code-card"]:hover,
[class*="number-card"]:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(0,0,0,.10);
}

/* ---------- EQUIVALENCIAS ---------- */

/* EQ siempre visible */
.tracking-radar-codes small,
.tracking-next-codes small,
.tracking-operation-code small,
[class*="equiv"],
[class*="equivalence"],
[class*="code"] small {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;

  font-size: 15px !important;
  line-height: 1.3 !important;
  font-weight: 750 !important;
  margin-top: 4px !important;
}

/* Código principal */
.tracking-radar-codes > span,
.tracking-next-codes > span,
.tracking-operation-code {
  font-size: 22px !important;
  line-height: 1.1 !important;
}

/* ---------- SISTEMA SEMÁFORO ---------- */

.tng-intensity {
  position: relative;
  border: 2px solid transparent !important;
}

.tng-intensity-high {
  border-color: #2c9b66 !important;
  box-shadow: 0 0 0 3px rgba(44,155,102,.09);
}

.tng-intensity-medium {
  border-color: #d4a62a !important;
  box-shadow: 0 0 0 3px rgba(212,166,42,.09);
}

.tng-intensity-low {
  border-color: #c85e52 !important;
  box-shadow: 0 0 0 3px rgba(200,94,82,.08);
}

.tng-intensity-neutral {
  border-color: rgba(7,91,67,.16) !important;
}

/* ---------- TARJETAS GENERALES ---------- */

.panel,
.card,
[class*="-card"],
[class*="-panel"] {
  transition:
    box-shadow var(--tng-transition),
    transform var(--tng-transition);
}

/* ---------- BOTONES ---------- */

button,
.btn,
a.btn {
  transition:
    transform var(--tng-transition),
    box-shadow var(--tng-transition),
    background var(--tng-transition);
}

button:hover,
.btn:hover,
a.btn:hover {
  transform: translateY(-1px);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(183,134,32,.25);
  outline-offset: 2px;
}

/* ---------- ACTUALIZACIONES ---------- */

@keyframes tngNewData {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.025); }
  100% { transform: scale(1); }
}

.tng-new-data {
  animation: tngNewData .55s ease;
}

/* ---------- RESPONSIVE ---------- */


@media (max-width: 768px) {
    .tng-eq-global {
        font-size: 15px !important;
        line-height: 1.2 !important;
        font-weight: 800 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* TNG - equivalencias siempre visibles en Seguimiento */
.tracking-operation-code {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    min-width: 58px;
    padding: 5px 7px !important;
    margin: 2px !important;
    line-height: 1.05 !important;
}

.tracking-operation-code-value {
    display: block;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: .05em;
}

.tracking-operation-eq {
    display: block !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    white-space: nowrap;
    opacity: .82;
}


/* TNG - plataforma y módulos destacados en la portada */
.tng-platform-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:24px}.tng-platform-card{display:flex;min-height:170px;flex-direction:column;padding:22px;border:1px solid var(--border-color,rgba(148,163,184,.22));border-radius:18px;background:var(--surface-card,rgba(255,255,255,.04));box-shadow:0 12px 28px rgba(15,23,42,.08);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.tng-platform-card:hover{transform:translateY(-3px);border-color:var(--accent-color,rgba(124,92,255,.55));box-shadow:0 16px 34px rgba(15,23,42,.14)}.tng-platform-card-icon{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;margin-bottom:16px;border-radius:12px;color:var(--accent-color,#7c5cff);background:rgba(124,92,255,.14);font-size:15px;font-weight:800}.tng-platform-card h3{margin:0 0 8px}.tng-platform-card p{margin:0;color:var(--text-muted,inherit)}.tng-platform-card small{display:block;margin-top:auto;padding-top:14px;color:var(--text-muted,inherit);font-size:.78rem;line-height:1.4}.tng-platform-card-featured{border-color:rgba(124,92,255,.52);background:linear-gradient(145deg,rgba(124,92,255,.12),var(--surface-card,rgba(255,255,255,.04)))}@media(max-width:1050px){.tng-platform-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.tng-platform-grid{grid-template-columns:1fr}.tng-platform-card{min-height:145px}}

/* Seguimiento TNG - evitar tarjetas remontadas */
.tracking-operation-code,
.tracking-code-card,
.tracking-equivalence-card {
    min-width: 0 !important;
    max-width: 100% !important;
    width: auto !important;
    box-sizing: border-box !important;
}

.tracking-operation-codes,
.tracking-radar-codes,
.tracking-day-alert-codes {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
}

.tracking-operation-code {
    overflow: hidden !important;
}

.tracking-operation-code-value,
.tracking-operation-eq {
    max-width: 100% !important;
    white-space: nowrap !important;
}

.tracking-operatives-grid,
.tracking-operations-grid,
.tracking-operations-table {
    min-width: 0 !important;
}

.tracking-operations-table td,
.tracking-operations-table th {
    vertical-align: top !important;
    min-width: 0 !important;
}

@media (max-width: 1400px) {
    .tracking-operation-codes,
    .tracking-radar-codes,
    .tracking-day-alert-codes {
        grid-template-columns: repeat(2, minmax(110px, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    .tracking-operation-codes,
    .tracking-radar-codes,
    .tracking-day-alert-codes {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   TNG TRIPLE COLOMBIA
   ========================================================= */

.tng-triple-shell{
    max-width:1200px;
    margin:0 auto;
    padding:24px;
}

.tng-triple-head{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    margin-bottom:18px;
}

.tng-triple-head h2{
    margin:4px 0 8px;
    font-size:32px;
}

.tng-triple-date{
    background:#fff;
    border:1px solid #e6dcc5;
    border-radius:16px;
    padding:12px 18px;
    font-weight:800;
}

.tng-triple-toolbar{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:center;
    margin-bottom:16px;
}

.tng-triple-audience{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.tng-triple-audience .is-active{
    background:#075c45 !important;
    color:#fff !important;
}

.tng-triple-note{
    padding:12px 15px;
    border-radius:14px;
    background:#eef8f3;
    margin-bottom:18px;
    font-size:13px;
}

.tng-triple-results{
    display:grid;
    gap:12px;
}

.tng-triple-card{
    display:grid;
    grid-template-columns:
      48px minmax(180px,1.6fr) 110px 36px 110px 145px;
    gap:14px;
    align-items:center;
    border-radius:18px;
    padding:18px;
    border:1px solid #ddd;
    background:#fff;
    position:relative;
    overflow:hidden;
}

.tng-triple-card.is-green{
    border-left:7px solid #138a5b;
    background:linear-gradient(90deg,#effaf4,#fff);
}

.tng-triple-card.is-yellow{
    border-left:7px solid #d5a72d;
    background:linear-gradient(90deg,#fff8df,#fff);
}

.tng-triple-card.is-red{
    border-left:7px solid #b44d47;
    background:linear-gradient(90deg,#fff1ef,#fff);
}

.tng-triple-position{
    width:38px;
    height:38px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#063f34;
    color:#fff;
    font-weight:900;
}

.tng-triple-lottery{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.tng-triple-number{
    text-align:center;
}

.tng-triple-number strong{
    display:block;
    font-size:34px;
    line-height:1;
    color:#064c3c;
    letter-spacing:.08em;
}

.tng-triple-equivalence strong{
    color:#9b6c0e;
}

.tng-triple-arrow{
    text-align:center;
    font-size:24px;
}

.tng-triple-score{
    display:flex;
    flex-direction:column;
    text-align:center;
    gap:4px;
}

.tng-triple-score strong{
    font-size:21px;
}

.tng-triple-score span{
    font-size:10px;
    font-weight:800;
}

.tng-triple-why{
    grid-column:2 / -1;
    display:flex;
    gap:8px 18px;
    flex-wrap:wrap;
    font-size:12px;
    opacity:.82;
    padding-top:8px;
    border-top:1px dashed rgba(0,0,0,.12);
}

.tng-triple-final{
    margin-top:22px;
    border-radius:20px;
    padding:22px;
    background:#063f34;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.tng-triple-final[hidden]{
    display:none !important;
}

.tng-triple-final-numbers{
    font-size:38px;
    letter-spacing:.12em;
    color:#f1ce73;
}

.tng-triple-empty{
    padding:28px;
    text-align:center;
    background:#fff;
    border:1px dashed #d6cab2;
    border-radius:16px;
}

@media(max-width:900px){
    .tng-triple-card{
        grid-template-columns:40px 1fr 90px 25px 90px;
    }

    .tng-triple-score{
        grid-column:2 / -1;
        flex-direction:row;
        justify-content:space-between;
    }

    .tng-triple-why{
        grid-column:1 / -1;
    }

    .tng-triple-final{
        flex-direction:column;
        text-align:center;
    }
}

@media(max-width:600px){
    .tng-triple-shell{
        padding:14px;
    }

    .tng-triple-head,
    .tng-triple-toolbar{
        flex-direction:column;
    }

    .tng-triple-card{
        grid-template-columns:38px 1fr 1fr;
    }

    .tng-triple-arrow{
        display:none;
    }

    .tng-triple-number strong{
        font-size:28px;
    }

    .tng-triple-final-numbers{
        font-size:31px;
    }
}


/* ===== TNG TRIPLE COLOMBIA - CSS FIX DEFINITIVO ===== */

.tng-triple-shell{
    max-width:1200px !important;
    margin:0 auto !important;
    padding:24px !important;
}

.tng-triple-head{
    display:flex !important;
    justify-content:space-between !important;
    gap:20px !important;
    align-items:flex-start !important;
    margin-bottom:18px !important;
}

.tng-triple-head h2{
    margin:4px 0 8px !important;
    font-size:32px !important;
}

.tng-triple-date{
    background:#fff !important;
    border:1px solid #e6dcc5 !important;
    border-radius:16px !important;
    padding:12px 18px !important;
    font-weight:800 !important;
}

.tng-triple-toolbar{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:16px !important;
    margin-bottom:16px !important;
}

.tng-triple-audience{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
}

.tng-triple-audience .is-active{
    background:#075c45 !important;
    color:#fff !important;
}

.tng-triple-results{
    display:grid !important;
    gap:14px !important;
}

.tng-triple-card{
    display:grid !important;
    grid-template-columns:48px minmax(180px,1.5fr) 110px 36px 110px 145px !important;
    align-items:center !important;
    gap:14px !important;
    padding:18px !important;
    border-radius:18px !important;
    background:#fff !important;
    overflow:hidden !important;
}

.tng-triple-card.is-green{
    border:1px solid #b9dfce !important;
    border-left:7px solid #138a5b !important;
}

.tng-triple-card.is-yellow{
    border:1px solid #ead899 !important;
    border-left:7px solid #d5a72d !important;
}

.tng-triple-card.is-red{
    border:1px solid #e2b4b0 !important;
    border-left:7px solid #b44d47 !important;
}

.tng-triple-position{
    width:38px !important;
    height:38px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    background:#063f34 !important;
    color:#fff !important;
    font-weight:900 !important;
}

.tng-triple-lottery{
    display:flex !important;
    flex-direction:column !important;
    gap:4px !important;
}

.tng-triple-number{
    text-align:center !important;
}

.tng-triple-number strong{
    display:block !important;
    font-size:34px !important;
    line-height:1 !important;
    color:#064c3c !important;
}

.tng-triple-equivalence strong{
    color:#95660b !important;
}

.tng-triple-arrow{
    display:block !important;
    text-align:center !important;
    font-size:24px !important;
}

.tng-triple-score{
    display:flex !important;
    flex-direction:column !important;
    text-align:center !important;
    gap:4px !important;
}

.tng-triple-why{
    grid-column:2 / -1 !important;
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px 18px !important;
    padding-top:8px !important;
    font-size:12px !important;
}

.tng-triple-final{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:20px !important;
    margin-top:22px !important;
    padding:22px !important;
    border-radius:20px !important;
    background:#063f34 !important;
    color:#fff !important;
}

.tng-triple-final[hidden]{
    display:none !important;
}

.tng-triple-final-numbers{
    font-size:38px !important;
    color:#f1ce73 !important;
    letter-spacing:.12em !important;
}

@media (max-width:900px){
    .tng-triple-card{
        grid-template-columns:40px 1fr 90px 25px 90px !important;
    }

    .tng-triple-score,
    .tng-triple-why{
        grid-column:2 / -1 !important;
    }
}

@media (max-width:600px){
    .tng-triple-shell{
        padding:14px !important;
    }

    .tng-triple-head,
    .tng-triple-toolbar{
        flex-direction:column !important;
    }

    .tng-triple-card{
        grid-template-columns:38px 1fr 1fr !important;
    }

    .tng-triple-arrow{
        display:none !important;
    }

    .tng-triple-number strong{
        font-size:28px !important;
    }

    .tng-triple-final{
        flex-direction:column !important;
        text-align:center !important;
    }

    .tng-triple-final-numbers{
        font-size:31px !important;
    }
}


/* =====================================================
   TNG SEGUIMIENTO - FIX DEFINITIVO REDES / VIP
   Cada codigo se apila; nunca se corta ni se superpone
   ===================================================== */

#trackingOperations{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
}

/* Tabla general */
#trackingOperations table{
    width:100% !important;
    max-width:100% !important;
    table-layout:auto !important;
    border-collapse:collapse !important;
}

#trackingOperations th,
#trackingOperations td{
    vertical-align:top !important;
    min-width:0 !important;
}

/* Columnas FECHA y SORTEO compactas */
#trackingOperations th:nth-child(1),
#trackingOperations td:nth-child(1){
    width:78px !important;
    min-width:78px !important;
}

#trackingOperations th:nth-child(2),
#trackingOperations td:nth-child(2){
    width:115px !important;
    min-width:115px !important;
}

/* REDES y VIP reciben el espacio principal */
#trackingOperations th:nth-child(3),
#trackingOperations td:nth-child(3),
#trackingOperations th:nth-child(4),
#trackingOperations td:nth-child(4){
    width:34% !important;
    min-width:220px !important;
}

/* IMPORTANTE:
   cualquier contenedor de codigos dentro de REDES/VIP
   queda en UNA SOLA COLUMNA */
#trackingOperations td:nth-child(3) > div,
#trackingOperations td:nth-child(4) > div,
#trackingOperations td:nth-child(3) [class*="codes"],
#trackingOperations td:nth-child(4) [class*="codes"],
#trackingOperations td:nth-child(3) [class*="code-list"],
#trackingOperations td:nth-child(4) [class*="code-list"]{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

/* Cada tarjeta ORIGINAL -> EQUIVALENCIA */
#trackingOperations [class*="tracking-operation-code"]{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

/* Tarjeta interna */
#trackingOperations .tracking-operation-code-card,
#trackingOperations [class*="code-card"]{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;

    display:grid !important;
    grid-template-columns:minmax(95px,1fr) 28px minmax(95px,1fr) !important;
    align-items:center !important;
    gap:8px !important;

    padding:10px 12px !important;
    margin:0 0 7px 0 !important;
}

/* ORIGINAL y EQUIVALENCIA */
#trackingOperations .tracking-operation-code-value,
#trackingOperations .tracking-operation-eq{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-width:0 !important;
    width:100% !important;
}

/* NUMEROS COMPLETOS */
#trackingOperations .tracking-operation-code-value strong,
#trackingOperations .tracking-operation-eq strong,
#trackingOperations [class*="code-value"] strong,
#trackingOperations [class*="equivalence"] strong{
    display:block !important;
    width:100% !important;
    min-width:0 !important;

    font-size:25px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:.035em !important;

    white-space:nowrap !important;
    overflow:visible !important;
    text-overflow:clip !important;
}

/* Flecha */
#trackingOperations .tracking-operation-arrow,
#trackingOperations [class*="code-arrow"]{
    width:28px !important;
    min-width:28px !important;
    text-align:center !important;
}

/* Nunca permitir que una tarjeta invada otra columna */
#trackingOperations td:nth-child(3),
#trackingOperations td:nth-child(4){
    overflow:hidden !important;
}

/* Resultado y Match más compactos */
#trackingOperations th:nth-child(5),
#trackingOperations td:nth-child(5){
    width:105px !important;
    min-width:105px !important;
}

#trackingOperations th:nth-child(6),
#trackingOperations td:nth-child(6){
    width:125px !important;
    min-width:125px !important;
}

/* Desktop pequeño / tablet */
@media (max-width:1200px){

    #trackingOperations .tracking-operation-code-card,
    #trackingOperations [class*="code-card"]{
        grid-template-columns:minmax(82px,1fr) 22px minmax(82px,1fr) !important;
        padding:8px !important;
        gap:5px !important;
    }

    #trackingOperations .tracking-operation-code-value strong,
    #trackingOperations .tracking-operation-eq strong,
    #trackingOperations [class*="code-value"] strong,
    #trackingOperations [class*="equivalence"] strong{
        font-size:22px !important;
    }
}

/* Movil: no tabla horizontal; cada registro se vuelve bloque */
@media (max-width:760px){

    #trackingOperations{
        overflow-x:visible !important;
    }

    #trackingOperations table,
    #trackingOperations tbody,
    #trackingOperations tr,
    #trackingOperations td{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
    }

    #trackingOperations thead{
        display:none !important;
    }

    #trackingOperations tr{
        margin-bottom:16px !important;
        border-radius:14px !important;
        overflow:hidden !important;
    }

    #trackingOperations td{
        min-width:0 !important;
        padding:7px 10px !important;
    }

    #trackingOperations .tracking-operation-code-card,
    #trackingOperations [class*="code-card"]{
        grid-template-columns:minmax(100px,1fr) 26px minmax(100px,1fr) !important;
    }

    #trackingOperations .tracking-operation-code-value strong,
    #trackingOperations .tracking-operation-eq strong,
    #trackingOperations [class*="code-value"] strong,
    #trackingOperations [class*="equivalence"] strong{
        font-size:26px !important;
    }
}


/* =====================================================
   TNG SEGUIMIENTO - FIX DEFINITIVO REDES / VIP
   Cada codigo se apila; nunca se corta ni se superpone
   ===================================================== */

#trackingOperations{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
}

/* Tabla general */
#trackingOperations table{
    width:100% !important;
    max-width:100% !important;
    table-layout:auto !important;
    border-collapse:collapse !important;
}

#trackingOperations th,
#trackingOperations td{
    vertical-align:top !important;
    min-width:0 !important;
}

/* Columnas FECHA y SORTEO compactas */
#trackingOperations th:nth-child(1),
#trackingOperations td:nth-child(1){
    width:78px !important;
    min-width:78px !important;
}

#trackingOperations th:nth-child(2),
#trackingOperations td:nth-child(2){
    width:115px !important;
    min-width:115px !important;
}

/* REDES y VIP reciben el espacio principal */
#trackingOperations th:nth-child(3),
#trackingOperations td:nth-child(3),
#trackingOperations th:nth-child(4),
#trackingOperations td:nth-child(4){
    width:34% !important;
    min-width:220px !important;
}

/* IMPORTANTE:
   cualquier contenedor de codigos dentro de REDES/VIP
   queda en UNA SOLA COLUMNA */
#trackingOperations td:nth-child(3) > div,
#trackingOperations td:nth-child(4) > div,
#trackingOperations td:nth-child(3) [class*="codes"],
#trackingOperations td:nth-child(4) [class*="codes"],
#trackingOperations td:nth-child(3) [class*="code-list"],
#trackingOperations td:nth-child(4) [class*="code-list"]{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

/* Cada tarjeta ORIGINAL -> EQUIVALENCIA */
#trackingOperations [class*="tracking-operation-code"]{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

/* Tarjeta interna */
#trackingOperations .tracking-operation-code-card,
#trackingOperations [class*="code-card"]{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;

    display:grid !important;
    grid-template-columns:minmax(95px,1fr) 28px minmax(95px,1fr) !important;
    align-items:center !important;
    gap:8px !important;

    padding:10px 12px !important;
    margin:0 0 7px 0 !important;
}

/* ORIGINAL y EQUIVALENCIA */
#trackingOperations .tracking-operation-code-value,
#trackingOperations .tracking-operation-eq{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-width:0 !important;
    width:100% !important;
}

/* NUMEROS COMPLETOS */
#trackingOperations .tracking-operation-code-value strong,
#trackingOperations .tracking-operation-eq strong,
#trackingOperations [class*="code-value"] strong,
#trackingOperations [class*="equivalence"] strong{
    display:block !important;
    width:100% !important;
    min-width:0 !important;

    font-size:25px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:.035em !important;

    white-space:nowrap !important;
    overflow:visible !important;
    text-overflow:clip !important;
}

/* Flecha */
#trackingOperations .tracking-operation-arrow,
#trackingOperations [class*="code-arrow"]{
    width:28px !important;
    min-width:28px !important;
    text-align:center !important;
}

/* Nunca permitir que una tarjeta invada otra columna */
#trackingOperations td:nth-child(3),
#trackingOperations td:nth-child(4){
    overflow:hidden !important;
}

/* Resultado y Match más compactos */
#trackingOperations th:nth-child(5),
#trackingOperations td:nth-child(5){
    width:105px !important;
    min-width:105px !important;
}

#trackingOperations th:nth-child(6),
#trackingOperations td:nth-child(6){
    width:125px !important;
    min-width:125px !important;
}

/* Desktop pequeño / tablet */
@media (max-width:1200px){

    #trackingOperations .tracking-operation-code-card,
    #trackingOperations [class*="code-card"]{
        grid-template-columns:minmax(82px,1fr) 22px minmax(82px,1fr) !important;
        padding:8px !important;
        gap:5px !important;
    }

    #trackingOperations .tracking-operation-code-value strong,
    #trackingOperations .tracking-operation-eq strong,
    #trackingOperations [class*="code-value"] strong,
    #trackingOperations [class*="equivalence"] strong{
        font-size:22px !important;
    }
}

/* Movil: no tabla horizontal; cada registro se vuelve bloque */
@media (max-width:760px){

    #trackingOperations{
        overflow-x:visible !important;
    }

    #trackingOperations table,
    #trackingOperations tbody,
    #trackingOperations tr,
    #trackingOperations td{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
    }

    #trackingOperations thead{
        display:none !important;
    }

    #trackingOperations tr{
        margin-bottom:16px !important;
        border-radius:14px !important;
        overflow:hidden !important;
    }

    #trackingOperations td{
        min-width:0 !important;
        padding:7px 10px !important;
    }

    #trackingOperations .tracking-operation-code-card,
    #trackingOperations [class*="code-card"]{
        grid-template-columns:minmax(100px,1fr) 26px minmax(100px,1fr) !important;
    }

    #trackingOperations .tracking-operation-code-value strong,
    #trackingOperations .tracking-operation-eq strong,
    #trackingOperations [class*="code-value"] strong,
    #trackingOperations [class*="equivalence"] strong{
        font-size:26px !important;
    }
}


/* TNG - equivalencia visible en Cruce del día */
.tng-cross-code-stack{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}

.tng-cross-code-stack > b{
    font-size:22px;
    line-height:1;
}

.tng-cross-equivalence{
    display:inline-flex;
    align-items:center;
    padding:3px 7px;
    border-radius:7px;
    background:#eef6f1;
    color:#075844;
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
}

.tng-cross-equivalence.is-exact{
    background:#fff1c7;
    color:#8b5c00;
    border:1px solid #dfb44a;
}

.tng-cross-equivalence-hit{
    display:inline-flex;
    margin-top:2px;
    padding:4px 7px;
    border-radius:7px;
    background:#075844;
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.03em;
}

/* TNG - equivalencia visible en tarjetas de cruces */

.tng-cross-origin{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}

.tng-cross-origin > b{
    font-size:24px;
    line-height:1;
    font-weight:900;
}

.tng-cross-eq{
    display:inline-flex;
    margin-top:3px;
    padding:4px 9px;
    border-radius:8px;
    background:#edf7f2;
    border:1px solid #b8dccb;
    color:#075b45;
    font-size:12px;
    font-weight:900;
}

.tng-cross-eq-hit{
    display:inline-flex;
    margin-top:5px;
    padding:5px 9px;
    border-radius:8px;
    background:#075b45;
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.03em;
}


/* TNG CROSS ANALYSIS - ruta de equivalencia */

.tng-cross-origin{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}

.tng-cross-origin > b{
    font-size:24px;
    line-height:1;
    font-weight:900;
    color:#064f3d;
}

.tng-cross-eq{
    display:inline-flex;
    padding:4px 9px;
    border-radius:8px;
    background:#edf7f2;
    border:1px solid #b6daca;
    color:#075b45;
    font-size:12px;
    font-weight:900;
}

.tng-cross-eq-direct{
    display:inline-flex;
    margin-top:3px;
    padding:5px 9px;
    border-radius:8px;
    background:#075b45;
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.03em;
}

.tng-cross-eq-route{
    display:inline-flex;
    margin-top:3px;
    padding:5px 9px;
    border-radius:8px;
    background:#fff2c9;
    border:1px solid #ddb857;
    color:#805700;
    font-size:10px;
    font-weight:900;
}



/* =========================================================
   TNG GLOBAL LOADER
   Feedback compartido de navegación y procesos
   ========================================================= */

.tng-global-loader {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 22px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 180ms ease;
}

.tng-global-loader[hidden] {
    display: none !important;
}

.tng-global-loader.is-visible {
    opacity: 1;
}

.tng-global-loader-card {
    display: flex;
    align-items: center;
    gap: 14px;
    width: min(440px, calc(100vw - 32px));
    padding: 14px 18px;
    border: 1px solid rgba(183, 134, 32, .32);
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 38px rgba(4, 63, 49, .18);
    backdrop-filter: blur(14px);
    transform: translateY(-12px);
    transition: transform 180ms ease;
}

.tng-global-loader.is-visible .tng-global-loader-card {
    transform: translateY(0);
}

.tng-global-loader-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--tng-green), var(--tng-green-dark));
    box-shadow: 0 7px 18px rgba(4, 63, 49, .20);
}

.tng-global-loader-mark span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #d6b354;
    animation: tngGlobalLoaderPulse 900ms ease-in-out infinite;
}

.tng-global-loader-mark span:nth-child(2) {
    animation-delay: 140ms;
}

.tng-global-loader-mark span:nth-child(3) {
    animation-delay: 280ms;
}

.tng-global-loader-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.tng-global-loader-copy strong {
    color: var(--tng-green-dark);
    font-size: .94rem;
    line-height: 1.25;
}

.tng-global-loader-copy small {
    color: #587069;
    font-size: .78rem;
    line-height: 1.35;
}

@keyframes tngGlobalLoaderPulse {
    0%, 100% {
        opacity: .35;
        transform: translateY(0);
    }

    50% {
        opacity: 1;
        transform: translateY(-5px);
    }
}

@media (max-width: 768px) {
    .tng-global-loader {
        align-items: flex-end;
        padding: 14px;
        padding-bottom: max(14px, env(safe-area-inset-bottom));
    }

    .tng-global-loader-card {
        width: 100%;
        padding: 14px 16px;
        border-radius: 18px;
        transform: translateY(18px);
    }

    .tng-global-loader.is-visible .tng-global-loader-card {
        transform: translateY(0);
    }

    .tng-global-loader-copy strong {
        font-size: .98rem;
    }

    .tng-global-loader-copy small {
        font-size: .82rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tng-global-loader,
    .tng-global-loader-card,
    .tng-global-loader-mark span {
        animation: none !important;
        transition: none !important;
    }
}


/* =========================================================
   TNG GLOBAL LOADER
   Feedback compartido de navegación y procesos
   ========================================================= */

.tng-global-loader {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 22px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 180ms ease;
}

.tng-global-loader[hidden] {
    display: none !important;
}

.tng-global-loader.is-visible {
    opacity: 1;
}

.tng-global-loader-card {
    display: flex;
    align-items: center;
    gap: 14px;
    width: min(440px, calc(100vw - 32px));
    padding: 14px 18px;
    border: 1px solid rgba(183, 134, 32, .32);
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 38px rgba(4, 63, 49, .18);
    backdrop-filter: blur(14px);
    transform: translateY(-12px);
    transition: transform 180ms ease;
}

.tng-global-loader.is-visible .tng-global-loader-card {
    transform: translateY(0);
}

.tng-global-loader-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--tng-green), var(--tng-green-dark));
    box-shadow: 0 7px 18px rgba(4, 63, 49, .20);
}

.tng-global-loader-mark span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #d6b354;
    animation: tngGlobalLoaderPulse 900ms ease-in-out infinite;
}

.tng-global-loader-mark span:nth-child(2) {
    animation-delay: 140ms;
}

.tng-global-loader-mark span:nth-child(3) {
    animation-delay: 280ms;
}

.tng-global-loader-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.tng-global-loader-copy strong {
    color: var(--tng-green-dark);
    font-size: .94rem;
    line-height: 1.25;
}

.tng-global-loader-copy small {
    color: #587069;
    font-size: .78rem;
    line-height: 1.35;
}

@keyframes tngGlobalLoaderPulse {
    0%, 100% {
        opacity: .35;
        transform: translateY(0);
    }

    50% {
        opacity: 1;
        transform: translateY(-5px);
    }
}

@media (max-width: 768px) {
    .tng-global-loader {
        align-items: flex-end;
        padding: 14px;
        padding-bottom: max(14px, env(safe-area-inset-bottom));
    }

    .tng-global-loader-card {
        width: 100%;
        padding: 14px 16px;
        border-radius: 18px;
        transform: translateY(18px);
    }

    .tng-global-loader.is-visible .tng-global-loader-card {
        transform: translateY(0);
    }

    .tng-global-loader-copy strong {
        font-size: .98rem;
    }

    .tng-global-loader-copy small {
        font-size: .82rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tng-global-loader,
    .tng-global-loader-card,
    .tng-global-loader-mark span {
        animation: none !important;
        transition: none !important;
    }
}
\n
/* TNG_PREMIUM_SYSTEM_V19A */
.tng-premium-tabs{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px;
  margin:0 0 18px;
  border:1px solid rgba(196,147,47,.28);
  border-radius:16px;
  background:rgba(8,55,45,.55);
  box-shadow:0 10px 28px rgba(0,0,0,.12);
}
.tng-premium-tab{
  appearance:none;
  border:1px solid transparent;
  border-radius:11px;
  padding:10px 16px;
  font-weight:800;
  cursor:pointer;
  transition:180ms ease;
}
.tng-premium-tab[aria-selected="true"]{
  background:linear-gradient(135deg,#0e8c68,#08664f);
  border-color:rgba(240,215,138,.55);
  color:#fff;
  box-shadow:0 7px 20px rgba(14,140,104,.18);
}
.tng-premium-tab[aria-selected="false"]{
  background:transparent;
  color:inherit;
  opacity:.72;
}
.tng-zone-hidden{
  display:none !important;
}
.tng369-window-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:12px 0 22px;
}
.tng369-window{
  position:relative;
  min-height:112px;
  padding:14px;
  border:1px solid rgba(14,140,104,.42);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(14,140,104,.10),rgba(255,255,255,.02));
  box-shadow:0 8px 22px rgba(0,0,0,.09);
}
.tng369-window-label{
  color:#d8af55;
  font-size:.74rem;
  font-weight:900;
  letter-spacing:.12em;
}
.tng369-window-number{
  display:block;
  margin-top:7px;
  font-size:clamp(1.55rem,3vw,2.35rem);
  line-height:1;
  font-weight:900;
}
.tng369-window-meta{
  display:block;
  margin-top:8px;
  font-size:.78rem;
  opacity:.74;
}
.tng-ab-flow{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:stretch;
  gap:12px;
  margin:12px 0 22px;
}
.tng-ab-node{
  padding:15px;
  border:1px solid rgba(196,147,47,.35);
  border-radius:15px;
  background:rgba(196,147,47,.055);
}
.tng-ab-node-title{
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.10em;
  color:#d8af55;
}
.tng-ab-number{
  display:block;
  margin:7px 0 5px;
  font-size:clamp(1.6rem,3vw,2.5rem);
  font-weight:900;
}
.tng-ab-arrow{
  min-width:115px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#d8af55;
  font-weight:900;
}
.tng-ab-arrow-symbol{
  font-size:2rem;
  line-height:1;
}
.tng-vip-hero{
  margin-top:14px;
  padding:20px;
  border:1px solid rgba(240,215,138,.78);
  border-radius:20px;
  background:
    radial-gradient(circle at 50% 0,rgba(196,147,47,.17),transparent 48%),
    linear-gradient(145deg,rgba(9,77,59,.96),rgba(5,48,40,.98));
  box-shadow:
    0 18px 45px rgba(0,0,0,.19),
    0 0 0 1px rgba(196,147,47,.09) inset;
}
.tng-vip-header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:16px;
}
.tng-vip-title{
  color:#f0d78a;
  font-size:1.1rem;
  font-weight:900;
  letter-spacing:.10em;
}
.tng-vip-grid,
.tng-public-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.tng-vip-code-card,
.tng-public-code-card{
  position:relative;
  padding:15px;
  border-radius:15px;
}
.tng-vip-code-card{
  border:1px solid rgba(240,215,138,.42);
  background:rgba(255,255,255,.045);
}
.tng-public-code-card{
  border:1px solid rgba(14,140,104,.32);
  background:rgba(14,140,104,.055);
}
.tng-code-number{
  font-size:clamp(1.7rem,3.6vw,2.8rem);
  line-height:1;
  font-weight:950;
}
.tng-vip-code-card .tng-code-number{
  font-size:clamp(2rem,4vw,3.25rem);
}
.tng-code-eq{
  margin-left:5px;
  color:#d8af55;
  font-weight:800;
}
.tng-badge-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:12px;
}
.tng-struct-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(14,140,104,.38);
  border-radius:999px;
  font-size:.71rem;
  font-weight:850;
  background:rgba(14,140,104,.10);
}
.tng-struct-badge.gold{
  border-color:rgba(240,215,138,.48);
  background:rgba(196,147,47,.11);
  color:#f0d78a;
}
.tng-vip-action{
  width:100%;
  margin-top:17px;
  min-height:46px;
  border:1px solid rgba(240,215,138,.6) !important;
  border-radius:12px !important;
  background:linear-gradient(135deg,#0e8c68,#087156) !important;
  color:#fff !important;
  font-weight:900 !important;
  box-shadow:0 10px 25px rgba(14,140,104,.24);
}
.tng-info-button{
  width:30px;
  height:30px;
  padding:0;
  border-radius:50%;
  border:1px solid rgba(196,147,47,.4);
  background:rgba(196,147,47,.08);
  color:#d8af55;
  cursor:pointer;
  font-weight:900;
}
.tng-code-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}
.tng-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  place-items:center;
  padding:20px;
  background:rgba(1,18,14,.72);
  backdrop-filter:blur(7px);
}
.tng-modal-backdrop.open{
  display:grid;
}
.tng-info-modal{
  width:min(620px,96vw);
  max-height:82vh;
  overflow:auto;
  padding:22px;
  border:1px solid rgba(240,215,138,.48);
  border-radius:20px;
  background:#07382f;
  color:#eefaf5;
  box-shadow:0 28px 80px rgba(0,0,0,.42);
}
.tng-info-modal h3{
  margin-top:0;
  color:#f0d78a;
}
.tng-is-loading{
  position:relative;
  pointer-events:none;
  opacity:.76;
}
.tng-is-loading:before{
  content:"";
  display:inline-block;
  width:14px;
  height:14px;
  margin-right:7px;
  vertical-align:-2px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:tng-spin-v19 .7s linear infinite;
}
@keyframes tng-spin-v19{
  to{transform:rotate(360deg)}
}
@media(max-width:780px){
  .tng369-window-grid,
  .tng-vip-grid,
  .tng-public-grid{
    grid-template-columns:1fr;
  }
  .tng-ab-flow{
    grid-template-columns:1fr;
  }
  .tng-ab-arrow{
    min-height:65px;
  }
  .tng-ab-arrow-symbol{
    transform:rotate(90deg);
  }
  .tng-premium-tabs{
    overflow-x:auto;
  }
}
\n
/* TNG_GLOBAL_ACTIONS_V19C */

.tng-btn-primary,
.tng-btn-secondary,
.tng-btn-premium,
.tng-btn-danger{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:9px 15px;
  border-radius:11px;
  border:1px solid transparent;
  font-weight:850;
  line-height:1.1;
  cursor:pointer;
  transition:
    transform 160ms ease,
    opacity 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease;
}

.tng-btn-primary{
  background:linear-gradient(135deg,#0e8c68,#087057);
  border-color:rgba(240,215,138,.35);
  color:#fff;
  box-shadow:0 8px 20px rgba(14,140,104,.18);
}

.tng-btn-premium{
  background:linear-gradient(135deg,#c4932f,#a9761e);
  border-color:#f0d78a;
  color:#fff;
  box-shadow:0 10px 25px rgba(196,147,47,.22);
}

.tng-btn-secondary{
  background:rgba(14,140,104,.08);
  border-color:rgba(14,140,104,.35);
  color:inherit;
}

.tng-btn-danger{
  background:rgba(163,58,58,.10);
  border-color:rgba(163,58,58,.38);
  color:#c95353;
}

.tng-btn-primary:hover,
.tng-btn-premium:hover,
.tng-btn-secondary:hover,
.tng-btn-danger:hover{
  transform:translateY(-1px);
}

button:disabled,
.btn:disabled,
[aria-disabled="true"]{
  cursor:not-allowed !important;
  opacity:.58 !important;
  transform:none !important;
  box-shadow:none !important;
}

.tng-action-loading{
  pointer-events:none;
  position:relative;
}

.tng-action-loading::before{
  content:"";
  width:14px;
  height:14px;
  flex:0 0 14px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:999px;
  animation:tng-action-spin-v19c .72s linear infinite;
}

@keyframes tng-action-spin-v19c{
  to{transform:rotate(360deg)}
}

.tng-action-success{
  border-color:rgba(20,115,77,.55) !important;
  box-shadow:0 0 0 3px rgba(20,115,77,.10) !important;
}

.tng-action-error{
  border-color:rgba(163,58,58,.62) !important;
  box-shadow:0 0 0 3px rgba(163,58,58,.10) !important;
}

.tng-toast-stack{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:100000;
  width:min(390px,calc(100vw - 32px));
  display:grid;
  gap:9px;
  pointer-events:none;
}

.tng-toast{
  pointer-events:auto;
  padding:13px 15px;
  border-radius:13px;
  border:1px solid rgba(196,147,47,.28);
  background:rgba(5,48,40,.96);
  color:#f5fbf8;
  box-shadow:0 18px 45px rgba(0,0,0,.26);
  backdrop-filter:blur(10px);
  animation:tng-toast-in-v19c 180ms ease;
}

.tng-toast strong{
  display:block;
  margin-bottom:3px;
}

.tng-toast-success{
  border-color:rgba(23,179,132,.48);
}

.tng-toast-error{
  border-color:rgba(200,78,78,.55);
}

.tng-toast-info{
  border-color:rgba(196,147,47,.45);
}

@keyframes tng-toast-in-v19c{
  from{
    opacity:0;
    transform:translateY(8px);
  }
  to{
    opacity:1;
    transform:none;
  }
}

html:not(.tng-trading-dark) .tng-toast{
  background:rgba(255,255,255,.98);
  color:#173126;
  border-color:#e1d5ba;
}

html:not(.tng-trading-dark) .tng-btn-secondary{
  background:#fff;
  color:#173126;
}

@media(max-width:680px){
  .tng-btn-primary,
  .tng-btn-premium,
  .tng-btn-secondary{
    min-height:46px;
  }

  .tng-toast-stack{
    right:16px;
    bottom:16px;
  }
}


/* TNG_GLOBAL_ROLLOUT_V19D */

/* ---------- ACCIONES PRINCIPALES ---------- */
:is(.btn-primary,.tng369-btn-primary,.tarot-btn-primary,.gl-btn-primary){
  background:linear-gradient(135deg,#0e8c68,#07644e)!important;
  border:1px solid rgba(240,215,138,.42)!important;
  color:#fff!important;
  border-radius:12px!important;
  font-weight:850!important;
  box-shadow:0 9px 23px rgba(14,140,104,.20)!important;
  transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease!important;
}

:is(.btn-primary,.tng369-btn-primary,.tarot-btn-primary,.gl-btn-primary):hover{
  transform:translateY(-1px);
  box-shadow:0 13px 28px rgba(14,140,104,.27)!important;
}

/* ---------- PREMIUM / DORADO ---------- */
:is(.btn-gold,.tng-btn-premium){
  background:linear-gradient(135deg,#c4932f,#a8751e)!important;
  border:1px solid #f0d78a!important;
  color:#fff!important;
  border-radius:12px!important;
  font-weight:900!important;
  box-shadow:0 10px 26px rgba(196,147,47,.22)!important;
}

/* ---------- SECUNDARIOS ---------- */
:is(.btn-soft,.tng369-btn-soft,.tng369-btn-ghost,.tarot-btn-soft,.tarot-btn-ghost,.gl-btn-soft,.mini-btn){
  border-radius:11px!important;
  border:1px solid rgba(14,140,104,.30)!important;
  transition:border-color .16s ease,background .16s ease,transform .16s ease!important;
}

:is(.btn-soft,.tng369-btn-soft,.tng369-btn-ghost,.tarot-btn-soft,.tarot-btn-ghost,.gl-btn-soft,.mini-btn):hover{
  border-color:rgba(196,147,47,.52)!important;
  transform:translateY(-1px);
}

/* ---------- PELIGRO ---------- */
:is(.btn-danger,[data-danger-action]){
  border-radius:11px!important;
  border:1px solid rgba(163,58,58,.55)!important;
  background:rgba(163,58,58,.10)!important;
}

/* ---------- TARJETAS ---------- */
.card{
  border-radius:18px!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.card:hover{
  border-color:rgba(196,147,47,.26);
}

.app-release-card,
.tng369-card{
  border-radius:18px!important;
  box-shadow:0 12px 32px rgba(7,58,43,.08);
}

/* ---------- CAMPOS ---------- */
:where(
  input[type="text"],
  input[type="search"],
  input[type="date"],
  input[type="number"],
  input[type="password"],
  input[type="email"],
  input[type="tel"],
  select,
  textarea
){
  border-radius:11px!important;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

:where(
  input[type="text"],
  input[type="search"],
  input[type="date"],
  input[type="number"],
  input[type="password"],
  input[type="email"],
  input[type="tel"],
  select,
  textarea
):focus{
  border-color:#0e8c68!important;
  box-shadow:0 0 0 3px rgba(14,140,104,.16)!important;
  outline:none!important;
}

/* ---------- NAVEGACION ---------- */
.nav-btn{
  border-radius:11px!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
}

.nav-btn:hover{
  transform:translateX(2px);
}

.nav-btn.active,
.nav-btn[aria-current="page"]{
  border-color:rgba(196,147,47,.48)!important;
  box-shadow:inset 3px 0 0 #c4932f;
}

/* ---------- TABLAS ---------- */
table{
  border-collapse:separate;
  border-spacing:0;
}

table thead th{
  font-weight:800;
}

table tbody tr{
  transition:background .14s ease;
}

table tbody tr:hover{
  background:rgba(14,140,104,.045);
}

/* ---------- FEEDBACK GLOBAL ---------- */
.tng-v19-working{
  pointer-events:none!important;
  opacity:.78!important;
}

.tng-v19-working:before{
  content:"";
  display:inline-block;
  width:14px;
  height:14px;
  margin-right:7px;
  vertical-align:-2px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:tng-v19d-spin .7s linear infinite;
}

@keyframes tng-v19d-spin{
  to{transform:rotate(360deg)}
}

.tng-v19-success{
  border-color:#17b384!important;
  box-shadow:0 0 0 3px rgba(23,179,132,.12)!important;
}

.tng-v19-error{
  border-color:#a33a3a!important;
  box-shadow:0 0 0 3px rgba(163,58,58,.12)!important;
}

/* ---------- BADGES ---------- */
.tng-ui-badge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 9px;
  border:1px solid rgba(14,140,104,.32);
  border-radius:999px;
  background:rgba(14,140,104,.08);
  font-size:.72rem;
  font-weight:850;
}

.tng-ui-badge.premium{
  border-color:rgba(196,147,47,.45);
  background:rgba(196,147,47,.09);
}

/* ---------- WEB PUBLICA CLARA ---------- */
.public-body :is(.btn-primary,.tarot-btn-primary){
  background:linear-gradient(135deg,#0e8c68,#087057)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(14,140,104,.16)!important;
}

.public-body :is(.btn-soft,.tarot-btn-soft,.tarot-btn-ghost){
  background:#fff!important;
  color:#173126!important;
  border-color:#ded3ba!important;
}

.public-body .card{
  background:#fff!important;
  border-color:#e5dece!important;
  box-shadow:0 12px 30px rgba(16,46,31,.07)!important;
}

/* ---------- MOBILE ---------- */
@media(max-width:720px){
  :is(.btn-primary,.btn-gold,.btn-soft,.tng369-btn,.tarot-btn,.gl-btn){
    min-height:44px;
  }

  .card{
    border-radius:15px!important;
  }
}

/* TNG_00_99_CONTRAST_FIX_20260919 */
/* Solo contraste y legibilidad; no altera valores, contenido ni comportamiento. */
.tng-triple-shell {
  --tng-text-on-light: #064735;
  --tng-text-on-dark: #F5D78E;
  color: #064735 !important;
}

/* Superficies claras: texto verde oscuro legible. */
.tng-triple-shell,
.tng-triple-shell .tng-triple-toolbar,
.tng-triple-shell .tng-triple-results,
.tng-triple-shell .tng-triple-card,
.tng-triple-shell .tng-triple-score,
.tng-triple-shell .tng-triple-why,
.tng-triple-shell .tng-triple-empty,
.tng-triple-shell table {
  color: #064735 !important;
}

.tng-triple-shell :where(h1, h2, h3, h4, h5, h6, p, span, small, label, li, caption, td, th, strong, em, a) {
  color: #064735 !important;
}

.tng-triple-shell :where(table, .tng-triple-card, .tng-triple-score, .tng-triple-why, .tng-triple-empty) {
  background-color: #FFFFFF !important;
}

/* Cabeceras y paneles oscuros: dorado accesible. */
.tng-triple-shell .tng-triple-head,
.tng-triple-shell .tng-triple-final,
.tng-triple-shell .tng-triple-final-numbers,
.tng-triple-shell thead,
.tng-triple-shell th {
  background-color: #064735 !important;
  color: #F5D78E !important;
}

.tng-triple-shell .tng-triple-head :where(h1, h2, h3, h4, h5, h6, p, span, small, strong, a),
.tng-triple-shell .tng-triple-final :where(h1, h2, h3, h4, h5, h6, p, span, small, strong, a),
.tng-triple-shell .tng-triple-final-numbers :where(*),
.tng-triple-shell thead :where(*),
.tng-triple-shell th :where(*) {
  color: #F5D78E !important;
}

/* Tablas: cabeceras oscuras y celdas claras. */
.tng-triple-shell tbody,
.tng-triple-shell tr,
.tng-triple-shell td {
  color: #064735 !important;
  background-color: #FFFFFF !important;
}

/* Notas y recuadros informativos claros, incluidos estados móviles. */
.tng-triple-shell .tng-triple-why,
.tng-triple-shell .tng-triple-score,
.tng-triple-shell .tng-triple-empty {
  border-color: #064735 !important;
}

.tng-triple-shell .tng-triple-number,
.tng-triple-shell .tng-triple-arrow,
.tng-triple-shell .tng-triple-date,
.tng-triple-shell .tng-triple-audience,
.tng-triple-shell .tng-triple-toolbar {
  color: #064735 !important;
}

.tng-triple-shell .tng-triple-audience :where(button, [role='button']),
.tng-triple-shell #tngTripleDrawPicker :where(button, [role='button']) {
  color: #064735 !important;
  background-color: #FFFFFF !important;
  border-color: #064735 !important;
}

.tng-triple-shell .tng-triple-audience :where(button.is-active, button[aria-pressed='true'], [role='button'].is-active, [role='button'][aria-pressed='true']),
.tng-triple-shell #tngTripleDrawPicker :where(button.is-active, button[aria-pressed='true'], [role='button'].is-active, [role='button'][aria-pressed='true']) {
  color: #F5D78E !important;
  background-color: #064735 !important;
  border-color: #064735 !important;
}

/* Elementos oscuros adicionales: dorado, sin cambiar su estructura. */
.tng-triple-shell :where(.is-dark, .dark, [data-theme='dark']) {
  color: #F5D78E !important;
}

.tng-triple-shell :where(.is-dark, .dark, [data-theme='dark']) :where(*) {
  color: #F5D78E !important;
}

@media (max-width: 700px) {
  .tng-triple-shell :where(h1, h2, h3, h4, h5, h6, p, span, small, label, li, caption, td, th, strong, em, a) {
    color: #064735 !important;
  }

  .tng-triple-shell .tng-triple-head :where(*),
  .tng-triple-shell .tng-triple-final :where(*),
  .tng-triple-shell .tng-triple-final-numbers :where(*),
  .tng-triple-shell thead :where(*),
  .tng-triple-shell th :where(*) {
    color: #F5D78E !important;
  }
}
