/* print-style.css */

/* Oculta elementos que no son necesarios en la impresión */
header,
footer,
.site-header, /* Puedes necesitar ajustar estos selectores según tu tema */
.site-footer,
.main-navigation,
.sidebar,
.widget-area,
.comments-area,
.post-navigation,
.coleccionista-rarity-legend, /* Oculta la leyenda de rareza en la impresión */
.coleccionista-save-button-wrapper,
.coleccionista-print-button-wrapper,
.coleccionista-lightbox-overlay,
.coleccionista-lightbox-trigger /* Oculta la funcionalidad de lightbox al imprimir */
{
    display: none !important;
}

/* Reglas para la impresión: Horizontal y 2 páginas por hoja */
@page {
    size: landscape; /* Sugiere orientación horizontal */
    margin: 0.5cm; /* Márgenes pequeños para maximizar el espacio */
}

/* El cuerpo del documento se prepara para el diseño multipágina */
body {
    background: #fff !important;
    color: #000 !important;
    width: 100% !important; /* Asegura que el cuerpo ocupe todo el ancho disponible */
    -webkit-print-color-adjust: exact; /* Para forzar la impresión de colores en Chrome/Safari */
    print-color-adjust: exact; /* Estándar */
}

/* Envuelve el contenido de la guía para que actúe como una "página" lógica */
.coleccionista-checklist-container {
    width: 49%; /* Intenta ocupar casi la mitad del ancho de la página */
    float: left; /* Coloca las "páginas" una al lado de la otra */
    box-sizing: border-box; /* Incluye padding y border en el ancho */
    padding: 10px !important; /* Padding para el contenido de cada guía */
    border: 1px solid #ddd; /* Un borde ligero para separar visualmente en la impresión */
    margin: 0.5% !important; /* Pequeño margen entre las "páginas" */
    page-break-inside: avoid; /* Evita que el contenedor se rompa a la mitad de una página */
    box-shadow: none !important; /* Elimina sombras para impresión */
    background-color: #fff !important; /* Asegura fondo blanco */
}

/* Para temas que tienen un wrapper de contenido principal, asegúrate de que se extienda o no interfiera */
.site-content,
.hentry,
.entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-shadow: none !important;
    border: none !important;
    display: flex; /* Utiliza flexbox para manejar múltiples columnas de contenido */
    flex-wrap: wrap; /* Permite que los elementos se envuelvan a la siguiente línea */
    justify-content: flex-start; /* Alinea al inicio */
    align-items: flex-start; /* Alinea los elementos en la parte superior */
}


/* Ajusta los estilos de la tabla para impresión */
.coleccionista-checklist-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}

.coleccionista-checklist-table th,
.coleccionista-checklist-table td {
    border: 1px solid #000; /* Bordes negros para claridad en impresión */
    padding: 5px; /* Reduce el padding para ahorrar espacio */
    text-align: left;
    vertical-align: top; /* Alinea al top para mantener la compactibilidad */
    font-size: 0.8em; /* Tamaño de fuente más pequeño para más contenido */
}

.coleccionista-checklist-table th {
    background-color: #e0e0e0; /* Fondo gris claro para encabezados */
    color: #000;
}

.coleccionista-checklist-table tr:nth-child(even) {
    background-color: #f2f2f2; /* Ligeramente más oscuro para filas pares */
}

/* Asegura que las imágenes y los selects se vean bien */
.coleccionista-checklist-table img,
.coleccionista-no-image {
    width: 75px !important; /* Aumenta el tamaño para que las imágenes sean más visibles */
    height: 75px !important; /* Mantén el aspecto cuadrado si las imágenes son de 1:1 */
    border: none !important; /* Elimina bordes de rareza */
    object-fit: cover; /* Mantiene la proporción de la imagen */
}

/* Oculta los dropdowns y muestra solo el valor seleccionado */
.coleccionista-status-dropdown {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    font-size: 1em;
    width: auto;
    text-align: left;
    /* Muestra solo el texto seleccionado */
    content: attr(value);
}

/* Para navegadores que imprimen el valor de un select vacío, esto es un truco */
.coleccionista-status-dropdown::-ms-expand {
    display: none;
}
/* Oculta las opciones no seleccionadas en el dropdown al imprimir */
.coleccionista-status-dropdown option:not(:checked) {
    display: none;
}


/* Asegúrate de que el nombre del coleccionista se imprima sin el campo de entrada */
.coleccionista-collector-name {
    border: none !important;
    background: none !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    display: inline-block !important; /* Para que se vea como texto normal */
}

/* Estilos para que el texto sea claro en la impresión */
h1, h2, h3, h4, h5, h6, p, li {
    color: #000 !important;
}

/* Mostrar el contador en la impresión */
.coleccionista-counter {
    display: block !important; /* Asegura que se muestre en impresión */
    text-align: right;
    font-size: 1em; /* Ajusta el tamaño de fuente */
    font-weight: bold;
    margin-bottom: 10px; /* Reduce margen */
    color: #000; /* Asegura el color negro para impresión */
}

/* Los highlights de rareza en el nombre también deben imprimirse */
.coleccionista-nombre-exclusiva-de-evento,
.coleccionista-nombre-rara,
.coleccionista-nombre-muy-rara {
    background-color: #f0f0f0 !important; /* Un gris claro para el highlight */
    color: #000 !important; /* Asegura el texto negro */
    padding: 0.1em 0.3em;
    border-radius: 3px;
    font-weight: bold;
}