
.csv-tool {

    max-width: 1180px;

    margin: 0 auto;

    padding: 45px 40px 70px;

}



.csv-tool > .eyebrow {

    margin-top: 10px;

    margin-bottom: 12px;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

}



.csv-tool h1 {

    margin: 0 0 12px;

    font-size: 44px;

    line-height: 1.05;

    letter-spacing: -1.5px;

}



.csv-tool > p {

    max-width: 820px;

    margin: 0 0 30px;

    font-size: 14px;

    line-height: 1.8;

}



.csv-workspace,

.csv-tool .pdf-workspace {

    display: grid;

    grid-template-columns: minmax(0, 1fr) 300px;

    gap: 25px;

    align-items: start;

}



.csv-tool .pdf-document {

    min-width: 0;

}



.pdf-dropzone {

    min-height: 190px;

    padding: 35px 25px;

    border: 2px dashed #d8c7e8;

    border-radius: 16px;

    background: #faf7fd;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    cursor: pointer;

    transition: .2s ease;

}



.pdf-dropzone:hover {

    border-color: #9b72c8;

    background: #f7f0fc;

}



.pdf-dropzone strong {

    display: block;

    margin-bottom: 8px;

    font-size: 18px;

}



.pdf-dropzone span {

    display: block;

    font-size: 12px;

    line-height: 1.7;

}



.pdf-dropzone small {

    display: block;

    margin-top: 10px;

    font-size: 10px;

    color: #9a86a9;

}



.csv-tool .word-file-info {

    margin-bottom: 18px;

}



.csv-tool #csv-preview {

    margin-top: 22px;

}



.csv-table-wrap {

    overflow: auto;

    max-width: 100%;

    max-height: 560px;

    border: 1px solid #e4d9ed;

    border-radius: 12px;

    background: #fff;

}



.csv-table-wrap table {

    width: 100%;

    min-width: 600px;

    border-collapse: collapse;

    font-size: 11px;

}



.csv-table-wrap th {

    position: sticky;

    top: 0;

    z-index: 1;

    padding: 12px 14px;

    background: #f3ebf9;

    border-bottom: 1px solid #dfd1e9;

    text-align: left;

    font-weight: 700;

    white-space: nowrap;

}



.csv-table-wrap td {

    padding: 11px 14px;

    border-bottom: 1px solid #eee7f2;

    white-space: nowrap;

    max-width: 300px;

    overflow: hidden;

    text-overflow: ellipsis;

}



.csv-table-wrap tr:last-child td {

    border-bottom: 0;

}



.csv-tool .pdf-options {

    position: sticky;

    top: 20px;

}



.csv-tool .seo-content {

    margin-top: 35px;

}



@media (max-width: 760px) {

    .csv-tool {

        padding: 25px 22px 45px;

    }



    .csv-tool h1 {

        font-size: 34px;

    }



    .csv-tool > p {

        font-size: 12px;

    }



    .csv-workspace,

    .csv-tool .pdf-workspace {

        grid-template-columns: 1fr;

    }



    .csv-tool .pdf-options {

        position: static;

    }



    .pdf-dropzone {

        min-height: 160px;

    }



    .csv-table-wrap {

        max-height: 450px;

    }

}

