/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

.mobile-space-y-8 {
    order: -1;
}

.attributes-table {
    table {
        table-layout: fixed;
        width: 100%;
        word-wrap: break-word;

        tr[data-row="client_contact_info"],
        tr[data-row="items"] {
            td {
                white-space: pre-line;
                display: flex;
                vertical-align: middle;
            }
        }
    }
}

.logo {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.comments_table {
    table {
        table-layout: fixed;
        min-width: 600px;
        word-wrap: break-word;
        overflow-x: scroll;
    }
}

.block-index {
    padding: 10px;
    word-wrap: break-word;
}

.turbo-frame {
    border: 1px solid blue;
}

.comment_body_column {
    width: 40%;
}

.delete_column {
    width: 10%;
}

.scrollbar {
    overflow-y: auto;
    max-height: 150px;
    max-width: 100%;
    white-space: pre-wrap;
}

/* Scroll thumb styles */
.scrollbar::-webkit-scrollbar {
    background-color: #f5f5f5;
    border-radius: 10px;
    width: 5px;
}

.scrollbar::-webkit-scrollbar-thumb {
    background-color: #000000;
    border-radius: 10px;
}

@media (orientation: landscape) {
    .landscape-hidden {
        display: none !important;
    }
}

textarea {
    field-sizing: content;
}