.wp-core-ui {
    --failure: #ff0808;
    --light-failure: #d63638;
}

.wp-core-ui .button-danger {
    color: white;
    background-color: var(--light-failure);
    border-color: var(--light-failure);
}

.wp-core-ui .button-danger:hover {
    color: white;
    background-color: var(--failure);
    border-color: var(--failure);
}

.wp-core-ui .button-danger:focus {
    color: var(--failure);
    background-color: white;
    border-color: var(--failure);
    box-shadow: 0 0 0 1px var(--failure);
}

.hidden {
    display: none !important;
}

:root {
    --foregrounddisabled: rgba(204, 204, 204, 1);
    --md-elevated-button-container-color: rgba(255, 255, 255, 1);
    --md-elevated-button-container-shape: 8px;
    --md-elevated-button-label-text-color: black;
    --md-elevated-button-label-text-font: "Inter", Helvetica, serif;
    --md-filled-button-container-color: rgba(0, 99, 155, 1);
    --md-filled-button-container-shape: 8px;
    --md-filled-button-label-text-font: "Inter", Helvetica, serif;
    --md-outlined-button-container-color: rgba(0, 99, 155, 1);
    --md-outlined-button-container-shape: 8px;
    --md-outlined-button-focus-label-text-color: rgba(0, 99, 155, 1);
    --md-outlined-button-hover-label-text-color: rgba(0, 99, 155, 1);
    --md-outlined-button-label-text-color: rgba(0, 99, 155, 1);
    --md-outlined-button-label-text-font: "Inter", Helvetica, serif;
    --md-outlined-button-outline-color: rgba(0, 99, 155, 1);
    --md-outlined-text-field-caret-color: black;
    --md-outlined-text-field-focus-label-text-color: rgba(0, 99, 155, 1);
    --md-outlined-text-field-focus-outline-color: rgba(0, 99, 155, 1);
    --md-outlined-text-field-input-text-font: "Inter", Helvetica, serif;
    --md-outlined-text-field-label-text-font: "Inter", Helvetica, serif;
    --md-outlined-text-field-supporting-text-font: "Inter", Helvetica, serif;
}

.td-card {
    align-items: flex-start;
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    font-family: "Inter", Helvetica, serif;
    padding: 16px;
    width: 1017px;
    border: 1px solid #c3c4c7;
	margin-bottom: 10px;
}

.td-card > .card-content {
    display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px 0;
}

.td-card > .card-title {
    display: flex;
    flex-direction: row;
}

.td-card > .card-title h1 {
    align-self: stretch;
    color: #2271b1;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.12px;
    line-height: 20px;
    margin-top: -1px;
}

.td-card > .card-title p {
    align-self: stretch;
    color: #646970;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: -0.09px;
    line-height: 18px;
}


.td-card > .card-title > .image {
    background-image: url("assets/email.png");
    height: 45px;
    width: 55px;
    background-position: 50%;
    background-size: contain;
}

.td-card > .card-title > .text {
    flex: 1;
}


.expanded, .collapsed {
    cursor: pointer;
    z-index: 1;
}

.expanded > .icon {
    transform: rotate(-90deg) scale(1, 2);
}

.collapsed > .icon {
    transform: rotate(-90deg) scale(-1, 2);
}