.btn-height-custom{
    width: 100% !important;                 /* Set width as per design */
    height: 50px !important;                /* Set fixed height for consistency */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;            /* Hide overflow text */
    text-overflow: ellipsis !important;     /* Show ellipsis if text is too long */
    white-space: nowrap !important;         /* Prevent text wrapping */
    font-size: clamp(12px, 2vw, 16px) !important; /* Adjust font-size to fit within button */
    padding: 0 10px !important;             /* Optional padding */
    box-sizing: border-box !important;      /* To include padding in button size */
}
.unstyled-button {
    border: none !important;
    padding: 20px !important;
    background: none !important;
    font-size: 4vw !important;
    font-family: 'Times New Roman', Times, sans-serif !important;
    display: inline;
}

.card-img-top {
width: 100% !important;
height: 30vh !important;
object-fit: contain !important;
}
.modal-body {
    max-height: 80vh; /* Limits the modal height */
    overflow-y: auto;  /* Enables scrolling inside modal */
}

#extra-table2 {
    display: none;  /* Initially hidden */
    max-height: 300px; /* Set a height limit */
    overflow-y: auto; /* Enable scrolling */
}

.popover {
    max-width: 200px; /* Prevent popovers from being too wide */
    font-size: 14px;
    line-height: 1.4;
}

.expandable-table-container {
    margin: auto; /* Keeps it centered */
}

.expandable-table-container {
    position: relative;
    overflow: hidden;
}

#extra-table2 {
    transition: all 0.3s ease-in-out;
}