.task-order-list { margin-top: 6 * $gap; } .task-order-card { &__buttons .usa-button { min-width: 10rem; } &__buttons .usa-button-secondary { min-width: 14rem; } .label { font-size: $small-font-size; margin-right: 2 * $gap; min-width: 7rem; display: flex; justify-content: space-around; } } .task-order { margin-top: $gap * 4; width: 900px; &__amount { text-align: right; } hr { margin-left: auto; margin-right: auto; } table { margin-top: 1rem; th { white-space: nowrap; } } &__header { .h2, p { margin-bottom: $gap * 0.5; } } .col { flex-grow: 1; } .h1, .h3 { margin-bottom: $gap * 2; } .h4 { margin-top: $gap * 2; } .task-order__review { .h2 { margin-bottom: $gap * 4; } .task-order__number { text-align: right; } .totals-box { flex-grow: unset; display: table; min-width: 350px; } } .card { padding: ($gap * 4) ($gap * 5) 0; .usa-input { margin: 0 $gap 0 0; width: 45rem; min-width: 45rem; } fieldset.date-picker { width: auto; } .form-row { margin: 0; } select { max-width: -webkit-fill-available; font-weight: bold; } button { margin-bottom: $gap * 3; } .date-picker { padding-bottom: $gap * 3; .usa-input__title { padding-bottom: $gap; font-weight: $font-bold; } .usa-input__help { font-style: italic; color: $color-gray; margin-bottom: 1rem; } .usa-alert { padding: $gap * 0.5; margin: 0 0 $gap; background-size: 3rem; background-position-x: 1.5rem; background-position-y: 1.25rem; &-body { padding-left: 5rem; padding-right: $gap * 2; } &-text { font-weight: 550; margin-bottom: 0.5rem; } } } } .panel { @include shadow-panel; } .alert .alert__actions { margin-top: 2 * $gap; } .panel { width: 100%; } .label { &--pending, &--started { background-color: $color-gold; } &--active { background-color: $color-green; } &--expired { background-color: $color-red; } } .task-order-document-link { &__icon { padding-top: 0.5rem; } .task-order-document-description { padding-left: 3rem; font-style: italic; } } button.icon-link { margin-top: 0; margin-left: 0; padding-left: 0; font-size: $base-font-size; &.icon-link__remove-clin { margin: 0; padding: 0; right: $gap * 1.5; position: absolute; .icon > svg * { fill: $color-gray; } } } } .task-order__modal-cancel { text-align: center; } .clin-card { width: 62rem; position: relative; &__title.h4 { margin-top: 0; padding-bottom: $gap * 2.5; } }