/* ============================================================
   Archivo: combinacion.css
   Estilos del Tablero de Ajedrez Cuántico - Chasis Mecánico 3D Definitivo
   ============================================================ */

/* Envoltura general estilo Soporte Técnico */
.tablero-box-wrapper {
    width: 100%;
    overflow-x: auto;
    background-color: #d1d5db !important; /* Gris suave de soporte */
    padding: 15px;
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.15), 0px 4px 10px rgba(0,0,0,0.1);
    margin-bottom: 25px;
    box-sizing: border-box;
}

.card-tablero-main {
    border: none;
    background: transparent !important;
}

.header-tablero-titulo {
    background-color: #f8f9fa !important;
    color: #222 !important;
    font-size: 14px;
    padding: 10px;
    font-weight: bold;
    font-family: 'Segoe UI', Arial, sans-serif;
    border-bottom: 2px solid #bbb;
}

/* MATRIZ COMPACTA CON SOPORTE DE RELIEVE 3D */
.tabla-ajedrez-cuantica {
    width: 100%;
    border-collapse: separate;
    border-spacing: 2px; /* Espacio sutil para la proyección de las sombras primordiales */
    background: #bbb !important;
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 14px;
}

/* Esquina superior izquierda unificada */
.th-block-esquina-limpio {
    border: none !important;
    background: transparent !important;
}

.th-titulo-maestro-ab {
    font-weight: bold;
    color: #222;
    background-color: #f8f9fa;
    font-size: 13px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #ccc !important;
}

/* Cabeceras de Ejes Horizontales */
.th-titulo-bicolor-eje {
    font-weight: bold;
    color: #333;
    background-color: #e5e7eb;
    font-size: 12px;
    padding: 6px; 
}

.th-titulo-zona-lejana {
    background-color: #9ca3af !important;
    color: white !important;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}

/* --- CABECERAS B INTERFAZ --- */
.th-header-b-col {
    font-size: 12px;
    font-weight: bold;
    padding: 8px;
    color: white;
}

/* Estructura base de la Fila 3 (Valores Reales Mutados) */
.th-valor-bicolor-mutado {
    font-weight: bold;
    font-size: 15px;
    padding: 6px;
    vertical-align: middle;
}
/* ============================================================
   TRATAMIENTO DE COLORES Y RELIEVES EN CABECERAS DOBLES (3D)
   Unificación total: La Fila 3 hereda la identidad de la Fila 2
   ============================================================ */

