.dbq-rest-token-modal {
    .dbq-rest-token-body {
        padding: 20px 30px;
    }

    .dbq-rest-token-description {
        margin: 0 0 16px;
        color: $text-color-default;
        line-height: 1.5;
    }

    .dbq-rest-token-expiration {
        margin-bottom: 16px;
        color: $text-color-default;
    }

    .dbq-rest-token-value-row {
        display: flex;
        align-items: stretch;
        width: 100%;
        margin-bottom: 20px;
        border: 1px solid $modal-header-border-color;
        border-radius: $border-radius-default;
        overflow: hidden;
        background: $color-layer-2;
    }

    .dbq-rest-token-value {
        flex: 1 1 auto;
        min-width: 0;
        width: 100%;
        margin: 0;
        padding: 12px 14px;
        border: 0;
        border-radius: 0;
        resize: vertical;
        background: transparent;
        color: $text-color-default;
        font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        font-size: $font-size-small;
        line-height: 1.4;

        &:focus {
            outline: 0;
            box-shadow: none;
        }
    }

    .dbq-rest-token-copy-addon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        padding: 0 8px;
        border-left: 1px solid $modal-header-border-color;
        background: $color-layer-1;
    }

    .dbq-rest-token-copy {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        padding: 0;
        border: 0;
        border-radius: $border-radius-default;
        background: transparent;
        color: $text-color-default;
        cursor: pointer;

        svg {
            width: 20px;
            height: 20px;
            fill: currentColor;
        }

        &:hover,
        &:focus {
            outline: 0;
            background: $color-layer-3;
            color: $color-primary;
        }

        &.dbq-rest-token-copy-copied {
            background: $color-primary;
            color: #fff;
        }
    }

    .dbq-rest-token-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }

    .dbq-rest-token-create-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
    }

    .dbq-rest-token-duration-label {
        margin: 0;
        color: $text-color-default;
        font-weight: $font-weight-bold;
    }

    .dbq-rest-token-duration {
        min-width: 180px;
        max-width: 100%;
        padding: 8px 12px;
        border: 1px solid $modal-header-border-color;
        border-radius: $border-radius-default;
        background: $color-layer-1;
        color: $text-color-default;
    }
}