.tc-epo-text-wrapper {
    border-radius: 5px;
}

.tc-epo-text-wrapper:hover {
    filter: brightness(0.98);
    backdrop-filter: brightness(0.98);
}

.tc-epo-text-wrapper:active {
    filter: brightness(0.96);
    backdrop-filter: brightness(0.96);
}

.tc-epo-text-wrapper .tc-tooltip {
    margin-inline-end: 0;
}

.tm-extra-product-options .tmcp-field-wrap.tc-active .tc-epo-text-wrapper {
    outline: 2px solid currentColor;
    box-shadow: none;
}

/* Fix for select fields with inputs. The number inputs are hanging off the page edge with the default styles 🙄 */
.tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display {
    flex-shrink: 1;
}

.tm-element-description *:first-child {
    margin-top: 0;
}

/* Gap between the subtitle/description and the field should be smaller than the gap between fields! */
.tm-extra-product-options .tm-element-description {
    margin-bottom: calc(0.5 * var(--tcgap));
}

.tm-collapse {
    border-color: #707070;
    padding-block: 0;
    border-radius: 4px;
}

.tm-extra-product-options .tm-collapse .tc-epo-label.tm-section-label {
    line-height: 1;
    padding-block: var(--tcgap);
}

.tm-extra-product-options {
    select,
    [type="text"],
    [type="email"],
    [type="tel"],
    [type="url"],
    [type="password"],
    [type="date"],
    [type="datetime-local"],
    [type="month"],
    [type="week"],
    [type="time"],
    textarea {
        line-height: 1;
        font-size: 1rem;
        border: 1px solid #707070;
        border-radius: 4px;
        padding: 0.5em 0.75em 0.4em;
    }
    select {
        padding: 0.5em 1.5em 0.4em 0.75em;
    }
    textarea {
        line-height: 1.4;
    }
}