/* ZONA ROJA (B0 y su número mutado abajo) */
.bg-zona-roja,
th[class*="bg-zona-roja"],
.tabla-ajedrez-cuantica thead tr th.bg-zona-roja {
    background-image: linear-gradient(135deg, #ff416c, #c00000) !important;
    background-color: #c00000 !important;
    box-shadow: 0px 3px 0px #641e16, inset 0px 2px 2px rgba(255,255,255,0.3) !important;
    color: #ffffff !important;
    text-shadow: 0px 1px 2px rgba(0,0,0,0.5) !important;
}

/* ZONA VERDE (B1-B2 y sus números mutados abajo) */
.bg-zona-verde,
th[class*="bg-zona-verde"],
.tabla-ajedrez-cuantica thead tr th.bg-zona-verde {
    background-image: linear-gradient(135deg, #11998e, #00b050) !important;
    background-color: #00b050 !important;
    box-shadow: 0px 3px 0px #145a32, inset 0px 2px 2px rgba(255,255,255,0.3) !important;
    color: #ffffff !important;
    text-shadow: 0px 1px 2px rgba(0,0,0,0.5) !important;
}

/* ZONA NARANJA (B3-B6 y sus números mutados abajo) */
.bg-zona-naranja,
th[class*="bg-zona-naranja"],
.tabla-ajedrez-cuantica thead tr th.bg-zona-naranja,
.bg-zona-naranja-eje {
    background-image: linear-gradient(135deg, #f47b20, #c65a0b) !important;
    background-color: #c65a0b !important;
    box-shadow: 0px 3px 0px #843904, inset 0px 2px 2px rgba(255,255,255,0.3) !important;
    color: #ffffff !important;
    text-shadow: 0px 1px 2px rgba(0,0,0,0.5) !important;
}

/* ZONA AZUL REY FIJA (Eje A0 y su número mutado) */
.bg-zona-azul-fija {
    background-image: linear-gradient(135deg, #00c6ff, #007bff) !important;
    background-color: #007bff !important;
    box-shadow: 0px 3px 0px #0b5394, inset 0px 2px 2px rgba(255,255,255,0.3) !important;
    color: #ffffff !important;
    text-shadow: 0px 1px 2px rgba(0,0,0,0.5) !important;
    font-weight: bold;
}

/* ZONA LEJANA GRIS MATE (B7-B9 y sus números mutados abajo) */
.th-titulo-zona-lejana,
.bg-zona-lejana-b,
th[class*="bg-zona-lejana-b"],
.tabla-ajedrez-cuantica thead tr th.th-titulo-zona-lejana,
.tabla-ajedrez-cuantica thead tr th.bg-zona-lejana-b,
.tabla-ajedrez-cuantica thead tr th.th-valor-bicolor-mutado.bg-zona-lejana-b {
    background-image: none !important;
    background: #9ca3af !important;       /* Gris intermedio/oscuro exacto */
    background-color: #9ca3af !important;
    color: #ffffff !important;            /* Texto blanco para máxima lectura */
    box-shadow: none !important;
    text-shadow: none !important;
    border: 1px solid #ccc !important;
}

.fila-tablero-medida {
    height: 35px;
}


/* --- BLOQUES DE TEXTO VERTICAL CONTINUO --- */
.td-eje-vertical-azul {
    background-image: linear-gradient(135deg, #00b4db, #0083b0) !important;
    color: #fff !important;
    font-weight: bold;
    width: 35px;
    font-size: 13px;
    letter-spacing: 1px;
    writing-mode: vertical-lr;
    text-orientation: mixed;
    text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
    box-shadow: inset 0px 1px 3px rgba(255,255,255,0.3);
    display: table-cell;
    vertical-align: middle !important;
    text-align: center !important;
}

.td-eje-vertical-zona-lejana {
    background-color: #9ca3af !important; /* Gris intermedio de la barra vertical */
    color: #ffffff !important;
    font-weight: bold;
    width: 35px;
    font-size: 13px;
    letter-spacing: 1px;
    writing-mode: vertical-lr;
    text-orientation: mixed;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
    display: table-cell;
    vertical-align: middle !important;
    text-align: center !important;
}

/* --- BASE DE BOTONERA 3D AZUL PARA LOS IDENTIFICADORES SUPERIORES (A0-A4) --- */
.td-etiqueta-azul-id, .td-digito-azul-val {
    color: #ffffff !important;
    font-weight: bold;
    background-image: linear-gradient(135deg, #00b4db, #0070c0) !important;
    vertical-align: middle;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 3px 0px #004b87, inset 0px 1px 2px rgba(255,255,255,0.4) !important;
}

/* --- CONTROL VERTICAL DE HERENCIA GRIS MATE (FILAS A5 A A9) --- */
.tabla-ajedrez-cuantica tbody tr:nth-child(n+6) td.td-etiqueta-azul-id,
.tabla-ajedrez-cuantica tbody tr:nth-child(n+6) td.td-digito-azul-val {
    background-image: none !important;
    background-color: #9ca3af !important; /* Gris intermedio exacto barra */
    color: #ffffff !important;
    box-shadow: none !important;
    text-shadow: 0px 1px 1px rgba(0,0,0,0.3) !important;
    border: 1px solid #ccc !important;
}

/* --- CELDAS DE COMBINACIÓN INTERNAS --- */
.td-cruce-combinacion {
    font-weight: bold;   
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
}

/* 1. Centro de Atracción Primordial (A0-A4 / B0-B6) en Verde 3D */
.td-cruce-combinacion.celda-prioridad-verde {
    background-image: linear-gradient(135deg, #c6e7b9, #a3d492) !important;
    color: #1a3d0e !important;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.5);
    box-shadow: 0px 3px 0px #70ab55, inset 0px 1px 2px rgba(255,255,255,0.5) !important;
}

/* 2. Plano Gris Mate Periferia */
.td-cruce-combinacion.celda-secundaria-naranja {
    background-image: none !important;
    background-color: #f3f4f6 !important;
    color: #374151 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* 3. Máxima Jerarquía Oro 3D */
.td-cruce-combinacion.celda-impacto-oro {
    background-image: linear-gradient(135deg, #ffd700, #ffa500) !important;
    color: #000000 !important;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.3);
    box-shadow: 0px 3px 0px #b58900, 0px 0px 10px #ffd700, inset 0px 1px 2px rgba(255,255,255,0.5) !important;
    font-size: 15px;
}

.centralizado { text-align: center; }
.text-espera-inercia { margin: 0; color: #666; font-size: 0.9rem; }