#massTextConfirmation {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 30000000;
    background-color: #030303;
    border: 5px solid #555;
    border-radius: 5px;
    height: 800px;
    width: 600px;
    display: flex;
    flex-direction: column;
    /* opacity: 0.95;   */
    font-family: Consolas, monospace;
}

#massTextConfirmationHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Center items vertically */
    height: 10%;
    padding: 10px;
    /* Adjust padding as needed */
    border-bottom: 1px solid #ddd;
    /* Example border */
}

#massTextConfirmationHeaderLeft,
#massTextConfirmationHeaderRight {
    flex: 1;
    /* Allow these to grow equally */
    padding: 5px;
    /* Adjust padding as needed */
}


#massTextConfirmationHeaderLeft {
    font-size: 28px;
    font-weight: bold;
}

#massTextConfirmationBody {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    flex-grow: 1;
    /* Allows the body to take up available space */
    padding: 20px;
    /* Adjust padding as needed */
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: auto;
}


#massTextConfirmationBodyUpper {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    flex-grow: 1;

}

#massTextConfirmationReadoutContainer {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-grow: 1;
    height: 86%;
    border: 5px solid #555;
    margin-right: 20px;
    border-radius: 8px;
}

#massTextConfirmationReadoutLeft,
#massTextConfirmationReadoutRight {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

#massTextConfirmationReadoutLeft {
    width: 33%;
}

#massTextConfirmationReadoutRight {
    width: 66%;
}

.massTextConfirmationReadoutDivider {
    height: 85%;
    width: 2%;
    background-color: #555;
}

#schedMassTextPostSent,
#schedMassTextPostDelivered,
.mass-text-confirmation-readout-label {
    color: #CCC;
    font-style: bold;
    font-weight: bold;
    font-size: 28px;
}

#massTextConfirmationStatusFlipsContainer {
    display: flex;
    flex-direction: column;
}

.mass-text-confirmation-status-flip-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    min-height: 30px;
}

.mass-text-confirmation-status-flip-label {
    white-space: nowrap;
    /* Prevents label text from wrapping */
}


.mass-text-confirmation-status-flip-select {
    min-width: 120px;
    padding: 4px;
    font-family: Consolas, monospace;
    color-scheme: dark;
}



.mass-text-confirmation-status-flip-status-options-container {
    top: 100%;
    /* This positions it right below the trigger element */
    left: 0;
    /* Remove any align-items or vertical centering properties */
}

.mass-text-confirmation-status-flip-status-option {
    display: flex;
    padding: 5px;
    font-weight: bold;
}

.mass-text-confirmation-status-flip-status-option:first-of-type {
    padding: none;
}

.mass-text-confirmation-status-flip-status-option:hover {
    background-color: #444;
    cursor: pointer;
}

#massTextConfirmationBodyLower {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
}

#massTextConfirmationPreviewContainer {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 10px;
    width: 100%;
    height: 460px;
    background-color: #121212;
    overflow: auto;
    border: 3px solid #555;
}

.mass-text-preview-message-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 10px;
}

.mass-text-preview-row {
    font-family: Consolas, monospace;
    padding-left: 10px;
}

.mass-text-preview-row.mass-text-preview-name {
    color: #13CBFF;
}


.mass-text-preview-row.mass-text-preview-number {
    margin-left: 10px;
    color: #FA4D36;
}

.mass-text-preview-row.mass-text-preview-message {
    margin-left: 20px;
    color: #E7DC55;
}

.mass-text-preview-row.mass-text-preview-note {
    margin-left: 20px;
    color: #F97F2A;
}

.mass-text-preview-row.mass-text-preview-status {
    color: #0043F7;
    margin-left: 10px;
}

#massTextConfirmationFooter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Center items vertically */
    height: 10%;
    border-top: 1px solid #ddd;
    /* Example border */
}

#massTextConfirmationCancelButton,
#massTextConfirmationSendButton {
    height: 87%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 15px;
    padding-right: 15px;
    cursor: pointer;
}

#massTextConfirmationCancelButton:hover {
    background-color: red;
}

#massTextConfirmationSendButton:hover {
    background-color: green;
}
