﻿/* Apply box-sizing to all elements for consistent width calculations */
* {
    box-sizing: border-box;
}

/* Container for download results with fade-in animation and background */
#downloadResultsModal .download-results-container {
    animation: fadeIn 0.5s ease-in;
    background-color: #ffffff;
    padding: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%; /* Ensure full width within padded body */
    cursor: default; /* Set default cursor for the container */
}

/* Fade-in animation */
@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Modal body for download results with increased height and margins */
#downloadResultsModal .modal-body {
    max-height: 450px;
    overflow-y: hidden; /* Handled by scrollable-data-wrapper */
    padding: 0 1rem; /* 1rem margins on both sides */
    cursor: default; /* Set default cursor for the modal body */
}

/* Ensure file selection modal retains Bootstrap padding */
#listDownloadModal .modal-body {
    padding: 1rem;
}

/* Modal content background to ensure visibility */
#downloadResultsModal .modal-content {
    background-color: #ffffff;
    cursor: default; /* Set default cursor for the modal content */
}

/* Fixed success header with margins */
#downloadResultsModal .success-header {
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: #ffffff;
    padding: 0.5rem 0; /* No side padding, handled by modal-body */
    border-bottom: 1px solid #dee2e6;
    cursor: default; /* Set default cursor */
    width: 100%; /* Full width within padded body */
    margin: 0; /* Ensure no offset */
}

/* Fixed table header with margins */
#downloadResultsModal .table-header {
    position: sticky;
    top: 2.5rem; /* Below success header (0.5rem padding + 2rem height) */
    z-index: 2;
    background-color: #1e3a8a;
    cursor: default; /* Set default cursor */
    width: 100%; /* Full width within padded body */
    margin: 0; /* Ensure no offset */
    padding: 0; /* Remove any residual padding */
}

/* Scrollable data wrapper with adjusted width and scrollbar handling */
#downloadResultsModal .scrollable-data-wrapper {
    max-height: calc(450px - 2.5rem - 2rem - 6rem); /* Adjusted for headers, padding, and button space */
    overflow-y: auto;
    width: 100%; /* Full width within padded body */
    cursor: default; /* Set default cursor */
    box-sizing: content-box; /* Ensure padding doesn’t affect width */
}

/* Scrollable data container */
#downloadResultsModal .scrollable-data {
    padding: 0; /* No padding, margin handled by modal-body */
    width: 100%; /* Full width within wrapper */
}

/* Table styling for download results with adjusted width */
#downloadResultsModal .download-table {
    width: calc(100% + 17px); /* Compensate for scrollbar width */
    margin-bottom: 0;
    border-collapse: collapse ;
    table-layout: fixed; /* Ensure fixed column layout */
}

    /* Fixed column widths with text wrapping and increased height */
    #downloadResultsModal .download-table th,
    #downloadResultsModal .download-table td {
        padding: 0.25rem; /* Consistent padding for header and data */
        font-size: 0.85rem;
        vertical-align: top; /* Align text to top for better wrapping */
        border: 0px solid #dee2e6;
        background-color: transparent;
        word-wrap: break-word; /* Enable text wrapping */
        overflow-wrap: break-word; /* Fallback for older browsers */
    }

        #downloadResultsModal .download-table th:nth-child(1),
        #downloadResultsModal .download-table td:nth-child(1) {
            width: 200px !important; /* Enforce fixed width */
            min-width: 200px; /* Prevent shrinking */
            max-width: 200px; /* Prevent stretching */
        }

        #downloadResultsModal .download-table th:nth-child(2),
        #downloadResultsModal .download-table td:nth-child(2) {
            width: 100px !important; /* Enforce fixed width */
            min-width: 100px; /* Enforce minimum width */
            max-width: 100px; /* Enforce maximum width */
        }

    /* Table header cells with white text, centered */
    #downloadResultsModal .download-table thead th {
        background-color: inherit; /* Inherit from .table-header */
        color: #ffffff !important;
        font-weight: 600;
        height: 100%; /* Ensure height matches data rows */
        padding: 0.5rem; /* Match td padding */
        box-sizing: border-box; /* Include padding and border in width */
        text-align: center; /* Center header titles */
    }


/* Alternating row colors with maximum specificity for download results */
#downloadResultsModal table.download-table tbody tr.row-even {
    background-color: #f0f8ff !important;
    z-index: 0;
    background-clip: padding-box;
}

#downloadResultsModal table.download-table tbody tr.row-odd {
    background-color: #d9ecff !important;
    z-index: 0;
    background-clip: padding-box;
}

/* Adjust spacing for success icon */
#downloadResultsModal .text-success {
    padding-left: 1rem;
}

/* Icon sizing */
.bi {
    font-size: 1.2rem;
}

/* Copy button styling with left alignment and offset */
#downloadResultsModal .copy-button {
    margin: 1rem 1rem 0 1rem; /* 1rem left offset, top margin, no right margin */
    align-self: flex-start; /* Align to left within flex container */
    transition: all 0.3s ease;
    cursor: default; /* Set default cursor */
}

    /* Copy button hover effect */
    #downloadResultsModal .copy-button:hover {
        background-color: #e9ecef;
    }

/* Center the footer close button */
#downloadResultsModal .modal-footer {
    display: flex;
    justify-content: center;
    padding: 1rem;
    cursor: default; /* Set default cursor */
}

    #downloadResultsModal .modal-footer .btn {
        margin: 0 auto;
        width: fit-content;
    }
