.accordion-table { .usa-alert { margin: $gap * 2; } ul { padding-left: 0; margin: 0; li { list-style-type: none; margin: 0; border-bottom: 1px solid $color-gray-lighter; } } thead th { text-transform: uppercase; border-bottom: 1px solid $color-gray-lightest; border-top: none; } th, td { white-space: nowrap; button { margin: 0; } } &__items { margin: 0; th, td, tr { border-bottom: 1px dashed $color-gray-lightest; } th[scope="rowgroup"] { position: relative; } } &__item { border-bottom: 1px solid $color-gray-lightest; padding: $gap 0; &:first-child { padding-top: 0; } &-content { font-weight: $font-bold; .usa-input { margin: 0; .icon-validation { left: 135%; } } .usa-alert { margin: 2.5rem 0; } } &__toggler { @include icon-link-color($color-blue, $color-gray-lightest); float: right; color: $color-blue; padding: $gap; > span { margin-left: auto; } .icon { @include icon-size(12); margin-right: $gap; } .open-indicator { position: absolute; bottom: 0; left: 5 * $gap; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid $color-blue-light; } &--active { background-color: $color-gray-lightest; } } &-toggle-content { margin-top: $gap; &__expanded { font-size: $small-font-size; font-weight: $font-normal; background-color: $color-gray-lightest; padding: $gap; &:last-child { border-bottom: none; } } } } } .application-list { .accordion-table { &__item { &__toggler { text-align: right; padding-right: 0; padding-left: 0; } &-content { .icon-link { align-items: baseline; padding-left: 0; padding-right: 0; padding-top: 1rem; white-space: nowrap; } } } } }